Gregory's ServerWelcome back! This is our fourth design critique thread. Today, we're taking a #ThrowbackThursday look at iPhoto for iOS, launched in 2012. Despite its short lifespan, it delivered visual design craftsmanship in spades.
 33 comments
2. The iWork suite launched with the iPad in 2010, then iMovie launched that summer with the iPhone 4, then GarageBand with the iPad 2. iPhoto was the last iLife app to get an iOS version (and later, the first to be killed). 3. iPhoto tried to be the most consumer-facing photo management/editing app. Their ideal customer probably uses it on their Mac, but they don’t do any editing on their mobile device because the built-in editing tools are limited to crop, rotate, remove redeye, and an auto-enhance feature. iPhoto had 6 “killer” features: • Smart Browsing In the interest of brevity, we’ll focus on just the five editing tools: crop, exposure, color, brushes, and auto-enhance. Cropping is the most straightforward. You pinch and zoom to crop, there are some preset constraints under the gear button menu. If iPhoto detects something resembling a horizon line, it’ll show a line flanked by some extremely period-correct radial brushed metal buttons to either accept or reject the changes. Today, building this would’ve been significantly easier with the nifty VNHorizonObservation class in the Vision framework. Tapping the straighten angle knob kicks in the gyroscope, so you can tilt your device to get the exact angle you want. We don’t see a ton of these sorts of interactions that make assumptions about hardware capability and the user’s motor skills. Maybe that’s for the best? Let’s take a look at the color adjustment features. You’ll notice the standard color adjustment tools you’d see in Photoshop or Pixelmator have been reduced down to four sliders. If we turn on the help labels, you’ll see what they adjust: This would probably drive a professional editor up the wall, but for the target user, it’s brilliant. These cover 80% of the adjustments you might want to make, and the simplified tools do it better better than a novice messing with color levels or specific hue adjustments. The sliders use the same radial brushed metal texture as the horizon adjustment line from earlier. We love it, but can’t help but feel like its use in the horizon line diminishes the power of this signifier. Across iOS 6, this texture means “knob for a slider.” But on that line, it’s just a button you can tap — you can’t drag it around. Beyond the sliders, there’s also a slide gesture you can perform on the image viewer. I like what this was going for, but honestly, I could never intuitively remember which direction controls which. Let’s talk about brushes. The functionality isn’t anything remarkable, but take a look at this visual design. It’s so fun; it’s almost like a primitive version of the tools in that PencilKit platter: Each tool is made up of a bunch of image files stacked on top of each other. The tool shadow, then the tool itself (with variants for retina and non-retina, then variants for iPad and iPhone with a longer stem), then the outline glow if its the selected tool. The Repair wand gets some extra-special treatment with a sparkle particle emitter swirling around the magic wand. If you think using sparkles for AI is overdone, just know that it predates the AI boom by quite a while. You should’ve spoken up when auto-enhance was rolled out 20 years ago, and that’s on you. 🫵✨ Remember, this is 2012. Phone cameras were terrible, so we all had to slap a bunch of filters over our photos to make them palatable. Some were fine. Most were gaudy. Apple targeted this in their marketing, calling their built-in effects “professional-quality.” They’re...fine, but they’re also 2012 app filters, so. You know. Similar to the brushes, they expand out from this Pantone-style fan deck. Some are color-based, others do some kind of blur or texture-mapping. They did a really nice job adapting photo filters to touch here. Take a look at how you can scrub through the black and white filters and change how the photo gets converted to black and white. This is such a neat interaction. Finally, we’d be remiss if we didn’t call out the photo inspector modal. It mimics a pro camera’s LCD readout — drop-dead gorgeous. They’re also doing something really interesting with the map. This predates them switching away from raster map tiles and Google Maps, so we’re seeing a version of Google Map tiles but with this neat photo book-style skin on top of it. I’ve never seen stylized map tiles before, so this was a fun discovery. All good things must come to an end. iPhoto for iOS was dealt two death blows. The first came in late 2013, when it got redesigned for iOS 7. Listen, it was the right move for Apple to usher in a fresh visual design language now that people were familiar with direct touch manipulation as a paradigm. They didn’t need the Notes app to look like a legal pad for us to understand that it’s a text field. But this an absolute massacre. Look at what they did to the brush panel: The final nail in the coffin was in 2014, when iOS 8 got serious about the standard Photos app. It got proper editing features, print products, smart search, and photo extensions. At the same time, a check was hard-coded into the system to prevent iPhoto from launching, presenting this alert instead: This entire thread has made us reflect on the work we do. It’s extremely ephemeral. It’s an art form where you could spend two and a half years crafting a beautiful product, only to have it killed for business reasons. I get it. It didn’t make a ton of sense for them to support two separate photo apps with increasing overlap. But it stings when it’s an artifact of pure craft. I still keep an iOS 6 device in my desk drawer to reference from time to time as a design archive of sorts. As primitive as some functionality is, the craft in first-party apps from that time is unparalleled. It serves as a baseline and a constant reminder for the type of work we strive to do.    @lickability Most people dont’ realize that iOS7 wasn't so much a “fresh” visual update as it was a stripping back of nearly everything to destroy the near total dependency on the 320pt width that had pervaded nearly every design everyone had been doing up to that point. It was in advance of Apple releasing a bunch of new iPhones that had larger and variable screen sizes. iOS7 was the death of "pixel perfect" designs.  @lickability This was a side effect of travel visuals in the printed photo books. There was an entire framework essentially devoted to map tile treatments.  @lickability @marioguzman I really, really miss such UI's these days.  @lickability, in your research for this – once again – great thread, did you come across WWDC 2012 Session 243 “iPhoto for iOS – UI Progression and Animation Design”? (Could be where you have the graphics from.) Of the countless dub-dub videos I've seen, both live and on video, this stands out as one of the very best. Mind-blowing work! https://archive.org/details/wwdc-2012-sessions/%5B2012%5D+%5BSession+243%5D+iPhoto+for+iOS+-+UI+Progression+and+Animation+Design.mov @bondo @lickability Yes! I've got my own little WWDC session archive which is always super useful for doing research for these threads. Also a big fan of Practical Drawing from 2011 https://www.youtube.com/watch?v=DBeQP_6SNME @samhenrigold Oh, that’s a good one. Had forgotten about that, but did lots of graphing and dynamic drawing those years. @bdudney helped me with the basic understanding all the way back when it was LayerKit on Mac OS X 🥹 @samhenrigold @bondo @lickability wow! What a blast from the past! I totally borked one of the steps in the demo, and wonderfully skilled editing means no one knows :) |
To properly understand this app, we have to set the stage:
1. The iPad was brand new when iPhoto for iOS came out — March 2012. Less than two years after it launched. Apple was still producing tons of glossy iPad apps to position the iPad as a capable — but more personal — computing device. So in this time, we saw iPad versions of their most popular apps.