LearnUX.io Awwwards Honorable Mention

Screens Essentials for UI Designers

  1. Screens Basics 05:15

    Screens Basics

    Learn about some basic terms such as resolution and density

  2. Scaling on Devices 06:28

    Scaling on Devices

    Check out scaling on different platforms

  3. Graphic Files Formats 15:08

    Graphic Files Formats

    Save files with confidence from Sketch, Illustrator and Photoshop

  4. Platform Specifics 07:40

    Platform Specifics

    Some iOS and Android considerations

  5. Things worth remembering 10:19

    Things worth remembering

    Other important terms and things worth remembering

Screens Essentials for UI Designers

Duration: 00:44:50 Last update: 3 years ago
  • Key Points
  • Author
  • Source Files
  • Who is this course for?

Learn some of the most important terms and factors for successful UI design. We'll start from the tiniest element you design for - pixel. Then we move on to different screens, resolutions, we'll explore retina, DPI and so much more. You will get to know optimal formats for UI design as well as workflows that will let you create highest quality assets!

  • Working with bitmaps & vectors
  • Assets for HiDPI and Retina screens
  • DPI, resolution, aspect ratio
  • Efficient workflow across the tools
  • Optimal formats for your assets

Greg Rog - “My work is all about design, coding and education. For over 10 years I’ve been a professional designer, design lead and UX consultant for companies such as Microsoft or Google. I work closely with Adobe as Community Professional. I also run a software house and a training facility, speak on design conferences and more. I’m curious, passionate and I love sharing knowledge.”

Sorry, you don’t have access to the project files.

Why don’t you subscribe and get full access throughout the site?

If you are a beginner, or just want to recap the most important factors for screen design - this workshop is just right. It will fit both those of you ready to dive into UI design but also more advanced users who want to keep track of the current specifications for different devices.

Reviews (2)

DPI, PPI, Resolution

You will find plenty of tutorials and articles on how screen design essentials work with explanation of terms and key techniques. The thing is the more you read the more complicated this topic appears. Let's focus on theory and keep it short and to the point so it is most useful in your workflow.

Vectors vs. Bitmaps

We'll explain the difference, but also get deeper into the best ways for exporting design assets from software such as Sketch, Illustrator or Photoshop. You will see multiple benefits of working in vector-only environment but also there are some hints for Photoshop design flow.

DPI, PPI, vectors and bitmaps for designers
Designing in 1x scale

Working in 1x scale

You will also get to know some approaches to designing for hi-density screens such as Retina and therefore explore differences between Pixels, Points or Density Independent Pixels. It will all sum up to a modern way to start in 1x scale and then export the assets accordingly for different screens, if needed.