TheCut– Redesign
The Goal: Improve User Experience & Visual Identity
Created in collaboration with Gray Walsh and Sophie Carter
TheCut is a leading platform that connects barbers with clients, offering an intuitive way to browse barbers, schedule appointments, and earn rewards. While the concept of the app is strong, its current user interface presents usability challenges that hinder navigation and user engagement.
The goal of this redesign is to enhance the app's usability, refine its aesthetic appeal, and improve consistency across all features.
Deliverables
-
UX/UI design
-
App Walkthrough video
-
Case study document
My Role
UI design, animation, video edits, copy edits.
Recognition
-
Featured in the American University Design Department’s Vimeo.
Process Documentation
The Redesign Process
1. Usability Testing & Research
User testing revealed friction points within the search, booking, and profile navigation. The following tasks were tested to assess ease of use:
-
Locating and booking a barber
-
Navigating the profile page
-
Filtering barbers by payment methods
-
Making a call to a barber
2. UI/UX Enhancements
Our focus was to streamline navigation and optimize the user experience. Changes include:
-
Navigation Bar Refinement: Consolidated redundant buttons and improved icon clarity.
-
Enhanced Barber Profiles: Increased image sizes for better visual appeal, improved content hierarchy, and optimized spacing.
-
Booking Flow Optimization: Reorganized the appointment booking process to minimize confusion.
-
Search Page Improvements: Simplified layout, improved filter visibility, and created a more intuitive experience.
Identifying the Issues
Through usability research and Nn group 10 UXX heuristic evaluation, we identified key design issues that needed to be addressed:
-
Heavy cognitive load: The interface is visually dense, making navigation challenging.
-
Inconsistent UI elements: Lack of uniformity in button hierarchy, spacing, and typography.
-
Poor adherence to industry standards: Elements that should be interactive are not intuitive.
-
Navigation inefficiencies: Overpopulated navigation bar with redundant functions.
Visual Identity & Aesthetic Overhaul
1. Color Palette & Typography
The original black, white, and gold color scheme was refreshed to introduce more depth while maintaining brand identity. We incorporated shades of gray and blue to create a modern and inviting interface.
2. Figma Asset Kit & Component Library
To ensure design consistency and expedite the process, a Figma UI kit was employed. This kit standardized buttons, cards, and layout structures, making the app more cohesive.
Before & After: Key Improvements
-
Home Screen: Improved spacing, better hierarchy, and refined filter options.
-
Profile Page: Enhanced visual separation between profile elements and improved readability.
-
Booking Screen: Reorganized service selection and booking flow for greater ease of use.
-
Navigation Bar: Reduced clutter and improved clarity with simplified icons.
Conclusion
The redesign of TheCut app prioritizes ease of use, modern aesthetics, and consistency. By implementing a research-driven approach, we have significantly enhanced the user experience, creating a more engaging and seamless platform for both barbers and clients.
This transformation ensures that TheCut not only meets industry standards but also provides a premium experience for all users.