Designing for Disruption

1,220 views

Published on

Keynote talk at the Society for News Design Annual Workshop in Cleveland on October 12, 2012. Discusses responsive design, branding, and UX for news.

Published in: Design

Designing for Disruption

  1. 1. DESIGNING for DISRUPTIONSOCIETY for NEWS DESIGN ANNUAL WORKSHOP October 12, 2012 @marisagallagher
  2. 2. DIGITAL DEVICE EXPLOSION WE ARE AT THE BEGINNING OF A DISRUPTION Social Media 6 % In 55 te es rn % et 49 on Mo bil 79 es Ph eP % ol ho art ns ne 6% co s8 Sm 8% e % Prin ~25 am t 90 % ders G Rea ts/e Table Penetration Rates Television 100% Across Media and Connected TVs 21% Platforms 20 40 60 80 100%Sources: Jeffries Equity Research, PwC, Barclays - updated Sept 2012
  3. 3. BEHAVIORS SOCIAL AND ALERTS DRIVE DIFFERENT SHIFTING EXPECTATIONS OF ACCESS AND SOURCES 2 71% of all online 97% users get news forwarded to them 3 1 through email and social media 66% 3.7x engagement with news content when it’s recommended Social MediaSocial Media basic engagement Usage in with news content Usage for generalonline news adult consumers population
  4. 4. Our Digital Footprint Today: Our Digital Footprint Today: Disconnected & Expensive Disconnected & Expensive CREATED IN A LEGACY EXISTING EXPERIENCES WERE MISMATCH Sunday 5:30 PM Sunday 5:30 PM PIECEMEAL FASHION, BASED ON OPPORTUNITY Web Our Digital Footprint Today: ADisconnected & Expensive Today: Random SundayDigital Footprint Web Our at 5:30 PM iPhone 5:30 PM Sunday & Expensive Disconnected TV iPhone Web 5:30 PM Sunday TV MobileTV Web iPad iPhone Web Mobile iPhone Web Web iPad TViPad Mobile Web TV
  5. 5. USER EXPECTATION SEAMLESS HANDOFF & CONNECTION
  6. 6. So, what do we do now?
  7. 7. We start with what we know.
  8. 8. BRAND POWER Knowing YourEFFICIENT Identity SYSTEMSBuilding the Future USER- CENTERED DESIGN Anticipating Opportunity
  9. 9. BRAND POWER Knowing YourEFFICIENT Identity SYSTEMSBuilding the Future USER- CENTERED DESIGN Anticipating Opportunity
  10. 10. EFFICIENT SYSTEMSBuilding the Future
  11. 11. SYSTEMS WHAT YOU ALREADY KNOW IS A LOT Daryl R. Moen - Mizzou School of Journalism August 2000 Sample topics: • Working in Modules • Using Photographs • Understanding Information Graphics • Designing Advertising • The Process of Redesign • Designing Sections
  12. 12. SYSTEMS WE BUILT ON THIS FOR WEB DESIGN 12
  13. 13. SYSTEMS AND IT’S DRIVING CROSS-PLATFORM DESIGN Images from “A List Apart” and the Upstatement.com blog
  14. 14. SYSTEMS IT’S ABOUT BUILDING QUALITY, FASTFOR NEWS: SPEED = TIME TO DEADLINE FOR TECH: SPEED = TIME TO MARKET
  15. 15. SYSTEMS HOW WE ARE APPLYING IT AT CNN MAPPING CONTENT TO PLATFORMS
  16. 16. SYSTEMS HOW WE ARE APPLYING IT AT CNN USING A GRID THAT WILL WORK ACROSS THOSE PLATFORMS
  17. 17. SYSTEMS HOW WE ARE APPLYING IT AT CNN LEVERAGING THAT TO MEET ELECTIONS DEMANDS
  18. 18. SYSTEMS HOW WE ARE APPLYING IT AT CNN USING IT FOR BROAD INFORMATION 12-column (web, tablet landscape) 8-column (tablet portrait) 4-column (phone) NATIONAL RESULTS
  19. 19. SYSTEMS HOW WE ARE APPLYING IT AT CNN USING IT FOR MORE NUANCED INFORMATION 12-column (web, tablet landscape) 8-column (tablet portrait) 4-column (phone) STATE RESULTS
  20. 20. BRAND POWER Knowing YourEFFICIENT Identity SYSTEMSBuilding the Future USER- CENTERED DESIGN Anticipating Opportunity
  21. 21. BRAND POWERKnowing Your Identity
  22. 22. IDENTITY There was areason you chose your company.
  23. 23. The Washington Post
  24. 24. The New York Times
  25. 25. ESPN
  26. 26. IDENTITY THESE DRIVERS GUIDE BRAND & IDENTITY DESIGN, TOO Brand Positioning Brand Personality Brand Values Brand DNA Based on teachings from Lynn Upshaw UC Berkeley Haas
  27. 27. Target makes Buying toothpaste a Fashion statement
  28. 28. Nike makes Dog Walking a Hard-Core sport
  29. 29. Starbucks makes Fast Food a Community activity
  30. 30. IDENTITY HOW WE ARE APPLYING IT AT CNN EXPLORING OUR CONTRIBUTION TO THE COMMUNITY “T o act upon one’s convictions, while others wait . . . To create a positive force in a world where cynics abound . . . To provide information to people when it wasn’t available before . . . To offer - those who want it — a choice . . . For the American people, who’s thirst for understanding and a better life has made this venture possible . . .”
  31. 31. IDENTITY HOW WE ARE APPLYING IT AT CNN IDENTIFYING WHERE WE BEST EMBODY THAT CONTRIBUTION
  32. 32. IDENTITY HOW WE ARE APPLYING IT AT CNN CODIFYING THAT INTO A STREAMLINED STYLE GUIDE
  33. 33. IDENTITY HOW WE ARE APPLYING IT AT CNN USING THAT STYLE GUIDE TO SPEAK MORE CONSISTENTLY
  34. 34. BRAND POWER Knowing YourEFFICIENT Identity SYSTEMSBuilding the Future USER- CENTERED DESIGN Anticipating Opportunity
  35. 35. USER-CENTERED DESIGNAnticipatingOpportunity
  36. 36. USERS How do you choose to tell a story?
  37. 37. USERS KNOWING WHEN, WHERE, AND WHY TO REACH THEM IS KEY Image from Google Study: “The New Multi-screen World: Understanding Cross-platform Consumer Behavior”
  38. 38. USERS ULTIMATELY, BEHAVIORS AND USAGE ARE DRIVEN BY LIFE EVENING LEAN BACK WORKDAY LEAN FORWARD TVs & iPads Entertain Computers Drive Action ANYTIME ON THE GO Mobile Alerting and the Glue 6a a 10 a 12 p 2p 4p 6p 8p 10 p 12 a 2a 4a
  39. 39. USERSUSER METHODS HELP US BETTER UNDERSTAND OUR SPECIFIC USERSOpportunity
  40. 40. USERS USER AND, ARISE FROM OUR COMMON DESIGN PROCESSOpportunityDESIGN Review the Brief, Ask Questions Sketch Ideas, Refine, Send to Press, Layout, Comp QA, Fix RedlinesRESEARCH CREATE Gather UX Brief DELIVER requirements Storyboard Test from User, Edit, Sitemap Develop Tech, Business Wireframe QAEXPERIENCE Comp OptimizeDESIGN
  41. 41. USER HOW WE ARE APPLYING IT AT CNNOpportunity REFRESHING PRODUCTS TO BE MORE DYNAMIC HOME SECTION VIDEOS NAV ARTICLE TVE ELECTIONS SAVED STORIES iREPORT SETTINGS (story branding) (read & delete) (promo) -- LANDSCAPE VERSIONS -- WEB VIEW (between scroll - snap) (video fly-out) (no image treatment)
  42. 42. USERSUSER HOW WE ARE APPLYING IT AT CNNOpportunity FOCUSING INNOVATION WHERE USERS & BUSINESS BENEFIT YESTERDAY TODAY
  43. 43. USERSUSER HOW WE ARE APPLYING IT AT CNNOpportunity EXPLORING HOW TO SHARE PASSIONS IN NEW WAYS
  44. 44. USERSUSER HOW WE ARE APPLYING IT AT CNNOpportunity EXPLORING HOW TO TELL STORIES MORE EFFECTIVELY
  45. 45. So, to bring it on HOME
  46. 46. BRAND POWER Knowing What EFFICIENT To Emphasize SYSTEMSThe Pattern Library USER- CENTERED DESIGN Anticipating Opportunity
  47. 47. SYSTEMS:Know you can do it.IDENTITY:Know what you stand for.USERS:Know how to reach people.
  48. 48. RESOURCES: SYSTEMS: Responsive Design (A Book Apart) http://www.abookapart.com/products/responsive-web-design Media Queries http://mediaqueri.es/ Responsive Wireframes http://www.thismanslife.co.uk/projects/lab/responsivewireframes/ 50 Best Tools Article http://www.netmagazine.com/features/50-fantastic-tools-responsive-web-design IDENTITY: David Aaker on Brands http://www.prophet.com/blog/aakeronbrands Interbrand Global Brands http://www.interbrand.com/ Contagious Magazine http://www.contagiousmagazine.com/ Fast Company Design http://www.fastcodesign.com/ USERS: IDEO Human Centered Design Toolkit http://www.ideo.com/work/human-centered-design-toolkit/ Sociology of News (Michael Schudson) http://amzn.to/Q1BjvA Pew Internet & American Life Project http://www.pewinternet.org/ Think With Google http://www.thinkwithgoogle.com/ Rosenfeld Media http://rosenfeldmedia.com/uxzeitgeist/ UX Magazine http://uxmag.com/
  49. 49. What opportunities doyou see in the disruption?
  50. 50. THANK YOU SND Oct 12, 2012 @marisagallagher

×