The making of the 4Tochki online store templates

Starting to plan the user interface. The main tire purchasing tool has traditionally been the tire size helper. Studying how it usually looks.

Assembling a prototype based on a two-step scenario: first we select the required parameters in the helper on the main page, then we see the search results in the catalog and make our selection.

Thinking of ways to make the helper more exciting and easy to use.

Planning the overall website usage scenario.

Why do we need a separate catalog? Combining the tire size helper on the main page and the search results together.

This leads us to a new scenario of choosing the tires.

Building a functionality matrix.

Assembling other pages.

Making the first attempt at the design concept.

Thinking about the helper user interface.

Making it slightly simpler.

Drawing the shopping cart and the product page.

The client approves the concept. A new designer joins the project and decides to make everything even more streamlined.

The shopping cart looks overloaded. Breaking it down into several steps.

The client approves the changes. Finalizing the main page.

Drawing the graphics.

Assembling the entire order flow.

Designing the form for making a tire fitting appointment.

Drawing the mock-up and thinking over the mechanics behind it.

Now the tire calculator.

Drawing other pages.

On the 404 error page replacing the zero with a car wheel.

Working with the client’s comments.

Testing the website.

Sending the templates to the client and watching over their implementation.