Websites

Mollaian Rugs

A research-led redesign that helps people choose and buy handmade, antique and modern rugs online with confidence.

Category: Websites
Our role: Team lead and UX/UI design: user research, interaction design, prototyping and testing

Screens

Full-length Mollaian Rugs homepage with a weaving-loom hero and summer sale offer, shipping and returns promises, Oriental, Modern and Kilim categories, a see-the-carpet-in-your-room section, customer reviews, featured rugs, inspiration banners, service benefits and the footer — The redesigned homepage, from the sale hero to the footer

Mollaian Rugs homepage hero showing a weaver at a loom with a dark blue badge reading Dont miss the summer sales, up to 50%, 12 days left, and icons for fast free shipping, easy returns for 30 days and 100% handmade — Hero with the sale offer and the three key promises: free shipping, 30-day returns, 100% handmade

Mollaian Rugs header with the Oriental menu open, showing eight carpet type thumbnails such as Persian, Ziegler, Afghan and Kilim, and a See All button — The Oriental mega menu: visual sub-categories so shoppers can browse by carpet type

Laptop on a white desk showing the redesigned Mollaian Rugs homepage — The new homepage on desktop

Screens from the final high-fidelity Figma prototype.

Overview

Mollaian Rugs is a family-owned business that has traded oriental and antique carpets for 35 years and now sells modern carpets too. It imports handmade carpets directly from their countries of origin, without intermediaries, and was the first importer in Italy and Europe of some carpet types, especially antiques. When customers moved to ordering online during the pandemic, our team of three redesigned the responsive website over ten weeks, from surveys and interviews to a tested, clickable Figma prototype.

Category: Websites
Our role: Team lead and UX/UI design: user research, interaction design, prototyping and testing
Client: Mollaian Rugs
Product: Website redesign
Duration: 10 weeks
Team: 3 members
Tools: Figma, Photoshop, Miro, Marvel, Canva
Scope: Survey
User interviews
Affinity diagram
Persona
Heuristic evaluation
Competitive analysis
Card sorting
Site map
User flows
Wireframes
Usability testing
A/B testing
UI kit
Prototyping

Figma prototype Low-fidelity prototype (Marvel)

Results

Survey respondents, interviewees and card-sorting participants behind the redesign: 50 + 10 + 15
Moderated usability testing, iterations and A/B tests shaped the final prototype: 10 testers
From discovery to a clickable high-fidelity prototype, with a team of three: 10 weeks

The story

The challenge

During the pandemic more customers began ordering carpets online. Mollaian Rugs needed a modern, minimal, responsive website that could compete, help people choose an expensive handmade product they cannot touch, and benefit the business.

Our approach

We researched first: a survey with 50 people, ten remote interviews, an affinity diagram, a persona, a heuristic review of the old site, competitive analysis and card sorting with 15 users. Then we moved through scenarios, user flows, sketches, wireframes and a Marvel prototype before designing the UI in Figma.

The outcome

A clean, minimal storefront with clear categories, visible promises on free shipping and easy returns, a see-it-in-your-room feature and refined product cards and filters, validated through moderated usability tests, iterations and A/B testing with 10 users.

01Overview

35 years of handmade carpets, moving online

Mollaian Rugs is a family-owned business that started trading oriental and antique carpets 35 years ago and now offers modern carpets as well. It imports handmade carpets directly from their countries of origin and sells them without intermediaries, and it was the first importer in Italy and Europe of some carpet types, especially antiques.

During the pandemic, customers chose to order carpets online more often. The company wanted a responsive website that would give customers a better experience and keep it competitive.

35 years of handmade carpets, moving online — The redesigned Mollaian Rugs website

02Business requirements and goals

A modern, minimal site that sells

The company wanted to redesign its responsive, minimal website to compete with other sellers and give customers a great experience.

Our research goals were to understand European online carpet shopping before and during the pandemic through competitive analysis; to identify our users; to learn how the main competitors cater to customers' needs and where they are strong or weak; to find out how people find and choose a carpet online; and to uncover people's experiences with Mollaian Rugs, both in store and online.

