Udemy – Figma UI/UX Complete Bootcamp: Design 8 Job-Ready Projects
About Course
“UI/UX Designer တစ်ယောက်အနေနဲ့ ကိုယ့်ရဲ့ Prototyping Skills ကို နောက်တစ်ဆင့်တက်လှမ်းဖို့ အချိန်တန်ပြီလို့ ခံစားနေရပြီလား။ ဒါဆိုရင် ဒီ Figma Master Class က သင့်အတွက် အကောင်းဆုံးပါပဲ။ ဒီသင်တန်းမှာ Ride-Sharing, Chat, နဲ့ Shoe Shop App တွေလိုမျိုး လက်တွေ့ကျတဲ့ ပရောဂျက်တွေကနေတဆင့် Prototyping ရဲ့ အနုပညာကို အပြည့်အဝလေ့လာရမှာပါ။
ဒီသင်တန်းက သင့်ကို Prototyping ရဲ့ အခြေခံအဆင့်ကနေစပြီး Zooming Hover လို အမိုက်စား Prototyping တွေ၊ Accordion လိုမျိုး နည်းစနစ်ကျတဲ့ပုံစံတွေကို လက်တွေ့ကျကျ Keyboard နဲ့ ရိုက်ပြတာမျိုးတွေအထိ ပိုင်နိုင်အောင် သင်ပေးသွားမှာပါ။ “On Drag” Trigger ဘယ်လိုအလုပ်လုပ်လဲဆိုတာကိုလည်း လက်တွေ့ကျကျ သိသွားပါလိမ့်မယ်။
အတွေ့အကြုံရှိသည်ဖြစ်စေ၊ မရှိသည်ဖြစ်စေ ဒီသင်တန်းကို တက်ရောက်နိုင်ပါတယ်။ Figma ပရိုဂရမ်ကို ပိုမိုကျွမ်းကျင်ချင်သူတွေနဲ့ Prototyping နည်းပညာကို နှံ့နှံ့စပ်စပ်လေ့လာချင်သူတွေအတွက် ဒီသင်တန်းက အကောင်းဆုံးရွေးချယ်မှုတစ်ခု ဖြစ်ပါလိမ့်မယ်။”
Udemy Original Course Link
Description
In this Figma bootcamp, students will dive deep into the fundamentals and advanced techniques of mobile app design. Through hands-on projects, they will learn to create high-fidelity UI/UX designs and interactive prototypes for real-world applications. Each project will help build core skills in layout, navigation, user flow, and interactive elements using Figma’s powerful design tools.
Project 1: Ride-Sharing Mobile App
Overview: Design a sleek and functional ride-sharing app, focusing on user-centered interfaces for a seamless ride-booking experience.
Learning Outcomes:
Creating a map interface for user pick-up/drop-off points
Designing a ride booking screen with options for ride types (e.g., standard, luxury, carpool)
Developing ride selection options (vehicle type, fare estimate, time of arrival)
Designing trip options (e.g., scheduling rides, favorite locations)
Building profile pages (user profile, payment methods, trip history)
Prototyping key user flows (booking a ride, selecting a driver, viewing ride details)
Interactive animations for map transitions and route details
Project 2: Shoe Shop E-commerce App
Overview: Build a modern and engaging e-commerce app for a shoe store, focusing on visually appealing product displays and user-friendly navigation.
Learning Outcomes:
Designing a home page with featured products and categories
Creating a bottom navigation bar for easy access to key sections (Home, Categories, Cart, Profile)
Developing a product details page with high-quality images, descriptions, and sizes
Implementing an “Add to Cart” feature with feedback animations
Designing a shopping cart page with options to modify items, apply discounts, and proceed to checkout
Adding animations for interactive prototypes to create a more immersive shopping experience
Prototyping user flows such as adding products to the cart, viewing details, and checking out
Project 3: Chat App UI/UX
Overview: Create a user-friendly and visually appealing chat app, focusing on messaging interfaces, notifications, and user interactions.
Learning Outcomes:
Designing a chat interface with messages, timestamps, and read receipts
Building a contacts list with options to search and start new conversations
Creating user profiles with settings, status updates, and notifications
Developing group chat interfaces with unique designs for multiple participants
Project 4: Music Player Mobile App
Overview: Design a sleek and intuitive music player app interface with album covers, playlist management, and playback controls.
Learning Outcomes:
Designing a home screen with featured playlists, recent tracks, and suggested songs
Building a now-playing screen with album art, playback controls, and song information
Creating a browse and search feature for finding songs, albums, and artists
Adding animated transitions for song changes, shuffle, and playback animations
Prototyping user flows for playing music, navigating playlists, and managing favorites
Types of Prototypes That You Will Learn in This Course:
Discussing the Types of UI Animation.
Destination, Trigger, Action and animation.
Prototype Settings,Testing & Sharing Prototypes.
How On Drag Trigger Works.
How On Click Trigger Works.
How While Hovering Trigger Works.
How After Delay Trigger Works.
Prototype Action-Navigate to and Change to.
Open overlay.
Toggle, Checkbox, Eye off on, radio.
Accordion Prototyping.
Tab Bar Prototyping.
Video interaction Prototyping.
Zooming Hover Prototyping.
Card Carosel Drag animation prototyping.
Sticky Scroll animation.
Range Slider Prototyping.
Text Animation Prototyping.
Notification Effects Prototyping.
animated card effect.
Switch and Toggle Button.
Conditional and set-variable.
Delete Prototyping using set variable.
Hide Show using Boolean.
App Screen Advance Prototyping.
Advance Prototyping Techniques.
Advance prototype using Button Variants.
Animated Slider.
Real Time Typing Keyboard Prototyping.
Key Takeaways from the Bootcamp:
Deep understanding of UI/UX principles for mobile apps
Hands-on experience in interactive prototyping and animations
Best practices in mobile app navigation and user interaction
Course Content
Udemy – Figma UI/UX Complete Bootcamp: Design 8 Job-Ready Projects
- 03:40
02. Module 1-Introduction to Figma & Tool Overview
40:5103. Module 2-Layouts & Canvas Setup
19:11- 09:56
05. Module 4-Typography in Figma
27:3406. Module 5-Color Theory & Effects
21:13- 10:21
- 12:50
09. Module 8-Auto Layout & Constraints
15:4610. Module 9-Grid & Column Systems
15:0311. Module 10-Ware-framing (Low & High Fidelity)
18:1612. Module 11-Variables in Figma
18:2713. Module 12-Design System & Style Guide
10:4014. Module 13-Adding Videos & Rich Media
07:5415. Module 14-Sharing, Exporting & Developer Hand off
10:2516. Module 15-Figma Plugins & Assets
11:2517. Module 16 – UIUX Design Patterns
13:5418. Getting Started Figma Prototyping Files (Resource)
09:5719. Prototyping Theory
11:0320. Prototyping Basic-Level
42:1721. Prototyping Mid-Level
01:04:3122. Prototyping Advanced-Level
01:02:5723. Food Order Mobile App UIUX Project – 1
02:06:0024. Uber Ride Sharing App UIUX Project-2
04:56:5025. Shoe Sop E-Commerce App UIUX Project – 3
03:01:0726. Chat App UIUX Project-4
06:59:0827. Music Player APP UIUX Project – 5
03:12:1328. E-commerce Web App UIUX Project – 6
05:54:4629. Netflix Clone Web App UIUX Project – 7
07:13:4930. Airbnb Mobile App Clone UIUX Project – 8
07:24:39