Course Introduction

Introduction to Course 3: Build Wireframes and Low-Fidelity Prototypes

Course Overview

Welcome to the third course in the Google UX Design Certificate program. This course continues the UX design process, moving from ideation into the prototype phase where you’ll bring your ideas to life through wireframes and low-fidelity prototypes.

Learning Objectives

By the end of this course, you’ll be able to:

• Use research to inform the ideation process
• Build storyboards and explain how storyboards are used to create wireframes
• Draw basic elements like shapes and lines
• Understand information architecture principles
• Create paper wireframes
• Build digital wireframes using Figma
• Construct low-fidelity paper prototypes
• Develop low-fidelity digital prototypes in Figma
• Understand how to avoid the effects of deceptive patterns in designs

Course Structure

This course is divided into three main modules:

Module 1: Storyboarding and Wireframing

You’ll start by learning how to use research findings to inform ideation during the design process. Next, you’ll create two types of storyboards: big picture and close-up. Then, you’ll draw your first wireframes and explore the benefits of wireframing. At this point in the design process, you should have lots of ideas for designs that address real user needs, and wireframing will help you refine those ideas.

Module 2: Creating Paper and Digital Wireframes

This action-packed module focuses on drawing wireframes for a mobile app. First, you’ll draw lots of wireframes on paper. Then, you’ll transition to digital wireframes in the design tool Figma. You’ll learn directly from Figma about how to best use their tool. Finally, you’ll apply Gestalt Principles like similarity, proximity, and common region to your wireframes.

Module 3: Building Low-Fidelity Prototypes

Having gone through the first three stages of the design process (empathize, define, and ideate), you’ll enter the fourth stage: prototype. First, you’ll create a paper prototype of your mobile app. Then, you’ll transition to create a digital low-fidelity prototype in Figma. Additionally, you’ll explore ways to recognize potential bias in your designs and learn how to avoid deceptive patterns.

Portfolio Project

Throughout this course, you’ll continue to develop the designs for a mobile app based on the project prompt you selected in the previous course. Everything you build will eventually be included in your online portfolio to demonstrate your experience to potential employers.

Tip

Career Focus: Taking the courses in this certificate program in order allows you to follow the steps of the design process and end up with all the artifacts you’ll need for your portfolio.

Prerequisites and Continuity

Content and projects in each course build on information practiced in earlier courses. To be successful in this course, you should complete the previous two courses:

1. Foundations of User Experience (UX) Design
2. Start the UX Design Process: Empathize, Define, Ideate

The skills you develop here will prepare you for subsequent courses where you’ll conduct UX research, create high-fidelity designs, and build dynamic user interfaces.

Design Process Context

Prototype Phase

You are now transitioning into the prototyping phase of the design thinking process. In this phase, you’ll build wireframes and low-fidelity prototypes that allow for visualization of the product, provide a great way to gain feedback on usability, and serve as tools to communicate experiences.

The prototyping strategy depends on the goal of your project, but the general approach focuses on turning concepts into reality while working through problems and iterating designs based on research and feedback.

This course emphasizes low-fidelity designs that help you get ideas out quickly while leaving room for exploration. Later courses will cover high-fidelity designs when you want to test designs that look like real products and get more specific feedback from users.