/Columbia-Eats

UI Design Final Project. Read README before opening website!

Primary LanguageHTML

Columbia-Eats

UI Design Final Project

This application is designed to be viewed on the dimensions of an iPhone X (not very responsive since it is coded purely in HTML and CSS).

To view the proper application, click on the site link and then right click to get to the ‘Inspect’ View. From there, you should click the highlighted button to toggle to mobile view. Then click 'Responsive' at the top to see a dropdown menu and select the 'iPhone X' option.

To navigate between screens, you can click the different options on the navigation bar at the bottom of each screen. On the Home screen, you can click the various parts of the 'Ferris' card to go to either the 'Menu' screen or the 'Wait Times' screen. You can also click the arrow at the bottom of each card to expand and see the buttons to navigate to other pages. On the 'Menu' screen, you can select ‘grid view’ from the dropdown to see images of each dish, which can be moused over for more information. You can also select ‘list view’ to get an at-a-glance summary of all available items. On the 'Wait Times' screen, you can click the thumbs up or down icons next to the line length of the pasta line to simulate user input. Clicking the thumbs down leads to a dropdown menu where you can enter your input in a dropdown menu and then confirm your input by clicking 'Confirm'. On the 'User Info' screen, you can click the arrow next to 'History' to expand your meal swipe, dining dollar, and FLEX dollar history.