This project is a design exercise I did for an interview of Product Design. The task was to design the key features for an app called Food Truck Finder (FTF). The app helps users locate food trucks they love, find new food trucks in their area, see menus of those food trucks, and pay for their meals using the app. I spent four days designing the process of finding a food truck. The final deliverables included sketches, visuals, interaction design and annotations.
|Duration||Mar. 2017, Four days.|
|Tasks||Ideation, User Stories, Interaction Design, Visual Design, Prototyping|
|Result||High fidelity interaction design|
Food Truck Finder (FTF) is an app we’re developing that helps users locate food trucks they love, find new food trucks in their area, see menus of those food trucks, and pay for their meals using the app. What we need to pitch the idea is a set of 3 screens, plus any supporting sketches or wire frames for the food truck feed, a food truck profile, and a search results page.
This design exercise took about four days. I first defined the scope by making several assumptions. I assumed that the target users are people who are always on the go and love food trucks. To flesh out the scenario, I assumed that the users have been using the FTF app for a while and have their favorite food trucks. Based on the scenario, I sketched out several ideas to explore possible solutions. In order to find the right one, I tested the home screen by doing task like: find the closest food truck around you, find your favorite food truck, etc. After refining the feed screen (home), I designed the interactions for the process of finding a desired food truck. Iterations happened a lot during each step.
With the scenario in mind, I started to brainstorm how the feed screen could look like. To start, I prioritized the information as following. First, when the user(Ellie) thinks of the food truck finder app, she probably needs to know where she can find food NOW. So a map of current locations of nearby food trucks is very important. Next, the distance between a food truck and the user, the name and the brand of the food truck, will be used by a user to decide whether to head to that food truck. Thus, the further details of the food truck should be easy to discover. What if a user wants to quickly scan the food trucks by rating or by distance? A list view can help! A filter can also help! I did several iterations to explore UI options under the requirements and the criteria discussed previously.
To boost the speed, I skipped the wireframes and directly headed towards high fidelity interaction design. In this process, I leveraged the visual specifications provided by the interviewer. The specifications included color, logo, font, and icons.