Ektron London Conference: Managing Responsive Projects

797 views

Published on

Ektron project managers Danny Freeman and Simon Asplin discuss how to create a successful responsive website on the Ektron 9 platform.

  • Be the first to comment

  • Be the first to like this

Ektron London Conference: Managing Responsive Projects

  1. 1. Danny Freeman & Simon Asplin Project Managers Managing Responsive Projects
  2. 2. Copyright © 2013 Ektron, Inc. Agenda • What is a Responsive Project? • Why go Responsive? • When to go Responsive? • Myths of Mobile Content • Project Phases
  3. 3. Copyright © 2013 Ektron, Inc. What is a Responsive Project? • Web pages that respond to screen widths • Delivers quality experience to desktop computers, laptops, tablets, mobile phones and now internet on your TV • Using new CSS techniques, fluid grids, flexible images and media queries
  4. 4. Copyright © 2013 Ektron, Inc. What is a Responsive Project?
  5. 5. Copyright © 2013 Ektron, Inc. Why go Responsive? • High level of continuity between different devices • Same URLs for every device • Not tied to specific devices • The proliferation of smart phones and tablets
  6. 6. Copyright © 2013 Ektron, Inc. PC vs Mobile Source: comScore (02/13)
  7. 7. Copyright © 2013 Ektron, Inc. Where are people using mobile devices? • 84% at home • 80% during miscellaneous downtime throughout the day • 76% while queuing / waiting for appointments • 69% while shopping • 64% at work • 62% while watching TV (alt. study claims 84%) • 47% during commute into work Luke Wroblewski. "Mobile Context Revisited." http://www.lukew.com/ff/entry.asp?1333
  8. 8. Copyright © 2013 Ektron, Inc. Why go Responsive?
  9. 9. Copyright © 2013 Ektron, Inc. When to go Responsive? • Difficult to retro-fit an existing design, may be best to start from scratch • Most appropriate when continuity between different devices is a priority for target audience • Responsive design does not constitute a mobile strategy
  10. 10. Copyright © 2013 Ektron, Inc. Myths of Mobile Content • Mobile users are always distracted, in a rush • Mobile users really only need location information. • Mobile users wouldn’t be interested in XYZ.
  11. 11. Copyright © 2013 Ektron, Inc. Project Phases • Research and Strategy • User Experience Planning • Design • Development
  12. 12. Copyright © 2013 Ektron, Inc. Project Phases - Waterfall
  13. 13. Copyright © 2013 Ektron, Inc. Project Phases – Agile
  14. 14. Copyright © 2013 Ektron, Inc. Research & Strategy • Focus Groups • Stakeholder Interviews • Audience Interviews • Site Audits • MoSCoW / Timeline workshops • Baseline Usability Tests
  15. 15. Copyright © 2013 Ektron, Inc. Things to consider • The device does not necessarily imply a context (stationary or mobile). • There is a misconception that mobile users want different things from your website than desktop users do. • Responsive design offers a high level of continuity between different devices. • You only need to develop, manage and maintain one site and one content silo.
  16. 16. Copyright © 2013 Ektron, Inc.
  17. 17. Copyright © 2013 Ektron, Inc.
  18. 18. Copyright © 2013 Ektron, Inc.
  19. 19. Copyright © 2013 Ektron, Inc.
  20. 20. Copyright © 2013 Ektron, Inc.
  21. 21. Copyright © 2013 Ektron, Inc.
  22. 22. Copyright © 2013 Ektron, Inc. User Experience Planning • Small screen sizes forces you to prioritise. • Slow connections and limited data plans require you to be vigilant about performance. • Small touch targets lead to BIG problems
  23. 23. Copyright © 2013 Ektron, Inc. Design • Discuss and test the developers’ design recommendations. • Review, design, build and repeat. • This closes the gap between traditional “design” and “development” cycles.
  24. 24. Copyright © 2013 Ektron, Inc. Development • Developers act as UX designers. • Close the communication gap across the project team. • Communicate to stakeholders how the responsive design will work. • Design within the constraints of the real medium.
  25. 25. Copyright © 2013 Ektron, Inc. Testing… • Real or virtual devices? • What devices to support? • Tools & devices • Ektron V9 • Android emulator • iOS emulator • W3C MobileOK Checker
  26. 26. Copyright © 2013 Ektron, Inc. Testing… • Testing and test preparations • Orientation • Touch • Error reporting • Regressions • Budget – QA time should not be skimped on! • Collaborate with different teams and work together to meet compromises
  27. 27. Copyright © 2013 Ektron, Inc. Implications for the Project • Responsive design takes 20-30% longer than a desktop-only site • Reduces ongoing maintenance costs compared to a stand-alone mobile site • Major milestones are unchanged, but a few new minor milestones are added • Bulk of time increase will be in development and testing
  28. 28. Copyright © 2013 Ektron, Inc. Implications for the PM • Change makes people uncomfortable. • UX and Design teams may feel out of control. • Developers may feel overwhelmed by increased responsibilities. • Requires a high degree of trust. • The PMs role is to encourage, support, and promote conversation.
  29. 29. Danny Freeman & Simon Asplin Project Managers Questions

×