SlideShare a Scribd company logo
Mobile User Experience
       Principles

            Mark Lieberwitz
 Mobile Product Manager at Tagged, Inc.
1024 x 768




             320 x 480
Where are we using?




      Anywhere & Everywhere

84% at home
80% misc. times
74% waiting in lines   Mobile is Personal
64% at work
Mobile UX Tips & Tricks

It’s about trade-offs…
• Focus on speed
• Reduce the amount of content
• Simple & focused UX / UI
• Minimize text entry
• The fat finger use case
• Create an experience (make navigation easy)
Responsive Web Design
Progressive Enhancement
Rather than hoping for graceful
degradation, progressive enhancement builds
documents for the least capable or differently
capable devices first, then moves on to enhance
those documents with separate logic for
presentation, in ways that don’t place an undue
burden on baseline devices but which allow a
richer experience for those users with modern
graphical browser software.

                     - Nick Finck & Steven Champeon
                               coined the term in 2003
Mobile First

If you design mobile first, you create agreement on
what matters most. You can then apply the same
rationale to the desktop/laptop version of the
website. We agreed that these were the most
important features and content for our customers
and business – why should that change with more
screen space?

                                   - Luke Wroblewski
Tagged Mobile UX & Design

More Related Content

Similar to Tagged Mobile UX & Design

Web UI Design Patterns 2014
Web UI Design Patterns 2014Web UI Design Patterns 2014
Web UI Design Patterns 2014
Lewis Lin 🦊
 
Tincan - Mobile Elephant
Tincan - Mobile ElephantTincan - Mobile Elephant
Tincan - Mobile Elephant
Ben Holliday
 
Responsive Design and Joomla!
Responsive Design and Joomla!Responsive Design and Joomla!
Responsive Design and Joomla!
JoomlaChicago - Loop
 
Uxpin web ui design patterns 2014
Uxpin web ui design patterns 2014Uxpin web ui design patterns 2014
Uxpin web ui design patterns 2014
MoodLabs
 
Responsive Design for Landing Pages
Responsive Design for Landing PagesResponsive Design for Landing Pages
Responsive Design for Landing Pages
Evgeny Tsarkov
 
How To Design Mobile Content For Multiple Devices
How To Design Mobile Content For Multiple DevicesHow To Design Mobile Content For Multiple Devices
How To Design Mobile Content For Multiple Devices
Entirenet
 
Bank Chris - Web UI Design Patterns - 2014
Bank Chris - Web UI Design Patterns - 2014Bank Chris - Web UI Design Patterns - 2014
Bank Chris - Web UI Design Patterns - 2014
Shah Muhammad Baig
 
It's All About Context
It's All About ContextIt's All About Context
It's All About Context
Kevin Suttle
 
Responsive & Adaprove Design
Responsive & Adaprove DesignResponsive & Adaprove Design
Responsive & Adaprove Design
Mike Vdovin
 
Floyd brad mobile_presentation
Floyd brad mobile_presentationFloyd brad mobile_presentation
Floyd brad mobile_presentationbrfloyd
 
Future-Proofing the Web: Choosing the Optimal Mobile Design Strategy
Future-Proofing the Web: Choosing the Optimal Mobile Design StrategyFuture-Proofing the Web: Choosing the Optimal Mobile Design Strategy
Future-Proofing the Web: Choosing the Optimal Mobile Design Strategy
Huge
 
Seminar: Putting Mobile First
Seminar: Putting Mobile FirstSeminar: Putting Mobile First
Seminar: Putting Mobile First
Precedent
 
Putting Mobile First
Putting Mobile FirstPutting Mobile First
Putting Mobile First
Precedent
 
Keeping your touch screen kiosk content creation business future
Keeping your touch screen kiosk content creation business futureKeeping your touch screen kiosk content creation business future
Keeping your touch screen kiosk content creation business future
Intuiface
 
2013 ion responsive_design_landingpages
2013 ion responsive_design_landingpages2013 ion responsive_design_landingpages
2013 ion responsive_design_landingpagesChafik YAHOU
 
What is Mobile First Design Strategy.pdf
What is Mobile First Design Strategy.pdfWhat is Mobile First Design Strategy.pdf
What is Mobile First Design Strategy.pdf
Integrated IT Solutions
 
UX Design by Havas' 18 with UCLA
UX Design by Havas' 18 with UCLAUX Design by Havas' 18 with UCLA
UX Design by Havas' 18 with UCLA
18Hubs
 
