UI Design

After this skill you can…

• Create a consistent 8pt spacing grid
• Choose a type scale and colour palette
• Critique a UI using Gestalt principles

Watch (10 videos)

LIVE DESIGN BATTLES! Interactive Stream - Win a DesignCourse Membership

DesignCourse · beginner hands-on

→ Create UI/UX designs with Figma→ Participate in live design battles

Intermediate Blueprints in Unreal Engine 5

Coursera · intermediate hands-on

→ Create Blueprints in Unreal Engine 5→ Use visual scripting for game development

Creative RESPONSIVE Rive Layouts for the Web - Crash Course

DesignCourse · beginner hands-on

→ Create responsive layouts for the web using Rive→ Design interactive UI/UX elements

Advanced UI Components & Data Visualization in SwiftUI

Coursera · intermediate hands-on

→ Design UI components with SwiftUI→ Create data visualizations for mobile apps

Portfolio Review: Matteo Fabbiani

Flux Academy · intermediate hands-on

→ Design a visually appealing portfolio website→ Create effective interactions and transitions→ Develop a clear and concise services page

[LIVE] Design Follow-Along - Let's Design a Dark UI Dashboard

DesignCourse · intermediate hands-on

→ Design a UI dashboard→ Apply dark theme principles

Create an Interactive Dark Mode / Light Mode UI in Figma

DesignCourse · beginner hands-on

→ Design a mobile UI in Figma→ Create an interactive toggle for dark mode

Tailwind CSS v4 Full Course 2025 | Master Tailwind in One Hour

JavaScript Mastery · beginner hands-on

→ Build a responsive UI with Tailwind CSS→ Master utility classes in Tailwind CSS→ Deploy a project using Tailwind CSS

Responsive Web Design Tutorial in Adobe XD

DesignCourse · beginner hands-on

→ Design responsive web pages→ Create mobile friendly variations

Pixels with Purpose: Lo-Fi to Hi-Fi Design in Sketch

Coursera · advanced hands-on

→ Create a Design System with Sketch→ Develop high-fidelity mockups from low-fidelity wireframes

Read (10 articles)