SlideShare une entreprise Scribd logo
1  sur  28
Designing for mobile 
A UX perspective for developers
Oscar González 
Duppy Oscar 
- UX Architect at Accenture/Avanade 
- UX / Front-end Consultant 
- Exa UDEM (LTI) 
Duppy Oscar @duppy_ocio 
duppy@chic-chic.mx
Overview 
• Know your user 
• Know your goals 
• Evaluate the resources 
• Get inspiration 
• Design 
• Test
Know your user 
People have different needs, goals, preferences and devices
Needs & Goals 
- Is it for fun? Is it for business? 
- What is the user expected to do? 
- What is the app expected to do? 
- Why would this app be successful? 
It is useful to do Personas / Archetypes 
Business goals 
App goals 
User needs
Choosing platforms 
- iOS 
- Android 
- Windows 8 
- Blackberry 
- Handhelds 
Example: 
- Adoption of Windows Phone in Argentina 
- Banorte
Available Resources 
- Accelerometer 
- GPS 
- Camera 
- NFC 
- Internet connection 
…
App context 
How and where is our app is going 
to be used? 
- Portrait / Landscape 
- Lighting / Contrast 
- How is the device going to be held 
- Is people driving? Flying? Laying 
on bed? 
- Is people in an emergency? 
- Do we need voice commands?
Get inspired 
Getting ideas from others
How to get inspired? 
- Take a look to other ’s work 
- Look for patterns and 
conventions 
- Sketch 
- Ask for help 
- Practice
Guidelines & Resources 
Different platforms, different experiences
iOS 
Defer to content 
- Content is king 
- Take advantage of the whole 
screen 
- Reconsider visual indicators of 
physicality and realism. 
- Let translucent UI elements hint at 
the content behind them.
iOS 
Provide clarity 
- Use of plenty negative space 
- Let color simplify the UI 
- Ensure legibility by using system fonts 
- Embrace borderless buttons 
- ….
Android 
Enchant me 
- Delight me in surprising ways 
- Real objects are more fun than buttons 
and menus 
- Let me make it mine 
- Get to know me 
http://developer.android.com/design/get-started/ 
principles.html
Android 
Simplify my life 
- Keep it brief 
- Pictures are faster than words 
- Decide for me but let me have the final 
say 
- Only show what I need when I need it 
- I should always know where I am 
- Never lose my stuff 
- If it looks the same, it should act the 
same 
- Only interrupt me is its important 
http://developer.android.com/design/get-started/ 
principles.html
Android 
Make me amazing 
- Give me tricks that work 
everywhere 
- It's not my fault 
- Sprinkle encouragement 
- Do the heavy lifting for me 
- Make important things fast 
http://developer.android.com/design/get-started/ 
principles.html
Windows 8 
- Metro Modern Style 
- Pride in craftmanship 
- Do more with less: Content, not 
Chrome 
- Authentically digital 
- Win as One 
- Fast and fluid: be alive (motion)
Think around the box 
Guidelines ≠ Template
Sketch first 
Draw, erase, redraw
There are plenty of tools available
Interactions & Gestures 
Build for the fingers 
• Swipe 
• Press 
• Press & Hold 
• Drag to refresh 
• Pinch 
• Tap 
• ….
Create engagement with interactions 
For example: 
• Flipboard 
• Jobr 
• Tinder 
• Paper 
• Infinite scroll
Building your idea 
Native / Responsive / Web app
Which way to go? 
• Native 
• Responsive 
• Jquery mobile 
• Xamarin 
• Titanium 
• Phonegap 
• … 
Choose wisely: 
They all have pros and cons. 
Evaluate their strengths 
Evaluate time and effort 
User tolerance 
Performance
Don’t forget middle tiers 
Web services are your friends
Common mistakes 
• Rollovers 
• Big data loading 
• Unreachable Buttons 
• Tactile area 
• Resolutions 
• Missing guidelines 
• Can’t be developed
Testing & Prototyping 
You don’t need expensive tools for 
ptototyping: 
• Paper Prototyping 
• Power point (seriously) 
• Axure 
• Omnigraffle 
• UXPIN
Thank you

