• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
Designing for diversity -  how to stop worrying and embrace the Android revolution
 

Designing for diversity - how to stop worrying and embrace the Android revolution

on

  • 27,385 views

It took 16 years for smartphone penetration to reach 1 billion people. Analysts believe it will take only 3 years to reach the next billion. The devices these consumers buy will be incredibly diverse, ...

It took 16 years for smartphone penetration to reach 1 billion people. Analysts believe it will take only 3 years to reach the next billion. The devices these consumers buy will be incredibly diverse, yet many will run on Android; a platform that now sees more than 1.5 million activations per day.


In this presentation, we explore the fascinating rise of Android around the globe. From dual SIM phones in Indonesia, to dual screen e-ink devices in Russia and crowd-sourced platform modifications in China, we will discover the role open source has played in Android's popularity and how to design for such a diverse environment.

Statistics

Views

Total Views
27,385
Views on SlideShare
26,612
Embed Views
773

Actions

Likes
49
Downloads
316
Comments
5

15 Embeds 773

http://www.scoop.it 373
https://twitter.com 290
http://lanyrd.com 45
http://eventifier.com 25
http://eventifier.co 13
http://sf231.ibermasters.com 7
http://translate.googleusercontent.com 6
https://www.rebelmouse.com 6
http://www.linkedin.com 2
http://buzz.bountyvirtualsupport.com 1
http://www.eventifier.co 1
http://moderation.local 1
http://dailyglancer.com 1
https://www.google.com 1
http://tawk.staging.barrelclient.com 1
More...

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

CC Attribution-NonCommercial LicenseCC Attribution-NonCommercial License

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel

