Goshsha is an in-store shopping tool that enhances the shopping experience for users who enjoy precision and a helping hand with finding and exploring new products.
Problem
Goshsha currently suffers from low user retention due to a gap between user expectations and the actual value delivered.
Solution
Our team developed a virtual stylist that recommends products to users by choosing the best-fit product for them through shade matching.
Project Timeline
Development Process
After beign told our scope of adding a gamification feature and boosting user retention, we brainstormed ideas to enhance the existing app. We then surveyed Gen-Z users to gauge their interest in our ideas. The results revealed concerns with virtual try-on features for makeup due to inconsistency. This led us to develop a shade matcher to improve the virtual try-on and add a recommendation page, which was the most requested feature in our survey. We met weekly with our sponsor on Zoom to assign tasks. Initially stuck in a waterfall process focused on research, we shifted to an agile approach, developing a product increment each week to share for feedback. This allowed for simultaneous development of features and faster progress. We also conducted multiple user tests to refine our designs and ensure they aligned with user needs and preferences.
We met weekly with our sponsor on Zoom to assign tasks. We were initially stuck in a waterfall process focused on research, so we shifted to an agile approach, developing our product incremently each week to share for feedback. This allowed for simultaneous development of features and faster progress. We also conducted multiple user tests to refine our designs and ensure they aligned with user needs and preferences.
When first determining what kind of features to consider, we conducted a competitive analysis to view what other companies had.
View our competitive analysis here
A survey was conducted in addition to the competitive analysis to get feedback and opinions from our demographic to see what they would be interested in.
View our survey results here
A user flow was created to provide a way to visualize the different options and paths that a user may encounter when interacting with the two features that we chose to implement.
A use case diagram was created to help provide a kind of blueprint to help us visualize how a user would interact with the features and what software would be involved as well in those processes.
In addition to having the use case diagram, we also created user personas to help visualize the our user population and provide a way to combine our survey findings.
We created the a set of low-fidelity wireframes that outlines the core user flow of our try-on room. The flow guides the user through capturing or selecting images, choosing comparison photos, and receiving product recommendations via visual analysis. Results are then presented. These wireframes allowed us to validate user intent and refine key interactions early in the design process. By starting with lo-fi wireframes, we were able to focus on functionality and user experience before investing in high-fidelity visuals.
These mid-fidelity wireframes refine the user journey through our try-on room with more detailed UI elements and interactions. We introduced onboarding screens to communicate key features, enhanced the Goshi assistant, and simulated real user tasks, such as selecting a bare-face image, saving colors, and receiving tailored product matches.
Visual hierarchy, button placements, and feedback flows were all iterated on to improve clarity and usability. MidFi allowed us to test the flow more realistically and align the visual direction with the final product.
Durign this stage, it helped us to validate our interface decisions while keeping the design flexible for further feedback and development.
Rather than separating testing from design, we used an iterative approach. Each user testing round directly informed live updates to the prototype, allowing us to validate changes quickly and evolve the experience in a way that genuinely reflected user needs. In total, we had three rounds of user testing where each round had 5 sessions.
Round 1: Our design process began with creating initial wireframes for the Try-On Room, focusing on how users would interact with the key features. We then conducted our first round of user testing to better understand where specific elements should be placed on the screen. During this round, users were given a lot of guidance as to how they can use the feature.
Focus: Test try-on room basics: adding/removing photos, changing background, buttons placement
Key Insights:
- Users accidentally deleted images instead of removing frames
- Confusion about reset and undo actions
- Save icon misinterpreted as download
- Preference for drag-and-drop scrapbook
Based on these insights, we implemented the following design changes.
- Added reset confirmation prompt
- Clarified interactions (e.g. delete vs. remove frame)
- Adjusted button layout for right-handed users
- Planned onboarding
Round 2: In addition to implementing the design changes, we then began developing the Goshi screens. Through this, we were able to evaluate the overall user flow with minimal to no guidance to the users.
Focus: Test full user flow: home → virtual try-on → try-on room→ Goshi (and identify pain points in navigating and saving try-on room)
Key Insights:
- Users struggled without guidance since they did not know what each feature does
- Navigation icons unclear (esp. person & save)
- Theme inconsistency (scrapbook dark, rest light)
- Users liked drag-and-drop freedom
- Goshi icon not intuitive; layering issues
Based on these insights, we implemented the following design changes.
- Updated navbar (removed eraser, border; added labels)
- Unified theme
- Improved icon clarity & positions
- Added save confirmations
- Planned tutorial tooltips for all features in the try-on room and Goshi
Round 3: The insights from the second user testing led us to refine not just the Try-On Room and Goshi screens, but also the onboarding experience. We also made sure that the transition between the virtual try on section that was already integrated into the app and the virtual try on room we created is as seamless as possible. Before our final demo, we conducted one last round of testing to catch any remaining usability issues.
Focus: Test full user flow: home → virtual try-on → try-on room→ Goshi (and identify pain points in navigating and saving try-on room)
Key Insights:
- No back button, unclear save flow
- Color picker timing unclear
- Users wanted foundation filters (e.g. matte, skin-type)
- Wanted match explanations (e.g. undertones)
Based on these insights, we implemented the following design changes.
- Improved try-on navigation + back button logic
The other three insights were out of our scope and so we decided that we can discuss them with our sponsor for possible future changes.
We used Figma to design and prototype the user interface, visualize user flows, and iterate on layout and interaction ideas before AND during development.
We used Xcode as our primary development environment to build the iOS app using Swift, and test the full user experience directly on simulators and physical devices.
We used Firebase for backend data storage. It enabled us to securely save content, manage user sessions, and sync data across.
We integrated the Google Lens API to analyze user-uploaded images and identify visually similar products to recommend to users.
Final Product
After much research and talks with our project partner, we narrowed down our core features:
Try-On Room: Allows the user to save their favorite looks from the products they try on in store
ColorPicker: Goshi assists users in finding their perfect foundation match, avoiding shade-matching issues (e.g., too light, too dark, wrong undertone (cool vs warm undertones))
Related Products Display: Shows the user a range of similar products they would like, along with relevant searches and media (such as product reviews)