Responsive Experience Design (RXD) Holistic approach to the web design Mike Donahue, UX Architect at Citrix UXDEV Summit Feb. 2016 @UXDevSummit #uxdevsummit @mdonahue37 #RXD #RXDBook
Welcome message from author
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
Transcript
Responsive Experience Design (RXD)Holistic approach to the web designMike Donahue, UX Architect at Citrix
UXDEV Summit Feb. 2016
@UXDevSummit #uxdevsummit @mdonahue37 #RXD #RXDBook
2011 Seattle, An Event Apart
Eric Meyers
2011 Seattle, An Event Apart
Kristina Havorson
Luke Wroblewski
Jeffrey Zeldman
JeremyKeith
Then…someone mentioned Responsive Web Design
(RWD)
Mind blown. World changed.
Responsive Web Design
Ethan Marcotte
This is responsive web design
GoalsInclusive (radically)AccessibleAppropriate
“An accessible web is a better web for
smartphones and other devices, showing how we
all benefit from the inclusive mindset.”Sir Tim Berners-Lee
GoalsInclusive (radically)AccessibleAppropriate
GoalsInclusive (radically)AccessibleAppropriate
Useful Desirable
Desirability is subjective
content
layout container
interface
widgets
Content outContent is why people are here.
The Mai Tai Diagram Credit: Nick Finck
layout container
interface
widgetsContent outWould you pay $8 for this?
Content informs design.
Page tables can help.
Spend most of your time here
“Design without content
is decoration.”Jeffery Zeldman
Mobile FirstDesign for the person before the device.
3C’s of Mobile First1. Context2. Constraints3. Capabilities
3C’s of Mobile First1. Context2. Constraints3. Capabilities
3C’s of Mobile First1. Context2. Constraints3. Capabilities
3C’s of Mobile First1. Context2. Constraints3. Capabilities
Mobile first leverages capabilities that empower users.
Progressive enhancementStart with something useful and usable, and make it desirable.
Progressive enhancement doesn’t mean design for the lowest common denominator. It means start there.
Jeremy Keith
Useful Desirable
Plan for failure – it will happen.
With JavaScript
Plan for failure – it will happen.
Without JavaScript
Plan for failure – it will happen.
Fail well.
Well this doesn’t seem
right.Our sight relies on JavaScript to
deliver the music you love. Please check that it’s enabled
in your browser and try reloading the page.
You will be judged by how you fail.with JavaScript without JavaScript
“If the content is critical, assume the enhancement
will fail.If it’s not, assume it will
work”Jared Smith, WebAIM
Progressive enhancement stack
No enhancement willovercome bad content.
“Empty your mind, be formless. Shapeless, like water. If you put water into a cup, it becomes the cup. You put water into a bottle and it becomes the bottle. You put it in a teapot, it becomes the teapot.
Now, water can flow or it can crash. Be water, my friend.“
Bruce Lee
Be adaptive when appropriateGoogle result on mobile Google result on desktop
Don’t build sites that just fill available screen space. Build experiences that fulfill human
needs.
UXDEV Summit 39% off discount: ctwuxdev
Responsive Experience Design (RXD)Holistic approach to the web designMike Donahue, UX Architect at Citrix
UXDEV Summit Feb. 2016
@UXDevSummit #uxdevsummit @mdonahue37 #RXD #RXDBook
Related Documents
