 Random detail when clicked.

Functions when clicked the Random button, there is a pop up will show a dish from all cuisine
and location. Also, users can click the Detail button to see location, name of restaurant and
calories. Furthermore, if user like the dish from random menu, there is a heart icon which can
click to add the dish into favorite page.

- The elements on the page

1. Random Button
2. Close Button
3. Detail Button
4. Favorite Button

- The rationale of your design

The rationale for UI design is driven by the 10 usability heuristic principles, which prioritize a
user-centered approach. These principles, including visibility of system status, consistency and
standards, error prevention, and user control and freedom, guide the design process. By
adhering to these principles, the design aims to enhance usability, minimize user errors, and
promote a seamless and intuitive user experience.

By presenting the Random button which is the design make user to recognize easily and detail
button show after clicked the Random button that we put it in the middle of the random page.

Also, all the information on each menu we aim to let user to see it clearly.
 More detail when clicked.

There is a menu on the main page that user can click to see more details of menu. For each
menu contain name of the menu, pictures, location, name of restaurant and calories, also heart
icon which user can click to it to add the menu into the favorite page that user can see the menu
again.

- The elements on the page

1. Lists of menus
2. Favorite Button
3. Arrow for back to main page

- The rationale of your design

The rationale behind UI design is informed by the 10 usability heuristic principles, which
prioritize a user-centered approach. These principles encompass system status visibility, intuitive
interactions, error prevention, efficiency, and flexibility of use. To make the user feel comfortable
when they start using the application that user will see the main point of the application, that is
lists of menus and detail for each menu is easy enough to recognize user.
 Hamburger Bar

We created Hamburger bar for user that when clicked, it will show a slide bar from left which
contain logo of the application, profile button and log out button.

- The elements on the page

1. Hamburger Button.
2. Slide bar.
3. Logo
4. Profile Button.
5. Log out Button.

- The rationale of your design

The rationale for UI design is guided by the 10 usability heuristic principles. These principles
encompass system status visibility, consistent interactions, error prevention, flexibility, efficiency,
feedback, minimalistic design, user control, error recovery, and help/documentation. By
incorporating these principles, the design of Hamburger bar aims to optimize usability, enhance
user satisfaction, and ensure a seamless and intuitive interaction with the interface for user to
recognize quickly.
 Search bar

On the main page there is a search bar for users to search for menu, when user clicked to it, it
will show all the menu with calories of each menu. Here when user typed something “Pork” the
result shows all menu that have pork.

- The elements on the page

1. Search bar.
2. Arrow for back to main page

- The rationale of your design

The rationale of UI design is in the usability heuristic principles. These principles guide the
creation of a user-centered experience by emphasizing system status visibility, intuitive
interactions, error prevention, flexibility, and efficiency. The design rationale also focuses on
clear feedback, minimalistic aesthetics, user control, error recovery options, and helpful
documentation. By following these principles, the design of the search bar aims to optimize
usability, enhance user satisfaction, and deliver a seamless and intuitive UI. Furthermore, we
added the lists of the menus to make the application more functional.