The Nagel Car Group and their appropriate companies, as well as car dealers, offer many things automotive, like buying and selling cars, rims, wheels and other car services. They work together with a broad variety of car manufacturers, like Mercedes, Jaguar, Land Rover, and many more.
Our task was to create an impactful landing page to sell complete wheels. In addition, it was meant to be the starting point for the development of a design system, which then should be applied to the other parts of the online shop and additional applications.
We started the project with a kick-off workshop and after that I worked closely with their developers, to create multiple landing pages in a very short time. Together we solved many technical challenges and created a delightful user experience.
The whole system was created for different manufacturers and cars at the same time, which all received their very own landing page. Many users will land on the page from ads or search engines, that's why we reduced everything to the purpose of buying complete wheels and left out typical things like a navigation or corporate content. Directly underneath the products, we showed the primary USPs, and a short explanation about the company, as well as the possibility to switch to other cars of the same manufacturer.
The interface adapts to the users' needs. For example, instead of showing irritating blank dropdowns, we enable them when needed. Or we show passively the possibility to login, to not disrupt the checkout flow. This will be hidden on succeeding steps, but it will return after the order, so the user can save it to his account.
In addition, lots of input fields tend to overwhelm users, that's why we show only the relevant inputs and hide the others in a dedicated tab.
We greatly reduced the number of inputs, compared to previous implementations. This way it is easy for the user to enter the data, even on a mobile device.
If a step is finished, we completely hide it and show a checkmark icon. No distractions! If a step takes a while to load, as it has third-party embeds or it needs to ask an API, we show a loading indicator at the same position as the checkmark.