Adaptive: Content, Context, and Controversy
Adaptive: Content, Context, and ControversyAdaptive: Content, Context, and Controversy
Adaptive: Content, Context, and Controversy
Karen McGrane
 
QuickSoft Mobile Tips & Tricks 11-03-10
QuickSoft Mobile Tips & Tricks 11-03-10QuickSoft Mobile Tips & Tricks 11-03-10
QuickSoft Mobile Tips & Tricks 11-03-10
Almog Koren
 
Mobile First by Sparks Grove
Mobile First by Sparks GroveMobile First by Sparks Grove
Mobile First by Sparks Grove
Brooke Novak
 

Similar to Tagged Mobile UX & Design (20)

Web UI Design Patterns 2014
Web UI Design Patterns 2014Web UI Design Patterns 2014
Web UI Design Patterns 2014
 
Tincan - Mobile Elephant
Tincan - Mobile ElephantTincan - Mobile Elephant
Tincan - Mobile Elephant
 
Responsive Design and Joomla!
Responsive Design and Joomla!Responsive Design and Joomla!
Responsive Design and Joomla!
 
Uxpin web ui design patterns 2014
Uxpin web ui design patterns 2014Uxpin web ui design patterns 2014
Uxpin web ui design patterns 2014
 
Responsive Design for Landing Pages
Responsive Design for Landing PagesResponsive Design for Landing Pages
Responsive Design for Landing Pages
 
How To Design Mobile Content For Multiple Devices
How To Design Mobile Content For Multiple DevicesHow To Design Mobile Content For Multiple Devices
How To Design Mobile Content For Multiple Devices
 
Bank Chris - Web UI Design Patterns - 2014
Bank Chris - Web UI Design Patterns - 2014Bank Chris - Web UI Design Patterns - 2014
Bank Chris - Web UI Design Patterns - 2014
 
It's All About Context
It's All About ContextIt's All About Context
It's All About Context
 
Responsive & Adaprove Design
Responsive & Adaprove DesignResponsive & Adaprove Design
Responsive & Adaprove Design
 
Floyd brad mobile_presentation
Floyd brad mobile_presentationFloyd brad mobile_presentation
Floyd brad mobile_presentation
 
Future-Proofing the Web: Choosing the Optimal Mobile Design Strategy
Future-Proofing the Web: Choosing the Optimal Mobile Design StrategyFuture-Proofing the Web: Choosing the Optimal Mobile Design Strategy
Future-Proofing the Web: Choosing the Optimal Mobile Design Strategy
 
Seminar: Putting Mobile First
Seminar: Putting Mobile FirstSeminar: Putting Mobile First
Seminar: Putting Mobile First
 
Putting Mobile First
Putting Mobile FirstPutting Mobile First
Putting Mobile First
 
Keeping your touch screen kiosk content creation business future
Keeping your touch screen kiosk content creation business futureKeeping your touch screen kiosk content creation business future
Keeping your touch screen kiosk content creation business future
 
2013 ion responsive_design_landingpages
2013 ion responsive_design_landingpages2013 ion responsive_design_landingpages
2013 ion responsive_design_landingpages
 
What is Mobile First Design Strategy.pdf
What is Mobile First Design Strategy.pdfWhat is Mobile First Design Strategy.pdf
What is Mobile First Design Strategy.pdf
 
UX Design by Havas' 18 with UCLA
UX Design by Havas' 18 with UCLAUX Design by Havas' 18 with UCLA
UX Design by Havas' 18 with UCLA
 
Adaptive: Content, Context, and Controversy
Adaptive: Content, Context, and ControversyAdaptive: Content, Context, and Controversy
Adaptive: Content, Context, and Controversy
 
QuickSoft Mobile Tips & Tricks 11-03-10
QuickSoft Mobile Tips & Tricks 11-03-10QuickSoft Mobile Tips & Tricks 11-03-10
QuickSoft Mobile Tips & Tricks 11-03-10
 
Mobile First by Sparks Grove
Mobile First by Sparks GroveMobile First by Sparks Grove
Mobile First by Sparks Grove
 

Recently uploaded

Assuring Contact Center Experiences for Your Customers With ThousandEyes
Assuring Contact Center Experiences for Your Customers With ThousandEyesAssuring Contact Center Experiences for Your Customers With ThousandEyes
Assuring Contact Center Experiences for Your Customers With ThousandEyes
ThousandEyes
 
A tale of scale & speed: How the US Navy is enabling software delivery from l...
A tale of scale & speed: How the US Navy is enabling software delivery from l...A tale of scale & speed: How the US Navy is enabling software delivery from l...
A tale of scale & speed: How the US Navy is enabling software delivery from l...
sonjaschweigert1
 
