Ad Clicks : Ad Views : Ad Clicks : Ad Views : Ad Clicks : Ad Views : Ad Clicks : Ad Views :
Oh Snap!

It looks like you're using an adblocker. Adblockers make us sad. We use ads to keep our content happy and free. If you like what we are doing please consider supporting us by whitelisting our website. You can report badly-behaved ads by clicking/tapping the nearby 'Advertisement' X text.

UX – Visual Design Process (Track)


Release date:2022

Author:Tree House

Skill level:Beginner


Exercise files:Yes

Welcome to Tracks
Treehouse Tracks are guided curriculums that cover all relevant Courses and Workshops necessary to master a subject. Treehouse’s learning library includes dozens of Tracks on a variety of topics including web design, programming, and more. With Compass, you’ll also be able to test out of subjects you already know, and create a custom curriculum for your learning goals.

UX: Visual Design Process
User Experience Design, commonly called UX Design, encompasses all aspects of a user’s interaction with a company, its services, and its products. UX designers put themselves into the shoes of users to create solutions through empathy.

In this Track, you’ll learn various methods of iterating on a design idea, from wireframing to building a mockup to sharing interactive prototypes.

We’ll begin with a few foundational courses in design thinking and giving/receiving feedback. Then you’ll dive into our 2-hour Introduction to Wireframing course, where you’ll learn the methods and process for wireframing, a key skill for a lot of UX design work.

Next, we’ll tackle Typography. Working with type is something that every UX designer needs to be comfortable with, and this in-depth course will get you up to speed. Afterward, you’ll take our Designing Layouts course, which covers visual and typographic hierarchy, the use of grids and alignment in layouts, and how to choose colors.

To wrap up this Track, we’ll learn how to create mockups of your designs, how to prototype them in Adobe XD and Figma, and how to present your ideas.

Ready to dive into the exciting UX design process? Let’s begin!

Watch online or Download for Free
01. Visual Design Foundations
01. Elements of Design

01. The Elements and Principles of Art and Design
02. Line, Shape, and Form
03. Space and Texture
04. Value and Color

02. Principles of Design

01. Balance and Harmony
02. Emphasis, Variety, and Proportion
03. Movement and Rhythm

02. Handling Feedback as a UX Designer

01. The Importance of Handling Feedback Well
02. The Challenges of Handling Feedback
03. Types of Feedback
04. Requesting Feedback
05. Getting Into the Right Mindset
06. Receiving Feedback
07. Acting on Feedback

03. Receiving UX Feedback by Example

01. Receiving Constructive Feedback
02. Receiving Non-constructive Feedback
03. Receiving Prescriptive Feedback

05. Introduction to Wireframing
01. What Is Wireframing

01. What Are Wireframes
02. Benefits of Wireframing
03. Types of Wireframes
04. How Wireframes Are Used

02. How to Make Wireframes on Paper

01. Hand-drawn Wireframes
02. Demonstration of Wireframing on Paper
03. Tips and Tools
04. Sharing and Getting Feedback
05. The Pros and Cons of Wireframing on Paper

03. How to Make Wireframes in Balsamiq

01. Wireframing in Balsamiq
02. Demonstrating Wireframes in Balsamiq
03. Sharing and Getting Feedback in Balsamiq
04. Pros and Cons of Wireframing in Balsamiq

04. How to Make Wireframes in Adobe XD

01. Making Wireframes in Adobe XD
02. Demonstrating Wireframes in Adobe XD
03. Sharing and Getting Feedback in Adobe XD
04. The Pros and Cons of Wireframing in Adobe XD

08. Typography for Designers
01. Introduction to Typography

01. What is Typography
02. How Typography Affects the User Experience
03. Typography Terminology
04. Different Types of Type
05. Print vs. Digital

02. How to Choose and Use Fonts

01. How to Install Fonts
02. Consider the Use Case
03. How to Choose a Text Typeface for the Web
04. How to Choose a Display Typeface

03. Web Typography

01. Font Weights, Styles, and Sizes
02. Horizontal Space Measure and Margins
03. Vertical Space Line-Height and Vertical Rhythm

04. Laying Out Type

01. Introducing Typographic Hierarchy
02. Typographic Hierarchy Style, Weight, Size, and Position
03. Typographic Hierarchy Caps and Color
04. Layout Treatments
05. Combining Typefaces

05. Going Further with Type

01. Responsive Typography
02. More Grid Systems
03. Variable Fonts
04. The Fine Details

09. Before and After Typography

01. Typography Before
02. Typography After

10. Designing Layouts
01. Writing Copy

01. Spelling, Grammar, and Title Casing
02. Headers and Labels

02. Hierarchy and Layout

01. Typography and Hierarchy
02. Using a Grid
03. Colors and Contrast

11. Creating Mockups

01. Introduction to Mockups
02. The Purpose of Mockups
03. Preparing to Make Mockups
04. Making Mockups
05. Efficiency Tips
06. Sharing Mockups

12. Before and After Color

01. Color Before
02. Color After

13. Before and After Layout

01. Layout Before
02. Layout After

14. Prototyping with Adobe XD
01. Introducing Adobe XD

01. Why Prototype in Adobe XD
02. The Adobe XD Interface
03. Navigating the Workspace

02. Prototyping Designs in Adobe XD

01. Drawing Shapes
02. Adding Images
03. Adding Text
04. Layers and Repeat Grids

03. Interactivity in Adobe XD

01. Adding Artboards
02. Creating New Screens
03. Adding Interactivity to Prototypes
04. Sharing Designs

15. Prototyping with Figma
01. Introducing Figma

01. Why Prototype in Figma
02. Project Setup
03. Navigating the Canvas
04. Arranging Design Elements

02. Prototyping Designs in Figma

01. Reusing Designs with Components
02. Drawing with Shapes
03. Drawing Curved Lines
04. Finishing the Interface

03. Interactive Prototypes in Figma

01. Adding Interactivity to Prototypes
02. Sharing Designs

17. Collaborating with Developers
01. Designing with Developers

01. Intro to Collaborating with Developers

02. Preparing Design Files for Developers

01. Communicating for Development
11. Final Design Handoff

18. Presenting Design Ideas

01. Know Your Audience
02. Set Expectations and Goals
03. State the Problem and Goals
04. Research the Problem
05. Solving the Problem
06. Timeline and Next Steps
07. Feedback

[Tree house] UX – Visual Design Process (Track).7z
[Tree house] UX – Visual Design Process (Track)_Subtitles.7z

Join us on
  Channel    and      Group

  • Facebook
  • Twitter
  • Google+
  • Linkedin
  • Pinterest


Leave a Comment

Your email address will not be published. Required fields are marked *