Designing for mobile

Понравилась презентация – покажи это...

Слайд 0

Designing for mobile A UX perspective for developers

Слайд 1

Oscar Gonzalez Duppy Oscar @duppy_ocio Duppy Oscar UX Architect at Accenture/Avanade UX / Front-end Consultant Exa UDEM (LTI) duppy@chic-chic.mx

Слайд 2

Overview Know your user Know your goals Evaluate the resources Get inspiration Design Test

Слайд 3

Know your user People have different needs, goals, preferences and devices

Слайд 4

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

Слайд 5

Choosing platforms iOS Android Windows 8 Blackberry Handhelds Example: Adoption of Windows Phone in Argentina Banorte

Слайд 6

Available Resources Accelerometer GPS Camera NFC Internet connection …

Слайд 7

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?

Слайд 8

Get inspired Getting ideas from others

Слайд 9

How to get inspired? Take a look to other’s work Look for patterns and conventions Sketch Ask for help Practice

Слайд 10

Guidelines & Resources Different platforms, different experiences

Слайд 11

iOS 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. Defer to content

Слайд 12

iOS Use of plenty negative space Let color simplify the UI Ensure legibility by using system fonts Embrace borderless buttons …. Provide clarity

Слайд 13

Android Delight me in surprising ways Real objects are more fun than buttons and menus Let me make it mine Get to know me Enchant me http://developer.android.com/design/get-started/principles.html

Слайд 14

Android 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 Simplify my life http://developer.android.com/design/get-started/principles.html

Слайд 15

Android Give me tricks that work everywhere It's not my fault Sprinkle encouragement Do the heavy lifting for me Make important things fast Make me amazing http://developer.android.com/design/get-started/principles.html

Слайд 16

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)

Слайд 17

Think around the box Guidelines ? Template

Слайд 18

Sketch first Draw, erase, redraw

Слайд 19

There are plenty of tools available

Слайд 20

Interactions & Gestures Build for the fingers Swipe Press Press & Hold Drag to refresh Pinch Tap ….

Слайд 21

Create engagement with interactions For example: Flipboard Jobr Tinder Paper Infinite scroll

Слайд 22

Building your idea Native / Responsive / Web app

Слайд 23

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

Слайд 24

Don’t forget middle tiers Web services are your friends

Слайд 25

Common mistakes Rollovers Big data loading Unreachable Buttons Tactile area Resolutions Missing guidelines Can’t be developed

Слайд 26

Testing & Prototyping You don’t need expensive tools for ptototyping: Paper Prototyping Power point (seriously) Axure Omnigraffle UXPIN

Слайд 27

Thank you