15 of 5 previous next Post a comment

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
  • @ysascha Yes :-) It's the only photo I currently have from this era. The devices are now so small that it's much harder to take a photo of people using them, especially in this scenario. Phablets far outweigh 10' tablets, so they're now palm-sized.

    What often happens these days is the crew members wander around the mall, grab a coffee to go, and use the Internet along the way (the only wifi used to be at Starbucks and Costa Coffee, now there's wi-fi all over the mall...I suspect the cruise ships also now have relatively economical broadband). So yes...it's not the most accurate picture, but I wanted to show the real context and real behaviours. Will hopefully update the photo soon...
    Are you sure you want to
    Your message goes here
    Processing…
  • slide 15 is supposed to show how android tablets took center stage. yet, the picture shows nothing but a laptop and an apple ipad.
    Are you sure you want to
    Your message goes here
    Processing…
  • This is globally mind blowing.
    Are you sure you want to
    Your message goes here
    Processing…
  • Very cool, stephanie. I love the diversity slides, showing all those different mods / adverts / national habits!
    Are you sure you want to
    Your message goes here
    Processing…
  • The second slide 'Android' is designed with wool? :) amazing !
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    Designing for diversity -  how to stop worrying and embrace the Android revolution Designing for diversity - how to stop worrying and embrace the Android revolution Presentation Transcript

    • http://www.flickr.com/photos/joeshlabotnik/305410323 designing for diversity how to stop worrying and embrace the Android revolution
    • http://www.flickr.com/photos/khamtran/5871541424 this isn’t just a talk about Android
    • http://www.flickr.com/photos/mwiththeat/5426772664 it’s a story about Moore’s Law, of personal computing globalisation, and the future
    • http://www.flickr.com/photos/mwiththeat/5562687410 on the other side of the world... rather than start this story in a factory,
    • (or more specifically, the Port of Leith i’m going to start in Scotland on the north edge of Edinburgh) http://www.flickr.com/photos/eguidetravel/4683905164
    • Leith is a working harbour, Source: Marinetraffic.com so as nearby residents, we see all sorts of ships...
    • Norwegian submarine oil and gas exploration vessels, giant pipe layers, and the occasional
    • and come spring and summer, there are cruise ships Scoish
    • when ships dock, the crew head to the nearby mall to shop for snacks and use the Internet
    • the Philippines crews often come from http://www.flickr.com/photos/insmu74/4296249058
    • http://www.flickr.com/photos/shankaronline/9237826940 more than 25% of the 1.5 million in fact, Filipino sailors account for mariners worldwide Source: Wikipedia
    • a dramatic change in the devices over the years, we’ve seen used by crew at the Port of Leith
    • from hulking laptops in 2010
    • to netbooks in 2011...
    • ...and tablets (or quite often phablets) throughout 2012 and 2013
    • http://www.flickr.com/photos/didbygraham/3892420695 and in the hands of people who all this change in just 3 years, send a good portion of their wages home to their families...
    • http://www.flickr.com/photos/svensson/6012726684 Three factors have enabled such rapid change... 1. Moore’s Law 2. The development of off-the-shelf silicon 3. The rise of an open source mobile OS 1 2 3
    • Source: Intel True to Moore’s predictions, the number of components on an integrated circuit (or microchip) have continued to double every 18 months.
    • http://www.flickr.com/photos/kamshots/4104155942Source: Wikipedia to build ever cheaper, lighter and this has enabled us more powerful devices...
    • http://www.flickr.com/photos/oskay/3300199882 These devices may have been smaller, cheaper and more powerful, but developing them still took months (or years) and the skill of hundreds of designers and engineers.
    • All that changed in 2005, when Taiwanese semiconductor company MediaTek introduced what it called “reference designs” for mobile phones. http://www.flickr.com/photos/oskay/3300142950
    • http://www.flickr.com/photos/oskay/3300142950 This “cell phone in a box” concept bundled all the necessary mobile phone components onto a single chip. Manufacturers could customize their chip from a menu of available features, and MediaTek even offered training and development tools such as emulators. camera MP3 music player low power consumption feature phone reference chipset GSM/GPRS pre-integrated software ARM7-EJ 52MHz ultra-low-cost MT6233
    • suddenly, tiny companies http://www.flickr.com/photos/oskay/3300186490 with only a handful of engineers could set up shop producing capable mobile devices
    • Most of these companies clustered around the electronics and manufacturing hub of Shenzhen in China, but others soon appeared in India, Malaysia, Indonesia... http://www.flickr.com/photos/oskay/3299338889
    • MediaTek chips provided most of the functionality. All companies needed to do was slap on a case, add a bit of branding and develop any product-specific customizations. Nexian Indonesia circa 2009
    • Micromax India circa 2009 Some companies competed solely on price, while others specialized in fun and often eccentric devices designed to suit local needs and fashions....
    • fake Blackberry ...others simply produced copies of flagship devices from well known brands... iOS lookalike fake Vodafone fake Opera Mini The ever stylish and most desirable Voda-Pod-Berry Source: Danwei.org
    • By late 2007, it was estimated that these small “white-box”* retailers had captured 10% of global device sales. Source: Wikipedia (Because many of these companies began by copying other products, they were also often referred to as “Shanzhai”, or bandit manufacturers, but this term downplays the presence of many small legitimate companies who designed their own products). not a BlackBerry man in an Obama suit?
    • didn’t just copy...they innovated but white-box manufacturers http://www.flickr.com/photos/jurvetson/1783467315 video caller 2 video caller 1
    • They ran tiny production runs, experimenting wildly with industrial design, components and software. If a “feature” didn’t sell, they simply dreamt up another... TV antenna watch phone music phone detachable lens regional designs special occasion space for 4 SIM cards + projectorQWERTY (popular in Indonesia) Photo credit: Bunnies studio blog
    • With the release of Android in 2008, things changed once again...
    • Android provided the entire ecosystem with a unique opportunity to rapidly transition from building low-cost feature phones to low, mid-and eventually high-end smartphones and tablets. circa 2010 one of Spice, India’s first Android smartphones
    • Source: EBay, August 2013 Shanzhai circa 2013 ...looks like a Nokia Lumia ...looks like Windows Phone OS Some small device makers still chose to copy the look and feel of well known brands... ...built on Android but hey, it’s only £56! ($85)
    • ...but many have evolved into larger companies that now develop and market devices under their own brand. Meizu M8 Mini One 667 MHz, 3.2 mp camera Customized Windows CE Meizu MX2 quad core 1.6 GHz, 8mp Customized Android “FlyMe” OS Meizu M9 1 GHz, 5 mp Android 2.2 2007 £125 ($200) 2011 £218 ($350) 2012 £250 ($400)
    • “...designed by Jack Wong with the help of 30-plus handcrafted wooden prototypes, followed by 3-D scanning...” Source: Engadget The slick, NFC- enabled Meizu MX3 in 2013...
    • Other chipset vendors such as Rockchip, Broadcom, Allwinner and Qualcomm now emulate the MediaTek model, resulting in a veritable explosion of options for manufacturers and consumers. http://www.flickr.com/photos/fdecomite/2787670078/
    • http://www.flickr.com/photos/oskay/3300199882Source: The Internet of things is Android and its everywhere “Every screen variant, mobile chip, and sensor known to man has been tuned to work with Android...there’s this network effect, so that now anyone who wants to make a custom product can take Android and morph it into anything”. Jim Zemlin, Linux Foundation
    • Off the shelf components and an open OS have democratized portable computing. There is now huge consumer choice in connected devices reaching almost every price point. http://www.flickr.com/photos/designshard/3019335591
    • http://www.flickr.com/photos/designshard/3019335591 “Good enough” smartphones and tablets can now be purchased for ~$100. Very basic models are available for ~$50. Thanks to Moore’s Law, many of these devices already rival the specs of top devices sold just a few years ago.
    • http://www.flickr.com/photos/designshard/3019335591 Android now powers 59% of smart devices (and 80% of smartphones) being sold. That works out to a staggering 1.5 million Android device activations per day*. *According to Google but not counting many Chinese devices
    • These devices are designed, developed, manufactured and marketed by many hundreds of companies, each with their own audience and product goals.
    • http://www.flickr.com/photos/joeshlabotnik/305410323 Part 2: Understanding diversity Before we discuss how to design for Android’s diversity, let’s dig deeper to discover how diversity affects day-to-day user experience.
    • All modern connected devices consist of a carefully chosen collection of components. Source: Samsung Gyro sensor Internal memory 1.5GHz DualCore Chip LTE, HSPDA Modem Antenna and stereo speakers Light sensor module 3 Megapixel back-facing camera High capacity battery DMB antenna
    • Manufacturers can choose off-the-shelf components, or customize each aspect of the device to suit their intended price-point and target audience. WI-FI Bluetooth capacitive display multi-SIM FM radio GPS CPU speakers physical size ppi responsiveness gyroscope proximity light motion operating system 2G/3G/4G battery camera browser music player SIM sensors graphics card clarity toggle simultaneous standby front back
    • At the cheapest price point, you often find “generic” device with an off-the-shelf chipset, stock Android and barely-branded case. There are tons of these devices for sale throughout Asia, but they haven’t (yet) reached Europe and North America. Screenshot: Tmart off-the-shelf stock off-the-shelf
    • Slightly more customized devices are sold by all sorts of companies. Here is an example of a very popular device that might fit this category.... customized customized off-the-shelf
    • ¥799 (£83/$130) nice but basic plastic case stock MediaTek MT6589T chipset 8 Mp camera dual SIM w/ dual standby highly customized MIUI ROM Xiaomi Hongmi fancy Gorilla Glass
    • Part of Hongmi’s huge appeal is its MIUI ROM. A highly customized (and customizable) version of Android. (we’ll have a better look at Android ROMs in a bit...)
    • In case you’re thinking “Yeah, whatever...” consider that when the Hongmi went on sale last month, the first batch of 100,000 devices sold out in just 90 seconds. (Xiaomi has no shops and until recently, only sold online. This reduces overhead, and enables customers all over China to purchase a device on the very same day).
    • What we most often purchase in Europe and North America is some manner of highly customized device built by an established manufacturer. customized customized customized
    • experiment with different form factors use Android as a base with which to these manufacturers Galaxy NGalaxy Tab 7.0”Galaxy Player 5.8” Galaxy Note 5.3” Galaxy SIII 4.8” Admire 3.5” Intercept 3.0” Gravity 2.3” Galaxy Tab 8.9”Galaxy Tab 7.7”
    • A new dual screen, dual SIM (with dual standby) luxury clamshell phone developed by Samsung. The full OS is accessible from back or front. This device is expected to retail for ~£1500 ($2500). serve varied audiences...
    • The KDDI Infobar range was designed by famed industrial designer Naoto Fukasawa, and features iida UI, a highly customized version of Android. to differentiate or leverage fashion their brand Infobar C01 Infobar A01
    • Open source Android OS also provides an ideal platform on which to experiment with new interfaces and interactions. Scrolling turns elements into translucent teardrops. iida UI features a modular, widget based interface. There are also lots of platform specific transitions.
    • On Sony Xperia and newer Samsung Galaxy devices, users can trigger resizable and repositionable floating windows. These enable advanced PC-like copy/paste and multi- tasking behaviours. Unlike Android widgets (which are simply mini-data views), these windows contain a fragment of the full application that users can interact with.
    • some customizations require even tighter coupling of hardware and software
    • scroll using the back panel 206° repositionable camera take photos remotely (using Bluetooth LE) or new extensions to hardware-based interactions The new Oppo N1
    • http://www.flickr.com/photos/designshard/3019335591 But (yet again) innovation and experimentation don’t just come from the big guys...
    • A dual display smartphone developed by Yota, a Russian broadband operator. The e-paper powered back display can retain an image for weeks, even when the device is powered off. This feature enables users to completely customize their back case, or use it to store a time-and power- sensitive image such as a map or boarding pass. e-paper with capacitive touch stripe standard multi-touch display FRONT BACK
    • Toughshield specializes in products for industrial and institutional settings including construction, healthcare and retail.
    • Global supermarket chain Tesco recently announced Hudl, a ~£100 ($150) family- friendly tablet featuring extensive ClubCard loyalty scheme and blinkbox entertainment service integration. Tesco Hudl
    • Source: Quartz, Photo courtesy Datawind The Indian government hopes to distribute at least 220 million Aakash 2 tablets to that country’s students. Manufactured in India for a mere $40, the purchase cost to students will be subsidized to further increase access.
    • Although many consumers still primarily purchase devices designed, developed and marketed by large companies...this may not be the case going forward. If current patterns hold true, consumers around the world may increasingly be just as likely to own devices developed by smaller brands and manufactured through any number of “other” manufacturers. Worldwide Smartphone Sales to End Users by Vendor in 2Q13 Apple 14% Samsung 32% LG 5% ZTE 4% Lenovo 4% Others 40%
    • ...but Android’s diversity does not stop at brands and hardware. The platform itself is also immensely customizable.
    • The most common customizations come from large manufacturers, who attempt to differentiate by offering proprietary user interface skins, home screens (or “launchers”) and enable unique features and personalization options such as themeing. “Vanilla” Android Samsung Touch Whiz HTC Sense Huawei Emotion UI customized versions
    • http://www.flickr.com/photos/liquene/4824175336 users can then layer their own customizations, ranging from simple interface adjustments, to more substantial OS-altering modifications
    • A relatively common customization might be the installation of an alternate app to control text input. This new app could be triggered just-in-time, or set to completely replace the default keyboard. SwiftKey with QWERTY and gesture input 8Pen gesture input
    • In fact, thanks to a system called intents, users can also specify favourite apps to complete common tasks such as sharing or opening URLs. They can do this just-in-time, or choose a favourite app to complete that task going forward. Set as default: Choose Firefox as default app to browse the web from the current context. Just in time: Choose which app you would currently like to use to “Share” a URL.
    • A less common, but more transformative customization is to install a new launcher. This replaces the device’s home and lock screens, core app menus, and often unlocks extensive collections of themes and home screen widgets. The very popular Go Launcher offers an extensive theme collection and enables users to customize transition effects and define their own shortcut gestures.
    • The most extreme form of customization involves completely replacing the build of Android that came with the device. These third party (and often community-built) modifications (or MODs) provide not just a new launcher, skins, and themes, but replace many default apps and enable entirely new (and often experimental) features.
    • Paranoid Android MOD for example features a Hybrid Mode that lets you adjust the resolution of every app, widget or system component on the device. Because many Android apps adapt to different screen sizes, this enables you to choose a preferred “view” for each app.
    • The most popular MOD in China is MIUI, developed by upstart handset manufacturer Xiaomi. International versions of MIUI are maintained by independent developers with versions available for 14 countries including Brazil, India and Indonesia. (The MIUI is closed source, so it may be in breach of the Android licence.)
    • MIUI is particularly popular as its design is actively crowd sourced through the discussions of thousands of Chinese Mi-Fans on Xiaomi’s message boards.
    • Another popular feature is MIUIs’ extensive themeing capabilities, and an app store containing thousands of community built themes.
    • Installing a MOD is far from mainstream (especially in Europe and North America), but as installation becomes simpler, who knows what behaviours will develop. CyanogenMod is now a formal company with $7M in investment, and plans to develop a one-click installer that will soon be available on Google Play.
    • ...your device, your choice of MOD at purchase The new Oppo N1
    • http://www.flickr.com/photos/designshard/3019335591 How does all this UI diversity impact design?
    • Although a device’s core interfaces, icons and even input mechanisms may be customized, manufacturers are expected* to include the default Holo system theme on every device. *This requirement only extends to “official” manufacturers who ship devices with Android Marketplace. Small manufacturers don’t always qualify, so although they have nothing to gain, (and everything to lose) by not including Holo, it’s possible they may choose to omit it. Holo lightHolo dark
    • Holo provides a consistent look and feel for core components. When designing an Android app, you are free to provide your own theme, but using Holo will guarantee a consistent look across devices, and reduce the need to extensively test your brand- specific theme with the many other themed variants of Android. Thanks to Holo, the Twitter image picker interface remains consistent. The Holo-themed settings screen on a Galaxy Nexus running stock-Android. The customized settings screen on a Xiaomi M2S running MiUI.
    • What you will need to plan for however is diversity in platform versions. Because Android OS is itself just another component, manufacturers are free to use whichever version best suits a device’s overall capabilities and performance profile. (And if a manufacturer has highly customized their build, they may not be able to immediately update it each time Google releases a new version). Jelly Bean (2012) 45.1% Ice Cream Sandwich (2011) 21.7% Gingerbread (2010) 30.7% Older versions 2.5% Source: developer.android.com, September 4 2013
    • Note: Older versions of Android often support different features, include different APIs and follow different design patterns. Google provides compatibility and support libraries that help smooth out many of these differences. Android 4.0 £7,000 ($11,000) Vertu Ti For this reason, consumers purchasing a device today may not automatically end up with the latest version of the OS.
    • Source: Henry Fong, Yodo1, presented at GDC 2013 Users may also not access their content through the channels you’d expect... A snapshot of the complexity of Android app discovery, distribution and payment in China. The Chinese ecosystem is particularly complex and include over 200 app stores.
    • An unofficial app store in a Bangkok mega mall selling Android (and iOS :-) apps to passersby. We’ve been told that in parts of APAC, stores like this can also help you install and maintain a custom Android MOD. FWIW: This is not a new behaviour. The platforms and devices may have changed but we first noticed (J2ME, SWF & ringtone) app store booths in APAC malls in 2002! the more creative people will get the more open the ecosystem, social discovery serendipity (...and fun!) curation and tech support
    • http://www.flickr.com/photos/adactio/1799953270 Part 3: Designing for diversity Throughout the remainder of this presentation, we will explore strategies that can help you design for such a diverse environment.
    • http://www.flickr.com/photos/designshard/3019335591 Disclaimer: Android is incredibly versatile and now powers thousands of “devices” including cars, TVs, fridges, stoves and watches. Although this presentation primarily discusses consumer electronics products such as smartphones and tablets, many of the guidelines and approaches discussed will be relevant to the design of other types of products.
    • 1. Be flexible 2. Provide assets for all 3. Optimize layouts 4. Enable diverse experiences Android design 101 Four key principles ...these no doubt seem familiar if you regularly design for the (mobile) web First three principles provided by Google but expanded by yiibu..
    • http://www.flickr.com/photos/designshard/3019335591 Principle 1: Be flexible ...create flexible, density-independent layouts
    • “We have seen 11,868 distinct devices download our app in the past few months. In our report last year we saw 3,997. OpenSignal device fragmentation report, 2013 With so many distinctly different devices, you can expect a wide range of screen sizes and pixel densities.
    • Screen size and pixel density diversity makes defining layouts using pixels problematic. On screens with different densities, an identical number of pixels, will correspond to different physical sizes. this 4 x 2 pixel button is too big on a low density display... ...just right on a medium density display... ...and far too small on a high density display
    • To solve this problem, Android enables you to define layouts using density independent pixels (dp). Use these virtual pixel units to express dimensions or position, and the system will automatically scale them as appropriate to the device’s screen size and density. medium density (baseline) high density (adjusted so physical size remains consistent) low density (adjusted so physical size remains consistent) Tip: 1dp corresponds to approximately 1px on a 160ppi display.
    • Similar to designing flexibly for the web, you should don’t specify dimensions in cases where elements are simply meant to stretch to fill the available space. Android enables you to specify how components should scale to fit this space, and ways to define the weight of each component within the interface. resizable area, no fixed height resizable and of equal weight 12dp10dp 48dp 48dp 32x32dp Source: developer.google.com
    • Layouts that scale and flex are great, but to provide the best experience, you will often need to go further: • Provide alternate bitmaps to reduce the blurring and pixelation caused by automatic scaling. • Specify alternate layouts to improve legibility and overall user experience. • Specify alternate content or behaviours to suit a user’s language, device form factor or capabilities. but that’s not all...
    • http://www.flickr.com/photos/designshard/3019335591 Principle 2: Provide assets for all ...using built-in layout and resource adaptation
    • Each Android app includes a collection of resources that are used to define and construct the user interface. These include bitmap images, layouts, colour palettes, text strings and numeric values containing content or key dimensions such as global or component-specific margins and font sizes. <abcd/> <200dp>
    • Resources can be grouped using qualifiers that specify their intended context of use. Similar (in spirit) to CSS media queries (but far more versatile)...this system enables you to indicate which resources should be used based on common contexts such as screen size, orientation, pixel density, and language. color drawable drawable-mhdpi res drawable-port-hdpi layout values values-de orientation pixel density language
    • values-de All you have to do is group assets using the necessary resources and qualifiers. At runtime, Android will detect the current device capabilities and load the appropriate resources for your application. color drawable res values logo.png icon.png drawable-hdpi logo.png icon.png only high dpi devices will use these images only devices set to German will use what’s in this folder
    • You can also combine qualifiers to increase context specificity. drawable-en-rUS-land-hdpi language region orientation pixel density
    • A critical use-case for qualifiers is to specify alternate bitmaps for different screen densities. These are specified using standard groupings (called generalized densities) that map to common Android screen densities. nodpi can be used to specify for bitmap resources that should not be scaled to match the device density. Although still rare, you can also use tvdpi to specify bitmaps for mid-density (~213dpi) televisions. ldpi ~120dpi mdpi ~160dpi hdpi ~240dpi xhdpi ~320dpi xxhdpi ~480dpi BASELINE 0.75x 1.5x 2.0x 3.0x
    • drawable-ldpi drawable-mhdpi drawable-hdpi drawable-xhdpi drawable-xxhdpi 0.75x 1x 1.5x 2x 3x Put assets in folders labelled with the correct qualifiers, and the platform will automatically choose the most appropriate assets to suit a device’s screen density. res
    • Android regularly publishes screen density statistics. Take these into account when deciding which alternate resources to include. xhdpi 23.7% hdpi 34.3% tvdpi 1.2% mdpi 23.5% ldpi 10.2% xxhdpi 7% TIP Source: developer.android.com, September 4 2013
    • http://www.flickr.com/photos/designshard/3019335591 Principle 3: Optimize layouts ...using built-in “responsive design”
    • Creating layouts that are flexible, and adapt to different screen densities, isn’t always enough to deliver the best experience. excessive line length missed opportunity to use space reduced visual grouping
    • Android provides two additional tools that dramatically improve the experience when dealing with screen size diversity. layout layout-sw480dp layout-sw720dp res A way to specify alternate layouts using qualifiers to correlate layouts with screen size breakpoints. A way to construct layouts using reusable and adaptable user interface components called fragments. layout-land-w900dp
    • Using qualifiers, you can define breakpoints between layouts, or tweak existing layouts to better suit the screen size. 600dp 720dp320dp 1020dp baseline experience and onwards...
    • Instead of filling these buckets with distinct “smartphone” or “tablet” layouts, construct highly adaptive layouts that rely on smart combinations of flexible and adaptable components. 600dp 720dp320dp 1020dp baseline experience and onwards...
    • http://www.flickr.com/photos/designshard/3019335591 here’s how it works...
    • Android apps are made up of activities (things you can do) and fragments (components that provide the content and functionality within each activity). fragment(s) fragment(s) fragment(s)
    • On small screens, it’s always best to focus the interaction. There's often only room to display one fragment at a time, so users must drill-down to access other fragments or activities.
    • On larger screens, there is an opportunity to combine these fragments to enrich interactions, improve usability, and make better use of available space. 12:00 12:00 A B A B
    • A B C On the largest screens Evernote combines up to three fragments into one activity. Swipe left on fragment B to reveal a split screen containing fragments B and C. Swipe left on C to reveal a full-screen view of that fragment.
    • Evernote also relies heavily on flexible components, and lots of fragment-specific design tweaks. It’s this combination of design decisions that enables a consistently great experience. linear layout fragments expand to fill the screen grid layout grid scales vertically and horizontallyfragment with larger thumbnail
    • One fragment per activity, accessible using tabs. Many fragments grouped as a single activity. Many fragments grouped as a single activity. Google I/O app
    • The list and detail fragments as one activity. Swipe right to slide open the menu panel fragment. The menu panel, list and detail fragments as one activity. Wordpress app One fragment per activity. Swipe right to slide open the menu panel fragment.
    • These layout changes can once again be defined using a collection of resources and qualifiers. layout layout-sw480dp res layout-land-sw720pd activity_notebook.xml fragment_notebook.xml layout-sw720dp activity_notebook.xml fragment_notebook.xml layout breakpoint layout breakpoint default layout orientation breakpoint
    • Touch screen UI mode API level notouch stylus trackball finger car desk television appliance v1 v2 v3 Layout direction Language & region MCC & MNC ldrtl ldltr en fr en-rUS fr-rFR mcc310 loosely maps to platform version e.g. Gingerbread, Jelly Bean country code mnc004 docked with a... no display!! network code e.g. AT&T, T-Mobile right to left And that’s just the start of what you can do. Qualifiers can be also used to specify a wide range of alternate experiences. (Here are just a few of the more interesting ones...) For a full list see Providing resources
    • Almost any application will benefit from the inclusion of alternate resources to support diversity (be they images, layouts, content or behaviours). It’s not necessary however to account for all combinations. TIP
    • Small well-chosen adjustments can make a big difference. When in doubt, keep things simple. Don’t micro-manage the design or introduce complexity just “because you can”. layout-en-rUS-land-car-hdpi-night-qwerty-trackball-...
    • http://www.flickr.com/photos/designshard/3019335591 Principle 4: Enable diverse experiences ...leverage intents to embrace diversity and personalization
    • http://www.flickr.com/photos/designshard/3019335591 Intents are the glue between application components, both within an app, and across different apps. They allow apps to outsource tasks to other apps (that they may not even know about). “ - Roman Nurik, Google
    • An intent is simply a combination of an action, and a piece of data. Source: Nick Butcher, Google VIEW EDIT Contact “Bryan Rieger” www.yiibu.com
    • Android apps can register their ability to handle each type of intent (or if you prefer...their ability to assist the user in completing an activity). I can.... ...VIEW ...EDIT ...SHARE ...CHOOSE “ Source: Nick Butcher, Google
    • EXAMPLE Diversity-friendly social sharing
    • There are hundreds of social networks, email clients, messenger apps or utilities that a user might prefer to use to share a URL.
    • On other platforms, a brand decides (ahem...guesses, presumes) which services to enable, and hard codes these into their app. (Or...if a user is lucky, the platform may enable them to pre-configure a few popular default services such as Facebook and Twitter.)
    • ...thanks to intents, users can choose how they wish to share. you “save” you edit/compose your noteyou click “share” SHARE {data} Share you choose an app*the intent is broadcast *only apps that are capable of fulfilling a share request are displayed
    • you “save” you edit/compose your noteyou click “share” the intent is broadcast SHARE {data} ...completing the action automatically brings you back to the Twitter app Intents also enable out-of-the-box seamless experiences. Once a task is complete, the user automatically ends up back where they initiated that task. Share *only apps that are capable of fulfilling a share request are displayed you choose an app*
    • EXAMPLE Enabling multi-app experiences
    • Clicking a URL also triggers an intent. It’s therefore possible for brands with both an app, and a mobile optimized site to enable behaviours like this.... Pick me!! Two apps respond “I can handle ”view” intents on amazon.co.uk” browser resolves the URL app resolves the URL*the user clicks a link (within a web page, in an email, or in another app...) <a href=”http:// www.amazon.co.uk/ bookReference”> the intent is broadcast VIEW {URI} Share Amazon Chrome *this doesn’t happen by magic, but the additional work is worth it!
    • The beauty here is that this is a (progressive) enhancement. The web page simply contains a URL. If there’s no Amazon app installed, the URL simply opens in a browser. (If the user has two browsers installed (for example, a text to speech browser), and hasn’t designated a default, both will respond...and the user can make a choice). Reminder:
    • The more apps support intents, the more users can chain apps and activities together to complete very personal experiences... Share (i.e. open) using Google Translate ...then Share in an SMS hardware Back open Tweet using your chosen “app” click a URL in the Tweet and open using your favourite “app” seamless auto Back seamless auto Back hardware Back For a deeper exploration of multi-app experiences, see Beyond Progressive Enhancement
    • Using intents reduces the need to design, build, and maintain a bespoke system to manage sharing, or build regional variants of your app to enable region- or audience- specific social sharing. It also enables your app to deliver a more personalized and future-friendly user experience. CORE BENEFITS
    • Be flexible Create density-independent layouts that stretch and compress to accommodate various heights and widths. Provide assets for all Provide resources for different screen densities to ensure that your app looks great on any device. Take advantage of built-in resource switching to optimize other aspects of the experience. Optimize layouts On larger devices, take advantage of extra screen real estate. Create compound views to reveal more content and ease navigation. Enable diverse experiences Enable personalization, and provide a more global experience using intents. recap: four key principles First three principles provided by Google but expanded by yiibu..
    • http://www.flickr.com/photos/designshard/3019335591 A few final words...
    • http://www.flickr.com/photos/designshard/3019335591 In the summer of 2013, the Android platform surpassed 1 billion activations....
    • this doesn’t include the many “unofficial” devices being imagined and assembled by makers around the world http://www.flickr.com/photos/tigoe/3321975176
    • Source: The Internet of things is Android and its everywhere the growing number of Android-based interfaces found in cars...
    • Internet enabled treadmill. Currently considered a luxury product (...give it 18 months). ...the emerging Android-based “appliances”
    • or experimental Android-powered Source: SSTL “things” like these nanosats that will one day orbit the earth
    • and once we begin to embed swarms of Android-tethered “smart dust” throughout the world, we may lose count altogether... Source: MIT Technology Review, smart dust mage: UCLA “By equipping the clothing and bodies of users with a mesh of multiple sensors - known as “smart dust” - that report to an Android-powered phone, researchers are pioneering an open-source route to realizing the dream of always-on medical monitoring”.
    • what these “devices” all have in common is the magic that happens... http://www.flickr.com/photos/designshard/3020167188
    • when easily available components and fabrication... http://www.flickr.com/photos/jadon/4853752558
    • meet an open and widely-distributed “Because Android is open-source, the researchers were able to develop on top of it using the SPINE platform for remote sensing, and to add to it their own API...these platforms allowed them free reign to experiment”. - Android powered sensors monitor vital signs platform... http://www.flickr.com/photos/andrewmalone/2355592191 “I ran into [SAIC] at this trade show where they were placed next to all these other carmakers with massive software teams...they said: ‘We just have six dudes and Android.’ - The Internet of things is Android and its everywhere “Nanosats based on Android phones offerthe...advantage of a standardized appplatform for running experiments. Thisopens up space experiments to studentsand hackers around the world.’ - Android and Linux Nanosats shine bright
    • some people believe to be squashed... Android’s diversity is a thing http://www.flickr.com/photos/greencolander/2502910471/
    • but i’m pretty sure http://www.flickr.com/photos/92090133@N04/8487832697/ diversity is not a bug...
    • http://www.flickr.com/photos/boedker/3846587018 it’s an opportunity...
    • http://www.flickr.com/photos/tinou/453593446 thank you many thanks to the amazing photographers on http://creativecommons.org/licenses/by/2.0 @yiibu hello@yiibu.com contact us at Presentation deck available @ http://www.slideshare.net/yiibu