Class Central is learner-supported. When you buy through links on our site, we may earn an affiliate commission.

Noble Desktop

UX & UI Design Certificate (Live Online)

via Noble Desktop

Overview

Gain the skills needed to become a UX/UI designer through training in design concepts, industry-standard tools like Figma, and research methodologies. This program equips you to design user-friendly products while preparing you for a career with hands-on projects and one-on-one mentoring.

Syllabus

UI Fundamentals

How & when to use common UI patterns

  • Menus
  • Tabs
  • Bottom tab bar
  • Buttons (including “Call to action” or CTA)
  • Accordion
  • Carousel
  • Breadcrumbs
  • Modals
  • Forms
  • etc.

Learn Figma

Create Visual Designs & Clickable Prototypes

  • Learn how to use Figma to create clickable prototypes to show users for testing, or for clients to see your work.
  • Design the UI (user interface of websites, apps, etc) in Figma. 

UX Design Concepts

Intersection of Design, Technology, & Business

  • Through critical analysis understand how user experience as a field sits in the intersection of different areas of the product.
  • What is the difference between User Experience Design and User Interface Design?
  • Learn about heuristics and apply heuristic evaluation to websites.
  • Competitive Research

Knowing Your User

  • Learn how to structure and conduct user interviews to better identify the needs and current behaviors of the user.
  • Understand how to engage the user to work through assumptions and preconceived notions that arise during the process.
  • Write down assumptions for your class project.

User Research Through Interviews

  • Refine user interview questions.
  • Interview classmates for your project.

Refining User Research and Creating Personas

  • Create user personas from the interviews to represent the goals and behaviors of the users within the system.
  • Develop user scenarios to show when and how the user engages with the system.

Synthesis of User Research, Journey Maps, and User Flows

  • Continue to synthesize results of user research to find patterns.
  • Create a journey map for your project.
  • Think through the different features of the system by building user flows.
  • Take the written narrative to the next level through sketching and improvising using techniques such as storyboarding and bodystorming.

Wireframing, Sketching, Prototyping

  • Practice a sketching session for an existing website or mobile application of your choice. Start with sketching on a whiteboard or your notebook.
  • Sketch wireframes for your class project.
  • Learn the power of prototyping and testing an idea. Understand different methods of prototyping and their levels of fidelity.
  • Discuss the motivation behind the prototyping, such as newly discovered user goals, business needs and improved functionality.

Prototyping & User Testing

  • User testing methods and strategies.
  • Do’s and don’ts of user testing.
  • Do a user test on your project with a classmate.
  • Clearly list the assumptions and test your concepts. Work on multiple iterations of the prototype based on the test results.

Iterating the Prototype and Further User Testing

  • Report conclusions based on user testing.
  • User testing reports.
  • Rework the prototype based on user testing conclusions.

Case Studies

Building Case Studies

  • Look at case study examples.
  • Finish your clickable prototype.
  • Using a compilation of user research, prototypes, photographs, and user research, build your case study.
  • Present class projects as case studies on-screen.

Creative Briefs

Getting to Know a Project: Creative Briefs

  • What is a Creative Brief?
  • What to Include in a Creative Brief

Wireframing for UI Designers

Wireframing

  • Why and How to Create Wireframes
  • Issues to Solve
  • Steps in Creating a Wireframe
  • Designing on a Grid System (like Bootstrap)
  • Get Critiques
  • Incorporate Feedback & Improve Your Designs

Wireframe to Refined Design

  • Iterate & Refine
  • Understanding the Mobile Experience

UI or Visual Design Concepts

Learning from Existing Websites & Apps

  • What Works & What Does Not?

Color

  • Color Harmonies
  • Creating Contrast with Color
  • Guidelines for Proper Color Usage

Typography & Fonts

  • Display Text (Such as Headings) versus Body Text
  • Legibility
  • Type Trends
  • Typeface Selection & Pairing
  • Where to Get Web Fonts
  • Ideal Line Height
  • Column Width (Line Length)
  • Hyphenation & Justification

Design Elements

  • Proximity
  • Similarity
  • Continuity

Trends in Web & App Design

  • Analysis of Example Websites & Apps

Design Patterns

  • Example Design Patterns

Multiple Screen Sizes

  • Responsive Web Design
  • Mobile Considerations & Limitations
  • Discoverability Challenges
  • Mobile Navigation
  • Phone vs Tablet App Design

Workflow: Idea to Design

  • Example Web & App Design Workflows

The Business of UX & UI Design

The UX & UI Design Industry

  • Getting into the business: strategies and ideas.
  • Resources

Portfolio Website & Job Preparation

Creating Your Portfolio Website

  • Examples of UX & UI portfolio websites
  • What you should include on your portfolio website
  • Get 1-on-1 feedback on your case studies & portfolio website

Resume Development

  • What you should include on your resume
  • Get 1-on-1 feedback on your resume

Taught by

Cameron Stevens, Michael Suen, and Christophe Dayton

Reviews

Start your review of UX & UI Design Certificate (Live Online)

Never Stop Learning.

Get personalized course recommendations, track subjects and courses with reminders, and more.

Someone learning on their laptop while sitting on the floor.