Live streaming: Designing For Multiple Devices - GA, New York, 14 March 2013
Upcoming SlideShare
Loading in...5
×
 

Live streaming: Designing For Multiple Devices - GA, New York, 14 March 2013

on

  • 1,463 views

Slides from my 1 hour live streaming class on March 14th at GA in New York ...

Slides from my 1 hour live streaming class on March 14th at GA in New York

ABSTRACT
The rise in mobiles and tablets have changed the way we consume and interact with content, but also the way we design and what we base our design approach on. This class will teach you about the shift in user expectations, behaviour- and consumption patterns and what that means for designing products that will be used on multiple devices. Coming out of it you'll be equipped with guiding principles and tools to tackle the multiple device jungle.

Statistics

Views

Total Views
1,463
Views on SlideShare
1,291
Embed Views
172

Actions

Likes
2
Downloads
14
Comments
0

3 Embeds 172

http://www.scoop.it 169
https://www.google.com.au 2
https://www.google.co.uk 1

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

Live streaming: Designing For Multiple Devices - GA, New York, 14 March 2013 Live streaming: Designing For Multiple Devices - GA, New York, 14 March 2013 Presentation Transcript

  • DESIGNING FOR MULTIPLE DEVICESLive streaming from New York, March14th 2013 Anna Dahlström co-founder byflock www.annadahlstrom.com annadahlstrom
  • I’m Anna IA & UX DESIGNER | SWEDISH BUT LONDON BASED FREELANCING + WORKING ON A STARTUP LOVES QUOTES & CHALLENGES This is Öresundsbron, the bridge between Sweden & Denmarkwww.flickr.com/photos/dahlstroms/4411448782/
  • AGENDA 1. DEVICE USAGE & PATTERNS 2. IMPLICATIONS FOR UX & DESIGN THINKING 3. BESPOKE MOBILE SITE vs. RESPONSIVE vs. AN APP 4. RESPONSIVE 5. APPS 6. PRACTICE 7. SUMMARY 8. Q & Awww.flickr.com/photos/horrigans/5649006182
  • 1. FIRST UP... DEVICE USAGE & PATTERNSwww.flickr.com/photos/publicenergy/1846375599
  • DEVICE: a thing defined for a specific purpose or task & which can connect to the internethttp://desktopwallpaper-s.com/19-Computers/-/Future/
  • THE FOCUS OF TODAY SMARTPHONES | DESKTOP ( TABLETS) - iOS & ANDROIDhttp://desktopwallpaper-s.com/19-Computers/-/Future/
  • In 2009 1% of global internet traffic camefrom mobiles. In 2010 the number was 4%.By the end of 2012 it had risen to13%.* * Source: www.forbes.com/sites/parmyolson/2012/12/04/5-eye-opening-stats-that-show-the-world-is-going-mobilewww.flickr.com/photos/nasamarshall/6289116940
  • The average person looks at their phone150 times a day.* * Source: www.textually.org/textually/archives/2012/02/030229.htmwww.flickr.com/photos/jorgeq82/4732700819
  • 40% of people use their phone in thebathroom* * Source: http://www.lukew.com/ff/entry.asp?1500www.flickr.com/photos/exlibris/2552107635
  • MOBILE DEVICES ARE USED ANYWHERE & EVERYWHERE ” The best computer is the one you have with you when you want something done. “ - JACOB NIELSENwww.flickr.com/photos/yahnyahn/2996454839
  • USAGE PATTERNS ACROSS DEVICES “...as devices become more mobile, it’s not only changing where we read, but when. ” - POCKET (formerly Read it Later)www.flickr.com/photos/brandoncwarren/4236278556
  • POCKET’S STATS - DESKTOP Source: http://readitlaterlist.com/blog/2011/01/is-mobile-affecting-when-we-readwww.flickr.com/photos/brandoncwarren/4236278556
  • POCKET’S STATS - iPHONE Source: http://readitlaterlist.com/blog/2011/01/is-mobile-affecting-when-we-readwww.flickr.com/photos/brandoncwarren/4236278556
  • POCKET’S STATS - iPAD Source: http://readitlaterlist.com/blog/2011/01/is-mobile-affecting-when-we-readwww.flickr.com/photos/brandoncwarren/4236278556
  • PEAK TIMES•When we get up•On our way to/ just arrived at work•Commuting home•Post dinnerSource: http://readitlaterlist.com/blog/2011/01/is-mobile-affecting-when-we-read
  • “MOBILE USERS ARE RUSHED & ON THE GO” THIS IS A MYTHwww.flickr.com/photos/theirmind/5001267661/
  • A LARGE PROPORTION OF USAGE HAPPENS WHEN WE HAVE TIME TO KILL COMMUTING, WAITING BUT ALSO AT HOMEhttp://www.flickr.com/photos/hanhutton/320464105/
  • THE SAME TASKS ARE CARRIED OUT ON SMARTPHONES AS ON DESKTOPS AS DEVICES & EXPERIENCE BECOME MORE OPTIMISED USAGE & TASK EXECUTION IS INCREASINGwww.flickr.com/photos/edduddiee/4307943164
  • Three purchases are made through eBay’s mobile applications every second.* Source: www.juniperresearch.com/reports/mobile_payments_for_digital_&_physical_goodswww.flickr.com/photos/stuckincustoms/440157748
  • 2. THIS HAS... IMPLICATIONS FOR UX & DESIGNhttp://www.flickr.com/photos/eyesore9/3206408088/
  • LIMITED DEVICE CAPABILITIES USED TO MEAN LIMITED TASKS E.G. FOCUS ON SEARCH | OPENING HOURS | REVIEWS | MENUwww.flickr.com/photos/frantaylor/4296536332
  • RESULTED IN MOBILE SPECIFIC WEBSITES LESS CONTENT & LINKS BACK TO THE FULL DESKTOP VERSION DESKTOP FULL WEBSITE BESPOKE CUT DOWN WEBSITE BESPOKE CUT DOWN WEBSITEhttp://desktopwallpaper-s.com/19-Computers/-/Future/
  • PEOPLE ARE CLICKING THE ‘FULL DESKTOP VERSION’ LINK THERE IS A REASON FOR THATwww.flickr.com/photos/demandaj/7287174776
  • AN EQUAL & CONTINUOS EXPERIENCE ACROSS DEVICES THIS EXPECTATION WILL ONLY GROW STRONGERwww.flickr.com/photos/joachim_s_mueller/7110473339
  • 3. A CLOSER LOOK AT... BESPOKE MOBILE SITES vs. RESPONSIVE SITES vs. APPShttp://www.flickr.com/photos/young_einstein/74097753/
  • There are 5 billion mobile phone users in theworld but just 1 billion smartphone users.** Source: www.forbes.com/sites/parmyolson/2012/12/04/5-eye-opening-stats-that-show-the-world-is-going-mobilewww.flickr.com/photos/91026431@N05/8497636527
  • PRIMARY REASONS FOR A BESPOKE MOBILE SITE • REQUIRED FOR THE AUDIENCE • TECHNICAL LIMITATIONS TO CMSwww.flickr.com/photos/st3f4n/3476036180
  • BEST AVOIDED IF WE CAN IT CAN CAUSE ALL SORTS OF PROBLEMShttp://www.flickr.com/photos/edenandjosh/2892956576/
  • BUT WHY? ” Todays popular devices are not tomorrows so building something which works on any device is better than building something which works on todays devices “ - COMBINED WISE WORDS FROM @ONEXTRAPIXEL & @TRENTWALTONwww.flickr.com/photos/lastquest/1472794031
  • 1057 different mobile devices accessedThe Guardian beta site yesterday (includingone person on a zune!)** Source: The Guardian
  • THE ALTERNATIVE IS MESSY & COSTLY MAINTAINING DIFFERENT VERSIONS USERS HAVING PROBLEMS FINDING WHAT THEY ARE AFTER (E.G. IN SEARCH)www.flickr.com/photos/ericconstantineau/5618576278
  • CORE CONTENT SHOULD REMAIN THE SAME BUT THE EXPERIENCE SHOULD BE OPTIMISED BOTH IN DISPLAY OF CONTENT, REGARDING USING DEVICE CAPABILITIES & FOR TOUCH INTERACTIONSwww.flickr.com/photos/jmtimages/2883279193
  • MOBILE PRESENCE vs. APP? USE ANALYTICS FOR GUIDANCE MOSTLY DIRECT TRAFFIC POSSIBLE ARGUMENT FOR APP MOSTLY VIA SHARED LINKS MOBILE WEB PRESENCE NEEDED. AN APP ALONE WON’T CUT IT A BIT OF BOTH THEN CONSIDER....www.flickr.com/photos/andwhynot/2946734025
  • WHETHER TO DO AN APP OR NOT COMES DOWN TO... • THE OBJECTIVE (USER & BUSINESS) • IF THERE ARE SPECIFIC DEVICE CAPABILITIES YOU WANT TO UTILISE • IF OFFLINE READING/USAGE IS REQUIRED • & OF COURSE BUDGETwww.flickr.com/photos/31878512@N06/4704140020
  • DIFFERENTTYPES OF APPSTHE MAIN TWO TYPESNATIVE APPS (e.g. Instagram)• MOST OPTIMISED USER EXPERIENCE• ACCESS TO DEVICE CAPABILITIES & APIs• BUT REQUIRES PLATFORM SPECIFIC CODE BASEHYBRID (e.g. first Facebook app)• USE OF HTML5 & JAVASRIPT• WRAPPER TO PROVIDE NATIVE CAPABILITIES• FEWER “VERSIONS” TO MAINTAIN• BUT CAN BE TIME CONSUMING TO CREATE APP LIKE INTERACTIONS• CANT JUST BE WRAPPED. MUST HAVE APP LIKE FUNCTIONALITIES
  • ” Money spent developing a pretty but limitediPhone app only benefits...the few, but moneyspent on the website UI would have benefittedeveryone “- Gary Marshall on ‘The app trap’ in .net Magaizinewww.flickr.com/photos/cristiano_betta/2909483129
  • 4. THERE IS SOMETHING CALLED... RESPONSIVE DESIGNwww.flickr.com/photos/taytom/5277657429
  • “ Design & development should respond to the user’s behaviour & environment based on screen size, platform & orientation. [It’s]...a mix of flexible grids & layouts, images & an intelligent use of media queries. ” - SMASHING MAGAZINEwww.flickr.com/photos/adactio/5818096043
  • THE SAME WEBSITE BEING DELIVERED TO ALL DEVICES BUT OPTIMISED FOR SCREEN SIZE, DEVICE & ORIENTATION DESKTOP FULL WEBSITE MOBILE FULL WEBSITE MOBILE SOON FULL WEBSITEhttp://desktopwallpaper-s.com/19-Computers/-/Future/
  • www.flickr.com/photos/fritzon/195008860 IN REALITY IT’S A BIT LIKE PLAYING REAL LIFE TETRIS BUT WITH PRE-DEFINED POCKETS FOR THE MODULES TO SLOT INTO
  • DEFINE YOUR GRID & BREAK POINTS • USE AS THE BASIS OF YOUR PAGE LAYOUTS • CHECKPOINT FOR MODULE SIZES & VARIANTS • FIXED OR FLUID COLUMNS • DEFINES HOW CONTENT WILL BEHAVE ACROSS DEVICEShttp://foundation.zurb.com/docs/layout.php
  • DEFINE YOUR CONTENTSTACKING STRATEGYACROSS DEVICES & ORIENTATION Mobile 1 2 Header“ Content needs to be Logo 3 Navchoreographed to Desktop & Tablet 4 Bath section intro 5 Adensure the intended 1 Logo 2 Headermessage is preserved 4 Bath section intro 5 Ad 6on any device and at Types of baths 3 Navany width ” 6 Types of baths 7 Related 7 products Related products- TRENT WALTON 8 Store locator 9 Tools 8 Store 9 Tools locator 10 10 Footer Footer
  • MOBILE VS. DESKTOP FIRST• START LARGE OR SMALL WHAT EVER WORKS BEST FOR YOU• ABOUT CONTENT, PRIORITISING & CONSIDERING HOW IT WILL WORK ACROSS DEVICESMOBILE VS. DESKTOP FIRST• START LARGE OR SMALL WHAT EVER WORKS BEST FOR YOU• ABOUT CONTENT, PRIORITISING & CONSIDERING HOW IT WILL WORK ACROSS DEVICES
  • THE WEB IS FULL OF EXAMPLES LOOK FOR INSPIRATION & BEST PRACTICE BUT DON’T BE AFRAID TO CHALLENGE OR COME UP WITH SOMETHING... BETTER.http://mediaqueri.es/popular/
  • CONSIDER YOUR NAVIGATION DIFFERENT WAYS OF OPTIMISING WITH DIFFERENT PROS & CONSwww.flickr.com/photos/tim_norris/2789759648
  • EXCELLENT READ‘RESPONSIVE NAVIGATION PATTERNS’by Brad Frost.*Source: http://bradfrostweb.com/blog/web/responsive-nav-patterns
  • www.flickr.com/photos/dopey/123646856
  • 5. WHAT ABOUT... DOING AN APP?http://www.flickr.com/photos/tomitapio/4053123799/in/photostream/
  • APPS ARE FOCUSED & PERSONAL ” Small, downloadable chunks of software, they give people access to information in a neatly packaged format “ - Apps on tap, The Economist Oct 8th 2011www.flickr.com/photos/elwillo/5247084642
  • EVERY PLATFORMIS ITS OWNLITTLEWORLDWITH THEIR OWN UIGUIDELINES THATUSERS ARE USED TOwww.flickr.com/photos/gadl/3570118243
  • NOT ASEASY AS JUSTANDROIDOR iOSFRAGMENTATION ACROSSDIFFERENT VERSIONS &BACKWARDSCOMPATIBILITY SHOULDBE CONSIDEREDwww.flickr.com/photos/nrkbeta/3906687294/in/photostream
  • RELATIVE NUMBER OFACTIVE ANDROID DEVICES Source: http://developer.android.com/about/dashboards/index.htmlwww.flickr.com/photos/blakespot/4773693893
  • EXAMPLE OF ADOPTIONOF NEW iOS VERSION Source: http://forums.macrumors.com/showthread.php?t=1347559&forceMobile=1www.flickr.com/photos/blakespot/4773693893
  • KEY DIFFERENCES BETWEENDESIGNING FOR ANDROID & iOSANDROID iOSFRAGMENTATION Design CONSISTENCYDIFFERENT FOR DIFFERENT VERSIONS & UI elements & CONSISTENCY BETWEENHANDSETS principles VERSIONS & HANDSETSSLOWER IMPLEMENTATION & UPTAKE Version adoption QUICK ADOPTION OF NEWOF NEWER VERSIONS VERSIONSHANDLED WITH EITHER SYSTEM BACK Back navigation BACK BUTTONBUTTON (EARLIER VERSIONS) OR BACK& UP BUTTONS (LATEST VERSION)OPTIONS MENU USED TO HOUSE APP SETTINGS BUTTON OR MORE TO Settings etc. ACCESS APP WIDE SETTINGS &WIDE SETTINGS & INFORMATION INFORMATIONwww.flickr.com/photos/nrkbeta/3906687294/in/photostream
  • iPHONERESOURCESHELP & INSPIRATIONWELL DOCUMENTED
  • ANDROIDRESOURCESHELP & INSPIRATION A LITTLELESS WELL DOCUMENTED FOREARLIER VERSIONS
  • iPhone 12:15 PM More BASIC iOS Customise APP NAME IMG Item NAVIGATION IMG Item IMG Item IMG Item CONSISTENT ACROSS IMG Item VERSIONS Content area IMG Item IMG Item NAVIGATION BAR IMG Item Enables navigation through the app IMG hierarchy. Holds the back button, Home Item Item Item More controls for managing screen content & the title of the screen. Home Item Item Item More BACK BUTTON Should always take the user one step back from where they came from & be descriptive. TAB BAR Can often be customised. Holds the main sections of the app. ‘MORE’ TAB BAR ITEM Used to hold & provide access to all other sections of the app that don’t fit in the tab bar.Source: http://developer.android.com/design/patterns/new-4-0.html
  • ANDROIDNAVIGATIONDIFFERENT BETWEENVERSIONS. IN ICE CREAMSANDWICH:NAVIGATION BARFor devices that dont have thehardware keys. Holds Back, Homeand RecentsACTION BARHolds the most important action buttons foryour app (3 + overflow menu)UP VS. BACK BUTTONThe Up button is used to navigate up one levelbased on the hierarchical structure of the site.Back is used to navigate back one step fromwhere you came from & as such works inreverse chronological order.Source: http://developer.android.com/design/patterns/new-4-0.html
  • HOW TO TAME THE BEAST? YOU LEARN BY DOINGwww.flickr.com/photos/jojoneil/6359536591
  • 6. THREE TAKE AWAY EXERCISEShttp://www.flickr.com/photos/kalexanderson/6302660289/
  • BESPOKE MOBILE SITE vs RESPONSIVE vs AN APP CONSIDER THE FOLLOWING: A big retail store has asked you to come up with a Easter Hunt across your city where EXERCISE ONE offers and give aways are hidden at certain locations. There will only be a certain number of items available each day & they want to be able to notify people when an item has been found, or when a user is close to one. What do you recommend in terms of their mobile strategy and why? I.e. an app, responsive or bespoke mobile site, or a combination?www.flickr.com/photos/jojoneil/6359536591 10 MINUTES
  • THINGS TO CONSIDER HOW WOULD MOST PEOPLE ACCESS IT? • DIRECT TRAFFIC vs. SHARED LINKS WHAT DO YOU NEED IT TO DO? • ARE THERE SPECIFIC DEVICE CAPABILITIES YOU EXERCISE ONE WANT TO UTILISE • IS OFFLINE READING/USAGE IS REQUIRED WHAT ARE THE OBJECTIVES & PRACTICALITIES? • THE BUDGET • THE CURRENT TECHNICAL PLATFORM THAT THE RETAILER IS ON • COULD AN APP BE RE-USED FOR ANOTHER CAMPAIGN LATER • THE MARKETING VALUE OF HAVING AN APPwww.flickr.com/photos/jojoneil/6359536591
  • BUILDING A RESPONSIVE SITE FOR THE EASTER HUNT SITE THE CLIENT WANT TO INCLUDE THE FOLLOWING: • About page • Share (on FB & Twitter) • List of offers • Login & registration • Product pages • Overview of number of found • Notifications & not found item EXERCISE TWO PART 1 Pick either mobile or desktop & do a rough sketch of what the home page should contain & how the content should be prioritised. PART 2 Using content stacking methodology define how the content should be prioritised on desktop & mobile. 15 MINUTESwww.flickr.com/photos/jojoneil/6359536591
  • THINGS TO CONSIDER EXPECTATION OF AN EQUAL & CONTINUOUS JOURNEY ACROSS DEVICES • MOBILE & DESKTOP USE CASES ARE MERGING KEEPING THE CORE CONTENT THE SAME EXERCISE TWO • OPTIMISE THE DISPLAY & INTERACTIONS TO THE DEVICE • IF IT DOESN’T BELONG ON MOBILE DOES IT BELONG ON DESKTOP THE HIERARCHY OF MODULES • PRIORITISE & CONSIDER EACH PIECE OF CONTENT • WORK WITH PEN & PAPER • DEFINE RULES FOR HOW HORISONTAL MODULES ARE DISPLAYED VERTICALLY ON SMALLER SCREENSwww.flickr.com/photos/jojoneil/6359536591
  • BUILDING AN APP BASED ON THE CONTENT & FUNCTIONALITY REQUIREMENTS CONSIDER WHAT WOULD BE SUITABLE FOR AN APP: • About page • Share (on FB & Twitter) • List of offers • Login & registration • Product pages • Overview of number of • Notifications found & not found item PART 1EXERCISE THREE Define the main sections your app would have. PART 2 Looking at the navigation how would you structure this if you were to do an iOS app & an Android app? Focus on the Tab bar items respectively Action bar items & what would go in the ‘More’ respectively ‘Overflow menu’.www.flickr.com/photos/jojoneil/6359536591 15 MINUTES
  • THINGS TO CONSIDER APPS ARE FOCUSED • CONTENT OFTEN DIFFERS BETWEEN APPS & MOBILE OPTIMISED SITES • EACH SECTION SHOULD HAVE A CLEAR PURPOSE & USE CASEEXERCISE THREE THE NUMBER OF ITEMS YOU CAN FIT VARIES BETWEEN ANDROID & iOS • BASE ORDER & POSITIONING OF SECTIONS ON IMPORTANCE & ACCESS FREQUENCY • TAB BAR ITEMS & ACTION BUTTONS AREN’T THE ONLY WAY FOR A USER TO NAVIGATE PROVIDE VALUE FROM THE FIRST SCREEN • AVOID USING THE FIRST SCREEN AS A STEPPING STONE BUT BRING THE USER RIGHT INTO CONTENTwww.flickr.com/photos/jojoneil/6359536591
  • 7. TO SUMMARISEhttp://www.flickr.com/photos/martinteschner/4569495912/
  • DEVICE USAGE & PATTERNS FUTURE DEVICES The number of different devices will only grow & we don’t know what’s coming. USED EVERYWHERE & ANYWHERE And we’re not only using them on the go but increasingly when we have some downtime including the sofa. USE OF MOBILE DEVICES Our use of mobile devices iswww.flickr.com/photos/thecaucas/2597813380 increasingly replicating that of desktop.
  • IMPLICATIONS FOR UX & DESIGN THINKING AN EQUAL & CONTINUOUS EXPERIENCE ACROSS DEVICES As they & the services we use become more sophisticated & optimised we expect more from them. KEEP THE CORE BUT OPTIMISE Consider the limitations but also the opportunities with mobile devices.www.flickr.com/photos/thecaucas/2597813380
  • WHEN DO WHAT BESPOKE MOBILE WEBSITE Try to avoid it but do it if necessary RESPONSIVE DESIGN The most device & future “proof ” approach right now. Use if possible. But challenge content delivery. APP Base on user & business needs. Strong argument if you require offline reading/functionality & access to device capabilities. Base which typewww.flickr.com/photos/thecaucas/2597813380 on objectives & stats.
  • FOR RESPONSIVE DEFINE YOUR GRID & BREAKPOINTS This is the backbone of responsive design & content choreography. DON’T FORGET THE NAVIGATION Consider the pros & cons of different methods. TEST & COLLABORATE This is new grounds & we’re all learning so work together & test aswww.flickr.com/photos/thecaucas/2597813380 you go.
  • FOR APPS REMEMBER PLATFORM SPECIFIC GUIDELINES Adhering to them will make your app easier to use. CONSIDER BACKWARDS COMPATIBILITY Not everyone will be on the latest version. Ensure you cater for the majority. CONSULT THE INTERNET There are a number of great resources for knowledge & inspiration. Use them.www.flickr.com/photos/thecaucas/2597813380
  • 8. BEFORE I GO... REMEMBER THATwww.flickr.com/photos/46355638@N00/4414640784
  • ...IT’S NOT JUST ABOUT THE SMALLER SCREENS BUT ALSO THE BIG ONESwww.flickr.com/photos/jolives/2889944573/
  • IT’S ABOUT THINKING AHEAD PLAN 5 YEARS AHEAD WITH “FUTURE PROOFING” IN MINDwww.flickr.com/photos/jolives/2889944573/
  • IT DOESN’T HAVE TO BREAK THE BANK BESIDES CONSIDER LOST CUSTOMERS & MAINTAINING MULTIPLE VERSIONShttp://www.flickr.com/photos/gi/5537770007/
  • BE CREATIVE & CHALLENGE WHAT EXISTS TODAY THAT’S WHAT MOVES US FORWARDwww.flickr.com/photos/oter/5090592214
  • CLOSER & MORE REWARDING COLLABORATION BETWEEN DISCIPLINES & WITH CLIENTSwww.flickr.com/photos/stevendepolo/3378152784
  • BUT ABOVE ALL... “ We’re not just making pretty interfaces. We’re actually in the process of making an environment where we’ll spend most of our time, for the rest of our lives. We’re the designers.We’re the builders. What do we want that environment to feel like? What do we want to feel like. ” - Wilson Minorhttp://www.flickr.com/photos/funch/4679422945/
  • 9. FOR THE ROADSOME TAKEAWAYS www.flickr.com/photos/st3f4n/4387291247
  • PLATFORM GUIDELINES http://developer.apple.com/library/ios/ #DOCUMENTATION/UserExperience/ Conceptual/MobileHIG/ UIElementGuidelines/ UIElementGuidelines.html http://mrgan.tumblr.com/post/ 10492926111/labeling-the-back-button http://developer.android.com/design/ index.htmlwww.flickr.com/photos/st3f4n/4387291247
  • PATTERN LIBRARIES http://pttrns.com/ http://mobile-patterns.com/ http://www.patternsofdesign.co.uk/ http:// www.mobiledesignpatterngallery.com/ mobile-patterns.php http://www.androidpatterns.com/ http://androidpttrns.com/www.flickr.com/photos/st3f4n/4387291247
  • RESPONSIVEDESIGNhttp://mediaqueri.es/popular/http://www.alistapart.com/articles/responsive-web-design/http://designmodo.com/responsive-design-examples/http://jamus.co.uk/demos/rwd-demonstrations/http://bradfrostweb.com/blog/web/responsive-nav-patterns/http://www.gridsetapp.com/http://grid.mindplay.dkhttp://goldengridsystem.com/http://foundation.zurb.com/docs/layout.php www.flickr.com/photos/st3f4n/4387291247
  • Thank you! QUESTIONS? annadahlstrom annadahlstrom anna.dahlstrom@gmail.com www.annadahlstrom.comwww.flickr.com/photos/dahlstroms/4411448782/