Exove Design - Mobile First and Drupal

2,867
-1

Published on

How to go mobile first with digital brands, responsive design, and Drupal. Presentation held in Drupalcamp Finland 2012.

Published in: Technology, Business
0 Comments
3 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
2,867
On Slideshare
0
From Embeds
0
Number of Embeds
4
Actions
Shares
0
Downloads
0
Comments
0
Likes
3
Embeds 0
No embeds

No notes for slide

Exove Design - Mobile First and Drupal

  1. 1. MOBILE FIRST WITH DIGITAL BRANDS, RESPONSIVE DESIGN AND DRUPAL Saku Sairanen CEO, EXOVE DESIGN
  2. 2. Exove is one of the leading Nordic andBaltic companies specialising in open source web services design and development.
  3. 3. 55 people Helsinki TallinnOver 120 customers overall
  4. 4. What to do? Why? Issues What is different?
  5. 5. What to do? Why? Issues What is different?
  6. 6. Why? Developers Designers Brand owners I’m a developer Why should I care?
  7. 7. Why? Developers Designers Brand owners The web is not just a desktop PC any more
  8. 8. Why? Developers Designers Brand owners It’s PCs, tablets, mobile phones, watches and more
  9. 9. Why? Developers Designers Brand owners Currently there are sites like m.site.com and site.mobi
  10. 10. Why? Developers Designers Brand owners But there’s only one web
  11. 11. Why? Developers Designers Brand owners Wouldn’t it be nice if it just worked on all devices?
  12. 12. Why? Developers Designers Brand owners Well, the web is not just a desktop PC any more
  13. 13. Why? Developers Designers Brand owners Growth
  14. 14. Why? Developers Designers Brand owners Every day 371,124 children are born across the World.
  15. 15. Why? Developers Designers Brand owners Every day 377,900 iPhones are sold across the World.
  16. 16. Why? Developers Designers Brand owners Every day 700,000 Android devices are activated across the World.
  17. 17. Why? Developers Designers Brand owners And there’s more
  18. 18. Why? Developers Designers Brand owners Nokia sold 200,000+ smartphones a day and RIM sold 143,000 Blackberries a day at the end of 2011
  19. 19. Why? Developers Designers Brand owners Total of smartphones entering the World per day is about 1.45M devices compared to 317,124 births - Luke Wroblewski
  20. 20. Why? Developers Designers Brand owners 46% of U.S. adults use smartphones as of February 2012. This means smartphone owners now outnumber those with basic mobile devices.
  21. 21. Why? Developers Designers Brand owners 50% of the Worlds second largest (Facebook) Web sites total audience (845 million) uses the service on mobile devices (425 million). More people access Facebook on the mobile web than from all their native mobile apps combined.
  22. 22. Why? Developers Designers Brand owners Growth = opportunity
  23. 23. What to do? Why? Issues What is different?
  24. 24. What to do? Why? Issues What is different?
  25. 25. What is different? Developers Designers Brand owners Adaptive layouts (responsive design)
  26. 26. What is different? Developers Designers Brand owners Proportional (percentages) instead of fixed (pixels)
  27. 27. What is different? Developers Designers Brand owners Media queries Flexible images Fluid grids
  28. 28. What is different? Developers Designers Brand owners Stacked CSS, mobile first global.css (default, mobile) tablet.css (min-width: 768px) desktop.css (min-width: 1024px)
  29. 29. What is different? Developers Designers Brand owners Responsive themes for Drupal
  30. 30. What is different? Developers Designers Brand owners Flexible device- independent solutions
  31. 31. What is different? Developers Designers Brand owners Multiple pixel perfect layouts?
  32. 32. What is different? Developers Designers Brand owners Content first Content choreography ‘Network of content’ Re-arranging content - Trent Walton
  33. 33. What is different? Developers Designers Brand owners Design for context User posture Input method Display size
  34. 34. What is different? Developers Designers Brand owners Reduce Reduce Reduce
  35. 35. What is different? Developers Designers Brand owners What is the minimum content required for this service? Mobile first
  36. 36. What is different? Developers Designers Brand owners User goals On - demanding – asap First to know Killing time Mobile management - access
  37. 37. What is different? Developers Designers Brand owners Define UI brand signatures which contribute to the brand identity
  38. 38. What is different? Developers Designers Brand owners Identify the core user stories which fulfill their goals
  39. 39. What to do? Why? Issues What is different?
  40. 40. What to do? Why? Issues What is different?
  41. 41. Issues Developers Designers Brand owners Max-width in IE6 Windows image reduction Bandwidth – download vs. display Browser compatibility Media queries Available Drupal themes not perfect
  42. 42. Issues Developers Designers Brand ownersSmall screen, badinput methods, lowbandwidth
  43. 43. Issues Developers Designers Brand ownersCamera, GPS, touch-screen, gyro, NFC etc.
  44. 44. Issues Developers Designers Brand ownersCapabilities =innovation
  45. 45. Issues Developers Designers Brand ownersRequires extra effortand experience
  46. 46. Issues Developers Designers Brand ownersWorkflowWay of thinkingNot pixel perfectSmall screen
  47. 47. Issues Developers Designers Brand ownersConstraints = focus
  48. 48. Issues Developers Designers Brand ownersThings to considerSeparate mobile siteResponsive siteNative application“Why mobile?”
  49. 49. What to do? Why? Issues What is different?
  50. 50. What to do? Why? Issues What is different?
  51. 51. What to do? Developers Designers Brand owners The only constant is change
  52. 52. What to do? Developers Designers Brand owners Difficult but necessary
  53. 53. What to do? Developers Designers Brand owners Dive in
  54. 54. What to do? Developers Designers Brand owners Not ‘future proof’ but ‘future friendly’ - Brad Frost
  55. 55. What to do? Developers Designers Brand owners Change your thinking
  56. 56. What to do? Developers Designers Brand owners Organize your content
  57. 57. What to do? Developers Designers Brand owners We need to make smarter content, not smarter containers - Stephanie Rieger
  58. 58. What to do? Developers Designers Brand owners Understand the available tools
  59. 59. What to do? Developers Designers Brand owners Help users to achieve their goals
  60. 60. What to do? Developers Designers Brand owners The web has moved beyond the desktop and it’s not turning back - Ethan Marcotte
  61. 61. Act now!
  62. 62. Q&A
  63. 63. Saku Sairanencall mobile+358 40 5926218send emailsaku@exovedesign.com Kiitos!

×