Udemy
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
Development
Web Development Data Science Mobile Development Programming Languages Game Development Database Design & Development Software Testing Software Engineering Development Tools No-Code Development
Business
Entrepreneurship Communications Management Sales Business Strategy Operations Project Management Business Law Business Analytics & Intelligence Human Resources Industry E-Commerce Media Real Estate Other Business
Finance & Accounting
Accounting & Bookkeeping Compliance Cryptocurrency & Blockchain Economics Finance Finance Cert & Exam Prep Financial Modeling & Analysis Investing & Trading Money Management Tools Taxes Other Finance & Accounting
IT & Software
IT Certification Network & Security Hardware Operating Systems Other IT & Software
Office Productivity
Microsoft Apple Google SAP Oracle Other Office Productivity
Personal Development
Personal Transformation Personal Productivity Leadership Career Development Parenting & Relationships Happiness Esoteric Practices Religion & Spirituality Personal Brand Building Creativity Influence Self Esteem & Confidence Stress Management Memory & Study Skills Motivation Other Personal Development
Design
Web Design Graphic Design & Illustration Design Tools User Experience Design Game Design Design Thinking 3D & Animation Fashion Design Architectural Design Interior Design Other Design
Marketing
Digital Marketing Search Engine Optimization Social Media Marketing Branding Marketing Fundamentals Marketing Analytics & Automation Public Relations Advertising Video & Mobile Marketing Content Marketing Growth Hacking Affiliate Marketing Product Marketing Other Marketing
Lifestyle
Arts & Crafts Beauty & Makeup Esoteric Practices Food & Beverage Gaming Home Improvement Pet Care & Training Travel Other Lifestyle
Photography & Video
Digital Photography Photography Portrait Photography Photography Tools Commercial Photography Video Design Other Photography & Video
Health & Fitness
Fitness General Health Sports Nutrition Yoga Mental Health Dieting Self Defense Safety & First Aid Dance Meditation Other Health & Fitness
Music
Instruments Music Production Music Fundamentals Vocal Music Techniques Music Software Other Music
Teaching & Academics
Engineering Humanities Math Science Online Education Social Science Language Teacher Training Test Prep Other Teaching & Academics
AWS Certification Microsoft Certification AWS Certified Solutions Architect - Associate AWS Certified Cloud Practitioner CompTIA A+ Cisco CCNA Amazon AWS CompTIA Security+ AWS Certified Developer - Associate
Photoshop Graphic Design Adobe Illustrator Drawing Digital Painting InDesign Character Design Canva Figure Drawing
Life Coach Training Neuro-Linguistic Programming Personal Development Mindfulness Personal Transformation Life Purpose Meditation Emotional Intelligence Neuroscience
Web Development JavaScript React CSS Angular PHP WordPress Node.Js Python
Google Flutter Android Development iOS Development Swift React Native Dart Programming Language Mobile Development Kotlin SwiftUI
Digital Marketing Google Ads (Adwords) Social Media Marketing Google Ads (AdWords) Certification Marketing Strategy Internet Marketing YouTube Marketing Email Marketing Retargeting
SQL Microsoft Power BI Tableau Business Analysis Business Intelligence MySQL Data Analysis Data Modeling Big Data
Business Fundamentals Entrepreneurship Fundamentals Business Strategy Online Business Business Plan Startup Freelancing Blogging Home Business
Unity Game Development Fundamentals Unreal Engine C# 3D Game Development C++ 2D Game Development Unreal Engine Blueprints Blender
30-Day Money-Back Guarantee
Design Web Design User Interface

DESIGN RULES: Principles + Practices for Great UI Design

Learn to design powerful user interfaces for apps, sites and systems
Rating: 4.6 out of 54.6 (6,798 ratings)
25,283 students
Created by Joe Natoli
Last updated 5/2018
English
English [Auto], Indonesian [Auto], 
30-Day Money-Back Guarantee