Epistemic Interaction - tuning interfaces to provide information for AI support
Epistemic Interaction - tuning interfaces to provide information for AI supportEpistemic Interaction - tuning interfaces to provide information for AI support
Epistemic Interaction - tuning interfaces to provide information for AI support
Alan Dix
 
The Art of the Pitch: WordPress Relationships and Sales
The Art of the Pitch: WordPress Relationships and SalesThe Art of the Pitch: WordPress Relationships and Sales
The Art of the Pitch: WordPress Relationships and Sales
Laura Byrne
 
Dev Dives: Train smarter, not harder – active learning and UiPath LLMs for do...
Dev Dives: Train smarter, not harder – active learning and UiPath LLMs for do...Dev Dives: Train smarter, not harder – active learning and UiPath LLMs for do...
Dev Dives: Train smarter, not harder – active learning and UiPath LLMs for do...
UiPathCommunity
 
Builder.ai Founder Sachin Dev Duggal's Strategic Approach to Create an Innova...
Builder.ai Founder Sachin Dev Duggal's Strategic Approach to Create an Innova...Builder.ai Founder Sachin Dev Duggal's Strategic Approach to Create an Innova...
Builder.ai Founder Sachin Dev Duggal's Strategic Approach to Create an Innova...
Ramesh Iyer
 
Welocme to ViralQR, your best QR code generator.
Welocme to ViralQR, your best QR code generator.Welocme to ViralQR, your best QR code generator.
Welocme to ViralQR, your best QR code generator.
ViralQR
 
Elevating Tactical DDD Patterns Through Object Calisthenics
Elevating Tactical DDD Patterns Through Object CalisthenicsElevating Tactical DDD Patterns Through Object Calisthenics
Elevating Tactical DDD Patterns Through Object Calisthenics
Dorra BARTAGUIZ
 
Secstrike : Reverse Engineering & Pwnable tools for CTF.pptx
Secstrike : Reverse Engineering & Pwnable tools for CTF.pptxSecstrike : Reverse Engineering & Pwnable tools for CTF.pptx
Secstrike : Reverse Engineering & Pwnable tools for CTF.pptx
nkrafacyberclub
 
Encryption in Microsoft 365 - ExpertsLive Netherlands 2024
Encryption in Microsoft 365 - ExpertsLive Netherlands 2024Encryption in Microsoft 365 - ExpertsLive Netherlands 2024
Encryption in Microsoft 365 - ExpertsLive Netherlands 2024
Albert Hoitingh
 
SAP Sapphire 2024 - ASUG301 building better apps with SAP Fiori.pdf
SAP Sapphire 2024 - ASUG301 building better apps with SAP Fiori.pdfSAP Sapphire 2024 - ASUG301 building better apps with SAP Fiori.pdf
SAP Sapphire 2024 - ASUG301 building better apps with SAP Fiori.pdf
Peter Spielvogel
 
Observability Concepts EVERY Developer Should Know -- DeveloperWeek Europe.pdf
Observability Concepts EVERY Developer Should Know -- DeveloperWeek Europe.pdfObservability Concepts EVERY Developer Should Know -- DeveloperWeek Europe.pdf
Observability Concepts EVERY Developer Should Know -- DeveloperWeek Europe.pdf
Paige Cruz
 
Assure Contact Center Experiences for Your Customers With ThousandEyes
Assure Contact Center Experiences for Your Customers With ThousandEyesAssure Contact Center Experiences for Your Customers With ThousandEyes
Assure Contact Center Experiences for Your Customers With ThousandEyes
ThousandEyes
 
Introduction to CHERI technology - Cybersecurity
Introduction to CHERI technology - CybersecurityIntroduction to CHERI technology - Cybersecurity
Introduction to CHERI technology - Cybersecurity
mikeeftimakis1
 
FIDO Alliance Osaka Seminar: Overview.pdf
FIDO Alliance Osaka Seminar: Overview.pdfFIDO Alliance Osaka Seminar: Overview.pdf
FIDO Alliance Osaka Seminar: Overview.pdf
FIDO Alliance
 
Securing your Kubernetes cluster_ a step-by-step guide to success !
Securing your Kubernetes cluster_ a step-by-step guide to success !Securing your Kubernetes cluster_ a step-by-step guide to success !
Securing your Kubernetes cluster_ a step-by-step guide to success !
KatiaHIMEUR1
 
