DINNER IS SERVED:

To some restauranteurs, running dinner service every night can be like watching a slow-motion train wreck. If front/back-of-the house operations aren’t precisely coordinated, the whole system falls apart. That’s why more owners are turning to data-driven solutions, like VengaDine, to help them anticipate and proactively address issues before they occur. It can be difficult, however, to translate messy data into something actionable. That’s where I come in!

chuttersnap-464815-unsplash.jpg

PROJECT SUMMARY

Problem: Users have trouble drawing actionable conclusions from Venga’s data tables on their own, without the help of Venga’s Support Team

Task: Redesign a feature that would increase the usability of Venga’s data and could be implemented immediately

My Role: Product Designer

Time Required: 4 hours


UNDERSTAND

Select a Feature

Dine vs. Move

  • I know both industries well, but I have applied experience in hospitality (wineries)

  • Missing feature documentation for Move (support page down)

  • Welcome to Venga Webinar (Mike)

    • Pre-shift report seems like a high-priority feature for the user

    • Doing some QA testing of the printing feature in the pre-shift report, I noticed the graph that’s present in the web app is excluded from the PDF

    • Data visualization is the goal here, so when a feature removes visual information, that’s something I want to take a closer look at

Granted, a PDF printout isn’t the sexiest thing to redesign, but it is an often overlooked feature that will go unnoticed until a user really needs it. I think that if you can’t get the small details right, like a PDF, how can you hope to execute on the big ones?

Feature Selected: VengaDine’s Pre-Shift Report Printout

Pre-Shift Report Printout_Current State.png
 

Personas and use cases

Persona: General Manager

  • Focused on efficiency, customer service and turning tables

  • Place high value on products that are fast, reliable and easy to reference at a glance

  • Working in restaurant conditions, which can be loud, crowded, chaotic, dimly lit, and high stress

Use Cases

  • GM of Fennel & Fog, a hip new 6-table restaurant, needs to impress first-time clientele and reviewers. Intimate (cramped) and cozy (dimly lit) atmosphere and 2 seatings/night. Still ironing out back-of-house kinks. The GM is also colorblind.

  • GM of JUMBO, the largest restaurant in the city. Several hundred covers/shift. Speed of service and reliability of guest management system critical. Nearby thunderstorms have knocked out internet service. Phones unaffected.


RESEARCH

Competitive Analysis

competitive analysis.JPG

Mariana Tek (different industry, similar functionality)

Cake

Toast

QSR Automations

OpenTable

User Research

  • Some restaurants don’t have color printers, so all printouts need to be readable in greyscale

  • The restaurant atmosphere may be ‘romantic’ and candlelit, so considerations like readability in low-light environments need to be considered

  • Internet connectivity can’t be taken for granted. Outages are common

  • When it’s busy, managers need information available at a glance and easily referenced

  • The service industry lives and dies by Yelp reviews. A positive customer review is critical to the bottom line

UNMET USER NEEDS

  • Printable PDF export with graphs and tables for reliable, off-line reference

  • Easily readable in dimly lit environments

  • Preferably one-page for ease of use

  • Accessible for visually impaired, including colorblind and farsightedness


DESIGN

Simply adding the missing graph back into the document increases usability tremendously. The GM can easily see when the restaurant will be busy.

Report with graph.png

But what happens if the GM is colorblind…and in a dim restaurant? Is the document still usable?

Simulated Colorblindness

Graph starts to lose fidelity, but data labels still visible

Simulated Colorblindness & Dimly Lit Restaurant

Graph is largely useless and data labels can’t be read

Sadly, the document ceases to be useful under these use cases. Could changing the graph type improve usability?

D3.js is a JavaScript library for manipulating documents based on data, and could prove very useful here.

Wind Direction

The circular arrangement of bars is suggestive of a clock. Even in dim conditions, it might be possible to read the relative position and length of the bars on the clock face without needing to see it clearly.

Circular Calendar

Same as the previous chart, but with an added data series that could be adapted to show different classes of party sizes.


EVALUATE

With simulated darkness applied on our new version, the user is able to see the positioning of each bar around the clock. They don’t have to be able to read the data label to get the information they need.


NEXT STEPS

  • User testing and iterations

  • Refine data series for the graphs and color choices (optimize for use cases)

  • Experiment with data table formatting to fit more on a single page

  • Collaborate with Development to gauge level of effort for implementation