Project: app finder
This project was carried out as part of a course on Figma and UX/UI design.
Assignment
During this course, you learn the principles of UX and UI design by developing an app that can find items using a Bluetooth keychain.
My approach
I followed the course step by step. An important part was outlining the user journey and creating a persona.
​
The user journey is a written step-by-step plan that describes how a user navigates through the app. It also maps out the user’s emotions, needs, goals, and more. This information is crucial for the design and navigation of the app.
Persona
First, I created a persona. A persona is a general representation of the user, including name, job, location, as well as their goals, needs, and frustrations. This example is based on the course.
.png)

User journey
I built the user journey based on three different scenarios:
-
Creating a new account.
-
Adding a new Bluetooth key.
-
Detecting an item.
On the side, you can see the flowchart that the user follows. Each block represents a screen that needs to be designed. The flowchart clearly shows which designs are needed and how they relate to one another.
Purple pentagons: Represent choices the user can make, which impact the app’s navigation.
Blue squares: Represent actions within the app itself, without affecting navigation.
The Design
I developed a simple brand style for the app, taking into account the persona and the app’s function.
The app helps users detect lost items. Users are often stressed while using it. I incorporated these insights into the design:
-
Logo: Based on sonar, aligning with the idea of searching and finding.
-
Colors: I chose shades of purple to create a calm and user-friendly appearance.
-
Usability: A simple user interface helps prevent additional stress when searching for something like a wallet.


Scenario 1: Creating a new account
When the user opens the app for the first time, they are curious and excited. The user creates a new account by clicking the 'Sign up link.'
-
The 'Create account' button is initially transparent.
-
Once all fields are correctly filled out, the button becomes fully visible and clickable.
-
After clicking the button, the email verification page opens.
Scenario 2: Add a new key
This scenario dives deeper into a feature of the app.
-
The user logs in and arrives at the ‘home screen.’
-
Several options are visible, including ‘add key’ and a navigation bar at the bottom.
-
The user personalizes the key with their own name and icon.
-
After clicking ‘Confirm,’ the user sees an overview of all the keys.


Scenario 3: Detecting an item
The user is searching for her wallet and can't find it anywhere. In high stress and frustration, she opens the app.
-
Thanks to the user-friendly and easy-to-navigate interface, the user only needs to log in and click on the desired key to locate the item.