Always preview on your phone
For any creative work we're doing that's ultimately going to be viewable on mobile, it's critical that we preview the work on a real phone. This goes for responsive websites, responsive emails, responsive banner ads, and non-responsive banner ad campaigns with sizes that will be displayed on mobile (typically 300x250, 320x50, and 300x50).
Just save your mobile layout as a PDF or PNG, email it to yourself, and view it on your phone. Any problems with font size, readability, contrast, tappability, etc, will be noticeable immediately.
It's critical we do this before client approval, and before the piece goes to the dev team.
The challenge here is that our creative colleagues lay out our mobile comps on large screens — that just makes sense! But we often make the mistake of routing the work through the team, and to the client, as a PDF that's meant to be viewed on desktop. This creates a ton of risk! The team and client are likely to view the mobile layout zoomed to a large size on their screen — possibly much larger than how the piece will be viewed by real users on their phones. This makes it easy to miss problems like certain elements that may be difficult or impossible to read at real mobile size. Even if we think we've done our due diligence, clients sometimes go from viewing the huge PDF to viewing the real programmed piece on their phone and end up feeling a bit surprised or disappointed that everything looks so small now; it's just not what they were imagining when they were reviewing the creative work on their large screen. Remember, we're the digital experts! Let's talk to our clients about these things!
So, a big ol' PDF is fine for having the team mark up changes, but we definitely need to review the layout by itself at full screen on a phone. And we can certainly share the big PDF with our clients, but we should also provide them with a version that's specifically meant to be viewed on a phone, and explain to them why. They're probably used to only reviewing mobile layouts on their work computer. It's in their best interest to see our creative work looking as close to real-life as possible, before approval and dev. When they understand why, they'll appreciate it! This extra little service is just one more thing we can do that sets us apart as real digital experts.
– Manning
Questions/comments? Feel free to contact me at manning@manningkrull.com. I update these articles pretty frequently — best practices evolve over time as the world of digital quickly changes, and I always welcome insights from others.