Figma UI/UX Complete Bootcamp: Design 5 Job-Ready Projects

Figma UI/UX Complete Bootcamp: Design 5 Job-Ready Projects, Figma Master Class: Design Professional Figma UI/UX for Ride-Sharing, Chat, and Shoe Shop Apps with Prototyping Skills.

Course 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

Free $39.99 Redeem Coupon
Online Tutorials
Show full profile

Online Tutorials

Online Tutorials is a website sharing online courses, and online tutorials for free on a daily basis. You can find the best free online courses and thousands of free online courses with certificates to take your knowledge to the next level with the free courses.

We will be happy to hear your thoughts

Leave a reply

Online College Courses
Logo
Register New Account