Geolocation-based mobile app CHEAPP compares prices of supermarket items. With the application, users can monitor (using the Scraping technique) the prices of similar products in nearby supermarkets in real time.

By exchanging the products according to their prices, the user can create shopping lists with the selected products.

  • CLIENT Cheapp
  • DATE 2022
  • TASKS Concept | Branding | UX/UI | Prototype | Design System

The challenge.

  • To ensure that the app is intuitive and easy to use for a wide range of users of different ages and levels of digital litgeracy
  • To create a catchy brand name and an attractive and modern logo
  • To develop a comprehensive and suitable Design System that can be used on multiple platforms, formats and devices in the future
  • To propose a simple and dynamic visual interface
Getting users with low levels of digital literacy to use the app successfully is the biggest challenge.
Cheapp Smartphone App

The solution.

Logo & branding

It is important to choose a simple, attractive, and easy to pronounce brand name for both Spanish and English speakers, and that conveys the concept of "cheap" and "best price". Ultimately, Cheap ('cheap' in English) creates a phonetic play of App and Cheap.

We used an attractive and informal-looking typography and striking colors for our logo (red suggests the idea of ​​'sales' and yellow or gold has to do with 'the best').

Cheapp Logo

The UX/UI process



As part of the project, the client wants to develop a mobile app that compares prices between different brands and supermarkets. By creating a shopping list of selected products, the customer can get the cheapest shopping list by easily swapping similar products from different brands or supermarkets. Our research found other apps that try to get the best supermarket deals, but they don't allow you to compare prices or create shopping lists.


  1. To find a product in different shops or supermarkets around the user´s location.
  2. To get the best price for products with similar characteristics.
  3. To create shopping list with products which can be swapped
  4. To figure out the total price of our shopping list, finding the best prices combination.


  • In-Depth Interview: This method is used to obtain information about user behavior in using the Cheapp application based on our objectives.
  • Competitor Analysis: This method is used to get insight from competitor users and find features that we can incorporate into our app in order to improve the user journey and meet his needs.


The Define stage involves combining the information that we have gathered and created during Empathise, analyzing and synthesizing it, so as to identify the core problems we found.

We moved the answers from the conduct research to sticky notes for easier sorting (behavior, difficulties, expectations); then, we create the Empathy Map, which reflected the user's thoughts, frustrations, and aspirations.

Empathy Map

We gathered all the data from our investigation and classified it according to similarities, and then found some findings and insights. This helps us develop potential ideas, and provide a clear picture of what is important to users and what isn't.

Cheapp Empathy map

User Persona

To effectively reach our target audience when designing the app, it is essential to develop a user persona. Despite the fact that our users come from different backgrounds, there are certain things they share in common; these common points are represented by two main User Personas, acording to their different backgrounds:

  • User Persona 1 (ages 18 to 28):College students living in shared housing, with limited purchasing power but high level of digital literacy.
  • User Persona 2 (ages 28 to 60):Middle-aged people working full-time with children in their care, little spare time and limited digital literacy.
Cheapp User persona

User Journey

We create a User Journey Map to understand the expectations, realities, and feelings of our users in order to find some critical points that will help us meet their demands.

Cheapp User journey


As part of this phase, we will attempt to resolve all potential users' problems and frustrations.

Identifying the problems and prioritizing them is the first step to providing real and effective solutions. This involves choosing the elements to display on the screen, the user interface, and the interaction design.

User flow

Cheapp User Flow



Cheapp Prototype

Design System

The app's predominant colors are determined by the red and yellow that we chose for the logo.

The Roboto font will be used for the typography; its readability, recognition, and modern appearance make it widely used in mobile applications.

Yellow background and corporate red text make the 'CTAs' stand out.

Cheapp Design System

Prototype (High Resolution)

Cheapp Prototype High Resolution