Intro

Pixels are the building blocks of all screen designs on digital devices – whether you’re creating the interface for a native or web app, or a mobile site. So you can get the most out of your pixels, Gyppsy, from leading interface design and UX house ustwo, has some simple-to-learn tips and tricks for you.

Following these steps will not only improve your output and save you time, but they also work across whatever graphics application you use from Photoshop, Illustrator and Fireworks to Sketch and Pixelmator.

You may ask yourself why you should bother with little details like this – especially when you’ve got bigger issues to deal with? Well, as with many things in life, when something’s done right it should become invisible to you, but when it’s done badly it soon becomes an annoyance. Blurred edges, objects that jump in position between pages, and colour mismatches are just a few things that a user will notice if your designs aren’t done properly, leaving them with a poor impression of the product or company behind the site. 

Getting these things right shows that you really care about what you’re making, so users will love your app – and/or the brand you’re promoting – even more.

For this Masterclass, Gyppsy has used ustwo’s Honk app as a ‘live example’ of his principles – though as mentioned above they’re just as appropriate for many types of digital design including mobile-focused web design. You can download Honk for free from here.

Time Saved

Loads

Tools

Any modern graphics software, such as Photoshop, Illustrator, Fireworks, Sketch or Pixelmator