From the Archives: Notes from Future Insights Live 2013 – designing for uncertainty

These are my notes from a presentation at Future Insights Live, 2013. Still good stuff.
Designing for Uncertainty – Rethink your design for a million-device world

Hello.
I’m a web professional and I make

AWESOME
Uncertainty FTW

Design:
We have no idea how someone is going to view our design. None. think about that.
Even less is certain about users.
  • impossible to know how design will be consumed
  • what size screen, what kind of imput, what multitasking
  • desktop/laptop/tablet/eReader/phone/console/tv/car….
Mobile:
  • Increasingly, the first point of contact is from a mobile device
  • this skyrockets in time of crisis
  • people need/want information on the device at hand… the one IN their hand
  • sites serving resources appropriately will:
    • get information out faster
    • not crash

 

time to rethink our design thinking

We’re Not Designing Pages
+ We’re designing systems of relationships
& hierarchy to infer meaning &
importance
+ Good design has structure – but that
structure must be fluid
✤ 960 pixels is a copout. Our work will be
viewed on phones, tablets, tv’s more than
on computers

 

We’re Designing Meaning
+ Information & understanding
must hold true no matter how
it’s conveyed
+ How users understand &
learn is as crucial as how
they see
+ Start with semantics & adapt
your presentation:
Logo

<h1>

Nav
<p>

 

Psychology & Cognitive
Science are The New Black
+ In order to preserve meaning & reinforce
understanding, you must know how
learning works
+ Once you know how learning works, you
can tailor your system of design
+ That system of visual & information
hierarchy can then survive across
platforms & screen sizes

 

Task-Appropriate Design is the
OTHER New Black
+ A place for everything &
everything in its place
+ But the place might be
different on a phone…
or in a car

As may be the
importance of some
tasks versus others

 

Design by Sharpie
+ Sketch out your design with a
marker to sort out hierarchy
+ Try 3 or 4 sizes & adjust
relative scale
+ Don’t forget about BIG (#RWD
isn’t just for smartphones)
+ Now interaction: what’s natural
to the device & method of use

 

Research, Research, Research.
Repeat.
+ Responsive Design is new
+ UI patterns evolving, but
conventions are emerging
+ Native Apps work: think
about why. Decode your
favorites

It’s not the What but the
Why & How
+ Josh Clark: ‘I have some attention to spend’ –
but how are they spending it?
+ @LukeW: with one eye & one thumb
+ There is no mobile user – there are only
mobile devices
+ Tasks vary by circumstances of use (the Why)
+ How users accomplish those tasks varies by
device capability (hover, touch, swipe)

 

Users Are Looking For It
+ The web is growing up (slowly & quickly)
+ Users don’t just want to access – they
want to experience
+ Tools like Drupal & WordPress means the next
amazing site is one smart student intern away.
There’s no excuse for doing it badly
So what will make your site memorable?

Our Process is Begging For It
+ The Decline & Fall of the Photoshop Empire
+ Tiles not Comps
+ Prototype, not promises
+ Never, ever use Arial again
So why do we still think in pages?

The Web Has Left the Building
+ It’s in our pocket
+ It’s on the couch
+ It’s on our television
+ It’s in the dash
So why do we still think 960 matters?

 

Power to the People
+ and their Web clients
+ Since we don’t know what that client is,
the solution has to live there, not on the
server (for now)
+ A CMS can help us deliver
+ Doing so from scratch can be hard

So don’t do that.
+ Use conventions to build appropriately
+ Use a CMS to deliver one platform with
many experiences
+ Nothing we’ve discussed is impossible (or
in many cases even difficult)
+ It just takes… Thought

Why Harp on This?
+ Because designing a page in Photoshop
is simply fantasy
+ Worse: designing just a page is only
1/400th of the answer (or less)
+ Even prototyping in static HTML only tells
part of the story (though doing so
responsively is a start)


Be Prepared
+ You know design
+ You know your content (or you should)
+ You know the web & what can be done on it
+ Don’t stop looking, seeing & learning
+ Use a CMS to help
+ Design meaning not pages

 

+ Responsive Web Design
Ethan Marcotte, A Book Apart
+ Adaptive Web Design
Aaron Gustafson, Easy Readers
+ Mobile First
Luke Wroblewski, A Book Apart
+ Don’t Make Me Think
Steve Krug (really – you still have to read it)
+ The Design of Everyday Things
Don Norman (web usability learned from the design of doors)

Leave a Reply

Your email address will not be published. Required fields are marked *

*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>