responsive design
responsivedesign
r!"p#$"%v!
&!"%'$respon
sivedesign�������
�����
RESPONSIVEDESIGN
ADAPTING TO YOUR USERSPresentation by: Vince Baskerville | VP of Product TripLingo
VINCENT BASKERVILLE | VP of PRODUCT
VINCENT BASKERVILLE | VP of PRODUCT
IHAZTHIS
VINCENT BASKERVILLE | VP of PRODUCT
VINCENT BASKERVILLE | VP of PRODUCT
PEOPLE USING *MOBILE WEB* WILL SURPASS DESKTOP USAGE BY 2015
VINCENT BASKERVILLE | VP of PRODUCT
BUT YOU KNOW THIS ALREADY RIGHT?
VINCENT BASKERVILLE | VP of PRODUCT
Q: HOW DO WE MAKE OUR WEBSITE EXPERIENCE BETTER?
A: WE MAKE IT RESPONSIVE
VINCENT BASKERVILLE | VP of PRODUCT
•Media Queries
•Adaptive grids, images & media
•???????
•Guaranteed ROI
VINCENT BASKERVILLE | VP of PRODUCT
VINCENT BASKERVILLE | VP of PRODUCT
VINCENT BASKERVILLE | VP of PRODUCT
VINCENT BASKERVILLE | VP of PRODUCT
“ When you start looking at a problem and it seems really simple with all these simple solutions, you don’t really understand the complexity of the problem. And your solutions are way too oversimplified, and they don’t work. ”
VINCENT BASKERVILLE | VP of PRODUCT
RWD isn’t the absolute answer to solve *all your
problems*
VINCENT BASKERVILLE | VP of PRODUCT
VINCENT BASKERVILLE | VP of PRODUCT
VINCENT BASKERVILLE | VP of PRODUCT
Throughout the design process, our work should be situated in the context
where it will be used
VINCENT BASKERVILLE | VP of PRODUCT
“THE PURPOSE BEHIND ‘RESPONSIVE DESIGN’—THE
CONCEPT OF WHAT IT STRIVES TO ACHIEVE—SHOULD BE SEPARATED FROM THE SPECIfiC TECHNIQUES
USED TO ACHIEVE IT.”
- JEFFREY ZELDMAN
VINCENT BASKERVILLE | VP of PRODUCT
VINCENT BASKERVILLE | VP of PRODUCT
2 types of users:
Internal & External
VINCENT BASKERVILLE | VP of PRODUCT
&'&(()"!'%#!&"
!"#$rpr$#%#!&"
VINCENT BASKERVILLE | VP of PRODUCT
“THE CHALLENGE IS GETTING PEOPLE TO ADAPT, AGREE TO
YOUR IDEA ACTUALLY MAKING IT THROUGH THE ORGANIZATION”
- SOMEONE
VINCENT BASKERVILLE | VP of PRODUCT
VINCENT BASKERVILLE | VP of PRODUCT
VINCENT BASKERVILLE | VP of PRODUCT
VINCENT BASKERVILLE | VP of PRODUCT
VINCENT BASKERVILLE | VP of PRODUCT
VINCENT BASKERVILLE | VP of PRODUCT
VINCENT BASKERVILLE | VP of PRODUCT
MOBILE CONTEXT
VINCENT BASKERVILLE | VP of PRODUCT
VINCENT BASKERVILLE | VP of PRODUCT
VINCENT BASKERVILLE | VP of PRODUCT
“THE CONSTRAINTS IN MOBILE DEVICES FORCE US TO FOCUS ON
WHAT REALLY MATTERS EMPHASIZE THE MOST VALUABLE PARTS [..] NOT JUST THE PARTS OF OUR OffERING
WE THINK ‘MAKE SENSE.”
- LUKE WROBLEWSKI
VINCENT BASKERVILLE | VP of PRODUCT
VINCENT BASKERVILLE | VP of PRODUCT
TEST, YOU MUST!
VINCENT BASKERVILLE | VP of PRODUCT
A/B testing?
VINCENT BASKERVILLE | VP of PRODUCT
Multivariate?
VINCENT BASKERVILLE | VP of PRODUCT
VINCENT BASKERVILLE | VP of PRODUCT
How do you measure KPI’s?
VINCENT BASKERVILLE | VP of PRODUCT
VINCENT BASKERVILLE | VP of PRODUCT
Home Page
VINCENT BASKERVILLE | VP of PRODUCT
VINCENT BASKERVILLE | VP of PRODUCT
Data wins arguments.
VINCENT BASKERVILLE | VP of PRODUCT
VINCENT BASKERVILLE | VP of PRODUCT
Heuristic Evaluations +Quantitative UX Data +
MEASURE & EVALUATE AGAINST KPI’S
VINCENT BASKERVILLE | VP of PRODUCT
ALIGN WITH STRATEGIC EDU GOALS
Create Case Studies +Survey key internal +
influencers
VINCENT BASKERVILLE | VP of PRODUCT
“Coding is long. Design is short. Paper is cheap.”
VINCENT BASKERVILLE | VP of PRODUCT
RESOURCES
VINCENT BASKERVILLE | VP of PRODUCT
http://www.alistapart.com
VINCENT BASKERVILLE | VP of PRODUCT
http://www.lukew.com
VINCENT BASKERVILLE | VP of PRODUCT
http://mediaqueri.es
VINCENT BASKERVILLE | VP of PRODUCT
http://mustache.github.com
VINCENT BASKERVILLE | VP of PRODUCT
AU REVOIRVINCE BASKERVILLE