Contenu connexe

Tendances

UX Design for Mobile Apps
UX Design for Mobile AppsUX Design for Mobile Apps
UX Design for Mobile Apps
Kamil Zieba
 
UX / UI Mobile Trends
UX / UI Mobile TrendsUX / UI Mobile Trends
UX / UI Mobile Trends
Mark N Swaine
 

Tendances (20)

10 Design Trends 2015 - UX & UI Trends for Mobile Solutions
10 Design Trends 2015 - UX & UI Trends for Mobile Solutions10 Design Trends 2015 - UX & UI Trends for Mobile Solutions
10 Design Trends 2015 - UX & UI Trends for Mobile Solutions
 
The Future of UX: What designers need to know to stay ahead
The Future of UX: What designers need to know to stay aheadThe Future of UX: What designers need to know to stay ahead
The Future of UX: What designers need to know to stay ahead
 
UI Design, Trends, Patterns and User Experience - Academy of Design
UI Design, Trends, Patterns and User Experience - Academy of DesignUI Design, Trends, Patterns and User Experience - Academy of Design
UI Design, Trends, Patterns and User Experience - Academy of Design
 
UX & UI Design - Differentiate through design
UX & UI Design - Differentiate through designUX & UI Design - Differentiate through design
UX & UI Design - Differentiate through design
 
UX UI - Principles and Best Practices 2014-2015
UX UI - Principles and Best Practices 2014-2015UX UI - Principles and Best Practices 2014-2015
UX UI - Principles and Best Practices 2014-2015
 
An introduction to ergonomics for mobile UX (Ux in the City)
An introduction to ergonomics for mobile UX (Ux in the City)An introduction to ergonomics for mobile UX (Ux in the City)
An introduction to ergonomics for mobile UX (Ux in the City)
 
The Importance of UX
The Importance of UXThe Importance of UX
The Importance of UX
 
Some Dos and Don’ts in UI/UX Design of Mobile Applications
Some Dos and Don’ts in UI/UX Design of Mobile ApplicationsSome Dos and Don’ts in UI/UX Design of Mobile Applications
Some Dos and Don’ts in UI/UX Design of Mobile Applications
 
UX Design for Mobile Apps
UX Design for Mobile AppsUX Design for Mobile Apps
UX Design for Mobile Apps
 
Presenting Usable Research Results
Presenting Usable Research ResultsPresenting Usable Research Results
Presenting Usable Research Results
 
NoVA UX Responsive Design
NoVA UX Responsive DesignNoVA UX Responsive Design
NoVA UX Responsive Design
 
UX / UI Mobile Trends
UX / UI Mobile TrendsUX / UI Mobile Trends
UX / UI Mobile Trends
 
Android Material Design Quick Presentation
Android Material Design Quick PresentationAndroid Material Design Quick Presentation
Android Material Design Quick Presentation
 
Understanding UI/UX Design by Aroyewun Babajide
Understanding UI/UX Design by Aroyewun BabajideUnderstanding UI/UX Design by Aroyewun Babajide
Understanding UI/UX Design by Aroyewun Babajide
 
Characteristics of a well designed user interface
Characteristics of a well designed user interfaceCharacteristics of a well designed user interface
Characteristics of a well designed user interface
 
By the Book: Examining the Art of Building Great User Experiences in Software
By the Book: Examining the Art of Building Great User Experiences in SoftwareBy the Book: Examining the Art of Building Great User Experiences in Software
By the Book: Examining the Art of Building Great User Experiences in Software
 
The Value of User Experience (from Web 2.0 Expo Berlin 2008)
The Value of User Experience (from Web 2.0 Expo Berlin 2008)The Value of User Experience (from Web 2.0 Expo Berlin 2008)
The Value of User Experience (from Web 2.0 Expo Berlin 2008)
 
