In the Summer of 2019, I was hired as a manager at a restaurant called the Port of Peri Peri in Frisco, TX.
My co-manager, a software engineer between jobs, had been commissioned by the owner of the business to develop an online ordering app for the restaurant. I came in as an early UX Consultant, doing some preliminary research and competitive analysis, delivering some low-fidelity wireframes (which I've sadly lost), and designing a high-fidelity prototype to illustrate the look and general flow of the app.
The app aimed to serve as a customer portal, allowing for rewards account management, online ordering, payment management using the internal Apple Pay or Google Wallet API, gift card management, and more. I started off by studying some similar apps. I browsed through DoorDash, Grubhub, UberEats, even the Starbucks app. They all shared certain similarities.
The first commonality I noticed was a masthead along the top, within which branding, primary account access, and settings access all remained consistently available. I noted that this same masthead could be used to contain internal navigation elements, separate from the main navigation used between primary screens. This is visible on the "Order" screen, in which the masthead contains the secondary navigation of the screen for the menu.
The fixed menu along the bottom was another commonality I observed, a design choice pushed primarily by iOS influence. This was the primary navigation between screens. The icons I chose were mostly placeholders, and I wasn't a huge fan of the client request to use the logo as the home icon.
The "front page" of the app follows similar principles to a number of restaurant apps. As the Port of Peri Peri was deploying their gift card system alongside the app, the service was given top billing in the information hierarchy. Later in the development cycle, after my involvement came to an end, the "Featured Menu Items" were cycled to a horizontally scrolling block on the front page.
Even further on in the development cycle, long after my involvement came to an end, delivery ordering was completely removed from the app. Instead DoorDash came to an agreement to allow users to make their selections in the Port of Peri Peri app, but complete delivery orders within their own payment portal. Before that, however, we were still advertising for users to download and install the DoorDash app as a companion to our own.
The "Order Again" selection has very obvious functionality, as the restaurant has a number of regular customers who rarely deviate from ordering the same thing. I wasn't a huge fan of the "New Order" button being typed out, I had intended for it to be smaller and compact, a simple plus icon with the same functionality of opening the checkout cart and pulling up the menu to make selections from.
Insofar as aesthetic, I followed the internal style guide provided by the company, and maintained clean lines and white spaces to create a bright, cheerful look when paired with the signature Port of Peri Peri Red.
Ultimately, this project was one of my first real attempts to research an existing market, develop insights based on that research, and implement that research into an information hierarchy containing key features, as required by the client.