Jimmy Truck Mobile Application Case Study

Jake
Jake
Jul 24, 2017 · 8 min read
Jimmy’s Food Truck

My team and I were assigned the task of researching and designing a mobile application for a local food truck named Jimmy’s Food Truck. By interviewing customers of the food truck and by collecting data from questionnaires, we were able to ultimately come up with the best possible solution for the problems we were handed.


The Original Problem and Goals for the Application

Myself along with my fellow team members first began interviewing people around the area to try and get a feel for what they looked for in a food truck and if a mobile application would benefit them. Some of our questions included: “Do you use food ordering apps?”, “How often do you frequent food trucks?”, “Have you heard of and/or been to a food truck called Jimmy’s?”

The reasoning behind the last question was to try and get a broad idea about whether or not people in the area knew who Jimmy’s Food Truck was. The majority of the interviewees knew who Jimmy’s was and said that they would seldom go there but when they did it was a good experience.

Next, we choose to interview users of the Jimmy’s Food Truck to get a good idea about what they would think if the truck had a mobile application. The questions asked to the users included: “How offer do you go to Jimmy’s?”, “What do you like about Jimmy’s?”, “What do you not like about Jimmy’s?”, “If Jimmy’s were to have a mobile application, would you use it?”

The consensus from the users were that they only visit Jimmy’s about once or twice a week at the most, this is mostly because of the unhealthy food that Jimmy’s offers. They would prefer a mobile ordering application so that they order before hand and reduce the time they have to wait for their food.

So to summarize, we found from these interviews that Jimmy’s users:

  • Don’t go often, only one to two times a week at most
  • Most were Engineering Majors looking to get a meal right after or before classes
  • Thought that app functions such as an award system weren’t needed since they only go weekly at the most
  • Would like a mobile ordering application to reduce wait times
  • Have the possibility of being able to customize their food on the go

All of these answers we decided must go into the thought process when designing the layout of our application. The next step in our process now was to create a moodboard to get an idea for how we want the application to look visually.

Creating a moodboard and finding a visual identity

Each of my team members included myself decided to each create a moodboard for Jimmy’s and then as a group we would collect those boards and create a combined board that reflected the food truck’s aesthetics and visual identity.

Moodboard for Jimmy’s Food Truck

After going over our moodboards, we came to the conclusion that the mobile ordering application needed to have an old time diner feel to it and needed to have a vibrant array of colors. This would match the similar mood that is being portrayed by the physical food truck.

Now that this was settled, it was time to move onto wireframing the layout of the application.

Wireframes, Iterations & Prototypes

In our original iteration of our wireframes we had the first screen that a user would see was an option for them to order from the truck or contact the truck. However we thought that this was unnecessary and keeping the user from the important content. Also if the user selected to order they were then shown this menu that was designed to run with the user having to swipe through a list of main menus to then scroll through a list. We as well felt that this was also unnecessary and made it harder for the user to find what they wanted.

For the next iteration in our design, we took what we learned before and got rid of the opening option screen and instead presented the user with the opportunity to keep out the menus as soon as they opened the app. And when they did select a menu they were taken to that menu and shown it items and allowed to switch menus by selecting a new one at the top.

For this iteration we decided to perform usability tests to see how the app would flow with users and if we needed to add anything else before moving on.

Screenshot of a usability test with Jimmy’s user

From this round of usability testing, we all agreed that a change needed to be made to the top section of the menu page as it was taken up too much space and not giving enough of the space to the menu items.

Second iteration of wireframes and our Low-Fidelity Prototype

We decided to add a little bit of color and a better UI for this next iteration which happened to be our low fidelity prototype. At this stage our goal was to start simplifying the app as much as possible and to have it flow evenly and have the user be able to place an order without having any hiccups. We added a slide down hamburger menu on the individual menu pages to make it easier for the user to switch users without us wasting a lot of on screen space. We also added the item images to try and give the users a visual sense of what the menu’s items looked like.

