🔥 Focus & Productivity App UI Design

Hey everyone! Super excited to share this design for an app focused on helping users manage their phone usage better.

Dashboard Screen

Score Overview: The main highlight is the user's focus score, which gives a quick snapshot of their productivity. The score is visually represented with a circular progress bar, providing immediate feedback on performance.

Detailed Statistics: Users can easily track essential metrics, including screen time, preventions (the number of distractions or interruptions blocked), blocked apps and progress.

League & Rankings Screen

Emerald League: This screen introduces a competitive element, where users can see their rank within the "Emerald League."

Local & Friend Ranks: The rankings are split between local and friend groups, allowing users to compete and compare their progress with others.

Achievement Badges: Unlockable badges provide motivation and a sense of accomplishment as users move up the ranks.

Profile & Friends Screen

User Profile: A personalized space where users can view their profile, including streak days and league status. The profile also highlights achievements and progress within the app.

Friends List: A dedicated section for managing and viewing friends within the app. Users can see how their friends are performing and even add new friends to increase the sense of community and friendly competition.

I’d love to hear what you think! 😊

🛠 Design tools - Figma

❤️ Press "L" if you like it.

✉️ Have a project idea? Say hello! [email protected]