UI Design Bootcamp
- Format
- Live or Self-paced
Choose how you learn
Compare formats, then explore the details for your choice.
Book directly on nobledesktop.com. Opens in a new tab.
Book live on Noble DesktopSummary
UI Designers, sometimes called Visual Designers, are responsible for the look and feel of apps, websites, and digital products, making sure everything is both beautiful and visually effective. This course teaches you the best practices for designing websites and mobile applications, all under the guidance of expert instructors who give you one-on-one feedback as you learn and grow.
You'll start by building a strong foundation in the essentials of design, including color, typography, layout, standard interface conventions, and UI patterns. From there, the course takes a project-based approach, meaning you're putting those concepts into practice right away and building up a portfolio of work you can show to potential employers or clients. It's the kind of hands-on experience that makes a real difference when you're just starting out in the field.
Prerequisites
Students should have knowledge equivalent to our Figma Bootcamp.
Curriculum
What you'll learn
- Learn UI design concepts & best practices
- Design webpages and apps with Figma
- Get 1-on-1 help and feedback on your design work so you can learn and improve
- Develop projects for your portfolio to showcase your work as a UI designer
Course syllabus
UI Fundamentals
How & when to use common UI patterns
- Menus
- Tabs
- Bottom tab bar
- Buttons (including “Call to action” or CTA)
- Accordion
- Carousel
- Breadcrumbs
- Modals
- Forms
- etc.
Wireframing for UI Designers
Wireframing
- Why and Gow to Create Wireframes
- Issues to Solve
- Steps in Creating a Wireframe
- Designing on a Grid System (like Bootstrap)
- Get Critiques
- Incorporate Feedback & Improve Your Designs
Wireframe to Refined Design
- Iterate & Refine
- Understanding the Mobile Experience
UI or Visual Design Concepts
Learning from Existing Websites & Apps
- What Works & What Does Not?
Color
- Color Harmonies
- Creating Contrast with Color
- Guidelines for Proper Color Usage
Typography & Fonts
- Display Text (Such as Headings) versus Body Text
- Legibility
- Type Trends
- Typeface Selection & Pairing
- Where to Get Web Fonts
- Ideal Line Height
- Column Width (Line Length)
- Hyphenation & Justification
Design Elements
- Proximity
- Similarity
- Continuity
Trends in Web & App Design
- Analysis of Example Websites & Apps
Design Patterns
- Example Design Patterns
Multiple Screen Sizes
- Responsive Web Design
- Mobile Considerations & Limitations
- Discoverability Challenges
- Mobile Navigation
- Phone vs Tablet App Design
What's included
- Free course retake within one year to refresh the material and gain practice.
- Class recordings
Stated by the provider. Confirm what your tuition covers before enrolling.
Live classes
Choose dates and book your instructor-led class on nobledesktop.com.
-
–
In-person or live online
Starts at 10:00 · America/New_York (EDT); final session ends at 17:00 EDT
-
–
In-person or live online
Starts at 10:00 · America/New_York (EST); final session ends at 17:00 EST
-
–
In-person or live online
Starts at 18:00 · America/New_York (EST); final session ends at 21:00 EST
-
–
In-person or live online
Starts at 10:00 · America/New_York (EST); final session ends at 17:00 EST
-
–
In-person or live online
Starts at 10:00 · America/New_York (EST); final session ends at 17:00 EST
-
–
In-person or live online
Starts at 18:00 · America/New_York (EDT); final session ends at 21:00 EDT
-
–
In-person or live online
Starts at 10:00 · America/New_York (EDT); final session ends at 17:00 EDT
-
–
In-person or live online
Starts at 10:00 · America/New_York (EDT); final session ends at 17:00 EDT
-
–
In-person or live online
Starts at 10:00 · America/New_York (EDT); final session ends at 17:00 EDT
-
–
In-person or live online
Starts at 10:00 · America/New_York (EDT); final session ends at 17:00 EDT
-
–
In-person or live online
Starts at 10:00 · America/New_York (EST); final session ends at 17:00 EST
Confirm current dates and availability on Noble Desktop before booking.
Self-paced course
Learn through recorded lessons on your own schedule.
This course is available for 30 days. You can choose when to start your access period. Once you activate, you will have 30 days to complete it (access the course materials, quizzes, projects and videos). You may request one extension of seven (7) days. Other extension requests will be evaluated on a case-by-case basis. Videos are not downloadable.
- Tuition
- $1,695
- Course length
- 30 hours
- Schedule
- On your schedule
UI (User Interface) Designers focus on creating visually appealing, intuitive layouts for websites, apps, and digital products. In this project-based course, you’ll learn best practices for designing webpages and mobile interfaces while building a foundation in color, typography, layout, UI patterns, and standard design conventions.
Guided by expert instructors, you’ll apply these concepts through hands-on projects, receive personalized 1-on-1 feedback, and develop a professional portfolio that showcases your UI design skills to potential employers or clients.
Self-paced prerequisites
Students should have knowledge equivalent to our Figma Bootcamp.
Self-paced curriculum
What you'll learn self-paced
- Learn UI design concepts & best practices
- Design webpages and apps with Figma
- Get 1-on-1 help and feedback on your design work so you can learn and improve
- Develop projects for your portfolio to showcase your work as a UI designer
Self-paced syllabus
UI Fundamentals
How & when to use common UI patterns
- Menus
- Tabs
- Bottom tab bar
- Buttons (including “Call to action” or CTA)
- Accordion
- Carousel
- Breadcrumbs
- Modals
- Forms
- etc.
Wireframing for UI Designers
Wireframing
- Why and Gow to Create Wireframes
- Issues to Solve
- Steps in Creating a Wireframe
- Designing on a Grid System (like Bootstrap)
- Get Critiques
- Incorporate Feedback & Improve Your Designs
Wireframe to Refined Design
- Iterate & Refine
- Understanding the Mobile Experience
UI or Visual Design Concepts
Learning from Existing Websites & Apps
- What Works & What Does Not?
Color
- Color Harmonies
- Creating Contrast with Color
- Guidelines for Proper Color Usage
Typography & Fonts
- Display Text (Such as Headings) versus Body Text
- Legibility
- Type Trends
- Typeface Selection & Pairing
- Where to Get Web Fonts
- Ideal Line Height
- Column Width (Line Length)
- Hyphenation & Justification
Design Elements
- Proximity
- Similarity
- Continuity
Trends in Web & App Design
- Analysis of Example Websites & Apps
Design Patterns
- Example Design Patterns
Multiple Screen Sizes
- Responsive Web Design
- Mobile Considerations & Limitations
- Discoverability Challenges
- Mobile Navigation
- Phone vs Tablet App Design
What's included with self-paced
- Course workbook