What you'll learn

  • Be able to create useful, usable and visually compelling UI design for any kind of app, site or system.
  • Understand how to properly balance form and function
  • Understand the critical rules for designing on small screens and mobile devices
  • Know how to effectively organize and economize visual information
  • Understand + apply the principle of Balance to create visual order
  • Understand + apply the principle of Rhythm to establish and reinforce comprehension
  • Understand + apply the principle of Harmony to shape disparate UI elements into a unified, consistent experience
  • Understand + apply the principle of Dominance to direct user focus and enhance UX
  • Understand + apply the principle of Alignment to lead the user's eye and speed task completion
  • Understand + apply the principle of Proximity to signal relationships between screen elements and decrease users' cognitive effort
  • Communicate with color, typography and imagery in the UI
  • Understand how color communicates and influences interaction
  • Know how to choose the right colors for any UI design
  • Know how to apply contrast properly to guide users and call attention to critical UI elements and interactions
  • Know how to determine whether or not color and contrast are appropriate
  • Understand the fundamentals of typography as a design element
  • Know how to choose the right fonts and design appropriately with them
  • Understand + apply 7 crucial rules for great typographic design
  • Understand + apply 5 rules for choosing the right imagery
  • Understand + apply a core set of DOs and DON'Ts when designing with images
  • Know how to create and simplify visual cues that direct user focus and interaction
  • Understand the 3 kinds of data visualizations used in UI design
  • Understand how the context of the data presented determines its visual form
  • Understand + apply 6 rules for great data design
  • Know how to simplify visual information to clarify meaning and improve UX
  • Know how to visually separate content from controls to make interactions easier for users to understand and act on
  • Walk away with a set of "18 UI Design Mantras" that you can apply to anything and everything you ever design!
Curated for the Udemy for Business collection

Requirements

  • No prior knowledge required; general familiarity with User Interface (UI) Design is helpful, though.

Description

When it comes to User Interface (UI) design, your job — whether you're a designer, developer, UXer or a mix of all those things — is to make sure that no aspect of someone’s onscreen interaction happens without explicit intent. The UI design choices we make have to reflect the user’s motivations, expectations, environment and possible actions.

All of those things manifest themselves in the User Interface — so what people see on the screen is usually the sum of their understanding about what this is and how it works.

So what we show them has to do a hell of a job communicating what’s there for them, how it’s organized, how they get to it and what they can do with it once they do.

The principles, practices and real-world techniques I'm going to show you here are the same ones that have informed graphic design for hundreds of years. And while that may sound like blasphemy to some of you, I guarantee you'll see why and how they apply equally to the world of digital design — especially for mobile devices and their small screens. 

I'm going to give you 50 lessons packed with timeless, ironclad, unchanging rules for good UI design that you can apply to anything and everything you ever work on. Trends will come and go, and it won't matter: your UI will still be useful, usable, appropriate and relevant for its users.

You'll learn how to make it easier for people to interact with what they see on the screen – whether they know what to tap, swipe or click, and whether what happens meets their expectations and moves them closer to their goals. You'll learn how to create and apply hierarchy, color, contrast, typography and gestalt principles to design appropriate visual cues so people know where and how to take action.

I'll show you how to make good visual decisions for even the most challenging applications, from simplifying complex visual information to designing with data. My goal with this course is to give you everything you need to know to make great UI design decisions, no matter what the content, context or product may be. 

From this point forward, you'll be equipped to make strategic, impactful User Interface designs that communicate, guide, encourage, motivate and educate. Anything else is decoration, and decoration has a very short shelf life.

By the time you finish Design Rules, you'll be able to do much more than create a more beautiful User Interface. Instead, you'll be able to design a UI that truly works for the people who use it. One that it allows them to easily figure out where to start and how to get what they need — quickly, efficiently and intuitively. 

Of course, it'll also just happen to be beautiful ;-)

Who this course is for:

  • Print and Digital Designers, Web and App Developers and anyone looking to take their UI work to the next level!

Featured review

Ildiko Setalo-Djordjevic
Ildiko Setalo-Djordjevic
17 courses
5 reviews
Rating: 4.5 out of 5a year ago
Very nicely put and concise. Excellent summary! What I liked about it is that these are timeless principles summarized in one place. The only reason I didn't gave full 5 starts is because there were no opportunities to test my knowledge! Perhaps adding quizzes after each design principle (or chapter) would be beneficial.

Course content

