The UI and UX process of the app allows you to focus or relax from the sounds of space.
Project Brief
The car rental business — used usability tests and analytics and indicated that users are having a hard time navigating the website.
The Problem
Designing from concept to inception, CometFocus needs a hassle-free onboarding process and the visual interface to navigate and use a variety of sounds to focus.
The Goal
I am creating a navigation workflow from signing up and listening to sounds as few steps as possible while designing a visually pleasing experience.
Responsibilities
User flow mapping, wireframing, and visual design
Tools
Figma, Adobe Illustrator, Adobe Photoshop
My process is consistent of:
RESEARCH
Find what other sound-generating apps navigate and their visual experience.
IDEATION
It is wireframing the layout and size of the content.
DESIGNING
I add design principles to create an engaging visual experience with illustrations and colors.
TESTING
I am prototyping the design and engaging feedback on the user’s input.
Understanding the core of the project.
Before designing, I want to see what this focus noise industry is doing well. Analyzing reviews on the App Store, experiencing their onboarding process first hand, and why certain apps no longer exist.
The Key Findings
Proposed a design with easy access to critical sections (Focus, mission, and favorite) and simplified as much as possible.
Inspiration
Mode
Sketching and wireframes
Design layouts from the screen opening to signing up, logging in, and if the user forgets the password.
To design layouts of the three main sections of the app and an achievement screen for incentive usage.
Achievements screen: The place to see stats and other information on what the user has accomplished.
Adventure screen: The main menu where the user finds sounds and other content within the app.
Sound screen: The user will spend the most time listening to specific space theme sounds for focusing or relaxing.
The font usage is Equinox which captures the space-themed branding. Its uppercase and lowercase of the same font create a duality while being simple.
The three main colors of the navigation are the primary colors to give as much contrast at a glance, so every input is intentional.
Laying the foundation
Creating user flows is how the app will start and why the user wants to use the app.
By simplifying the process to get the workload of the developers as smooth as possible.
I am crafting a cohesive and friendly feel.
Here are the styles that were used in the design process of CometFocus:
When users start the app, they go through a sign-in or sign-up and onboarding before proceeding to their default screen, the focus screen, which has a footer navbar. The navbar has three tab options:
Focus - where users go to see and explore the different sounds to focus with
Mission - where users go to learn more about space and how to enhance their productivity beyond the sounds
Favorite - where the users go to find their favorite sounds and other content without having to search for it
The sound player screen is the crucial feature where the user will spend the most time on the app on.
When users start the app, they go through a sign-in or sign-up and onboarding before proceeding to their default screen, the focus screen, which has a footer navbar. The navbar has three tab options:
Focus - where users go to see and explore the different sounds to focus with
Mission - where users go to learn more about space and how to enhance their productivity beyond the sounds
Favorite - where the users go to find their favorite sounds and other content without having to search for it
The screen that records and displays the stats and accomplishments the user has made. This screen can implement a reward system to enhance more prolonged and more frequent usage.
What I've learned from this project?
You can call me at 253.670.5440 or email me at Nick@NickMannDesigner.com.
An analysis of wireframing and implementing a great user experience for a car rental business.
A look at the process to enjoy transferring money with the Paymetric app.