Date: November 2018 - ongoing
Platform: desktop, tablet, mobile

Challenge:

Design a new cross-platform website for the new brand on the online vehicle market in Poland.

My contribution:

  • Defining the problem
  • Writing hypotheses
  • Creating task flows
  • Creating wireframes
  • High-fidelity prototype
  • Interactive prototype
  • Guerrilla research

Introduction

Background of my involving

The Motoke is an online platform for buying and selling used cars in Poland. The old version of the site (Fig.1) wasn't launched because of many reasons. Therefore in November 2018, I got involved in redesigning the page and leading all works towards launching a modern, functional, and above all user-oriented site.

Process of work

When I started to think about the process of work, I knew that the waterfall model wouldn't be eligible for this case in this case. Both I and engineers who worked with me needed a framework that would enable us to work with small pieces of the system quickly and effectively. Lean UX was an excellent choice.

Figure 1. The old version of the site
Figure 1. The old version of the site
Figure 2. Lean UX process
Figure 2. Lean UX process

Declaring assumptions

Components of future hypotheses

Because of the essence of the Lean UX, every person involved in work contributed to indicating the assumptions. Unlike requirements, they are only high-level declarations of what we think to be true. Based on them, we can write testable hypotheses in the next step. With that in mind, we pointed out the primary business problem statement and four kinds of assumptions in the beginning: business outcomes, users, user benefits, and features (See Fig. 3 and Fig. 4).

Business problem statement

The current state of the online vehicle market in Poland has focused primarily on providing an opportunity to sell and buy cars mainly for advanced users. These services fail due to too expanded features that are difficult to use for inexperienced customers. Our platform will address this gap by building a practical and straightforward site tailored to advanced and non-advanced users.

Figure 3. The assumptions about the users with
                    Agile Proto-Personas
Figure 3. The assumptions about the users with Agile Proto-Personas
Figure 4. The assumptions about the business outcomes, the user benefits, and the features
Figure 4. The assumptions about the business outcomes, the user benefits, and the features

Writing hypotheses

Combining assumptions

Having all kinds of assumptions, I was able to build hypotheses that are granular, testable statements. As you can see, each hypothesis consists of assumptions about our business outcomes, users, user benefits, and features that are ways to solve problems and achieve users’ needs (Fig. 5).

Prioritizing Hypotheses

I wrote six main hypotheses. However, there was the last necessary step to make before moving on to the design stage. It was impossible to design everything and validate all the hypotheses. Therefore I chose two of the most valuable and riskiest hypotheses and started to think about how to design the solutions for them.

Figure 5. The combining assumption process
Figure 5. The combining assumption process
Figure 6.  The Risk Prioritization Matrix
Figure 6. The Risk Prioritization Matrix

Solutions for hypotheses

Don’t make me think too much

During continual research, I learned that if a new online platform on the market doesn't convey the main message directly and quickly, the probability of failing is very high. Users want to know what goals they can achieve. That is why I focused on a bright, fast message about services provided (Fig. 7).

The first hypothesis to test

We believe this [Visitors know that they can buy and sell cars] will be achieved if [both Anna and Julian] successfully [can recognize the services provided] with [a “homepage content” feature].

Figure 8.  The project of the solutions for the second hypothesis
Figure 7. The project of the solution for the first hypothesis

Uncover hidden problems

Sometimes serious problems are hidden, and thanks to exhaustive interviews, we can uncover them. Although the leading Polish automotive ad platforms work well, many users struggle with additional services for their ads. There are too many of them, and it's tough to understand how they actually work.

The second hypothesis to test

We believe this [Customers select additional services for their ads] will be achieved if [Julian] successfully [can highlight his ads to sell cars faster] with [a “stand out my ads” feature].

Figure 7. The project of the solution for the first hypothesis
Figure 8. The project of the solutions for the second hypothesis

Medium-fidelity wireframes

Don’t make me think too much

The second solution to the second hypothesis was challenging. In the management panel, I had to place many additional services most reasonably and functionally. Fortunately, there is an interaction design technique that helps us maintain the focus of a user's attention.
(See Figure 8 and Animation).

Let users uncover the system

Thanks to the progressive disclosure, we can reduce cognitive workload. We show the users only the minimum data that are necessary to complete their current task.