UX trends 2016
UX trends 2016UX trends 2016
UX trends 2016
 
UI-UX Practical Talking - Mohamed Shehata
UI-UX Practical Talking - Mohamed ShehataUI-UX Practical Talking - Mohamed Shehata
UI-UX Practical Talking - Mohamed Shehata
 
UX Masterclass at muru-D
UX Masterclass at muru-DUX Masterclass at muru-D
UX Masterclass at muru-D
 

En vedette

Ntt Data Advisory & Interactive 20120529
Ntt Data Advisory & Interactive 20120529Ntt Data Advisory & Interactive 20120529
Ntt Data Advisory & Interactive 20120529
Dana Helland
 
Mobile UX - Things to consider
Mobile UX - Things to considerMobile UX - Things to consider
Mobile UX - Things to consider
Richard Hewitt
 
Fragmentation in mobile design: fact or fiction
Fragmentation in mobile design: fact or fictionFragmentation in mobile design: fact or fiction
Fragmentation in mobile design: fact or fiction
Belen Barros Pena
 
On your mark, get set, mobile
On your mark, get set, mobileOn your mark, get set, mobile
On your mark, get set, mobile
Tiffany Beker
 
[refreshaustin] Adaptive Images in Responsive Web Design
[refreshaustin] Adaptive Images in Responsive Web Design[refreshaustin] Adaptive Images in Responsive Web Design
[refreshaustin] Adaptive Images in Responsive Web Design
Christopher Schmitt
 

En vedette (20)

Ntt Data Advisory & Interactive 20120529
Ntt Data Advisory & Interactive 20120529Ntt Data Advisory & Interactive 20120529
Ntt Data Advisory & Interactive 20120529
 
Our eternal digital afterlife — FrontTrends 2016
Our eternal digital afterlife — FrontTrends 2016Our eternal digital afterlife — FrontTrends 2016
Our eternal digital afterlife — FrontTrends 2016
 
Designing the mobile user experience
Designing the mobile user experienceDesigning the mobile user experience
Designing the mobile user experience
 
Product Development with Lean UX
Product Development with Lean UXProduct Development with Lean UX
Product Development with Lean UX
 
The 10 Golden Rules of Mobile UX
The 10 Golden Rules of Mobile UXThe 10 Golden Rules of Mobile UX
The 10 Golden Rules of Mobile UX
 
Mobile UX - Things to consider
Mobile UX - Things to considerMobile UX - Things to consider
Mobile UX - Things to consider
 
Prototyping for responsive web design
Prototyping for responsive web design Prototyping for responsive web design
Prototyping for responsive web design
 
RIP Steve Jobs
RIP Steve JobsRIP Steve Jobs
RIP Steve Jobs
 
Mobile Marketing for Nonprofits with Mobile Apps
Mobile Marketing for Nonprofits with Mobile AppsMobile Marketing for Nonprofits with Mobile Apps
Mobile Marketing for Nonprofits with Mobile Apps
 
Mobile forms - 10 DOs and DONTs
Mobile forms - 10 DOs and DONTsMobile forms - 10 DOs and DONTs
Mobile forms - 10 DOs and DONTs
 
Fragmentation in mobile design: fact or fiction
Fragmentation in mobile design: fact or fictionFragmentation in mobile design: fact or fiction
Fragmentation in mobile design: fact or fiction
 
Digital Liberation: The Future Auto Experience
Digital Liberation: The Future Auto ExperienceDigital Liberation: The Future Auto Experience
Digital Liberation: The Future Auto Experience
 
SEO for Mobile Apps
SEO for Mobile AppsSEO for Mobile Apps
SEO for Mobile Apps
 
Mobile Marketing: myths, truths and practice
Mobile Marketing: myths, truths and practiceMobile Marketing: myths, truths and practice
Mobile Marketing: myths, truths and practice
 
