Figma UI Design Tutorial - How To Redesign Any Website (A Beginner's Guide)

8 months ago
4

In this Figma UI Tutorial for beginners, Product Designer, and Workshop Facilitator Johan Holst shares a step-by-step guide on how to redesign any website using Figma without any design skills needed.

⏰ Video Timestamps

0:00 Intro
0:36 Why is learning this skill useful?
1:42 Advantages of using Figma
2:24 Getting started with Figma
3:36 What type of website can you redesign?
3:57 Start the redesign of Uber’s website
4:27 How to install builder.io plugin
5:00 Importing a website to figma with builder.io
5:49 Cleaning up the import
7:15 Importing a website that’s behind a login using the builder.io Chrome extension
9:40 How to rename a frame
10:05 How to make a copy of the original import
11:14 How to edit TEXT
14:23 How to add IMAGES with pexels.com
15:48 How to add IMAGES with the UNSPLASH plugin

19:11 How to add ICONS with a free icon pack
24:34 How to SHARE your design
25:57 How to add COMMENTS
26:52 How to EXPORT your design

Loading comments...