Figure 9.  The early project of the second solution to the second hypothesis
Figure 9. The early project of the second solution to the second hypothesis

High-fidelity prototype

The high level of the solutions

The right solution to the first hypothesis was also tricky. You can see in Figure 9 that I put some links in the nav section. One link called "Baza ogloszen" is for the buyers whereas the second one called "Dodaj ogloszenie" for the sellers. In the header section, the "Kupujacy" button is for buyers, but the orange one for sellers. The third section is for the buyers.

Why do we actually need an MVP?

The phrase Minimum Viable Product causes much confusion related to the meaning of it. Generally, it is the smallest thing that you can build to test your hypotheses among the users and to get feedback from them. That is why I made the high-fidelity prototype.

Figure 10. The homepage - the high level of the solution to the first hypothesis
Figure 10. The homepage - the high level of the solution to the first hypothesis

What is important for buyers?

I think that the answer is simple. The users who want to buy a car need a functional search form and a readable page with a certain car for sale. If the user clicks the "Kupujący" button on the Homepage, they will be navigated to the advanced search form (Fig. 10).

Simplicity was my main goal

When people want to buy a car, they don't want to admire the beauty of the page, but they want to achieve their goal quickly. I knew that the ad page should be simple, scannable with a little bit of sophistication (Fig. 11).

Figure 11. The advanced search form page
Figure 11. The advanced search form page
Figure 12. The advertisement page
Figure 12. The advertisement page

Did I forget about mobile devices?

I deliver outputs both for desktop and mobile devices at the same time in the majority of my projects. However, the approach is different in this case. The most important are measurable outcomes that can justify the solutions for the assumed hypotheses. After the validation process, the developers will implement the solutions. That moment will be appropriate to design mobile views for the fully validated hypotheses.

We want to be sure that our core solutions are the best for the users, and nobody has trouble using them. Despite this, I designed a couple of easy-to-change mobile views for the presentation's sake that weren’t risky to the whole concept (Fig. 12).

Figure 13. The mobile view
Figure 13. The mobile view

Interactive prototype

The main tool for validation

An interactive prototype is one of the best ways to show your solution to the audience in order to validate your hypotheses. You should go out of the building, show users the MVP, and draw conclusions based on the users' feedback. It’s the essence of the UX designers’ work.

Limited interactivity

I want to point out that interactivity in the below prototype is limited only to the elements that were necessary to validate the two riskiest and valuable hypotheses. You can see the 1.0 version that I showed to the users without any further changes based on received feedback.

Guerrilla research

Time to validate the hypotheses

I presented the first version of the prototype both to the stakeholders and the users that represent defined personas. I talked with them about the solutions and observed how they accomplished some predefined tasks. Thanks to that, I gathered qualitative data that allowed me to draw some conclusions.

Conclusions

The users recognized quickly the services provided, mainly thanks to the buttons on the header section. Despite this, there were three minor things to improve to say that the first hypothesis was validated. The second solution to the second hypothesis also required some improvements (Fig. 13).

14. The solution to one of the problems after the first phase of research.
Figure 14. The solution to one of the problems after the first phase of research.

What is next?

Work on implementation

The solutions of the first two hypotheses were fully validated after the second phase of the research (Fig. 14). It was the right moment for the developers to start writing code for the verified solutions. At the same time, I started to design solutions for the next hypotheses.

Figure 15. The hypotheses validation process

General insights

My assessment

The users understand the project. They know what the site is about and how they can attain their goals. Some of them also indicate visual appealing. I want to emphasize that the design could be cleaner and simpler based on pure Material Design 2.0. However, it would have required to involve at least one professional illustrator that was impossible in this case. With all this in mind, my overall assessment is positive.

The advantages of Lean UX

Thanks to this project, I realized that the Lean UX framework is a great choice when you work with a complex system. We focus on outcomes, work with small batches, and eliminate risk and waste. Finally, what is most important, only users can tell us that our work is going in the right direction.

Additional contribution

Building audience engagement

I contribute to the growth of social media by creating some static assets and animations related mainly to education. Both candidates for drivers and drivers love to solve riddles about the traffic law. I care about the content quality, and some samples you can see by clicking on the links above.

Figure 16. The Facebook metrics that show the users' engagement