Hossein Tabandehpour

Work

About me

My CV

Hossein Tabandehpour

About me

My CV

Test Result Platform

Health App

Custom B2B Apps 🔒

E-commerce Website

Medication Tracker App

WORKS

browser app

Browser app & results reports rework

COMPANY

Cerascreen

ROLE

Product designer

EXPERTISE

UX/UI design

YEAR

2022 - 2023

Project Description

The company’s browser platform was mainly used to activate blood tests and access results. While the functionality worked, the UI was outdated, inconsistent with the design system, and confusing to navigate. Tables lacked hierarchy, and actions such as viewing reports or answering questionnaires were hard to find. Also, during this project we wanted to immigrate from PDF reports to dynamic HTML pages for creating the result reports.

Solution

The browser app rework involved simplifying user journeys, modernizing the user interface, and ensuring consistency between the shop and the test activation platform. The redesign focused on providing a cohesive, visually aligned experience to prevent users from feeling lost when switching platforms.

For the results reports, we moved from static PDFs to HTML pages, dramatically improving flexibility. This allowed the design to be responsive across devices, while also enabling personalization for different users. The HTML format offered the ability to include dynamic elements, such as recommended products based on the user's test results, and allowed for more effective tracking of user interactions, which wasn’t possible with PDFs.

The company’s browser platform was mainly used to activate blood tests and access results. While the functionality worked, the UI was outdated, inconsistent with the design system, and confusing to navigate. Tables lacked hierarchy, and actions such as downloading reports or answering questionnaires were hard to find.

The company’s browser platform was mainly used to activate blood tests and access results. While the functionality worked, the UI was outdated, inconsistent with the design system, and confusing to navigate. Tables lacked hierarchy, and actions such as downloading reports or answering questionnaires were hard to find.

Process

I reviewed the existing interface and identified key usability issues:

  • Poor hierarchy in the test table

  • Status information buried in text, making it easy to miss

  • Inconsistent styling compared to the design library

In Figma, I explored redesign concepts that:

  • Introduced status indicators (e.g., download, questionnaire, results) with distinct colors and icons

  • Improved spacing and contrast for better readability

  • Simplified navigation by grouping related actions

Impact

A direct comparison highlights the improvements in hierarchy, clarity, and consistency.

Key changes:

  • Clear status labels with supporting icons

  • Consistent alignment with the design library

  • Enhanced spacing for easier scanning

Results

Although the redesigned UI was not rolled out, this project reinforced several lessons:

  • Even small adjustments in hierarchy and labeling can make complex data tables more usable.

  • Applying a design system consistently is crucial for building trust and coherence across products.

  • Redesign explorations are valuable for uncovering how existing workflows could be simplified, even if implementation is delayed.