When we set out to design an integrated online ordering platform for our restaurant partners, we had two primary design objectives. We needed a design that would provide end users the best possible, mobile optimized online ordering experience, while at the same time, offering the minimum possible setup and maintenance for restaurant management. Utilizing Google’s material design and modern cloud architecture, we were able to achieve our objectives.
Material design is all about conveying a consistent visual language that is easy to understand. Proper spacing, smooth animations, and iconography are used to create proper functionality, usability, and aesthetic attractiveness. The background is a light grey color with important pieces of data, like menu items and cart info, placed on white cards which seem to pop off of the page. Main headers, important links, and buttons share a bright primary color while sub-headers and other secondary functions rely on a secondary accent color. All of this creates a level of color contrast that conveys an almost subconscious sense of hierarchy and importance among page elements. While visual design required a fair amount of development, we also engineered the backend of the site to be secure, simple to use, and fully integrated into our existing POS architecture.
Simple to setup and deploy
While many online ordering platforms require a separate menu setup, we use the same data for both our iPad POS and online ordering site. Aside from the significant amount of time saved by not having to duplicate an entire menu, mistakes can be avoided and future changes only need to be made once. Our common data store guarantees the online ordering site is always in sync with the POS system. When a restaurant makes any change to the menu setup, the propagation of that change to the online ordering system is automatic and immediate.
Setting up a new online ordering site is quick and easy. The MobileBytes admin site has a page where restaurant managers simply set properties to configure their web presence, which we host on their behalf. Setup properties include the two colors mentioned above, a logo and banner image, specific online hours of operation, accepted payment types, accepted order types (delivery or carry-out), a delivery area (if applicable), and a designated iPad for processing the online orders. Managers also choose a URL prefix for their new site. For example, a restaurant called “Burger Bytes” could setup a URL prefix of “burgerbytes,” meaning their full URL would be “https://burgerbytes.
Realtime Connection to the Restaurant
For hungry end users, we made the ordering process as simple as possible. The first thing a user sees when they arrive on the landing page is the restaurant menu where they can immediately begin choosing the items they want to order. Order items can be customized with ingredients and modifiers based on the restaurant’s menu setup, and items can be grouped by guest name to help avoid confusion. Upon checkout, a delivery or pickup time can be chosen from a list. Guests can optionally login through Facebook to save address information as well as credit card tokens for future orders.
When an online order is placed, a new ticket gets pushed to the restaurant in real time. The online order ticket looks and acts exactly like any other ticket entered into a local iPad terminal, except that each iPad also gets a message alerting users that a new online ordering ticket has arrived. All kitchen slips print and kitchen display terminals are updated automatically.
Restaurant staff can alter the prep time for online orders in real time with a simple slider control on any MobileBytes iPad POS or KDS terminal in the restaurant. This allows restaurants to easily adjust for slow and busy periods while keeping online order customers aware of the current prep times.
Online Ordering for Free
With our online ordering system being simple to setup, any restaurant using MobileBytes POS can have an online ordering presence today, and for a limited time, online ordering is being offered to our iPad POS customers free of charge for the life of the account.