Intro to Wireframing & Figma

Gain practical UI design experience by learning about and creating wireframes before diving into Figma to make a digital prototype of your design.

Instructor:
Jen Hubbard | UI Designer, Creative & User Experience, OIT
Jen currently works as a User Interface Designer here at Duke. She's worked in design for the past 10 years, starting out as a print designer. Jen is passionate about creating designs that are both usable and delightful.

This class will be hosted via Zoom. You will receive an email with the Zoom link a day before the class. Attendance will be taken and the session will be recorded

About Course

Outline

  • Wireframing basics
  • Wireframing in Figma
  • Prototyping in Figma

Objectives

  • Basic understanding of wireframes: what they are, how to create them, and when to use them.
  • Be able to create a simple prototype of wireframes using Figma.

Tools

  • Figma (Please create an account before the class)
  • Paper & pencil

Files

Download File Icon Example

Prerequisites

Complete one of these Figma tutorials to learn the basics of the application:
https://www.youtube.com/playlist?list=PLXDU_eVOJTx7QHLShNqIXL1Cgbxj7HlN4z
OR
https://www.linkedin.com/learning-login/share?forceAccount=false&redirect=https%3A%2F%2Fwww.linkedin.com%2Flearning%2Ffigma-for-ux-design-2%3Ftrk%3Dshare_ent_url&account=77842946

This class is part of our UX/UI Design Track

See the whole track

Suggested Courses

Course Graphic

Designing for Users: Overview of UX/UI

Get familiarized with the different steps and aspects of designing websites and apps with your users in mind.

Learn More
Course Graphic

Validate Your Design with User Testing

Put your design to the test and check if your ideas make as much sense to your users as they do to you (and your team). See how usability testing is done in professional circles and learn how to apply the same methodologies to your personal projects.

Learn More
Course Graphic

Organizing UX Research with Information Architecture & User Flows

Learn how to organize the research you uncovered during the Discovery phase of UX research through this overview of information architecture and user flows.

Learn More
Course Graphic

UX Research: Discovery

Join Information Architect Bendte Fagge and learn how to go about gathering valuable information that will inform all future design decisions of a website or app project.

Learn More
Course Graphic

The Visual Design Process

This workshop will introduce you to one approach to visual design. Join UI designer Jen Hubbard as she walks you through the steps she takes in completing visual design projects here at Duke.

Learn More
Course Graphic

Inclusive websites and accessibility

The goal of a website is to be found and used, but to do that, it must be accessible. Depending on the type of website, accessibility rules may be mandatory, but even if you are only planning on creating a cat blog for you and your family, accessibility should be on your mind.

Learn More