6 sections • 50 lectures • 5h 8m total length

  • Preview16:37
  • Preview07:25
  • Form Doesn't (and Shouldn't) Follow Function
    11:16
  • Balancing Form and Function: Prescription vs. Description
    07:06
  • Why Form Follows Function is NOT a UI Design Prescription!
    07:43
  • Every Force Evolves Form (So Don't Follow the Prescription)
    04:44
  • Less is More: Small Screens, Big Challenges
    06:41
  • Five Rules for Effective UI Design on Small Screens
    05:38

  • Balance: Creating Visual Order
    06:03
  • Case Studies: Improving Balance in the User Interface
    06:38
  • Rhythm: Establishing and Reinforcing Comprehension
    04:43
  • Harmony: Shaping the Parts Into a Whole
    05:50
  • Using Harmony to Create Directional Flow
    02:49
  • Case Study: Using Harmony for Better Form Design
    04:00
  • Dominance: Directing (and Maintaining) User Focus
    05:57
  • Using Dominance to Increase Focus — and Decrease Cognitive Effort
    05:21
  • Creating Dominance with Size, Negative Space and Contrast
    05:42
  • Alignment: Leading the Eye Across the Screen
    04:22
  • Case Studies: The Power of Alignment
    05:26
  • Proximity: Showing and Communicating Visual Relationships
    04:36
  • Using Proximity to Make Cognition Faster
    02:46
  • Case studies: Using Proximity to Make Browsing Easier
    04:35

  • Color: Getting Attention and Communicating Emotion
    05:02
  • How Color Influences Interaction
    07:57
  • A Word on Color Theory — and Using Color Correctly
    04:07
  • How to Choose the Right Colors for your UI: Common Associations
    04:07
  • How to Choose the Right Colors for your UI: Emotional Impact
    06:42
  • How to Choose the Right Colors for your UI: From the World Around You
    04:15
  • How to Choose the Right Colors for your UI: From Brand Colors
    04:03
  • The Power of Contrast
    02:55
  • Using Contrast to Improve Readability, Attention and Focus
    07:41
  • Three Essential Functions of Contrast in UI Design
    02:54
  • How to Determine Appropriate Color and Contrast
    04:51

  • Typography 101: It's About Much More Than Choosing a Font!
    02:43
  • Creating Emotional Impact with Typography
    03:52
  • Choosing a Font Isn't Typography: The Importance of Pattern Recognition
    03:08
  • The Importance of Proper Alignment, Leading and Kerning
    08:19
  • Seven Rules for Great Typography
    14:43
  • Five Rules for Choosing Imagery
    12:13
  • Imagery DOs and DON'Ts
    08:07

  • Working with Icons
    04:35
  • Four Core Types of Icons (and How to Choose the Right Type)
    06:04
  • Five Rules for Effective Icon Design
    06:50
  • Dealing with Data
    08:45
  • Five Rules for Great Data Design
    05:27
  • Simplifying Visual Information Part 01
    04:10
  • Simplifying Visual Information Part 02
    09:13
  • Separating Content from Controls Part 01
    06:53
  • Separating Content from Controls Part 02
    06:15

  • Recap: UI Design Mantras
    06:16

Instructor

Joe Natoli
29-year UX + Design Veteran; Consultant, Author & Speaker
Joe Natoli
  • 4.5 Instructor Rating
  • 33,390 Reviews
  • 170,593 Students
  • 8 Courses

Joe Natoli has launched five successful online courses with Udemy on the topics of User Experience (UX) and User Interface (UI) Design, with more than 180,000+ students enrolled to date.

Joe has been preaching and practicing the gospel of User Experience (UX) to Fortune 100, 500 and Government organizations for nearly three decades. That work includes commercial industry leaders like Google Ventures, Kroll/Duff + Phelps, Broadridge, Conde Nast, Johns Hopkins, Mettler-Toledo, PHH Arval, SC Johnson and Wolters Kluwer, as well as government agencies like the National Science Foundation, National Institutes of Health and the Dept. of Homeland Security.

Joe devotes half of his practice to writing, coaching, and speaking. From guiding students at the beginning of their careers to integrating UX into the work of seasoned veteran developers and designers, he is immensely passionate about the inherent power of UX and design.

The remaining half of Joe’s practice is dedicated to training Enterprise Design and Development teams, helping them integrate best practices in UX into their product development efforts. In addition, he does a limited number of UX Audit engagements to help organizations identify and overcome UX-related obstacles to product adoption.

Joe has been speaking publicly on the topics of User Experience (UX) and Design across the globe for 24 years, from global conferences like HOW Design Live, SDD, DevWeek, and IxDA South America. He also makes it a point to spend time talking to students across the country at colleges and universities, in an effort to give back what others have so generously given him.

His latest book on UX Strategy and Product Improvement, Think First, was published worldwide on October 5, 2015.

In addition, he has written numerous articles about the roles Design and UX play in business success for publications such as Fast Company, SmartCEO, The AIGA Journal, The Baltimore Business Journal and Business Monthly. His articles, advice and videos can be seen at his website, as well as across various social media platforms.

  • Udemy for Business
  • Teach on Udemy
  • Get the app
  • About us
  • Contact us
  • Careers
  • Blog
  • Help and Support
  • Affiliate
  • Terms
  • Privacy policy
  • Cookie settings
  • Sitemap
  • Featured courses
Udemy
© 2021 Udemy, Inc.