Alicja Colon

UI Photography: Part 1 #tbt

Spoiler alert: you may have read/seen this post already. Tucked into the Focus Lab journal is a lot of valuable information from the past few years of learning and growing. We want to make sure you have access to all the in-our-heads goodies we have to offer. Hence, our Throwback Thursday series, which will post each third Thursday of the month.

Sidecar Wide Image 1@2X

It’s no secret that I have a love affair with the camera, and me and mine tryst on a pretty regular basis. Another un-secret is that Focus Lab excels in User Interface (UI) design. Upon showcasing our chops on Dribbble, particularly concepts from the OpenCoach project, opportunities to craft awesome UIs multiplied. One such opportunity was Snappy.

Snappy was my first soup-to-nuts project management assignment. It was also my first attempt at UI photography. Up to this point, I was well versed in fashion/portrait/subject-based photography, not commercial; nevermind UI photography.

“In my efforts to self-educate, I quickly noticed a lack of original UI photography how-to’s (well, except some from the 80’s).”

This is my attempt at filling the void, though, admittedly, there’s much I don’t know. Please chime in, as I’m sure this subject matter becomes more transversed. There are countless photographers with more experience than I. I’d love to hear from you!

When diving into this subject matter I want to address one question I always get inundated with: Why take pics of UI when you can just mask it?

There's one mainstay of the original photograph the mockup can't contend with: Authenticity.


When I first started to venture into UI photography, I tried to ensure that the screen was free from glare. (You have to see the UI after all.) But after berating myself for failing at this, I took notice of the images that Bill, our Creative Director, was selecting: those with partial obstruction due to glare. Huh? Well, they were more real. After relief paraded my spirit, I took some time to reevaluate the success metrics of a UI photography shot. Capturing elements that reflect authenticity is crucial. (UI is for humans — duh!) An off-shoot of Authenticity is Originality.


Your design is unique to the client for whom it was created. There was extra effort for research within and outside the industry. Iterative rounds going back and forth with the client discussing interactions, flow, brand, experience. Why not take the opportunity to further the story, personality, and brand?

While a mockup is handy, does it truly further the brand strategy? Does it leave a lasting impression with your audience? Chances are they've seen it before.

What about you: Do you create custom UI photography? Why or why not? What are some questions you have diving into crafting kick-tail imagery?

If you enjoyed this article, stick around for Part Deux coming at ya in November, where I share what I’ve learned about things like moiré and lighting, among other tidbits. I’d love to hear what obstacles you’ve encountered and your time tested solutions.

Give this a share if you enjoyed it :)