A place to cache linked articles (think custom and personal wayback machine)
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

пре 4 година
12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455
  1. title: The challenge for web designers in 2015 (or how to cheat at the future)
  2. url: http://blog.memespring.co.uk/2015/01/17/the-challenge-for-web-designers-in-2015/
  3. hash_url: 3c8f845f0b869e33f338b19713331de2
  4. <p><small>This is a second attempt at articulating this issue, and was inspired by a conversation with <a href="http://blog.whatfettle.com/">@psd</a> who also pointed me at a TEDx talk entitled <a href="https://www.youtube.com/watch?v=jb09RYnSNOw">A time traveller's primer</a>. The first attempt is <a href="http://blog.memespring.co.uk/2014/12/24/mobile-first-demo-build-design/">here</a>.</small> </p>
  5. <hr/>
  6. <p>It took 4 or 5 years of ajax / XMLHTTP being a thing for it to change almost everything about the sort of things that were built on the web.</p>
  7. <p>That was 4 or 5 years when lots of amazing things didn't get built, not because it wasn't possible, but because people just, didn't. There were probably lots of transient reasons - browser support, users might not understand it yet, hard justifying it to co-workers, lack of examples - but fundamentally, there was lots of potential that was not realised until later in time. When that potentual <em>was</em> finally realised everything that went before suddenly felt dated.</p>
  8. <p>This is faster than the 700 year example of pasteurisation that Ryan North gives in his TEDx talk <a href="https://www.youtube.com/watch?v=jb09RYnSNOw">A Time Traveller's Primer</a> (and yes, ajax is significantly less significant than pasteurisation) but the principle is the same: </p>
  9. <p><strong>If you want to design for the future, look for unrealised but present potential, look for what people could be making right now but are not. Design what is lacking.</strong></p>
  10. <p>The web is going though an Ajax moment right now, and it is happening (or rather has the potentual to) for 2 reasons:</p>
  11. <p>1) The things browsers can do</p>
  12. <p>The web browser on your phone has access to sensors, outputs and offline storage to make proper <a href="http://www.cennydd.com/blog/designing-with-context">contextual design</a> a reality. It can:</p>
  13. <p>Most of those won't work if you try them on a laptop browser, but they will on your phone or tablet if you use chrome or firefox. This is partly the point, the technology is here, but not in the tools that we use to design things for the web (laptop browsers), but is in the place where users are spending more time.</p>
  14. <p>Designing in a laptop web browser and testing with a mouse rather than fingers may come to look very out of date soon.</p>
  15. <p>2) Stable mobile design patterns</p>
  16. <p>The 7 years of the Apple App Store and the android equivalents have, in effect, been mass, micro funded experiments in UI design for small, touch sensitive devices with lots of sensors and outputs. They have generated winning patterns like:</p>
  17. <ul>
  18. <li>Checkboxes replaced by switches</li>
  19. <li>Check-ins</li>
  20. <li>Edit without save button</li>
  21. <li>Everything can be contextual, any bit of UI can disappear between pages</li>
  22. <li>Everything has it's own settings page</li>
  23. <li>Floating buttons</li>
  24. <li>Keeping primary navigation off canvas (hidden behind the page)</li>
  25. <li>Minimal or zero page header (the context an old school page header / nav gives seems less important when you are holding the app in your hand.)</li>
  26. <li>Multiple, focused apps for the same service</li>
  27. <li>Offline by default</li>
  28. <li>Overscroll to refresh</li>
  29. <li>Reserving dropdown menus for actions on the current context</li>
  30. <li>Search scoped to their current context (the app)</li>
  31. </ul>
  32. <p>These are patterns that people use day in day out on facebook, Gmail and WhatsApp. These are the new normal, what people expect.</p>
  33. <p>But with a few notable exceptions - eg the mobile versions of <a href="http://en.m.wikipedia.org">Wikipedia</a> and <a href="http://forecast.io">Forecast</a> - these are not patterns that are making their way on to the web.</p>
  34. <p>So, here is the challenge for anyone designing and building for the web in 2015. There are a set of technologies and design patterns that are here, right now, not experiments in an innovation lab, but things you can use to design better tools for people. Today. </p>
  35. <p>At some point in the next few years, some of these will become as widespread on the web as ajax and responsive design, so why wait 5 years? Design what is lacking.</p>