Learn UI Design

Dive into the art of UI design. Read these tutorials to master color theory, layout, typography, and more. Create stunning user interfaces that delight users.

All UI Design content:

  1. New Course: Getting Started With Semantic UI

    New Course: Getting Started With Semantic UI

    Tutorial Beginner

    Semantic UI is a well-crafted front-end framework with professional features and a robust API. Our new course will guide you from start to finish through the...

  2. Understanding Sketch’s Export Options

    Understanding Sketch’s Export Options

    Tutorial Beginner

    Exporting assets from your designs is a common task. You start by creating and preparing your graphics, then you choose the export format, set its properties...

  3. How to Give Your Logo the “Slip Scroll” Effect

    How to Give Your Logo the “Slip Scroll” Effect

    Tutorial Intermediate

    In today's tutorial we're going to use JavaScript to create a simple, flexible, parallax effect where a logo seemingly changes colors with the background...

  4. How to Create Buttons in Photoshop and Adobe Muse

    How to Create Buttons in Photoshop and Adobe Muse

    Tutorial Beginner

    In this tutorial I'll show you how to create a button in Photoshop and use it, with all its various states, in an Adobe Muse project.

  5. 3 High-level Approaches to Prototyping by Example

    3 High-level Approaches to Prototyping by Example

    Tutorial Intermediate

    In today's tutorial I will compare different types of web prototypes through illustrating three high-level approaches by example.

  6. How to Decide Between Static, Lo-Fidelity and Hi-Fidelity Prototypes

    How to Decide Between Static, Lo-Fidelity and Hi-Fidelity Prototypes

    Tutorial Beginner

    In this post, I'll walk you through high-level prototyping approaches, and describe in which contexts one would choose each.

  7. Sketch for Beginners: Design a Login Form Interface

    Sketch for Beginners: Design a Login Form Interface

    Tutorial Beginner

    In the following tutorial you will learn how to create a simple login screen using Sketch 3.

  8. Quickly Create a Website With Adobe Muse CC 2014

    Quickly Create a Website With Adobe Muse CC 2014

    Tutorial Beginner

    In this tutorial I will quickly show you how you can build a website using Adobe Muse CC. Amongst other things, we’ll create and manage a site structure,...

  9. Quick Tip: Sticky Navigation, Without the Awkward Jump

    Quick Tip: Sticky Navigation, Without the Awkward Jump

    Tutorial Intermediate

    In this quick tutorial we're going to use jQuery and make a simple sticky navigation. With that done, we'll improve on our efforts by using jQuery Waypoints...

  10. Filament: Website “Plugins” That Work Everywhere

    Filament: Website “Plugins” That Work Everywhere

    Tutorial Beginner

    Filament gives you “apps” which allow you to add social sharing buttons, Google Analytics, newsletter subscriptions and other extra functionality to your...

  11. Designing a Simple Instagram-Based Portfolio in Photoshop

    Designing a Simple Instagram-Based Portfolio in Photoshop

    Tutorial Intermediate

    In this tutorial I'll guide you through the process of creating a simple and clean Instagram-based portfolio. We'll use some striking imagery, a clean color...

  12. User Interface Design for the Web

    User Interface Design for the Web

    Course Beginner

    Ready to learn the key principles of successful UI design, and apply them to your web design? In this course, instructor Adi Purdila will teach you the...