Create great UIs for budget phones
Create great UIs for budget phonesCreate great UIs for budget phones
Create great UIs for budget phones
 
You can't beat the experience November 2014
You can't beat the experience November 2014You can't beat the experience November 2014
You can't beat the experience November 2014
 
Spéciale Paiement La French Mobile Juin 2012
Spéciale Paiement La French Mobile Juin 2012Spéciale Paiement La French Mobile Juin 2012
Spéciale Paiement La French Mobile Juin 2012
 
On your mark, get set, mobile
On your mark, get set, mobileOn your mark, get set, mobile
On your mark, get set, mobile
 
[refreshaustin] Adaptive Images in Responsive Web Design
[refreshaustin] Adaptive Images in Responsive Web Design[refreshaustin] Adaptive Images in Responsive Web Design
[refreshaustin] Adaptive Images in Responsive Web Design
 
Tapit Cannes 2012 Presentation - Creating Magical Experieneces on Mobile Usin...
Tapit Cannes 2012 Presentation - Creating Magical Experieneces on Mobile Usin...Tapit Cannes 2012 Presentation - Creating Magical Experieneces on Mobile Usin...
Tapit Cannes 2012 Presentation - Creating Magical Experieneces on Mobile Usin...
 

Similaire à Designing for mobile. A UX perspective for developers

Multi Platform User Exerience
Multi Platform User ExerienceMulti Platform User Exerience
Multi Platform User Exerience
Tanya Zavialova
 
Ux ui presentation2
Ux ui presentation2Ux ui presentation2
Ux ui presentation2
GeneXus
 
Boris Chan - AndroidTO - Becoming Social by Default on Android
Boris Chan - AndroidTO - Becoming Social by Default on AndroidBoris Chan - AndroidTO - Becoming Social by Default on Android
Boris Chan - AndroidTO - Becoming Social by Default on Android
Boris Chan
 

Similaire à Designing for mobile. A UX perspective for developers (20)

Designing for Mobile
Designing for MobileDesigning for Mobile
Designing for Mobile
 
User Experience for Software Engineers
User Experience for Software EngineersUser Experience for Software Engineers
User Experience for Software Engineers
 
Design Workshop I @ Cornell Tech
Design Workshop I @ Cornell TechDesign Workshop I @ Cornell Tech
Design Workshop I @ Cornell Tech
 
Design process interaction design basics
Design process interaction design basicsDesign process interaction design basics
Design process interaction design basics
 
Implementing Modernization by Trevor Perry
Implementing Modernization by Trevor PerryImplementing Modernization by Trevor Perry
Implementing Modernization by Trevor Perry
 
ATDTK18 - design patterns for emergent learning technologies
ATDTK18 - design patterns for emergent learning technologiesATDTK18 - design patterns for emergent learning technologies
ATDTK18 - design patterns for emergent learning technologies
 
Improving your site's usability - what users really want
Improving your site's usability - what users really wantImproving your site's usability - what users really want
Improving your site's usability - what users really want
 
What is UX v1
What is UX v1What is UX v1
What is UX v1
 
UI For Alien Cowboys
UI For Alien CowboysUI For Alien Cowboys
UI For Alien Cowboys
 
The UX Toolbelt for Developers
The UX Toolbelt for DevelopersThe UX Toolbelt for Developers
The UX Toolbelt for Developers
 
Multi Platform User Exerience
Multi Platform User ExerienceMulti Platform User Exerience
Multi Platform User Exerience
 
User Experience Design: It's about people
User Experience Design: It's about peopleUser Experience Design: It's about people
User Experience Design: It's about people
 
Ux ui presentation2
Ux ui presentation2Ux ui presentation2
Ux ui presentation2
 
Mobile App vs Mobile Web Development
Mobile App vs Mobile Web DevelopmentMobile App vs Mobile Web Development
Mobile App vs Mobile Web Development
 
