Skip to content

Latest commit

 

History

History
85 lines (59 loc) · 3.56 KB

ui-ux-design.md

File metadata and controls

85 lines (59 loc) · 3.56 KB

UI/UX Design

Projected Time

About 1 hour 10 minutes

  • 10 minutes for video walkthrough of slides
  • 45 minutes for Independent Practice
  • 20 minutes for Group Practice

Prerequisites

  • "HTML" lesson
  • "CSS" lesson

Motivation

User Interfaces (UI) and User Experiences (UX) describe the things users see and feel when they interact with a product, be it a website, a mobile app, or even a physical gadget. Almost all tech companies build products of some kind or another, and it's imperative that their products be well-received and well-loved by their users.

Objectives

Participants will be able to:

  • Define "UI" and "UX."
  • Explain how UI and UX work together.
  • Identify good examples of UI and UX.

Specific Things To Teach

  • Differences between UI and UX
  • How UI and UX work together

Supplemental Materials

Lesson

UI/UX Design (video walkthrough of slides)

UI/UX Design (slides)

Things to Remember

  • Interface design is often seen as the "visible things on screen". In fact, it is about the experience, but not just the experience using the app, it's about the whole user experience, including the one outside the app. Designers must immerse themselves into the user's mind and life.

  • The iterative aspect of the design process is key. Designer motto: The first design is never right. A good designer always refines solutions and explores options.

Independent Practice

Pairs will not be assigned for this exercise.

Activity #1 - Design Improvements Pick an app or website whose UI or UX you dislike and make a list of things that could be improved.

Focus of the following:

  • Am I able to complete the tasks for which the interface is built for?
  • Why would I not use the app on a daily basis?
  • Details matter. How is the copywriting? The app's personality? The visual language? The colors? The information density?
  • List other annoyances you might see, hear, or feel

Activity #2 - Design Successes Name something (an app, an object, an experience, a place) that you use regularly and that is truly making your life better. It doesn't have to be an application or software.

Describe your feelings: Why do you use this in particular? Why not another something else?

What do you think stands out in terms of the following?:

  • Emotional response
  • Usefulness
  • Usability
  • Simplicity
  • Sense of community
  • Speed

Group Practice

Find a pair and share your findings for Activity #1 and Activity #2. Swap pairs and share once more.

Check for Understanding