In addition to our longer form talks at Design+Startup, we also featured two QuickFire talks built for sharing detailed, tactical advice on a specific topic. In this talk Shawn dives into the Retina display and how the design process at HotelTonight has evolved to leverage all those pixels. Check out the video below and the summary that follows.
Retina does not mean we have to scale a design up or down for differ displays, it changes the way we have to design for everything else and makes the details matter even more on lower resolution screens. It is true, designing for retina is like cooking an amazing meal in a chef’s kitchen with an unlimited budget for the best ingredients, but after you spend all that time designing the perfect meal, you don’t want 80% of your guests to eat leftovers, right? Interpolation leads to second hand experience and by not focusing on the details of the design and how it will be seen on low resolution screens, you are basically serving day old meatloaf instead of Filet.
The biggest change to the process at HotelTonight was deciding to build everything in vector but also mapping the designs to the pixel grid. The goal is to avoid the half-pixel at all costs and this process of building in vector eliminates the argument about build small and scale up vs. build big and scale down.
The approach is time consuming and there are some new softwear shortcuts, but photoshop is the best tool. Also, in PhotShop, there are some time saving tricks like smart objects and blending options that make building more efficient.
You learn things like super rounded rectangle will snap to a grid, circles will not, so use super rounded rectangles instead of circles. More generally, techniques that focus on the specific simple details like prototyping on the device with HTML5 or even dropbox over wi-fi will speed you up and help you deliver the best product at all resolutions.
In the end, as tempting as it is to focus on the detail and power of these new beautiful devices, the best products will come from the teams that sweat the details to deliver the best experience for the low resolution customers that are behind us.