UiPath Test Automation using UiPath Test Suite series, part 4
UiPath Test Automation using UiPath Test Suite series, part 4UiPath Test Automation using UiPath Test Suite series, part 4
UiPath Test Automation using UiPath Test Suite series, part 4
DianaGray10
 
LF Energy Webinar: Electrical Grid Modelling and Simulation Through PowSyBl -...
LF Energy Webinar: Electrical Grid Modelling and Simulation Through PowSyBl -...LF Energy Webinar: Electrical Grid Modelling and Simulation Through PowSyBl -...
LF Energy Webinar: Electrical Grid Modelling and Simulation Through PowSyBl -...
DanBrown980551
 
UiPath Test Automation using UiPath Test Suite series, part 3
UiPath Test Automation using UiPath Test Suite series, part 3UiPath Test Automation using UiPath Test Suite series, part 3
UiPath Test Automation using UiPath Test Suite series, part 3
DianaGray10
 
How world-class product teams are winning in the AI era by CEO and Founder, P...
How world-class product teams are winning in the AI era by CEO and Founder, P...How world-class product teams are winning in the AI era by CEO and Founder, P...
How world-class product teams are winning in the AI era by CEO and Founder, P...
Product School
 

Recently uploaded (20)

Assuring Contact Center Experiences for Your Customers With ThousandEyes
Assuring Contact Center Experiences for Your Customers With ThousandEyesAssuring Contact Center Experiences for Your Customers With ThousandEyes
Assuring Contact Center Experiences for Your Customers With ThousandEyes
 
A tale of scale & speed: How the US Navy is enabling software delivery from l...
A tale of scale & speed: How the US Navy is enabling software delivery from l...A tale of scale & speed: How the US Navy is enabling software delivery from l...
A tale of scale & speed: How the US Navy is enabling software delivery from l...
 
Epistemic Interaction - tuning interfaces to provide information for AI support
Epistemic Interaction - tuning interfaces to provide information for AI supportEpistemic Interaction - tuning interfaces to provide information for AI support
Epistemic Interaction - tuning interfaces to provide information for AI support
 
The Art of the Pitch: WordPress Relationships and Sales
The Art of the Pitch: WordPress Relationships and SalesThe Art of the Pitch: WordPress Relationships and Sales
The Art of the Pitch: WordPress Relationships and Sales
 
Dev Dives: Train smarter, not harder – active learning and UiPath LLMs for do...
Dev Dives: Train smarter, not harder – active learning and UiPath LLMs for do...Dev Dives: Train smarter, not harder – active learning and UiPath LLMs for do...
Dev Dives: Train smarter, not harder – active learning and UiPath LLMs for do...
 
Builder.ai Founder Sachin Dev Duggal's Strategic Approach to Create an Innova...
Builder.ai Founder Sachin Dev Duggal's Strategic Approach to Create an Innova...Builder.ai Founder Sachin Dev Duggal's Strategic Approach to Create an Innova...
Builder.ai Founder Sachin Dev Duggal's Strategic Approach to Create an Innova...
 
Welocme to ViralQR, your best QR code generator.
Welocme to ViralQR, your best QR code generator.Welocme to ViralQR, your best QR code generator.
Welocme to ViralQR, your best QR code generator.
 
Elevating Tactical DDD Patterns Through Object Calisthenics
Elevating Tactical DDD Patterns Through Object CalisthenicsElevating Tactical DDD Patterns Through Object Calisthenics
Elevating Tactical DDD Patterns Through Object Calisthenics
 
Secstrike : Reverse Engineering & Pwnable tools for CTF.pptx
Secstrike : Reverse Engineering & Pwnable tools for CTF.pptxSecstrike : Reverse Engineering & Pwnable tools for CTF.pptx
Secstrike : Reverse Engineering & Pwnable tools for CTF.pptx
 
Encryption in Microsoft 365 - ExpertsLive Netherlands 2024
Encryption in Microsoft 365 - ExpertsLive Netherlands 2024Encryption in Microsoft 365 - ExpertsLive Netherlands 2024
Encryption in Microsoft 365 - ExpertsLive Netherlands 2024
 
SAP Sapphire 2024 - ASUG301 building better apps with SAP Fiori.pdf
SAP Sapphire 2024 - ASUG301 building better apps with SAP Fiori.pdfSAP Sapphire 2024 - ASUG301 building better apps with SAP Fiori.pdf
SAP Sapphire 2024 - ASUG301 building better apps with SAP Fiori.pdf
 