Update the visual UI to feel more modern
Improve usability from the customer's perspective
Use innovative design to keep customers engaged
Bring real benefit to the business

03Design process

Five phases, from discovery to delivery

We structured the ten weeks into five phases, each with its own methods and deliverables.

Discover: business, user and competitive research, competitive analysis, user interviews and a survey
Define: user journey, affinity diagram, primary user needs, problem and solution statements, persona and a heuristic evaluation (NN/g)
Develop: scenario, user flow, task flow, information architecture and site map
Design: ideation, sketches, wireframes, user testing, UI kit, iterations and usability testing
Deliver: final wireframes and a clickable prototype

04Survey

50 people told us how they buy carpets

We set up an online survey in Google Forms and asked potential users to fill it in; 50 people responded.

Who are our likely users?
How much do they know about, and do, online shopping?
How much do they know about handmade carpets?
What limits and fears do they have about buying carpets online?

When asked for their two biggest concerns about shopping online, respondents put quality and the return policy at the top.

50 people told us how they buy carpets — A selection of survey results

05Interviews

Ten remote interviews, screens shared

To build real empathy we interviewed ten people who shop online: seven women and three men from various countries, aged between 30 and 50.

Because of the coronavirus, every interview was remote, so participants shared their screens while they performed tasks. This gave us a much better understanding of the problem.

06Affinity diagram

From interview notes to needs

To synthesise the qualitative data from the interviews, we created an empathy map and grouped the findings to find patterns across users, uncover insights and generate needs.

Insight: users see handmade carpets as luxury items and will pay a lot for them
Insight: natural fibres make people pay more than they had planned
Need: easy returns and free shipping when buying a carpet online

From interview notes to needs — Affinity diagram built from the interview findings

07Persona

Meet Marta

Our persona, Marta, is a 45-year-old teacher in Berlin who has just moved to a bigger home with her husband and teenage son and wants to redecorate it with new carpets.

She loves handmade products because each one has a story, but she assumed handmade carpets were out of her budget. She needs a trustworthy source of unique, high-quality, nature-friendly carpets, free and easy returns and the option to pay in instalments.

"A handmade carpet is the soul of a house."

Meet Marta — Persona: Marta, 45, teacher, Berlin

08Heuristic evaluation

Reviewing the old site against NN/g's ten heuristics

As the first step of the redesign, we evaluated the former Mollaian website against the 10 Usability Heuristics for User Interface Design from NN/g. Most of the ten principles were not being followed, and three issues stood out.

#8 Aesthetic and minimalist design
#4 Consistency and standards
#1 Visibility of system status

Reviewing the old site against NN/g's ten heuristics — The former website we evaluated

09Competitive research

What other European carpet shops do well

We analysed three direct competitors that trade handmade carpets as Mollaian does, and two indirect competitors that sell both handmade and machine-made carpets. The goal was to learn their strengths and weaknesses and find gaps that Mollaian Rugs could fill.

Hero area: most use a single hero image with information about carpet sales
Main menu: most offer Sale, Modern, Oriental and Contact us in the navigation bar
Homepage: all show customer reviews, and most offer filters by size, colour and price
Product page: usually carpet ID, name, provenance, size, knots, description and care instructions

What other European carpet shops do well — Feature comparison across five competitors

10Card sorting

Letting users organise the catalogue

For the information architecture we ran open card sorting with 15 users, asking them to group related items by their own priorities and classifications. It showed how people sort information on the site, and how much they know about handmade carpets.

11Site map

A simpler structure

The card-sorting results turned into a new site map with clear, understandable categories.

12Approach plan

What the redesign had to achieve

After all the research and interviews, we set the main purposes of the redesign.

Show that Mollaian sells modern carpets as well as traditional and antique ones
Emphasise good services such as free shipping, easy returns and carpet exchange
Keep the website minimal
Avoid confusion with understandable categories
Offer special features such as AR

13Scenario

