Screens Essentials for UI Designers

05:15

Screens Basics

Learn about some basic terms such as resolution and density
06:28

Scaling on Devices

Check out scaling on different platforms
15:08

Graphic Files Formats

Save files with confidence from Sketch, Illustrator and Photoshop
07:40

Platform Specifics

Some iOS and Android considerations
10:19

Things worth remembering

Other important terms and things worth remembering

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

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.

Gain access to all courses from $12/mo