Intro to UX: Enterprise UX
Intro to UX: Enterprise UXIntro to UX: Enterprise UX
Intro to UX: Enterprise UX
 
Boris Chan - AndroidTO - Becoming Social by Default on Android
Boris Chan - AndroidTO - Becoming Social by Default on AndroidBoris Chan - AndroidTO - Becoming Social by Default on Android
Boris Chan - AndroidTO - Becoming Social by Default on Android
 
Interactive design basics
Interactive design basicsInteractive design basics
Interactive design basics
 
Human Factors and User Interface Design
Human Factors and User Interface DesignHuman Factors and User Interface Design
Human Factors and User Interface Design
 
UX psychology for software engineers
UX psychology for software engineersUX psychology for software engineers
UX psychology for software engineers
 
E3 chap-05
E3 chap-05E3 chap-05
E3 chap-05
 

Dernier

➥🔝 7737669865 🔝▻ dharamshala Call-girls in Women Seeking Men 🔝dharamshala🔝 ...
➥🔝 7737669865 🔝▻ dharamshala Call-girls in Women Seeking Men  🔝dharamshala🔝  ...➥🔝 7737669865 🔝▻ dharamshala Call-girls in Women Seeking Men  🔝dharamshala🔝  ...
➥🔝 7737669865 🔝▻ dharamshala Call-girls in Women Seeking Men 🔝dharamshala🔝 ...
amitlee9823
 
一比一定(购)卡尔顿大学毕业证(CU毕业证)成绩单学位证
一比一定(购)卡尔顿大学毕业证(CU毕业证)成绩单学位证一比一定(购)卡尔顿大学毕业证(CU毕业证)成绩单学位证
一比一定(购)卡尔顿大学毕业证(CU毕业证)成绩单学位证
wpkuukw
 
RT Nagar Call Girls Service: 🍓 7737669865 🍓 High Profile Model Escorts | Bang...
RT Nagar Call Girls Service: 🍓 7737669865 🍓 High Profile Model Escorts | Bang...RT Nagar Call Girls Service: 🍓 7737669865 🍓 High Profile Model Escorts | Bang...
RT Nagar Call Girls Service: 🍓 7737669865 🍓 High Profile Model Escorts | Bang...
amitlee9823
 
Call Girls In Jp Nagar ☎ 7737669865 🥵 Book Your One night Stand
Call Girls In Jp Nagar ☎ 7737669865 🥵 Book Your One night StandCall Girls In Jp Nagar ☎ 7737669865 🥵 Book Your One night Stand
Call Girls In Jp Nagar ☎ 7737669865 🥵 Book Your One night Stand
amitlee9823
 
Whitefield Call Girls Service: 🍓 7737669865 🍓 High Profile Model Escorts | Ba...
Whitefield Call Girls Service: 🍓 7737669865 🍓 High Profile Model Escorts | Ba...Whitefield Call Girls Service: 🍓 7737669865 🍓 High Profile Model Escorts | Ba...
Whitefield Call Girls Service: 🍓 7737669865 🍓 High Profile Model Escorts | Ba...
amitlee9823
 
Vip Mumbai Call Girls Bandra West Call On 9920725232 With Body to body massag...
Vip Mumbai Call Girls Bandra West Call On 9920725232 With Body to body massag...Vip Mumbai Call Girls Bandra West Call On 9920725232 With Body to body massag...
Vip Mumbai Call Girls Bandra West Call On 9920725232 With Body to body massag...
amitlee9823
 
How to Build a Simple Shopify Website
How to Build a Simple Shopify WebsiteHow to Build a Simple Shopify Website
How to Build a Simple Shopify Website
mark11275
 
Escorts Service Nagavara ☎ 7737669865☎ Book Your One night Stand (Bangalore)
Escorts Service Nagavara ☎ 7737669865☎ Book Your One night Stand (Bangalore)Escorts Service Nagavara ☎ 7737669865☎ Book Your One night Stand (Bangalore)
Escorts Service Nagavara ☎ 7737669865☎ Book Your One night Stand (Bangalore)
amitlee9823
 