Marta's story

Marta's family has just bought a new home and she is thinking about new furniture. At an Iranian party, the many handmade carpets catch her eye, and she asks her friend how to buy them. Her friend explains that she bought hers from the Mollaian website.

When Marta learns that the site offers free shipping and a 30-day return policy, she decides to buy carpets for her new home there.

Marta's story — Storyboard of Marta's scenario

14User flow

Mapping decisions, not just screens

Building on the task flow, we mapped user flows whose scenarios match the tasks we had defined. Decision points helped us think through what users would do next, based on their feelings and needs on the website.

15Sketches

Ideas on paper first

After writing a UI requirements document with a to-do list for the key screens from the task and user flows, we started sketching. Pen and paper let us capture ideas quickly and test them before committing to the slower work of digitising.

16Wireframes

Proven patterns, focused on user goals

We turned the sketches into low- and mid-fidelity wireframes. They use common design patterns already proven on competitors' websites, or elements that directly address users' goals, needs, frustrations and motivations.

To keep the experience consistent across devices, we created responsive wireframes for desktop.

Proven patterns, focused on user goals — Mid-fidelity wireframes: product, home and category pages

17Primary design

An early prototype in Marvel

With the persona and user flows in place, we built an early low-fidelity prototype in Marvel. It kept the process on track, brought the research together, and let us explain our thinking to the client and hear their feedback.

18Usability testing and iterations

Watching where people struggled

To find the major issues in the design, we ran a moderated usability test built on the tasks we had created. We chose this method to see where participants struggled most, and to learn why.

Product cards: from a single photo with hover zoom to multiple photos with dot buttons instead of arrows
A simplified, smaller footer
Filters that show real carpet colour tones instead of flat swatches

Watching where people struggled — Iterations on product cards, the footer and filters

19UI kit

Colours and type that suit ornate carpets

We chose colours and fonts that work with colourful, ornate handmade carpets rather than competing with them.

Typography mattered a lot to us: we wanted to communicate clearly, and we assumed users spend a long time in front of screens and may have tired eyes. We chose Titillium and Nunito.

Colours and type that suit ornate carpets — UI kit: typography, colours, buttons, logo and icons

20High-fidelity prototype

Bringing the new look to life

Once the UX research was where we wanted it, we combined the new look and feel with the low-fidelity mockups to create the high-fidelity screens, and linked them into an interactive prototype in Figma.

21Final usability test

Users surprised us, and the design got better

We ran usability tests with 10 potential users to find where they struggled most and why. We made many iterations and some A/B tests, and timed how long each participant took to complete each task successfully.

The prototype we ended up with was very different from the one we first designed.

That is what UX teaches you: we are not the users, and users always surprise us.

How we got there

Discover

Business, user and competitive research: a survey with 50 people and ten remote interviews.
Define

Affinity diagram, user needs, problem statements, the Marta persona and a heuristic evaluation of the old site.
Develop

Scenario, user and task flows, card sorting with 15 users and a new site map.
Design and deliver

Sketches, wireframes, a Marvel prototype, a UI kit, usability tests and the final Figma prototype.

Key features

Clear category navigation

Oriental, Modern, Antique and Sale in the main menu, with a visual mega menu of carpet types.

Promises up front

Free shipping, 30-day returns and 100% handmade are visible from the first screen.

See it in your room

An AR-style feature: take a photo of your room, then choose a carpet to preview in it.

Better product cards

Multiple photos with dot navigation, clear prices and discounts, carpet name and size.

Colour-true filters

Filters for price, style, size, shape and material, with real carpet colour tones.

Social proof

Customer reviews and a rating summary on the homepage.

A lighter footer

A simplified footer with services, policies, delivery and payment partners and contact details.

Reflection

Testing with real users changed the design far more than we expected. After many iterations and A/B tests, the final prototype looked very different from our first version, which was a useful reminder that we are not our users.

Next step

Have a project in mind? Let's design it.

Tell us what you need and we'll reply with questions or a first estimate.

Start a project