Observability Concepts EVERY Developer Should Know -- DeveloperWeek Europe.pdf
Observability Concepts EVERY Developer Should Know -- DeveloperWeek Europe.pdfObservability Concepts EVERY Developer Should Know -- DeveloperWeek Europe.pdf
Observability Concepts EVERY Developer Should Know -- DeveloperWeek Europe.pdf
 
Assure Contact Center Experiences for Your Customers With ThousandEyes
Assure Contact Center Experiences for Your Customers With ThousandEyesAssure Contact Center Experiences for Your Customers With ThousandEyes
Assure Contact Center Experiences for Your Customers With ThousandEyes
 
Introduction to CHERI technology - Cybersecurity
Introduction to CHERI technology - CybersecurityIntroduction to CHERI technology - Cybersecurity
Introduction to CHERI technology - Cybersecurity
 
FIDO Alliance Osaka Seminar: Overview.pdf
FIDO Alliance Osaka Seminar: Overview.pdfFIDO Alliance Osaka Seminar: Overview.pdf
FIDO Alliance Osaka Seminar: Overview.pdf
 
Securing your Kubernetes cluster_ a step-by-step guide to success !
Securing your Kubernetes cluster_ a step-by-step guide to success !Securing your Kubernetes cluster_ a step-by-step guide to success !
Securing your Kubernetes cluster_ a step-by-step guide to success !
 
UiPath Test Automation using UiPath Test Suite series, part 4
UiPath Test Automation using UiPath Test Suite series, part 4UiPath Test Automation using UiPath Test Suite series, part 4
UiPath Test Automation using UiPath Test Suite series, part 4
 
LF Energy Webinar: Electrical Grid Modelling and Simulation Through PowSyBl -...
LF Energy Webinar: Electrical Grid Modelling and Simulation Through PowSyBl -...LF Energy Webinar: Electrical Grid Modelling and Simulation Through PowSyBl -...
LF Energy Webinar: Electrical Grid Modelling and Simulation Through PowSyBl -...
 
UiPath Test Automation using UiPath Test Suite series, part 3
UiPath Test Automation using UiPath Test Suite series, part 3UiPath Test Automation using UiPath Test Suite series, part 3
UiPath Test Automation using UiPath Test Suite series, part 3
 
How world-class product teams are winning in the AI era by CEO and Founder, P...
How world-class product teams are winning in the AI era by CEO and Founder, P...How world-class product teams are winning in the AI era by CEO and Founder, P...
How world-class product teams are winning in the AI era by CEO and Founder, P...
 

Tagged Mobile UX & Design

  • 1. Mobile User Experience Principles Mark Lieberwitz Mobile Product Manager at Tagged, Inc.
  • 2.
  • 3. 1024 x 768 320 x 480
  • 4.
  • 5.
  • 6. Where are we using? Anywhere & Everywhere 84% at home 80% misc. times 74% waiting in lines Mobile is Personal 64% at work
  • 7. Mobile UX Tips & Tricks It’s about trade-offs… • Focus on speed • Reduce the amount of content • Simple & focused UX / UI • Minimize text entry • The fat finger use case • Create an experience (make navigation easy)
  • 8.
  • 9.
  • 10.
  • 12. Progressive Enhancement Rather than hoping for graceful degradation, progressive enhancement builds documents for the least capable or differently capable devices first, then moves on to enhance those documents with separate logic for presentation, in ways that don’t place an undue burden on baseline devices but which allow a richer experience for those users with modern graphical browser software. - Nick Finck & Steven Champeon coined the term in 2003
  • 13. Mobile First If you design mobile first, you create agreement on what matters most. You can then apply the same rationale to the desktop/laptop version of the website. We agreed that these were the most important features and content for our customers and business – why should that change with more screen space? - Luke Wroblewski