Dernier (20)

call girls in Vasundhra (Ghaziabad) 🔝 >༒8448380779 🔝 genuine Escort Service 🔝...
call girls in Vasundhra (Ghaziabad) 🔝 >༒8448380779 🔝 genuine Escort Service 🔝...call girls in Vasundhra (Ghaziabad) 🔝 >༒8448380779 🔝 genuine Escort Service 🔝...
call girls in Vasundhra (Ghaziabad) 🔝 >༒8448380779 🔝 genuine Escort Service 🔝...
 
➥🔝 7737669865 🔝▻ dharamshala Call-girls in Women Seeking Men 🔝dharamshala🔝 ...
➥🔝 7737669865 🔝▻ dharamshala Call-girls in Women Seeking Men  🔝dharamshala🔝  ...➥🔝 7737669865 🔝▻ dharamshala Call-girls in Women Seeking Men  🔝dharamshala🔝  ...
➥🔝 7737669865 🔝▻ dharamshala Call-girls in Women Seeking Men 🔝dharamshala🔝 ...
 
Book Paid In Vashi In 8976425520 Navi Mumbai Call Girls
Book Paid In Vashi In 8976425520 Navi Mumbai Call GirlsBook Paid In Vashi In 8976425520 Navi Mumbai Call Girls
Book Paid In Vashi In 8976425520 Navi Mumbai Call Girls
 
UI:UX Design and Empowerment Strategies for Underprivileged Transgender Indiv...
UI:UX Design and Empowerment Strategies for Underprivileged Transgender Indiv...UI:UX Design and Empowerment Strategies for Underprivileged Transgender Indiv...
UI:UX Design and Empowerment Strategies for Underprivileged Transgender Indiv...
 
❤Personal Whatsapp Number 8617697112 Samba Call Girls 💦✅.
❤Personal Whatsapp Number 8617697112 Samba Call Girls 💦✅.❤Personal Whatsapp Number 8617697112 Samba Call Girls 💦✅.
❤Personal Whatsapp Number 8617697112 Samba Call Girls 💦✅.
 
一比一定(购)卡尔顿大学毕业证(CU毕业证)成绩单学位证
一比一定(购)卡尔顿大学毕业证(CU毕业证)成绩单学位证一比一定(购)卡尔顿大学毕业证(CU毕业证)成绩单学位证
一比一定(购)卡尔顿大学毕业证(CU毕业证)成绩单学位证
 
RT Nagar Call Girls Service: 🍓 7737669865 🍓 High Profile Model Escorts | Bang...
RT Nagar Call Girls Service: 🍓 7737669865 🍓 High Profile Model Escorts | Bang...RT Nagar Call Girls Service: 🍓 7737669865 🍓 High Profile Model Escorts | Bang...
RT Nagar Call Girls Service: 🍓 7737669865 🍓 High Profile Model Escorts | Bang...
 
8377087607, Door Step Call Girls In Kalkaji (Locanto) 24/7 Available
8377087607, Door Step Call Girls In Kalkaji (Locanto) 24/7 Available8377087607, Door Step Call Girls In Kalkaji (Locanto) 24/7 Available
8377087607, Door Step Call Girls In Kalkaji (Locanto) 24/7 Available
 
Top Rated Pune Call Girls Saswad ⟟ 6297143586 ⟟ Call Me For Genuine Sex Serv...
Top Rated  Pune Call Girls Saswad ⟟ 6297143586 ⟟ Call Me For Genuine Sex Serv...Top Rated  Pune Call Girls Saswad ⟟ 6297143586 ⟟ Call Me For Genuine Sex Serv...
Top Rated Pune Call Girls Saswad ⟟ 6297143586 ⟟ Call Me For Genuine Sex Serv...
 
