Tangible Table Interface

Rapid prototyping of a tangible interface for a restaurant tabletop while creating a seamless experience for diners.

In present days, mobile devices can go beyond their expected use to humans and create virtual barriers while at a social event, discussion meetings, or at a restaurant. To promote a better food ordering experience, social interactions, team collaboration, we created a prototype and tested usability.

How might we enhance dining experience through seamless tangible interaction using physical devices, break barriers, and encourage social interactions?
Tangible interface for restaurants. Interaction using a circular dial for continuous input.

Overview

Restaurants are a commonplace for making social connections, enjoying family moments, discussions involving clients, and to enjoy delightful food.

But most times, we end up leaving the dining table even before taking that tasty bite.

1Food preparation progress: Continuous feedback is paramount in most cases and it even applies to the food being prepared in a restaurant. This can certainly cause a diner to become impatient.

2Struggle with the menus: Unless you have been to a similar restaurant or the one you are now, most times menus can be difficult to understand and visualize the food ingredients.

3Difficulty to socialize: Mobile devices can be barriers and introduce distances between people at a dinner table.

4Entertainment: Games and puzzles on a common table interface can bring people together and also, it promotes interaction between different groups within the restaurant.


My role

I led the team of designers, researchers to rapid-prototype the whole interface and test with users at the end.

Also, My contributions include paper sketching, hybrid sketches, storyboards, physical sketches, and prototype evaluation.

Presented the work to the class at the end of our project.


Process

We combined our thoughts, ideas to realize possible interactions and then, used rapid prototyping techniques to transform concepts into final high-fidelity interactive prototype.

Rapid prototyping process

Brainstorming

In a team, we explored various concepts that could become part of our tabletop interface and directly address the issues, we aimed.

  1. Digital menu with continuous/discrete inputs
  2. Food preparation status indicator
  3. Entertainment options (Games/Puzzles)
  4. Tangible objects for interaction
  5. Mobile device based payment and review submissions
Initial concepts — Brianstorming

Some of the key aspects we focused during our brainstorming were:

How might we introduce social aspects by limiting the diners with their mobile device interaction?
How might we add gamification in our concept to encourage collaboration?
How might we enhance the payment process, food review process?

Key concepts

Social interaction in restaurant settings

  • Initiate conversation with people around using the options on tabletop display.
  • Share stories on restaurant wall
  • Multiplayer games
  • Cast pictures/ videos from your phone on the tabletop display

Order using the tabletop display

  • Place an order
  • Build your own (customize)
  • Estimated time for you order arrival

Payment

  • Pay using different payment methods
  • Pay on the tabletop using QR code
  • Apply discounts and coupons
  • Split the check

Reviews and recommendations

  • Review/ rate the wait staff
  • Review/ rate restaurant experience (food, ambience etc.)

Information Displays

  • News bulletins
  • Reading books, articles. Blogs

Paper Prototypes

We gathered our ideas and thoughts about interactions, functions for the tabletop display and clustered them based on similarities. Further, we developed our initial paper sketches to elicit user cases and user interactions.

Paper sketching exploring use cases

Key findings from initial sketches and walk-through

Some of the key findings from the critique session and walk-through revolved around how the various objects in the restaurant settings can be used for enhancing the user experience using tangible user interfaces.

For giving ratings instead of using the rating screen on the digital tabletop interface it was suggested to use a tangible object that includes a knob to rate the staff or restaurant from 1 to 5 or a flag up or down option using a flag object that be physically adjusted to indicate like/ dislike.

The vertical menu did not seem to go well with the ergonomic design preferences.
Ability to reach certain controls was an issue.

Storyboards

We explored the scenarios for our prototype in a restaurant environment — one storyboard showing successful use and other a breakdown in the interaction.

Success Scenario: Users at a restaurant ordering their meal with customized ingredients by using tangible interaction

Successful dining experience using the interface

Failure Scenario: Kids annoying parents by being immersed distracted in games and other interactions discouraging the parents to use restaurants with table displays.

Failure scenario of using the interface

Physical Prototyping

We explored high-fidelity prototype by building a cardboard version and employed physical objects which resembled to our requirements — cylindrical and cubical forms.

We chose cardboard and everyday objects such as foam, jar caps as interaction objects. We basically chose these for reasons:

Easy to find and adapt them to our design requirements
Easy to dispose and build a new one
Physical prototype creation. Cognitive walk-through using the prototype

High-Fidelity interactive prototype

We created our high-fidelity interactive prototype for the tabletop using power-point hot-spots. Using the interactive prototype, we conducted user evaluations to understand about tangible interaction and food ordering process.

Hi-fi screen mockup

User testing

We evaluated our prototype using think aloud protocol by asking few participants to use the high fidelity mock-up of the system. We gave the participants a task of ordering a food item ‘muffin’ by completing all the steps right from exploring the items in the menu to finalizing the order.

Prototype evaluation using tasks

Tasks

Order a muffin
Choose flavors (customize)
Adjust the quantity

Key Findings

Some of the key findings that emerged:

  • Participants liked the idea of ordering food using the tabletop interface. They were quite fascinated by the look and feel of the interface and enjoyed playing and exploring all the options.
  • The idea of showing the status of their food order was appreciated by the participants.
  • Participants liked the concept of having games on tabletop only if they were better than the games they already have in their mobile phones. Our prototype was not ready with screens for showing game-play hence, we couldn’t test this feature.

Lessons learned / Conclusion

A great team experience and some new neurons were burnt in the process.

We used combination of InVision and PowerPoint slides to add interactions to the tabletop interface.
With just few adjustments to the regular desktop interface elements, tabletop user interfaces can be optimized to be used for interacting using touch and tangible modalities.
Considering just-enough-details during each of the prototyping phase is paramount.
Do not focus on aesthetics too early as it can discourage from disposing the intermediate prototypes.
Rapid prototyping combined with evolutionary approach helps achieve efficient way of product design.

Credits

Chauncey Frend, IUPUI, Indianapolis — assisting with the hardware, technology

Team members — Rehab, Kartik, Shanglei, and Yi.


Hope you enjoyed!

Let’s be friends. Connect me on LinkedIn. Also, Check out my GitHub for more case studies.