10. Wireframes and Mockups

Try these first

1. 1.

   What is a wireframe?

   Hint

   Think about blueprints and their functions.

2. 2.

   What is a mockup?

   Hint

   It involves colors and branding.

3. 3.

   What is a wireframe focused on?

   • Visual design
   • Layout and structure
   • Final branding

   Hint

   Think about the foundational aspect of UI design.

4. 4.

   True or False: Mockups are low-fidelity representations of a user interface.

   • True
   • False

   Hint

   Remember the fidelity levels.

5. 5.

   Create a wireframe for a simple login page including username, password, and login button. Explain how your wireframe will guide the development team.

   Hint

   Focus on the layout, not design elements.

6. 6.

   Design a mockup for the checkout process of an online store. List the key components involved and justify the choices you made based on user experience.

   Hint

   Think about what users need most during checkout.