Great Design With User Research – Design a Mobile App Using Figma
By freeCodeCamp.org
Published: Feb 02, 2022“
Improve your UI / UX design skills by designing a real-world app using Figma. You will learn how to use the d.school design thinking process and self-process management to come up with design solutions.
Course created by Dev and Design. Check out his channel: https://www.youtube.com/channel…
Course Contents
- (0:00:00) Introduction
- (0:04:53) Outline Breakdown
- (0:07:01) Workflow Breakdown In FigJam
- (0:22:50) User Empathy ( Empathize )
- (0:23:21) Creating User Experience Survey With Google Forms
- (0:38:21) Creating User Personas
- (0:43:08) Creating Problem Statement
- (0:44:31) Ideate
- (0:47:49) Prototype Analysis
- (0:48:16) User Goals & User Tasks
- (0:50:11) Information Architecture
- (0:55:38) Low Fidelity Prototyping
- (1:19:59) High Fidelity Prototyping
- (1:20:11) Creating Style Library
- (1:37:21) Creating Component Library
- (3:32:11) Prototype Presentation & Assignments
”
Tag: UX
[#Script #Coding] Figma Tutorial for UI Design – Course for Beginners
Figma Tutorial for UI Design – Course for Beginners
By freeCodeCamp.org
Published: Jan 05, 2022“
In this Figma course, you will learn how to use Figma for UI Design. Figma is a vector graphics editor and prototyping tool.
Joseph Brendan developed this course. Check out his YouTube channel: https://www.youtube.com/channel/UCETwb_AzizmhID0RjKULnBA
Course Contents
- (0:00:00) Introduction
- (0:00:55) Creating A Figma Account
- (0:02:32) Creating & Naming A Figma Design File
- (0:04:47) Creating Shapes In Figma
- (0:07:16) Selection In Figma
- (0:12:02) Editing Shapes In Figma
- (0:36:14) Introduction To Typography In Figma
- (1:01:41) Design Tree In Figma
- (1:06:43) First Design Task
- (1:20:44) Colors In Figma
- (1:44:22) Drawing Tools In Figma
- (1:49:20) Margin And Padding In UI UX Design
- (1:56:08) Figma AutoLayout
- (2:13:48) Formatting Principles In Figma
- (2:34:32) Figma Constraints And Resizing
- (2:51:11) Website Design in Figma
- (2:55:52) Jakob’s Principle Of Design
- (3:00:25) Introduction to Styles and components
- (3:25:29) Figma Component Variants
- (3:36:18) Layout Design & Configuration For Websites in Figma
- (3:40:07) Layout Grids In Figma
- (4:01:22) Introduction To Responsive Design
- (4:07:32) Material Design Guide
- (6:26:24) Introduction To Tailwind UI
- (6:28:24) Tailwind UI Design Project
- (7:25:45) Responsive Landing Page Design Project
- (8:45:54) Designing Mobile Apps
- (8:56:47) Iconography In Figma
- (9:02:32) Boolean Groups
- (9:09:52) Figma Tokens
- (9:18:29) Animation In Figma With Figmotion
- (9:36:29) Mobile Design Project
Learn to code for free and get a developer job: https://www.freecodecamp.org
Read hundreds of articles on programming: https://freecodecamp.org/news
And subscribe for new videos on technology every day: https://youtube.com/subscription_cent…
”
