Design Inside Yahoo!: George Oates
Flickr, acquired by Yahoo! in 2005, is one of the most popular photo sharing sites on the web. It recently took on Gamma status with a new navigation, a redesigned AJAX-based organization tool and new search features.
This is the second interview of Design Inside Yahoo! This time, I interviewed George Oates, the UI designer at Flickr. I talked to George about Flickr’s beginnings at Ludicorp, its place in Yahoo!’s social media strategy and the Flickr design process.
Joshua Kaufman: Ludicorp preceded Flickr with the online multiplayer game, Game Neverending. How did the design of an online multiplayer game influence the design of a photo sharing site?
George Oates: Game Neverending (GNE) was designed to be a playful space where people could socialise. While there were certainly game elements (like exploring the world, buying and making things, exchange and such) essentially it was about interaction; having social connections in the game like friends or acquaintances, even enemies.
In terms of the UI, it was a Flash-based app, where you moved around the series of nodes that formed the world. Anywhere you went you could see who was there and open up a chat window with them. You could drag and drop items to collaborate and share, help people, or make new items.
When we came up with the idea of starting a photo-sharing project — you know, actually sharing as opposed to straightforward storage — the elements of interaction we had in place in GNE just seemed to fit.
So, we basically translated the game objects themselves into photos on top of the existing game architecture. Like, dropping a photo from your shoebox on to someone’s name to share it with them.
It was a lot of fun in those early days to see the way people would use a photo as the subject for discussion, and even use images within conversations to make a point, or a joke. The “social infrastructure” we created for GNE turned out to be really handy :)
JK: Tom Chi talked about how MyWeb fits into Yahoo!’s growing social media network. What is Flickr’s role in this network and how does it compare to Yahoo! Photos?
GO: I think Flickr’s role in the network is as a sort of figurehead… You know those ladies that were carved onto the prow of huge pirate ships? ;)
As well as that, the content that our members are producing can and is being used throughout the Yahoo! Network in really cool ways. Photos are being displayed on Yahoo! Travel, and in the new Trip Planner, and being showcased on the new Yahoo! home page as part of the Yahoo! Pulse.
The bigger Flickr gets, the more we’re seeing it as a huge, huge archive of our lives (produced within a fertile, surprising, collaborative space). With such a vast resource at everyone’s fingertips and our open API, who knows what the future will bring?
JK: When faced with a new interface requirement for Flickr, what is the design process you (or the Flickr team) typically use?
GO: We don’t follow any formal design process here at Flickr HQ, although I guess if you had to put our process in a box, you could call it something like RAD or XP. The whole team enjoys iterative development, and frankly, I think the best results come out of that sort of process anyway, in terms of personal creativity and input as well as the end result.
That said, there are a number of different ways that new features make their way on to our to-do list. I’ve been thinking of them as either Blue Sky New Bits, Things We Should Just Do, or Improvements to Existing Features.
Let’s pick the fun one, shall we? Blue Sky.
- One of us comes up with a crazy idea.
- We share the idea.
- We talk about it.
- We sketch out some requirements or a flow or something like that to frame the feature.
- I sketch out some potential UI or visual design, usually in OmniGraffle or Photoshop initially.
- We share our ideas.
- We talk about it and start putting stuff on the Wiki.
- The devs start coding stuff and working through changes we might need to make to the infrastructure of the system (a new database table or two, impact on existing data, that sort of thing).
- I keep working on the design: visuals, interaction, copy etc.
- Rinse, repeat.
Also, we always consider how the community might respond, and where we think they’ll need assistance. This is Really Important. :)
JK: Following that last question, how do you involve users in the design of Flickr?
GO: After we release something new, most of us hang out on the site, listening and gathering feedback from people, good and bad. Often we’ll stay tuned to a new release for sometime after go-live, making tweaks or improvements to it based squarely on what The People think.
I’m not sure we would say that we involve our members in the design of Blue Sky New Bits per se, but their feedback is essential when it comes to improving on stuff that’s already out there.
JK: Finally, I have to ask: Flickr recently dropped the beta status and took on gamma status. What exactly was the point of that?
GO: The point? Well, FUN of course.
We just didn’t see the point in shooting for a huge “1.0” release, because Flickr is always changing, and we want everyone to be aware of that, and find comfort in it. :)
I mean, the idea that a web application out there can label itself as “in flux” is exciting! For too long, software developers have toiled in development cycles of months or years, slaving over their specs with no release in sight. Of course we don’t want to release buggy code, but the added weight of having x features pass through y gates before we can deploy is, well, yucky.
That said, the release we did that we labeled GAMMA was a fairly significant change to the site — we redesigned the navigation system, the experience for new members, and wrote a new version of the Organizr. It seemed like a good idea to bundle all of them together.
JK: What’s next for Flickr?
GO: As if! You’ll just have to watch and see.
George Oates is the UI Designer at Flickr.
- 8 Aug 06
- flickr, interaction-design, interface, interview, process, web-design, yahoo
Go back to the top of this entry ↑
Add a Comment
Allowed HTML: a, em, strong (How do I use HTML?)
To link to a website type <a href="http://nameofsite.com">link text</a>
To add emphasis type <em>text you want to emphasize</em>
To add strong emphasis type <strong>text you want to emphasize</strong>
Comments (Add Yours)
Awesome interview. Thanks!
Lance Nishihira on 11 Aug 06
Thoroughly enjoyed the interview. Thanks for the insights.
efatima on 21 Aug 06
very interesting… I have an idea that I hope you may consider:
when a member selects to view one of their own photos, to read the comments it would be nice if there was a display of what members have faved that image. Just use the icon and member name like in the contacts list… just a thought.
cheers, Sean
Redroom Studios on 21 Aug 06
Love the lady on the pirate ship metaphor. Beautiful. :-)
Gino Zahnd on 21 Aug 06
Nice interview. She is one of my fav designers.
-kazi
kazi on 14 Apr 07