Project: Grubhub - User Generated Photos
Role: UX, Visual Design, Research, Integration of feature into Ratings and Reviews flow
This project is a feature I worked on at Grubhub that was designed to collect user generated photos of a user’s delivery items. At Grubhub, we decided to invest in working on this feature after research was conducted that determined that users were posting a significant amount of photos on other networks featuring Grubhub delivery. We also received a significant amount of user reviews daily, which, when tied with the opportunity for collecting user generated photos presented an opportunity to bring Grubhub’s photo content onto our platform (as opposed to secondary social networks). Although this feature was primarily mobile focused (for mobile and tablet), at Grubhub, I design cross platform on most features. It should be noted also, that when designing for Grubhub, my feature designs also get applied to Seamless’s product as well (and at the time Eat24).
For this project, I initially started by using our previously conducted research on user generated photos and began to wireframe after having sketching some lower fidelity solutions and discussing with my team. The core of the functionality here was a photo capture feature that would integrate into our ratings and reviews flow where users could capture photos, and their photos would be tagged with their menu item. The main success metric for this project was to create a brand new feature that wouldn’t negatively impact our conversion metric. Secondarily, this initial design was created to see how many photos we could potentially collect from users.
After arriving at a wireframe that covered the photo capture flow we needed for this feature, I conducted internal research sessions after collaborating with a researcher to write a research script. The wireframes we tested with for these initial research sessions are included here.
From these initial research sessions, I (along with the Product Manager I was working with on this project) developed key learnings about the UI we were testing with. For example: buttons we altered to be clearer, and the initial vs. ‘photo captured’ state of the camera capture UI was altered to be a clearer separate state. From this point, I was able to go ahead and alter the flow with the changes we needed from research, and continue to the visual design stage of this project. The majority of the final frames are included here. Not shown are animations I prepared for this project to explain the scroll menu behavior. To finish this project at the time, I prepared a design spec, final flow mocks, did animations in Principle, and prepared a final prototype in Invision.