Going Mobile as a Community: A Case Study from Stanford

Presented at the 2013 Bay Area Drupal Camp Mobile Summit.

How does a small team support a large, diverse community with efficient, affordable website solutions? How do we enable a whole community to "go mobile?" In this case study, I share how Stanford Web Services has approached designing centralized tools and resources to help the Stanford community go mobile.

Transcript

1. GOING MOBILE AS A COMMUNITY A Case Study from Stanford OCTOBER 25, 2013 • BADCAMP Megan Erin Miller Web Designer, Stanford Web Services meganem@stanford.edu • @meganerinmiller
2. OUR CHALLENGE
3. The Stanford Community §  Thousands of websites §  Every level of experience §  Small units with no web person §  Large units with whole web teams OUR CHALLENGE
4. A challenging task §  How do you support a community this large? §  How do you provide efficient, affordable centralized website solutions? OUR CHALLENGE
5. §  Founded in 2011 §  Small centralized team §  We design and build Drupal websites §  We also maintain central web services OUR CHALLENGE Stanford Web Services http://webservices.stanford.edu
6. Make it easy to… §  make a website… §  make an accessible, secure, stable website §  make a more harmonious Stanford web presence §  go mobile responsive OUR CHALLENGE
7. Raising awareness of mobile §  Mobile Awareness Project §  jQuery Mobile templates §  Example sites as proof of concept OUR CHALLENGE
8. But how do we scale? §  Tools for the whole community §  A small team OUR CHALLENGE
9. OUR STRATEGY
10. Solve for the 80% §  Solutions that meet most common needs §  Actively engage with community and listen OUR STRATEGY
11. Design for beginners §  Beginner site builders §  Empowering through self-service OUR STRATEGY
12. Ease the barrier to entry §  Simpler user experience §  Enable fast site creation §  Hide but don’t disable advanced functionality OUR STRATEGY
13. Reusable solutions §  Reusable tools §  For self-service and complex development OUR STRATEGY
14. Standards allow for better support §  Standardized platform & environment §  Curated modules and themes §  Better central documentation OUR STRATEGY
15. OUR SOLUTION
16. Stanford Sites http://sites.stanford.edu §  Drupal hosting platform §  Curated modules §  Centralized themes §  Supported environment §  Easy site request process OUR SOLUTION
17. Centralized Themes http://drupalthemes.stanford.edu §  Open Framework base theme §  Subthemes with branding OUR SOLUTION
18. Themes Strategy §  Always consider the site builder §  Community feedback and contribution OUR SOLUTION
19. Going responsive §  Sophisticated responsive regions (following a set responsive pattern) §  Standardized responsive menu OUR SOLUTION
20. Responsive regions §  Blocks & regions approach §  “Flow” and “Stacked” regions §  Utilize Block Class module OUR SOLUTION
21. OUR SOLUTION
22. OUR SOLUTION Flow regions
23. OUR SOLUTION Stacked regions
24. OUR SOLUTION Combination approach
25. OUR SOLUTION Our responsive regions meet 80% of layout needs
26. Responsive menu §  Standardized responsive behavior §  Keep it simple OUR SOLUTION
27. OUR SOLUTION Responsive menu
28. Examples §  Undergrad §  Department of English §  DoResearch §  Graduate School of Business OUR SOLUTION
29. OUR SOLUTION http://undergrad.stanford.edu
30. OUR SOLUTION http://english.stanford.edu
31. OUR SOLUTION http://doresearch.stanford.edu
32. OUR SOLUTION http://gsb.stanford.edu
33. IN CONCLUSION
34. Site builder as end user §  Always have implementation in mind §  Responsive is not just about theme, it’s how we build and how we create content §  Cleaner, more scalable solutions IN CONCLUSION
35. Standards let us scale §  Central platform & environment §  Central themes §  Central modules and features §  Standardized responsive patterns §  Central documentation & resources §  Fostering a community of practice IN CONCLUSION
36. Mobile is not just about themes and templates §  It’s about changing perceptions §  Educating a community §  Integrated solutions IN CONCLUSION
37. Stanford Sites (Drupal hosting) http://sites.stanford.edu Drupal Themes http://drupalthemes.stanford.edu Stanford Web Services Blog http://swsblog.stanford.edu IN CONCLUSION
38. THANK YOU! Megan Erin Miller Web Designer, Stanford Web Services meganem@stanford.edu • @meganerinmiller