Merkur E-commerce store

Merkur

E-commerce store

Merkur E-commerce store

Client

Merkur

Team

8 people

My role

User Research

Interaction

Visual design

Prototyping & Testing

Information Architecture

Year

2023

Brief

Brief

Brief

We designed a new online store for Merkur, an established DIY retailer in Southeast Europe. Given their wide range of products, it was crucial for users to find desired items quickly and easily, and for the checkout process to be swift and intuitive.

Problem

Problem

Problem

The store's vast product variety made it challenging for users to find exactly what they were looking for. Since most users shop on their mobile phones, the mobile experience needed to be as good as, if not better than, the desktop experience.

Solution

Solution

Solution

We designed intuitive and easy-to-use filters to help users search for specific product characteristics. We also developed a well-thought-out mega menu that presents all product categories with easy-to-understand icons and names, focusing on providing an excellent mobile experience.

1.

1.

1.

Design process

Design process

Design process

Research / discovery

Research / discovery

Research / discovery

I gathered feedback from our clients about their pain points while interacting with our site and researched potential improvements suggested by employees. Based on the user research and interviews, I realized we didn't define and present our product—our case studies—clearly enough.

I gathered feedback from our clients about their pain points while interacting with our site and researched potential improvements suggested by employees. Based on the user research and interviews, I realized we didn't define and present our product—our case studies—clearly enough.

Design

Design

Design

I redesigned the presentation of our products, built a new branding as the old one lacked visual identity, and transformed the webpage into a modern, fast, and easy-to-understand site. I used subtle animations and colors to guide users' attention to important parts of our digital presentation.

I redesigned the presentation of our products, built a new branding as the old one lacked visual identity, and transformed the webpage into a modern, fast, and easy-to-understand site. I used subtle animations and colors to guide users' attention to important parts of our digital presentation.

Prototyping & Testing

Prototyping & Testing

Prototyping & Testing

I tested high-fidelity prototypes with real users to gather accurate feedback and insights into "what's working" and "what's not working." This process helped me identify areas needing improvement before the final product went live.

I tested high-fidelity prototypes with real users to gather accurate feedback and insights into "what's working" and "what's not working." This process helped me identify areas needing improvement before the final product went live.

2.

2.

2.

Concept and development

Concept and development

Concept and development

Lo-fi wireframes

Lo-fi wireframes

Lo-fi wireframes

Based on user research, we knew we had to improve the website's search functionality and architecture because people were struggling to find specific products. We also needed to enhance the overall online shopping experience.

Based on user research, we knew we had to improve the website's search functionality and architecture because people were struggling to find specific products. We also needed to enhance the overall online shopping experience.

3.

3.

3.

Design and prototypes

Design and prototypes

Design and prototypes

We reorganized products into categories to make it easier for users to find what they were looking for and featured the most popular categories on the home page with easily recognizable icons.

We reorganized products into categories to make it easier for users to find what they were looking for and featured the most popular categories on the home page with easily recognizable icons.

4.

4.

4.

Navigation

Navigation

Navigation

Based on user research findings we reorganized the product categories and redesigned the navigation to make the website easier to navigate for the users and find specific items they are looking for. We also redesigned the search tab with improved elastic search.

Based on user research findings we reorganized the product categories and redesigned the navigation to make the website easier to navigate for the users and find specific items they are looking for. We also redesigned the search tab with improved elastic search.

5.

5.

5.

Product detail page

Product detail page

Product detail page

We redesigned the product detail page to make it easier for users to shop online, view shipping options, and added the option to join the loyalty program for more discounts. The online shopping experience is now quicker and more user-friendly.

We redesigned the product detail page to make it easier for users to shop online, view shipping options, and added the option to join the loyalty program for more discounts. The online shopping experience is now quicker and more user-friendly.

6.

6.

6.

Mobile experience

Mobile experience

Mobile experience

We also focused on the mobile experience, ensuring users can quickly read details and shop online with an experience that is as good as, or even better than, the desktop version of the website.

We also focused on the mobile experience, ensuring users can quickly read details and shop online with an experience that is as good as, or even better than, the desktop version of the website.

Are you interested in the final product?

Are you interested in the final product?

Click here to visit the website

Go back to my work

SB

About me

Work

Let’s talk

SB

About me

Work

SB

About me

Work

Let’s talk

Create a free website with Framer, the website builder loved by startups, designers and agencies.