Flickr for iOS dropped a major update late last week. It’s an impressive redesign worthy of attention from photographers and designers alike. I’m excited about Yahoo’s renewed energy in the mobile space, and judging by the work that went into this update, it’s clear that their designers aren’t cutting any corners.
Design Details is also a podcast, a weekly conversation about design process and culture. Listen to the latest episode while you read, or subscribe in your favorite app.
I’ll kick things off with a small detail: the pull to search interaction. It’s really, really smooth on the app and I’m not sure the gif captures this very well. I love the subtle fade in, almost like it’s gently popping to the surface of the screen.
Some Flickr designer out there came up with this genius pull to refresh animation, and I can’t get enough of it. It breaks the mold from every other iOS app, and plays so nicely with Flickr’s logo. We’ll see more of this in later views.
If you thought iOS7 took the frosted glass look to the limit, just wait until you get your hands on Flickr. They really hit you hard with the gentle blurs, glass effects and context-aware coloring. This style is tastefully done, and seems to work so well for a photography app.
My animation capture doesn’t quite do the app justice in this case – I recommend grabbing the app to see this interaction really come to life. Flickr has built a really consistent animation for opening secondary views – it’s a nice blur/pop effect that (while admittedly glitchy at times) feels quite nice. I think they’ll smooth this out in future versions, but even now it’s a very snappy, responsive interaction.
The animation for favoriting/unfavoriting a picture is a nice touch that adds so much to the entire polish of the app. Very nicely done.
The follow button interaction here feels so great. It’s a wonderful animation that’s playful, but doesn’t feel like it’s wasting your time.
I actually said “whoa” out loud the first time I came across this detail. I’m in love with this animation – it’s more complicated than a pull-to-refresh ever needed to be, but this delightful experience adds so much to the entire app. Bravo, Flickr.
You’ll miss this one if you aren’t paying attention – right when you hit the empty Groups tab, we get a nice little icon that bubbles in. This is one of those details that adds nothing to the app’s functionality, but builds a delightful experience that can’t be quantified.
This shot showcases the nice interaction when tapping into subviews within Flickr. The animation still isn’t quite perfect, but the effort is there and I’m excited for the designers to smooth this interaction over in future versions.
This little detail is one that I think could be so easy to overlook. Notice how the placeholder text in the search field changes depending on the search filter. Providing more context, even in little ways like this, can add so much to the user experience.
Once upon a time Flickr was the host of high-quality, drool-worthy photos taken by professionals with DLSRs and high quality equipment. Those days have since passed, and Flickr is certainly working hard to stay with the times. The new camera is very sleek – simple, easy to use and certainly draws comparisons to VSCO or Instagram.
This gif shows the live-filters being added to the camera. I love the way the filters bounce in from the right side of the screen, and then stand up a bit taller on selection.
Toggling between video capture and photo mode is slick here. I love the circle rotation, and how the button changes color to indicate the state change (red for record).
When I first hit this flow I was amazed at how smooth every animation and state change was. This is seriously impressive design + engineering collaboration at work. In this gif I took a photo then tapped ‘next’ to bring up the post composer. Notice all the sliding, bouncing and blurring – yet none of it feels over the top or unnecessary.
I added this little gif to the post only to showcase just how snappy and responsive every interaction is. The editing tools feel great to use, and makes modifying photos so easy.
After you’ve taken a photo you can go back and edit the filter and then apply secondary effects.
I’m torn because while I love the animation, I feel like these secondary effects are really hard to find and sort through. It took me a while to explore this view and get comfortable knowing what options were at my disposal. In this case it seems like Flickr has buried some functionality that is quite fun to use – I’m not sure if the tradeoff makes much sense for an app of this nature.
In cases like these, however, I trust that the designers/engineers made the best decision possible with all available information. I’ll be curious to see if this interaction gets changed at all down the road.
Tapping on the ellipsis in the bottom right corner of the screen brings up additional editing options. While I love the snappy sliding effects, I’m again torn about these effects being hidden behind an ellipsis icon. I imagine that this was a really hard design decision for the team, so it’s probably not fair for me to try and inject my two cents here :)
I’m adding this gif in just to show off the snappy animations that are used everywhere in the new Flickr app. In this case, I’m bringing up my existing albums and then returning to the camera view. Everything feels so quick and responsive, a wonderful attention to detail that’s so hard to get right.
Flickr seriously nails it when it comes to these dynamic image blurs and frosted glass effects on subviews. Bringing up a photo’s meta information is truly beautiful and delightfully snappy.
I might not have chosen the best profile to capture here, but I did want to just keep highlighting how prominent the frosted glass/color blur is used all across the new Flickr app. Here, the subnav is blurring the profile cover photo. It’s a really great touch and makes every profile feel more rich and personal.
For my last design detail, I want to highlight just how smooth the commenting is in the new update. Everything just slides perfectly into place, pairing my mental expectations with the digital movement of content. This one is hard to explain, but I really enjoy the way comments feel so fluid in Flickr.
Design Details is also a podcast, a weekly conversation about design process and culture. Listen to the latest episode while you explore more posts, or subscribe in your favorite app.
Paper by Facebook
Copyright whenever. This isopen source.