We decided to perform another round of usability testing and received feedback from users such as:

  • They liked the Venmo option for paying
  • For the “text” button option: wasn’t sure whether the truck was going to text them or they were going to text the truck their order
  • There’s no back button for the About Page
  • When adding a new item, no indication that the other item is in cart

We took this feedback and used to help us with producing our next prototype, our Mid-Fidelity.

Our Mid-Fidelity Prototype

After a lot of discussion and feedback from testers we decided for our mid fidelity prototype that we wanted to take the simplification of the application even further and make it easier for our users to order. So we made it so that the user now has access to all of the menu items on the homepage. And at this stage we also began adding color and additional UI elements to the rest of the app to try and keep a visual flow.

After putting this prototype through usability testing, we were given a large amount of feedback including:

  • Hamburger menus on the first page seemed a little long and when the menu expanded the hamburger icons icons looked weird
  • When clicking to customize a skinny jimmy sandwich, the menu can’t be expanded
  • On the your cart page, right below the jimmy’s sister tab, the customize order tab’s text overflows
  • On the same page, the ‘x’ icon seems like it will delete the whole page not the item
  • The checkout page doesn’t show me the Benmo page when I tap on credit/Venmo
  • To many options on the customization menu, “add ketchup to fries?” why is that an option
  • On the your cart page, it just jumps straight to the confirmation page after tapping on pay in person, should have more of a second confirmation to be sure

From this feedback we learned that the design and flow of the application needed to be simplified even more than we had expected.

So for this final prototype, we focused on eliminating everything that wasn’t absolutely necessary for the user to complete their order. We did this in a few ways:

  • We were determined to ditch the login feature: most users wouldn’t want to bother going through the process of generating an account and saving their credit info to the app. We avoided that by offering Venmo as a popular third-party service that stores your info externally, so even if you don’t use Venmo, you can sign up once and be done without us tracking your personal data for you.
  • KEEP IT SIMPLE, STUPID: We also wanted to get the entire workflow to as few screens as possible, so we condensed many of the features to single pages. Maintaining that balance of screen density and number of interactions is the key.

“If I’m ever going to use an app for one food truck that doesn’t even deliver, it’d better be the simplest goddamn thing ever.” — Usability Tester #6

With keeping simplification in our minds throughout the entire process of our final iteration we decided to shrink our page numbers down to just two and include an overlay style. This would allow for the user to choose and customize an item and add it to their cart all on one screen. Then the next page they would see is the checkout page where they would have the option to add another item if they wanted to.

Final Prototype

View our final working prototype of the Jimmy’s Food Truck mobile application.

Final Thoughts

There are a couple of things that myself and my team have learned throughout this process.

  1. KEEP IT STUPID SIMPLE. This is different from the original KISS statement because I believe it showcases our progress throughout the weeks of creating our prototype. We kept learning throughout that the application just needed to be simpler and that users didn’t want a super complicated application for just one food truck.
  2. YOUR TOOLS CAN MAKE OR BREAK YOUR PROJECT. Due to the requirements of the project that we were assigned, we had to present our final prototype in the browser application UXPin. While the application is very useful for when working by yourself, it can have a lot of hiccups and can cause a lot of problems when working with a group on one project. These problems ultimately led to a lot of time being wasted debugging our prototype, which could have been spent more on user testing.
  3. DOES A FOOD TRUCK NEED A MOBILE APPLICATION? By the end of this project, I think that the food truck that we selected did not need this application to help further grow their business. With all of the research and interviewing that we performed, it seemed like a better solution their problems would be to have a simple ordering text message bot set up so that customers can order right before they get out of class.

Have any questions or comments for me? Share your thoughts in the comments. Also, if you like photography, check out my Instagram.

Jake

Written by

Jake

Interactive Digital Media student @ Drexel. Writing at jakeculp.work

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade