User Experience Design - Learn UI UX App Design with Figma

Focused View

Gihan Akalanka

6:47:26

15 View

1. Introduction

1. Welcome to UX UI App Design Course.mp4

02:44

2. Introduction to wireframes.mp4

02:53

3. Introduction to prototype and different between wireframe and prototype.mp4

02:10

2. Wireframe Basics

1.1 Create a FIgma account for free..html

1. Figma Introduction.mp4

04:27

2. Design first wireframe for Gmail app.mp4

10:57

3. Design second wireframe for YouTube Studio app.mp4

18:26

4. Design third wireframe for Instagram.mp4

10:29

5. Design fourth wireframe for Linkedin.mp4

10:12

3. Design Wireframes for Food Delivery App

1. Intro to design wireframe for food delivery app.mp4

01:18

2. Design home page wireframe for food delivery app.mp4

12:51

3. Design search page wireframe for food delivery app.mp4

04:56

4. Design single food page for food delivery app.mp4

09:04

5. Build cart page for food delivery app.mp4

05:15

6. Build order confirm popup for food delivery app.mp4

05:41

7. Design add to cart popup for food delivery app.mp4

02:26

8. Do final touch up to wireframe before convert to prototype.mp4

02:42

4. Create prototype of food delivery app

1. Create prototype of food delivery app - Part 01.mp4

10:23

2. Create prototype of food delivery app - Part 02.mp4

05:28

3. Test food delivery app prototype.mp4

02:12

5. First Assignment

1.1 Food delivery app Figma project.html

1. Assignment details.mp4

02:53

6. UX Visual Design - Select Colors

1. Introduction to UX Visual Design.mp4

01:03

2. Selecting Colors Using Color Psychology.mp4

03:48

3. Selecting a Primary Color.mp4

01:37

4. The 60-30-10 Rule.mp4

08:13

5. Creating the Color Palette.mp4

03:59

6. Color Accessibility Check.mp4

04:03

7. Bonus Lecture - Easy Ways to Select Colors.mp4

06:12

7. UX Visual Design - Typography

1. Fundamentals of Typography.mp4

02:08

2. Message and Emotion in Typography.mp4

04:00

3. How to Use the Google Fonts Website.mp4

06:49

4. Selecting Fonts for a New Food Delivery App.mp4

03:59

8. UX Visual Design - Iconography

1. Iconography.mp4

04:49

9. UX Design Basics

1. Design System.mp4

04:02

2. UX Principles and Laws.mp4

07:08

3. Information Architecture (IA).mp4

02:46

10. UI Design with Figma

1.1 Create a FIgma account for free..html

1. Creating a Figma Account.mp4

05:56

2. Grid Layout.mp4

02:48

3. Auto Layout Basics.mp4

10:53

11. Brand Logo

1. Designing a Brand Logo.mp4

03:43

12. Hi-Fi Mockups with Figma

1. Sticker Sheet.mp4

09:52

2. Hi-Fi Mockups Introduction.mp4

01:38

3. Designing the Header.mp4

12:22

4. Improving the Header.mp4

01:18

5. All About Components.mp4

08:23

13. Hi-Fi Mockups Design - Homepage

1. Designing the Search Box.mp4

05:05

2. Designing the Category Section.mp4

04:48

3. Adding Content to Categories.mp4

02:22

4. Designing Popular Foods Section.mp4

08:39

5. Making Changes to Food Item Component.mp4

04:54

6. Adding Content for Food Items.mp4

04:46

7. Designing Recommended Foods Section.mp4

01:17

14. Hi-Fi Mockups Design - Search Page

1. Designing Search Page.mp4

06:48

2. Designing Search Results Section.mp4

06:21

3. Pro Tip to Improve UI Design Skills.mp4

02:43

15. Hi-Fi Mockups Design - Single Food Page

1. Designing Single Food Page.mp4

05:43

2. Designing Dollar Amount Preview and Star Rating.mp4

03:48

3. Creating Count Controller and Adding to Cart Button.mp4

05:28

4. Adding Description Section.mp4

01:49

5. Creating Reviews Section.mp4

10:14

16. Hi-Fi Mockups Design - Cart Page

1. Designing Cart Page.mp4

09:23

2. Changing My Cart Design.mp4

08:50

3. Designing Cart Items Summary Section.mp4

03:35

4. Adding Content to the My Cart Section.mp4

02:16

5. Designing Cart Page - Part 05.mp4

05:20

6. Designing Cart Page - Part 06.mp4

