Subway Sandwich

Self Service Kiosk

I chose to design a self-service kiosk interface for Subway for two main reasons. First, in North America Subway currently lacks a dedicated self-service kiosk option. Second, on a personal level, I often find it challenging to interact with employees at Subway—either due to difficulty understanding them or not knowing the names of specific ingredients. This experience often leads to anxiety and frustration. I would much prefer the ease and independence of using a self-service kiosk.

PROTOTYPE

Please click on the Figma prototype below.

PURPOSE

My purpose of this project is to create an intuitive, efficient, and accessible self-service kiosk experience that will simplify the ordering process for Subway customers. The current interface has some challenges, such as unclear navigation, lack of feedback, and customization process might feel overwhelming for users, especially with too many choices presented at once. I want to make the new design being focused on the usability and user-centred.

RATiNG & REViEW

In my research and analysis of Subway, I discovered numerous reviews from unsatisfied customers who shared similar frustrations to my own. Reading these reviews provided valuable insights into what’s missing and highlighted the importance of Subway considering a self-service kiosk to help reduce customer frustrations and improve the overall experience.

Pain Points

  • Service is bad and some customers has worst experience
  • Disrespectful and rude attitude
  • No change in bad service and attitude
  • Some customers prefer to go to Tim Hortons after bad experience
  • Customers feel miserable
  • The food is not fresh (eg, “cucumbers were yellow, lettuce was brown”)
  • Some employees can barely speak English
  • Feel sick due to too much sauce and or/dark brown lettuce
  • Food and service are getting worse
  • 12” sub for half of the meat
  • Two employees were talking to each other and didn’t acknowledge customer’s existence

Gain Points

  • Food is good, fresh and tasty
  • Some customers still willing to tip
  • Normally eat Subway for lunch
  • Always prefer Subway to eat twice a week
Subway self-service kiosk mockup

HEURISTIC REViEW

I have done the Heuristic Review of the Subway’s official website, specifically the homepage and the ordering process. For the ordering process I decided to go with my favourite Steak & Cheese sandwich, which surprisingly I could only find in Best Sellers section, but not in “Menu: Subway Series” landing page. I paid extra attention to the customization process, which includes the Size, the type of Bread, Protein, Cheese, Veggies, Seasonings, Add-Ons and here is what I found:

Screenshots of website for heuristic review

RESEARCH PROCESS

After initial prototype I have conducted 3 interviews. I have recorded the interviews by using Voice Memos app and by taking notes during the interview. I turned all the answers and main ideas into notes and placed them next to answers so I can see the main points and find some insights.

Subway self-service kiosk mockup

INSiGHTS

PERSONA

Based on my identified recommendations and key goals, I developed a distinct persona to guide my focus and address user needs effectively.

target audience persona

DESiGN PRiNCIPLES

  1. Simplicity: Keep the interface clean and easy to navigate with minimal distractions.
  2. Efficiency: Optimize the user journey for speed and quick decision-making.
  3. Personalization: Allow users to customize their orders without overwhelming them with choices.
  4. Visual Appeal: Use high-quality images and clear text to enhance the user experience.
  5. Consistency: Ensure uniformity in design elements across the interface.
  6. Accessibility: Design with accessibility in mind for a diverse range of users.

USER FLOW

Customers start at the welcome screen, select their meal from categorized menu options, and customize their order step by step (bread, protein, toppings, sauces). The system suggests combo upgrades before showing an order summary for review. Once confirmed, customers complete payment, receive an order number, and pick up their meal when ready. The kiosk ensures a fast, intuitive, and seamless ordering experience.

MOCKUPS

Subway self-service kiosk mockup
Subway self-service kiosk mockup

SUMMARY

Based on the feedback provided, the overall experience with the Subway self-service kiosk prototype seems to be quite positive. Users appreciated the clean, intuitive interface, which made navigation easy. The visual design, such as clear images and the use of colors like yellow to guide actions, was well-received. The progress bar, breadcrumb navigation, and step-by-step process were found to be helpful in keeping users informed and reducing confusion.

Key strengths of the prototype included its efficiency in saving time and reducing miscommunication. The inclusion of descriptions for each sandwich and the ability to customize options, such as “more” or “less” of certain ingredients, were noted as useful features. However, some users suggested improvements, such as making the "None" option more intuitive and adjusting the order of certain pop-up windows for better flow.

In terms of payment options, the kiosk was considered secure and intuitive, with straightforward icons and navigation. While users found the ordering process to be efficient, the transition between customization and finalizing the order could be improved by presenting the sandwich description first.

Overall, the self-service kiosk was seen as a convenient and time-saving option, especially when compared to traditional counter ordering. Users expressed a preference for kiosks as they allow for a more streamlined experience without the need to wait in line. Despite some minor suggestions for improvement, the kiosk met users' expectations for an easy, fast, and visually engaging ordering experience.

<
Prev.
Subway
Next
Teakit
>