ZDE — e-commerce site

I was in role of main UX&UI designer in this project, however I discussed and ideated with my colleagues on same positions as well as with the lead of the project and developers.

Challenges

First challenge of the redesign was to maximize the space for products on the category pages since shop contains a lot of products. Next challenge was to provide users with quick overview of items in their shopping cart since the average number of bought items is quite big. Last but not least challenge was to introduce more modern design of the shop targeted to specific user groups.

Old version

Old version of the website was important for ZDE during their rise to one of the biggest players on Czech market. It supported enormous growth in the number of products as well as customers. However, it is not up to par with planned development and growth of the site.

Initial interviews and workshops

I conducted initial workshop and interviews with the stakeholders to determine main pain points of the current system as well as their goals for the redesign. It was important stage to understand the big picture of the project and current state of the website.

Stakeholders had very precise data about current customers which helped a lot in determining the target audience of the redesign. They also provided me with first-hand information about the pain points of the users from their support department.

Unfortunately, stakeholders were not comfortable with more extensive user research nad deemed the data collected by them to be enough. Personally, I would like to have more time to observe the use of the site by the users directly however, the data by the stakeholders were quite extensive.

Competitor analysis

I decided to expand the information by analysing the competition of the project. Result of the analysis was a set of elements grouped by their functions. Then I compared the solutions and selected the interesting ones to consider during the designing stage.

Site map

Old version of the site had quite plain structure which we mostly re-used with small additions made according to the keyword analysis. One of the bigger changes was grouping the pages that were only informative and did not contain products under a separate sections. This way, user has a direct access to extra information at one place.

First sketches

Based on the findings we started to sketch wireframes of the new layout. One of the most important was the new always visible shopping cart. We discussed the sketches among our team of designers as well as with the project lead and stakeholders to validate our ideas.

Wireframe

After deciding on the main elements in our low-fidelity sketches we decided to visualize the design in the more detailed way. We reworked the paper sketches into digital wireframes using Axure. We made sure to discuss and validate the designs often to incrementally reach the satisfactory solution.

UI

We based the final UI design of the website on the brand guide of the client and aimed to create simple and clean UI with a few specifics required by the stakeholders. We were sure to create a design that would be easily scalable from a mobile device to the desktop monitor.

We created the double menu approach to provide users with the quick access to the main categories as well as the full responsive menu with everything they might look for.

Outcomes

We are implementing the website as the so-called MVP (Minimal Viable Product) and we will work closely with the stakeholders and their clients to uncover potential pain points of the new design and validate our designs on the broader range of users. We plan to expand the website with additional functions down the road.

We also plan to implement the tools to observe the behaviours of the users on the site and refine our designs accordingly.

Learnings

This project teached me a lot about the very specific part of the market and challenges connected with it. It was interesting to design a solution with a very particular target audience in mind. I also confirmed for myself that including developers in the early stages of the design is very useful as it allowed us to avoid solution that would be technically way too difficult.

I would also like to add a few quick points new of confirmed:

• Paper prototyping is very useful at the early stage
• Combining good usability and business goals might prove difficult at times
• Frequent discussions and ideations generate a lot of useful ideas but sometimes create too much options to consider
• I definitely learned to listen a little better

Every project encounters mistakes and I would also change a few things about this one. Namely I would like to have more budget and time to do a proper user research. I believe it would allow us to create a better final product aimed more at the correct customers. I would also do the user testing during the designing to validate some ideas as opposed to testing on the running website after implementation. This was however necessary due to budget restrictions.