The Flickr Redesign - May 20 2013
•Download as PPT, PDF•
2 likes•544 views
This deck discusses the redesign Flickr that launched in May 2013, beginning with an incremental approach in 2012 and culminating in a massive relaunch in 2013. We created a design vision in 2012 and began to redesign feature by feature. There were clear benefits to this process, but the pace and impact were not optimal. With Marissa Mayer's arrival at Yahoo we presented our vision and quickly found significant renewed enthusiasm for Flickr – she was ready to invest in a much larger relaunch of the Flickr product. With Marissa's support, we changed course to a much faster, revolutionary redesign of the product. The results were spectacular, and put Flickr on a new course.
Recommended
More Related Content
Similar to The Flickr Redesign - May 20 2013
Similar to The Flickr Redesign - May 20 2013 (20)
Recently uploaded
Recently uploaded (20)
The Flickr Redesign - May 20 2013
- 3. The Need to Redesign flickr.com/photos/saraewood/6258668995/
- 4. Complexity vs. A Big Redesign flickr.com/photos/dominik99/384027019/
- 5. Redesign in Stages • risk of Frankenstein product • frequent, smaller user churn • repeated PR bumps • faster time to market • iteration & course correction vs. One Big Release • less UX fragmentation • larger community impact • single, big PR boost • long wait / no shipping
- 6. Ease of Use & Beauty 2012 2013 Redesign in Stages! faster time to market with higher coordination cost
- 7. st rt the a f ate o Ease of Use & Beauty 2012 2013 Redesign in Stages? progress in key metrics, not overtaking competition
- 8. st Ease of Use & Beauty 2013 Big Relaunch! big effort to retake market leadership rt the a f ate o
- 9. Evolution or Revolution: Same Goals & Metrics • bigger photos – photos as the hero • revitalize Flickr brand and product perceptions through design • create daily habit for photo viewing and sharing • be the limitless public / private photo sharing destination • social engagement and photo sharing • photos uploaded (public & private) • new member growth • increase time spent on site flickr.com/photos/coast_guard/9474042420/
- 20. Flickr Relaunch Impact Photos uploaded up 4x – now 12m+ daily New members up 2x – now 60k daily Over 1.5m new members – first 30 days Time spent & social engagement up 10-50% Monthly uniques up 25% – 110mm in July Photos uploaded via Android up 490% flickr.com/photos/cindyli/8767201530/
- 21. Ship Often (not too often) flickr.com/photos/84786968@N06/8565827754
Editor's Notes
- I spent 5 years at Flickr as the head of product design, loads of projects including the big redesign last year This talk covers some of the reasons why we felt it was important to redesign Flickr and the process. Started with one approach (incremental) and really did it with another (big redesign, all at once).
- 10 years old as of Feb 2014, part of Yahoo since 2005 Small team until 2013: 42 people - 4 designers, 6 FE’s, ~20 engineers total. Grown to 100 by end of 2013. March 2014: 13 billion photos, 120+ million members, ~4 billion PV’s / month
- In 2012 we began creating a design vision for a new Flickr Flickr continues to scale and new features added to product, complexity increases Challenged not by lack of features, but on simplicity, engagement, and beauty Stepped back and created design vision because we couldn’t re-envision the site without a roadmap and significant planning Design vision work owned by design with Engineering and Product involved. Open process is crucial.
- How to proceed with vision? Flickr has over 1,600 page templates Users experience multiple parts of the product daily (uploader, photos, groups, organizer, search, sharing, etc). Not everything can be simplified away, scope is large. Product must be modernized, simplified, and beautified: but how?
- No clear winner for every product
- In 2012 we chose a multi-stage redesign to: 1. Simplify & beautify key experiences, but not everything 2. More immediate progress with small staff 3. Blend new visual style with old, accept some inconsistencies, improve as we go
- ————>
- A/B tests at each launch to assess key metrics social engagement, # photos consumed, discovery of key features all increased incremental increases, not enough to disrupt site wide trends
- Flickr product needed disruption to surpass newer rivals 1. Major PR splash needed to excite new and old members, stoke awareness and buzz 2. Significant product changes to simplify, amplify experience 3. Significant investment from Yahoo w/ arrival of Marissa Mayer
- Start and end projects with key metrics, clear goals Same metrics regardless of design process social engagement & sharing photos uploaded (public & private new members time spent
- We reviewed designs constantly with exec staff frequently referred to original designs to strengthen awareness of product execs were very deep down into the design details, pushed for quality and visual impact used pixel perfect mockups and Keynote demos to show details
- New site launched to 100% of traffic all at once on May 20, 2013 - immediate impact on metrics Very risky, but mitigated by thorough planning and experienced staff leadership. $0 price point, 1TB storage, and massive marketing campaign clearly influenced success of relaunch. Launching all at once (vs testing) makes it hard to quantify effect of design changes, though many metrics are design driven.
- Think about story / headline of what you’re launching - Is it compelling enough to achieve desired results? Flickr slowed down releases slightly to achieve larger, more coherent impact for each release. Generally mix evolutionary projects with periodic significant changes - plan on big redesigns periodically. Make some change “normal” for community with regular releases.
- Prioritize empathy, present opportunities - don’t limit design to what stakeholders ask for. Build what they need, what will delight, what will maximize product. Flickr users didn’t (directly) ask for most of what we built. 1. Bigger Photos was #1 goal, but we had to design what that actually meant. Maintained context & features, photos as “containers” for interface. 2. Example: specific Flickr Logo redesign requested by an exec stakeholder, we presented alternates that better fit product needs (vs. requests)
- Flickr Logo redesign dictated by a senior exec, but we presented alternates that better fit needs (vs. requests) Stated goal: “make the R purple”. Separately worked on “why”, and presented opportunities that worked better. Result: demonstrated understanding, presented alternatives, and gained support for simpler option.
- Flickr Logo redesign dictated by a senior exec, but we presented alternates that better fit needs (vs. requests) Stated goal: “make the R purple”. Separately worked on “why”, and presented opportunities that worked better. Result: demonstrated understanding, presented alternatives, and gained support for simpler option.
- Flickr Logo redesign dictated by a senior exec, but we presented alternates that better fit needs (vs. requests) Stated goal: “make the R purple”. Separately worked on “why”, and presented opportunities that worked better. Result: demonstrated understanding, presented alternatives, and gained support for simpler option. A simple white logo takes brand color conflicts off the table, works better on dark background, etc.
- Polish, attention to detail must be expected by leadership and entire organization. Show respect for users and pride in the product. Quality over quantity! (Except under deadline, then both) Delight is part of the product. Even rough spots like Flickr 404 error can be cleverly presented. Attention to detail either strengthens or weakens the brand. Trade off with extreme caution. “Do a good job tomorrow” - fortune cookie