Dr.Head: product choice, checkout, and returning customers

Dr.Head sells specialist audio equipment. Its product pages contained most of the expected commerce features, but mobile shoppers reached the product image and sharing controls before the information needed to buy. During my work there from April 2023 to December 2024, progressing from Senior Web Designer to Lead Product Designer, I worked across product selection, checkout, and email. The product-card work also informed a separate localization audit for the UAE store.

Open product

A feature checklist missed the buying problem

I used an audit of sales touchpoints to shape product strategy across the customer journey, from acquisition to purchase.

Mobile accounted for most traffic in the audit. A modified KISLOROD commerce checklist gave the page 82/100 for functional coverage, yet the buying path still had obvious breaks. A feature could be present somewhere on the page and remain unavailable when the shopper needed it.

I compared the first screen, purchase controls, and long-page navigation with captured M.Video and DNS pages, then used the recorded scroll-map view to examine the description area. The task was to find where an interested shopper lost access to the next buying decision. Traffic quality and the commercial offer remained possible causes of weak conversion too.

In the first Dr.Head screen, the product name, reviews, price, and purchase actions fell below the image and social-sharing row. The M.Video comparison shows those buying signals much earlier. The Jivo chat widget also overlapped CAPTCHA, adding an interface conflict to an already crowded lower edge.

Dr.Head first screen places sharing before product details; M.Video exposes title, rating, price, and Add to Cart — Dr.Head on the left, M.Video on the right: sharing controls before product details versus title, rating, price, and Add to Cart in the first view. Browser chrome is omitted.

Put the buying questions in order

Farther down the original page, “Found it cheaper?”, “Buy”, and “Buy in one click” competed in the same block. Delivery and availability were separated from that choice. The DNS comparison made the alternative concrete: keep the price, stock, delivery, and purchase control in one decision area.

I prioritized product identity, rating, reviews, and price in the first view; moved shipping and availability up; and made Add to Cart persistent. Sharing became secondary. Fixing the overlapping widget and the discount treatment belonged in the same pass because both interfered with reading or acting on the offer.

Dr.Head purchase area with competing actions on the left; DNS stock, delivery, price and purchase controls on the right — Left: competing Dr.Head purchase actions with stock and delivery separated from price; right: DNS stock, delivery, price, and purchase controls kept together.

Keep the description without making it a detour

The description was a heavily viewed area in the recorded scroll map. Removing it would discard information shoppers were using. But opening the whole description by default meant scrolling through it to reach specifications, reviews, or ratings; the available shortcut only went back to the top.

I recommended a shorter initial description or quick navigation between sections, with the purchase action still available while reading. The DNS example shows the useful distinction: a shopper can expand the description, reach reviews, and keep the price and Buy control in view.

Dr.Head description with a recorded scroll-map overlay beside a DNS expandable description and persistent purchase action — Dr.Head long description with scroll-depth overlay versus DNS expandable description with persistent purchase action.

The redesign brought the purchase back into view

The original before/after comparison shows the hierarchy change: the sharing row no longer occupies the position ahead of the product name, rating, price, and purchase actions. This is the design comparison from the case, including its placeholder pricing; it is not a current retail offer.

reported product-card conversion: +101%; Relative change after the combined redesign; rounded to a whole percent.
reported product-card bounce: −17%; Relative change after the combined redesign; rounded to a whole percent.

Original Dr.Head product card beside revised hierarchy with product name, reviews, price and purchase actions — Original product card beside the revised hierarchy: name, reviews, price, and purchase actions moved into the first view. Source mockup placeholder prices retained.

UAE: reuse the structure, repair the trust signals

The UAE store had a different starting point: shoppers rarely added a product to the cart, and product-card bounce was high. The second audit compared local retailers, including Jumbo, Virgin Megastore, and Dubai Audio. It found familiar commerce patterns, but a mismatch in the signals Dr.Head offered: reviews and ratings were missing, and locally familiar wallet and installment options were absent.

The recommendation was to retain the modular product-card structure and add the missing regional pieces: reviews and ratings, Apple Pay and Samsung Pay, and installment options such as Tabby and Tamara. This avoided rebuilding a separate product page simply because the store served another market.

The recommendations went to the Dubai team for hotfixes. The reported result belongs to the combined UX and marketing intervention; it cannot be presented as the effect of UX alone or combined with the Russian store's conversion result.

reported UAE product-card bounce: −62.5%; Two-month window; combined UX and marketing intervention.
reported measurement window: 2 months
combined intervention: UX + marketing

Carry the buying decision through checkout

The cart needed to account for more than a list of products. The archived designs include selected items, optional services, promotional gifts, unavailable stock with a route to alternatives, and the ability to restore a removed item. Delivery selection brings pickup, courier, and express options into one task, with map and list views.

The checkout audit and redesign ran through discovery and development in 2024. The archived implementation review compared the build with the intended states. The November 2024 correction report records saved addresses losing their selectors, location changes locking the address search, Enter opening authorization, and chat covering the mobile purchase bar. Those findings made the handoff concrete: identify the broken shopper action and show the state it needed to reach.

The reported revenue change belongs to the combined checkout project. The correction report documents the QA findings; it does not establish that every listed defect was subsequently fixed.

reported revenue after checkout work: +3%; Checkout audit and redesign, 2024. Combined project result.

English adaptation of archived Dr.Head cart states and delivery selection, including services, gifts, unavailable products and restore — English adaptation of archived cart and delivery designs from the 2024 work; not a current storefront capture.

Make email work after the first visit

Around October 2024, I worked on the email templates and triggers that brought customers back into the shopping journey. We revised spacing, dark-mode treatment, split tags, and trigger scenarios so the message and next action could carry through different email contexts.

The comparison shows the revised template on the left and an earlier template on the right. The emails are different campaigns, so this is a comparison of template structure rather than a controlled campaign test.

The experience presentation reports that click-through rate doubled after this work. That is an email result, separate from product-card conversion and the revenue change reported for checkout.

reported email click-through rate: +100%; Email templates and triggers; project dated approximately October 2024.
spacing, dark mode and message scenarios: Templates + triggers

Revised Dr.Head email template with a navy header on the left and earlier template with a white header on the right — Revised template on the left, earlier template on the right. English reconstruction from the archived emails.

Make designer development repeatable

I built internal systems for case review and designer onboarding. They made feedback, development, and ramp-up repeatable across the design team.

The original product-card audit and UAE follow-up contain the source comparisons and reported results.