This document discusses emerging technologies and how they are blurring the lines between the digital and physical worlds. It explores concepts like smart connected objects, Internet of Things, and how the web can better integrate with native apps and experiences. The document advocates for a more seamless experience where the web enhances and complements other technologies instead of trying to replace them.
10. Proteus Digital Health - Digital health feedback system
stomach acid powered sensors that communicate
with applications on your smartphoneā¦
11. senses how you eatā¦
a fork that
Hapi Fork by Hapi Labs
12. Proteus Digital Health - Digital health feedback system
Apple Gives Share-
holders More Input;
Will Facebook Get the
Message?
At its annual shareholders meet-
ing on Thursday, Appleās man-
agement bowed to pressure
from key investors and agreed to
allow shareholders to elect
board directors by a simple ma-
jority vote.
Now any new or current director
standing for election who fails to
receive support from a majority
of shareholders must resign his
By Tim Carmody
February 24, 2012 | 4:26 pm
MENU
and smart toilets that help you track
what comes outā¦
13. microchip
+
sensors data
out
A real-time web (or app) based
progress report is available.
The fork gathers data
as you eat.
data
out
data
outservice
data
out
Fork vibrates if youāre
eating too fast
they are systemsā¦
these arenāt just smart connected objects,
Hapi Fork by Hapi Labs
25. at the last web standards round...
access bits of hardware or software that didnāt exist
āMotesā are Bluetooth Low Energy (LE)
devices that can broadcast data on
behalf of things in the real world.
There still no Bluetooth API for the web
(LE or otherwise...)
Source: EstimoteRead Scott Jensonās W3C article proposing we extend web discovery to objects
26. ...and take full advantage of
powerful new chipsets
The Moto X includes a low-power core
whose only job is to listen for the
passphrase "OK, Google Nowā.
(This plus another core devoted to sensors
enables, Touchless Control to run in the
background without the need to power up
the entire processor, which would
drain your battery.
and technologies
Photo: Mashable
36. ā¦we must accept that enhancement
may sometimes lie beyond the web
Source: Nymi
Nymi lets you use your unique cardiac rhythm
to authenticate your identity.
40. http://www.ļ¬ickr.com/photos/ducdigital/2892313560
ā
...services arenāt made on an assembly line...you canāt
predict precisely which [touchpoint] each user will
need, in what order she will encounter them, and
who will help her along the way.
The service is experienced diļ¬erently by every
person, because every person is diļ¬erent."
- Andy Polaine
the services we create must embrace
that complexity...
51. http://www.ļ¬ickr.com/photos/ducdigital/2892313560
Dixons (owner of electronics giants Curryās and PC
World) recently scrapped individual sales commissions
in favour of store-wide schemes linked to measures
of customer satisfaction.
To overcome managersā reluctance to refer customers
to the website, stores are now credited with all sales
in their catchment area...regardless of whether
a buyer entered the premises.
- The Economist
ā
57. iOS smart app banners
URLs that (kinda) open apps
APPBROWSER
58. The call to action adapts to suit the
context:
ā¢ OPEN if the app is installed,
ā¢ VIEW if itās not
The banner also wonāt appear if the
app isnāt supported (...in that region,
on that particular model)
iOS Smart App Banners can
prompt users to open or
install your app, and are easy
to implement using a meta-tag
in the head of each page.
They are less obtrusive than
modal windows and are native
components so wonāt impact
performance or suļ¬er from
usability problems as a modals
often can.
Source: Apple developer
59. While less intrusive than other methods, smart app banners
can still send mixed messages. Donāt use them āsimply because
you canā. Make sure they are truly useful.
60. If the user already has the app installed, generically linking to it
is about as useful as generically dumping all smartphone users
on your (mobile) home page. You can do better...
<a href=āhttp://
www.amazon.co.uk/
bookReferenceā>
Clicking OPEN passes
that pageās URL...
...which the app
parses and resolves
to display the content
1
2
3
This is sadly a mythical example. Amazon could do this, but so far hasnāt.
61. Bottom line:
If used well, Smart app banners can deliver a good experience.
Itās a shame however that their content canāt be customized to
make them feel a bit less like an advert in cases where users
already have the app installed.
63. URI schemes are a mechanism through which third-party apps
can communicate with each other.
They are supported on iOS, BlackBerry 10, Windows Phone 8
and Android (using the far more robust intents).
64. polar://
The user clicks a link
within a web page
The native app (thatās
already installed)
recognises the scheme
The app developer
registers the scheme
within the native app
<a href=āpolar://
polls/2246/ā>
The app opens and (if itās been
well designed) resolves the full
URL to display the content or
activity the user requested
using a web link
to launch an app in iOS
2
3
4
1
example:
Lukeās case study: Linking mobile web and native app experiences
65. Boo...the user is on
another platform
(Mac, PC, Android etc.)
...if only it were that simple :-(
(a complicated error prone process using cookies ensued to make this work...see the case study)
Boo...the native
app isnāt installed
FAIL
Lukeās case study: Linking mobile web and native app experiences
<a href=āpolar://
polls/2246/ā>
FAIL
polar://
The app developer
registers the scheme
within the native app
The user clicks a link
within a web page
2
3
3
1
66. Bottom line:
For the moment at least...schemes are a bit of a hack.
They donāt gracefully degrade, so it takes a lot of work to
ensure everyone gets a good experience.
68. Intents are the glue between application components,
both within an app, and across diļ¬erent apps. They allow
apps to outsource tasks to other apps (that they may not
even know about!) using predetermined interfaces.
ā - Roman Nurik
69. Why is this useful?
Intents enable users to choose the app they prefer to use
when completing a task, such as sharing a link, saving a ļ¬le or
opening a URL.
(In contrast to the typical scenario where the platform owner, app
developer or designer decides what people should use (and often how they
should use it) and in some way hard-codes the functionality into the app.)
70. 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
71. Android apps can register
their ability to handle
each type of intent.
Source: Nick Butcher, Google
I can....
...VIEW
...EDIT
...SHARE
...CHOOSE
ā ...an image, ļ¬le etc.
...an URL, photo etc.
...a photo, document etc.
...just about anything
73. Pick me!!
Two apps respond
āI can handle āviewā
intents on amazon.co.ukā
browser resolves
the URL
app resolves
the URL
user is
prompted to
pick...
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
Clicking a hyperlink is one of the many user actions that
triggers an intent.
Itās therefore possible for brands with both an app, and a mobile
optimised site to enable behaviours like this....
Once again a mythical example. Amazon could do this, but so far hasnāt.
74. Reminder: The beauty here is this is an 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).
75. SHARE
{data}
āSaveā
INTENT
click āshareā
...completing the action automatically brings you back to the Twitter app
choose an app
edit/compose
your note
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
Twitter does use intents. Yay!
76. 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
78. Detailed instructions on developers.google.com and try this out in Pocket on iOS
user clicks a link
from within the
Pocket iOS app
VIEW
mock-intent
?
NO
YES
isChrome
Installed?
oļ¬ers the usual
web view
roundtrip enabled using the x-callback-url scheme
enjoy content in your
favourite browser
Google has implemented a variant of intents enabling apps to
delegate viewing web content to Chrome on iOS. While a bit
contrived, it incorporates feature detection so can be used as an
unobtrusive progressive enhancement.
āopen in Chromeā
option is oļ¬ered
ābackā button
added at runtime
79. Mozilla has also developed the web activities API for Firefox
(mobile) and Firefox OS. Web activities enable (web) apps to
delegate activities to other (web) apps.
three apps respond
āI can pick a photoā
user picks a photo...
the app gets the photo back as a ļ¬le blob, and does something with it...
PICK
{photo}
invokes the
pick activity
Select Crop
...does other useful
stuļ¬ with their
favourite app...
Iām
done!Pick
Wallpaper
Gallery
Camera
More on Web Activities and a comparison of Web Activities and the far broader Web Intents
80. Mozilla hopes that web
activities will be
adopted as a standard.
The development of
web intentsāa similar,
but more complex W3C
standardāis now on
hold as the various
groups discuss how
best to proceed.
Before the web intents working group was disbanded, web intents were available behind
a Chrome ļ¬ag. This highly stylised and non-oļ¬cial visualization provides a glimpse of
how these worked on a Chromebook.
Which service should be used for saving?
App suggestions from Chrome Web Store:
Evernote Add to Chrome
81. CONNECTED STUFF OUT IN
THE WORLD
DEVICE
APPAPP
APP
The last couple scenarios
all began (and ended) with an
app (the browser is also an app :-)
Next weāll talk about ways to
enable interactions between
other users, devices and
connected āthingsā?
83. NFC is a simple but powerful wireless technology that
makes it easy to complete transactions, exchange digital
content, and connect electronic devices.
84. Apple doesnāt yet support NFC :-(
Supported on most BlackBerry
and Windows Phone devices.
1 million NFC-enabled Android
devices activated each week*.
*Source: Google I/O 2013. Also of interest are the Mozilla NFC web API, a PhoneGap plugin, and the W3C NFC working group.
Apple appears to have no plan to support NFC and may instead focus
on Bluetooth LE. These technologies overlap but each has its
strengths. Itās a shame that Apple is as usual going its own way.
85. Receive small amounts of data
from an unpowered object
the NFC tag is
momentarily
powered by the
deviceās NFC ļ¬eld
NFC enabled devices operate at a very short range (max. 4ā/10cm)
and can communicate with two types of āthings.ā
Exchange data of any size
with another powered device
86. The word ādataā downplays the power of a potential
NFC data exchange. Here are a few examples...
87. Touch the poster
(which contains a
passive NFC tag) to
receive a product-
related URL.
(...similar to a QR code but at
least you donāt need to own,
open and activate a separate
QR code reader app)
Share a URI
OBJECT DEVICE
data
browser
opens and
loads the URI
88. Share a dataset
While using the British Airways
app, tap your NFC device to an
NFC-enabled (e-ink display)
luggage tag to transfer your
luggage and ļ¬ight data.
(Currently in Beta. This is a basic guess of how it will
work. The e-ink image can last for weeks and only
requires power when the tag is being written. )
OBJECTDEVICE
data
Source: British Airways to oļ¬er NFC luggage tags
89. While playing a video using the
YouTube app, touch your phone
to a Smart TVās NFC logo...
Share a context
2 Loads the video
3 Sets the playhead location
4 Adjusts any other settings
1 Opens the TVās YouTube app
(This is easy to demonstrate using two smartphones
but not sure if the YouTube app on any NFC-
enabled TVās support this functionality.
In cases where the app isnāt yet installed, the device
automatically takes you to the page on Google Play
where you can download it.)
DEVICE
data
DEVICE
90. Tap to send the ļ¬le
1 Activates Bluetooth (if not already on)
2 Pairs the devices
3 Initiates Bluetooth streaming
Share media
4 Disconnects Bluetooth once complete
Progress is visible in the
notiļ¬cation window
e.g. PDF, mp3, mp4, MPEG
(or Wi-ļ¬ Direct)
DEVICE
data
DEVICE
(large)
Play using your
favourite app...
(uses a āviewā
intent on Android!)
91. Touching the headphoneās
NFC logo to your NFC phone...
2 Activates Bluetooth
3 Pairs the devices
4 Initiates streaming of the
song thatās currently open
on your phone
1 Powers up the headphones
Initiate a connection
DEVICE
data
DEVICE
93. NFC
payment
share voucher with a friend
and so on...
in-store oļ¬er:
check-into
Facebook for
10% oļ¬
....later that day
redeem
10% oļ¬
VIEW
grab QR code
voucher from web
begin
here...
download
brand
loyalty app
see something
you like! share a photo
tell 20 of your
best friends...
conversation
ensues...questions arise
+10!!
friends say
go for it!
browse
reviews
tap POP
display to
get reviews
share
them
97. http://www.ļ¬ickr.com/photos/comedynose/4328893766
ā¦in a world where everything is connected
every company is now a technology company
ā...itās really rather simple, in the future, app development is
going to be just as important as property development.ā
- Philip Clarke, CEO, Tesco supermarkets
http://www.ļ¬ickr.com/photos/78170556@N08/6992639132
98. the entire service,
the entire company...is the app
smart POP
contactless
payment
loyalty
just-in-time
inventory
global supply chain
accountability
privacy
personalization
sensors
big data
transparency
open data
http://www.ļ¬ickr.com/photos/comedynose/4328893766
APIs
loyalty
104. http://www.ļ¬ickr.com/photos/dcoetzee/3885789043
for what, for whom, where and most importantly, why.ā
- Bill Buxton (in a great many contexts)
for something else. The trick is knowing what is what,
āEverything is best for something and worst
A one-handed ergonomic keyboard from the Buxton collection