Editor's Notes

  1. For years the tech industry struggled for a standard size to design for and we finally settled here. Everyone is familiar with this, we all design in 960, yes? This was fine for a while, although it ignores most other screen resolutions and doesn’t represent the real world. Jeremy Keith calls this ‘the consensual hallucination’.Design is the art of applying constraints until an elegant solution is created. 80% of the screen we designed for is GONE. This creates FOCUS.So let’s talk about focus and User Experience….
  2. SW is focused on what customers want.Has anyone studied visual perception? Has anyone heard of change blindness?When two things are similar and only 1 or 2 things change people can’t tell the difference. So be aware of that concept when I make this transition, cause you might not see the difference. Let me do that again….
  3. What’s on here?How does the airline make money? They sell reservations.Customers want to buy that stuff, they want to check their flight and manage their rewards….that’s it!Business goals + user needs – nothing else. There is no room, they had to get rid of all the crap and focus on what customers want, what the business is for. This is not, every single marketing initiative…it’s what is NEEDED.Know your audience: what are they doing and why? What is important….make it EASY.This deisng isn’t exactly viasually appealing, but it gets the job done and it has focus. So what else do we need to be aware of in designing for mobile?
  4. Home – In between cooking dinner or watching TVPeople use these devices anywhere and everywhere.-Very distinct factor of mobile. When’s the last time you saw someone in line with their laptop? New Usage begets new UX.Because we can use anywhere, we have partial attention. You’re not sitting their for hours using these devices like a PC. It’s a one thumb one eyeball experience…focus on designing for a simple user experience. (think angry birds)This means we have to think about mobile design differently, there’s a short attention span for people using mobile. Think about going to see a movie you really were looking forward to on a huge IMAX screen and you’re sitting next to a guy with a really terrible laugh.Mobile is personal….you’ve got all these things that are specific to mobile. Device is ALWAYS with youSmall ScreenBattery is going to dieNetwork is inconsistentIncreasingly use fingersEnvironmental SensorsLocationDirectionAmbient Light SensorCan call / text everyone you knowThese things together make the device much more personal:It changes the equation when we design for stuff based on these agronomical factors.
  5. Mobile is about speed Things are generally slower on mobile. Give the user an indication something is happening…a spinning wheel, blinking ‘loading’ icon…this makes it feel like the app/site is faster than it actually is.Speed is one of the top concerns in mobile designTry to design for a slow-medium connection speed (strike a balance)Design for 3G, not necessarily WiFi connectivityCalls to the serverImage sizeReduce the amount of contentMobile web: Reduce number of new page loadsSimple & focused UX (KISS)Single column layouts tend to work wellMinimize text entryAuto-fill, dropdowns, pinwheels, lists, calendar picker, etc. – If you want the user to type something bring up the keyboard right away, don’t make them click for it.Copy Paste This is painful on mobile (describe experience), use a ‘mail-to’ instead and allow the user to use the mail client to post the link…this pops an overlay over the browser and is a great experience everyone is used too. This may be bad on the desktop, but it’s great on mobile.Quotes:Design is the method of putting form to content.- Paul Rand Design is the stuff around the end result.- Mark Boulton
  6. What we need to realize as designers is that we don’t have control. This is hard for designers…we LOVE control.But users can access our content in any amount of ways; RSS, Print, desktop, laptop, mobile devices, aggregate websites that use iframes, twitter, facebook, tablets, the list goes on and on…and we don’t always have control over how our content displays or is consumed. Once we admit this to ourselves it’s easy to see why responsive design offers a great answer to the question of How our content is consumed on the three major platforms. When talking about mobile many people use the term mobile web. But I ask you, is there such a thing as mobile web? Stephen Hay wrote an essay titled “There is no Mobile Web” in which he stated….Most sites on the web are not built with specific mobile use-cases in mind. However, millions of people access these sites every day through mobile devices. They access a “normal” (whatever that means) website through their “mobile” device.Stephen HayWhat makes a design responsive?Flexible GridsFlexible Images / MediaMedia Queries (CSS3) …but design isn’t just about layout.Design is the method of putting form to content.- Paul Rand Design is the stuff around the end result.- Mark Boulton
  7. This way of thinking has been around for some time, but we need to adapt it to today’s world. This means designing for the base use case and then adding to the experience as the device the user is accessing our content on becomes better enabled….we can then layer on more and better tools and experiences where they add value to the user. This way of thinking brings us to my last point….
  8. Luke has written a book called Mobile First and has also given numerous presentations which are available online. I highly recommend you read his book or look into these presentations as they can be eye-opening. Especially for friends of ours in the industry who still aren’t convinced that mobile is the future or don’t know how to react to the new paradigm we’re in.Mobile first allows us to design for the base use case and add more value to the user experience as we design upward for devices that are more enabled by screen size or JavaScript or CSS capabilities. It also allows us to design specific use cases for mobile and tablet devices which have capabilities that desktops simply don’t have. It’s a new, potentially scary, way of thinking (especially for a successful business that has been web driven from the outset). But we as an industry need to change with the times and design for how users want and need to interact with our content. That means changing the way we think and design to provide a better, broader and adaptable experience that responds to any use case users might have.So how do we tie this all together? …
  9. Any questions?