Zoe Monosson

I wanted my user to feel like he was walking into and through a real restaurant. In order to establish this experiential quality, I utilized pictures and animations to engage and entertain the user. This is the home screen where the user is prompted to push open the door of the restaurant. In a working prototype, the user would click on the door, the image of the doors would animate open, and then the user would be guided inside the restaurant, just as if he was in the restaurant himself.

Once entering the restaurant, the user is shown a video of them walking through the restaurant, is brought to a table, and is give a menu. This screen is displayed once the user is given the menu. By displaying an image of the table behind the menu, I tried to replicate the user sitting at a table in the restaurant.

When the gallery button, located in the navigation bar, is pressed, the video will move from looking at the menu to changing to a bird's eye view above the table. On the table, a dish is shown. Similarly to before, this animation is used to capture the user's attention and engage them in the dining experience.

This is another example of a dish served at The Slanted Door.

The reason people go to a restaurant is to eat delicious food. Therefore, my main goal with this application was to make my user's mouth water. When one enters the photo gallery, he has the option to "click for more details," on each dish. When this occurs, the user is brought to the "hero page."

This is the "hero page." On this screen, blinking circles hover above different sections of the dish. The colors of the circle match the colors used in the navigation bar in order to give the design a consistent look. When the user clicks on a blinking circle, the rest of the page darkens and details about the ingredients used in the dish appear.

The user can swipe through multiple images of the ingredients in order to make the design more interactive. The image of the ingredients lights up in a bright blue color in order to give the user visual feedback that he pressed the circle button and to draw attention to the image. It is important to draw attention to the image in order to distinguish it from the busy background.

The navigation menu is located at the bottom of the screen. This location was chosen, so that the user's hand would not cover the content of the page when selecting different options. For both the "menu" and "about" buttons, there are smaller sub options. The text for these subheadings are a smaller text size in order to convey to the user that they are secondary options. These subheadings are layered on top of the main headings in order to condense the information and to not take space away from the images on the screens.

This screen tells the user more about the restaurant's owner, Charles Phan. On this screen, you can see how the navigation bar is slightly transparent. This design choice was made in order to add depth and visual intrigue to each screen.

This screen gives the user more information about the local farms that The Slanted Door gets their food from. The user can click on any picture in order to be transferred to the farm's website in order to learn more about their produce. This screen was created to highlight how upscale their produce is and the quality of their food.

Ultimately, the end goal of the application is to convince the user to book a reservation at The Slanted Door.