Roco
Roco was born out of my own personal frustration with the scattered and disconnected nature of recommendations. As a UX designer, I saw an opportunity to create a platform that would streamline the process of sharing and saving recommendations in one convenient place.
The clickable wireframe prototype was created to communicate to our developer how the core functionalities of Roco would need to look.
Accessing the recommended items (a “Roco”, or plural “Rocos”) in a central location
Sending a Roco to a friend with a personalised note
Leaving feedback on a received Roco
Connecting content and humans
From insights gained from surveying our potential user base, I developed the basic functional user requirements. With these needs distilled to their barest functions, I designed the MVP version of the application.
Below you will find some wireframe sketches, wireframes, and a number of hifi mockups. The sketches were made in Procreate and the wireframes and mockups were made in Figma.
Wireframe sketches done in Procreate. From left to right: The main dashboard from which users navigate to the various items recommended to them. A detail page for a Roco. The feedback screen for sending feedback to their friends on the Roco in question. The "Send Roco" screen for sending recommendations to your friends.
Information architecture of the application, covering all the screens that would need to be included.
The dashboard. The Roco detail screen. The Send Roco screen. Some adjustments were made to simplify the app, such as removing the bottom navigation bar.
Feedback user flow. From the Roco detail screen, users can send feedback to their friends. Rather than have all functionalities crammed on one screen, they have been split into multiple screens to not overwhelm the user.
Hifi mockups of the splash screen and Sign up screen.
A hifi mockup screen from the more developed prototype. This is part of the profile creation process.
Hifi mock-up screens of the dashboard and Roco detail screen.