Call Girls In Jp Nagar ☎ 7737669865 🥵 Book Your One night Stand
Call Girls In Jp Nagar ☎ 7737669865 🥵 Book Your One night StandCall Girls In Jp Nagar ☎ 7737669865 🥵 Book Your One night Stand
Call Girls In Jp Nagar ☎ 7737669865 🥵 Book Your One night Stand
 
Sector 104, Noida Call girls :8448380779 Model Escorts | 100% verified
Sector 104, Noida Call girls :8448380779 Model Escorts | 100% verifiedSector 104, Noida Call girls :8448380779 Model Escorts | 100% verified
Sector 104, Noida Call girls :8448380779 Model Escorts | 100% verified
 
Booking open Available Pune Call Girls Nanded City 6297143586 Call Hot India...
Booking open Available Pune Call Girls Nanded City  6297143586 Call Hot India...Booking open Available Pune Call Girls Nanded City  6297143586 Call Hot India...
Booking open Available Pune Call Girls Nanded City 6297143586 Call Hot India...
 
call girls in Vaishali (Ghaziabad) 🔝 >༒8448380779 🔝 genuine Escort Service 🔝✔️✔️
call girls in Vaishali (Ghaziabad) 🔝 >༒8448380779 🔝 genuine Escort Service 🔝✔️✔️call girls in Vaishali (Ghaziabad) 🔝 >༒8448380779 🔝 genuine Escort Service 🔝✔️✔️
call girls in Vaishali (Ghaziabad) 🔝 >༒8448380779 🔝 genuine Escort Service 🔝✔️✔️
 
Jordan_Amanda_DMBS202404_PB1_2024-04.pdf
Jordan_Amanda_DMBS202404_PB1_2024-04.pdfJordan_Amanda_DMBS202404_PB1_2024-04.pdf
Jordan_Amanda_DMBS202404_PB1_2024-04.pdf
 
Whitefield Call Girls Service: 🍓 7737669865 🍓 High Profile Model Escorts | Ba...
Whitefield Call Girls Service: 🍓 7737669865 🍓 High Profile Model Escorts | Ba...Whitefield Call Girls Service: 🍓 7737669865 🍓 High Profile Model Escorts | Ba...
Whitefield Call Girls Service: 🍓 7737669865 🍓 High Profile Model Escorts | Ba...
 
Vip Mumbai Call Girls Bandra West Call On 9920725232 With Body to body massag...
Vip Mumbai Call Girls Bandra West Call On 9920725232 With Body to body massag...Vip Mumbai Call Girls Bandra West Call On 9920725232 With Body to body massag...
Vip Mumbai Call Girls Bandra West Call On 9920725232 With Body to body massag...
 
call girls in Kaushambi (Ghaziabad) 🔝 >༒8448380779 🔝 genuine Escort Service 🔝...
call girls in Kaushambi (Ghaziabad) 🔝 >༒8448380779 🔝 genuine Escort Service 🔝...call girls in Kaushambi (Ghaziabad) 🔝 >༒8448380779 🔝 genuine Escort Service 🔝...
call girls in Kaushambi (Ghaziabad) 🔝 >༒8448380779 🔝 genuine Escort Service 🔝...
 
Pooja 9892124323, Call girls Services and Mumbai Escort Service Near Hotel Hy...
Pooja 9892124323, Call girls Services and Mumbai Escort Service Near Hotel Hy...Pooja 9892124323, Call girls Services and Mumbai Escort Service Near Hotel Hy...
Pooja 9892124323, Call girls Services and Mumbai Escort Service Near Hotel Hy...
 
How to Build a Simple Shopify Website
How to Build a Simple Shopify WebsiteHow to Build a Simple Shopify Website
How to Build a Simple Shopify Website
 