04:16

17. Fixing UIUX Issues and design footer menu

1. Fixing UIUX Issues in the Design.mp4

06:24

2. Designing Footer Menu.mp4

03:56

18. HI-FI Prototype

1. Prototype Introduction.mp4

02:28

2. How to Use the Prototype Tab to Make Design Interactive.mp4

07:10

3. Prototyping - Part 2.mp4

03:52

4. Making Carousel Scroll.mp4

02:30

5. Adding Footer Menu to Frames.mp4

03:35

6. Adding Connection to Popup.mp4

08:53

7. Adding Horizontal Scrolling to Review Section.mp4

01:21

8. Making the Search Box Interactive.mp4

03:18

9. Using Variables to Remove Cart Items.mp4

05:20

19. Second Assignment

1.1 Food delivery app Figma project.html

1. Assignment and Thank you!.mp4

01:18

Description

Design User-Centered Mobile Apps and Solve Real Problems : User Interface, User Experience design, UX Design with Figma

What You'll Learn?

Become a Successful UI/UX designer.
Visual design fundamentals: Master color psychology, the 60-30-10 rule, select font that enhances readability and brand identity, and iconography.
Organization: Keep everything neat, finding what you need in a flash.
UX principles and laws: Build user-centered apps that anticipate needs and solve real problems.
Learn to design wireframes and low fidelity prototypes
Learn to build high-fidelity mockup and prototype by following best practices.
How to use Figma for Essential UX Design & UI Design

Who is this for?

Anyone who like to become a UI/UX designer

Anyone who wants to start using Figma in their career & get paid for their user experience design skills.

Anyone who wants to learn the basics of wireframes and low-fidelity prototypes

Anyone who wants to learn the A-Z of building high-fidelity mockups and interactive prototypes!

What You Need to Know?

A computer/laptop with access to the Internet.

A Figma account. A free plan is available on the Figma website.

No previous UX Design/UI Design experience is needed.

No previous Figma skills are needed.

More details

Description
Ready to launch your UI UX app design journey or take your skills to the next level? This class is your rocket fuel!

We're ditching dry theory and jumping right into pixel-perfect reality. Turn your vision into a stunning mobile app, one pixel at a time.
Here's what you'll master:
The importance of wireframes and prototypes in the early stages of the design process.
How to use the Figma design tool.
How to design low-fidelity wireframes.
How to design high-fidelity mockups.
How to create interactive prototypes.
Visual design fundamentals: Master color psychology, the 60-30-10 rule, select font that enhances readability and brand identity, and iconography.
Organization: Keep everything neat, finding what you need in a flash.
UX principles and laws: Build user-centered apps that anticipate needs and solve real problems.
UI design: build high-fidelity mockup and prototype by following best practices.
Who's this class for?
Anyone who wants to learn the A-Z of creating wireframes and low-fidelity prototypes. then turn them to high-fidelity mockups and interactive prototypes! No prior experience is needed, just a passion for creating amazing apps.
Your co-pilot on this journey? Me! We'll craft a delicious food-ordering app together, mastering UX/UI principles along the way. By the end, you'll be ready to conquer any app you dream of.

Benefits? Buckle up!
Master visual design and UX principles: From colors and fonts to user journeys, you'll build a rock-solid foundation.
Craft stunning high-fidelity mockups and prototypes: Say hello to your future portfolio!
Become a user-centered design champion: Build apps that truly solve problems and make life easier.
What are the requirements for taking this class?
A computer/laptop with access to the Internet.
A Figma account.
Ready to launch your UI/UX design journey? Let's get started!
Who this course is for:
Anyone who like to become a UI/UX designer
Anyone who wants to start using Figma in their career & get paid for their user experience design skills.
Anyone who wants to learn the basics of wireframes and low-fidelity prototypes
Anyone who wants to learn the A-Z of building high-fidelity mockups and interactive prototypes!

User Reviews

Rating

average 0

Total votes0

Focused display

Hi there!I'm a UI/UX designer who loves teaching others how to design great digital experiences. I'm here to help you learn how to create user-friendly and visually appealing websites and apps. My courses are designed for everyone, whether you're a beginner or a seasoned pro. I'll teach you everything you need to know to create digital experiences that people love. So join me on this journey to level up your UI/UX design skills!

Udemy

View courses Udemy

Students take courses primarily to improve job-related skills.Some courses generate credit toward technical certification. Udemy has made a special effort to attract corporate trainers seeking to create coursework for employees of their company.