EULE Institute
UI & Visual Design Course – Updated Edition
A course to help you use and understand all the techniques and methodologies to become a UI & Visual Designer in the field of User Experience.
12 modules102 lessons3h 18min of video10 free previews€647.00
Curriculum
1. Visual Design Course1 lesson
2. Visual Design4 lessons · 8min
- What is Visual DesignPreview
- Visual Design applied to UX
- Tips for the first exercisePreview
- Practice: Create a digital product
3. Visual Hierarchy9 lessons
- Hierarchy in Design
- Gestalt Principles in Design
- Scanning Pattern
- F Pattern vs Z Pattern
- Apply the Golden Ratio
- Practice (Optional): How to Draw the Golden Ratio
- Practice: Visual Hierarchy
- Reflections on Visual Hierarchy / To be deleted
- How to organize content / to be removed
4. Design for Accessibility12 lessons
- Accessibility: Designing accessible websites and apps
- Accessibility: Color and Contrast
- Accessibility: Text and Typography
- Accessibility: Images and Visual Content
- Accessibility: Focus Indicator
- Accessibility: Touch Target & Hit Area
- Accessibility: Consistent Visual States
- Accessibility: Cognitive Accessibility
- Contrast for Accessibility
- Focus Indicator: A Crucial Element for Accessibility
- Image Accessibility
- Support keyboard navigation
5. UI Fundamentals33 lessons
- Basic Principles of UI DesignPreview
- Principles: Typography 1
- Principles: Typography 2
- Principles: Typography 3
- Principles: Typography 4
- Tips & Tricks: Typographic Scales
- Tips & Tricks: How to Improve Text Readability
- Tips & Tricks: Uppercase
- Principles: Color 1
- Principles: Color 2
- Tips & tricks: 60-30-10 the color rule
- Tips & tricks: Gradients
- Principles: Balancing
- Principles: Alignment
- Principles: Whitespace
- Principles: Proximity
- Principles: Symmetries in UX&UI
- Principles: Patterns
- Interfaces: Elements
- Interfaces: Grids and Layouts
- Interfaces: Icon
- Interfaces: Buttons
- Tips & Tricks: Thumb zone
- Tips & Tricks: Touch Target
- Tips & Tricks: Links or Buttons
- Interfaces: Forms
- Interfaces: Dropdowns
- Tips & Tricks: Input Fields
- Interfaces: Navigation
- Interfaces: Search
- Interfaces: Modals
- Interfaces: Hero Sections
- Interfaces: Cards
6. Designing Wireframes10 lessons · 34min
- Overview of Wireframes
- Wireframe: low and high fidelity
- Introduction to Responsive Design
- Mobile-First Approach
- Leverage grids in layoutPreview
- 8px Grid DesignPreview
- Bootstrap Grids
- Practice (optional): Paper and pencil wireframe
- Wireframing Kit
- Practice: High-Fidelity Wireframe
7. Style Guide and Moodboard9 lessons · 16min
- Introduction to the style guide
- Moodboard: definition and usePreview
- Moodboard: What are they?
- Practice: Create a moodboard
- Style Tiles vs Moodboards
- Style Tiles vs Style Guide
- Practice: Create a style guide
- Types of moodboards
- Style tiles: key visual elements
8. Practical Prototyping Session1 lesson
- Practice: Add Colors and Typography to the Wireframe
9. The UI Kit6 lessons · 7min
- Design States: how to manage them
- Guidelines for Naming ElementsPreview
- Create an effective UI Kit
- Practice: UI Kit
- Introduction to Design System
- Design tokens: the bridge between design system and code
10. Design and Collaboration5 lessons
- Collaborate with other designers
- How to create documentation for developers
- Export and create assets
- The professional handoff: what to deliver to developers
- Practice (Optional): Prepare the handoff of a screen
11. UI Animations9 lessons · 1h 56min
- The Importance of Animations in UX
- Types of Animations to Improve User Experience
- Framer: create your first animationPreview
- Framer: second animation (medium difficulty)
- Framer: 3 advanced animations
- Principle: create your first animation
- Principle: create the second animation
- Principle: 2 advanced animations
- Figma: Animation using GIFs
12. Create Your Portfolio3 lessons · 15min
- Tips for Creating a UX Designer PortfolioPreview
- Practice: Create Your Portfolio
- Final Review
About the instructor

EULE Institute
Online courses by EULE Institute