Escorts Service Nagavara ☎ 7737669865☎ Book Your One night Stand (Bangalore)
Escorts Service Nagavara ☎ 7737669865☎ Book Your One night Stand (Bangalore)Escorts Service Nagavara ☎ 7737669865☎ Book Your One night Stand (Bangalore)
Escorts Service Nagavara ☎ 7737669865☎ Book Your One night Stand (Bangalore)
 

Designing for mobile. A UX perspective for developers

  • 1. Designing for mobile A UX perspective for developers
  • 2. Oscar González Duppy Oscar - UX Architect at Accenture/Avanade - UX / Front-end Consultant - Exa UDEM (LTI) Duppy Oscar @duppy_ocio duppy@chic-chic.mx
  • 3. Overview • Know your user • Know your goals • Evaluate the resources • Get inspiration • Design • Test
  • 4. Know your user People have different needs, goals, preferences and devices
  • 5. Needs & Goals - Is it for fun? Is it for business? - What is the user expected to do? - What is the app expected to do? - Why would this app be successful? It is useful to do Personas / Archetypes Business goals App goals User needs
  • 6. Choosing platforms - iOS - Android - Windows 8 - Blackberry - Handhelds Example: - Adoption of Windows Phone in Argentina - Banorte
  • 7. Available Resources - Accelerometer - GPS - Camera - NFC - Internet connection …
  • 8. App context How and where is our app is going to be used? - Portrait / Landscape - Lighting / Contrast - How is the device going to be held - Is people driving? Flying? Laying on bed? - Is people in an emergency? - Do we need voice commands?
  • 9. Get inspired Getting ideas from others
  • 10. How to get inspired? - Take a look to other ’s work - Look for patterns and conventions - Sketch - Ask for help - Practice
  • 11. Guidelines & Resources Different platforms, different experiences
  • 12. iOS Defer to content - Content is king - Take advantage of the whole screen - Reconsider visual indicators of physicality and realism. - Let translucent UI elements hint at the content behind them.
  • 13. iOS Provide clarity - Use of plenty negative space - Let color simplify the UI - Ensure legibility by using system fonts - Embrace borderless buttons - ….
  • 14. Android Enchant me - Delight me in surprising ways - Real objects are more fun than buttons and menus - Let me make it mine - Get to know me http://developer.android.com/design/get-started/ principles.html
  • 15. Android Simplify my life - Keep it brief - Pictures are faster than words - Decide for me but let me have the final say - Only show what I need when I need it - I should always know where I am - Never lose my stuff - If it looks the same, it should act the same - Only interrupt me is its important http://developer.android.com/design/get-started/ principles.html
  • 16. Android Make me amazing - Give me tricks that work everywhere - It's not my fault - Sprinkle encouragement - Do the heavy lifting for me - Make important things fast http://developer.android.com/design/get-started/ principles.html
  • 17. Windows 8 - Metro Modern Style - Pride in craftmanship - Do more with less: Content, not Chrome - Authentically digital - Win as One - Fast and fluid: be alive (motion)
  • 18. Think around the box Guidelines ≠ Template
  • 19. Sketch first Draw, erase, redraw
  • 20. There are plenty of tools available
  • 21. Interactions & Gestures Build for the fingers • Swipe • Press • Press & Hold • Drag to refresh • Pinch • Tap • ….
  • 22. Create engagement with interactions For example: • Flipboard • Jobr • Tinder • Paper • Infinite scroll
  • 23. Building your idea Native / Responsive / Web app
  • 24. Which way to go? • Native • Responsive • Jquery mobile • Xamarin • Titanium • Phonegap • … Choose wisely: They all have pros and cons. Evaluate their strengths Evaluate time and effort User tolerance Performance
  • 25. Don’t forget middle tiers Web services are your friends
  • 26. Common mistakes • Rollovers • Big data loading • Unreachable Buttons • Tactile area • Resolutions • Missing guidelines • Can’t be developed
  • 27. Testing & Prototyping You don’t need expensive tools for ptototyping: • Paper Prototyping • Power point (seriously) • Axure • Omnigraffle • UXPIN