Comprado

UX/UI design for an offline service search and comparison app
UX and UI design for the Comprado iOS app. The team analyzed the target audience of the app, created a customer journey map, designed and tested interactive prototypes, worked on the design of the application and all of its UI elements, and delivered a complete UI Kit.

Goal

Comprado is a Swedish online service that lets users find, compare, and order various offline services: from beauty procedures to car maintenance. Our task was to study the UX aspect of the web service, factor in new functionality, and produce the UX/UI design of Comprado’s new iOS application.

Delivered the UX/UI design for Comprado App — an iOS app for searching and ordering offline services in Sweden

Thank you for the successfully completed project! We are very happy with its results and are truly impressed with your skills and effectiveness.
Michael Sender, CEO Comprado

Analysis

The team explored and analyzed the existing website and identified the key issues that users face while using it.

Based on our hypotheses and subsequent testing, we created an improved concept of user interaction with the app.

Scenarios

We came up with multiple user flows that were fully documented. We also prepared a Customer Journey Map detailing how users will take advantage of the app to fulfill their tasks.

3
user types
30
key tasks
60
possible scenarios

Users

We identified all user types and created user flows for each of them.

Information architecture

Prototypes

We prepared interactive prototypes, app screens, transitions, and element states.

User Flows

We improved the user’s interaction with the app.

UI design

We redesigned the user interface of the app.
200
hours spent in UI design
80
main screens

Start screen

We did our best to simplify the work of the application.

During onboarding, we tell the user about the app and suggest turning geolocation services on, as it will improve the user experience and find the most relevant offers.

Main screens

The main user flow is the search and selection of suitable offers. Offers are grouped into cards for ease of comparison. By default, the user sees the nearest offers first, but can change this by switching to filtering by price or by rating.
The first screen consists of two parts — a list of categories and a map — which makes it possible to choose the search mode right away.

Offer page

The search result includes a full description of the offer. The user can book a service/place, add it to Favorites or share the offer with friends.
The information is grouped so that the user can examine the offer in great detail and learn more about the place providing the service.

Login and registration

Registration or logging in to the app are context-driven and are required when the user adds an offer to Favorites or rates something.

Unregistered users can use the app, while registered ones have access to additional features, such as ratings, interests and favorites.

Favorites, interests, ratings, and profile

Statistics

200
hours of UI design
80
main screens
200+
additional elements

UI Kit

Colors

Background
#FFFFFF
255, 255, 255, 1.00
Lightgray
#D4DFE7
212, 222, 233, 1.00
Cars
#FFBF00
255, 192, 0, 1.00
Food
#9980F7
153, 128, 248, 1.00
Gray
#D8D8D8
217, 217, 217, 1.00
Text
#3F3F3F
64, 64, 64, 1.00
Cleaning
#33DFA7
51, 222, 166, 1.00
Beauty
#FF7F45
255, 128, 69, 1.00
Health
#6EB4FF
110, 182, 255, 1.00
Comprado
#00AFBF
0, 176, 192, 1.00
Comprado Dark
#008C98
140, 152, 100, 1.00
Price
#FF3800
256, 56, 0, 1.00

Text styles

Elements and icons

Handover to the developers

Prepared all the necessary documentation for handover to the developers.
4
experts
full-time UX/UI designers on the projects
300
drafts
prototypes for UX and UI
440
hours
spent on the project in total

Got a project?