WWDC2016 Session 804

Transcript

X-TIMESTAMP-MAP=MPEGTS:181083,LOCAL:00:00:00.000
[ Music ]
[ Applause ]
>> Hello, everybody.
My name is Mike Stern, and
I'm User Experience Evangelist
at Apple.
And it's a great pleasure
to be with you today to talk
about designing for Apple Watch.
Now, in today's session,
we'll look at how
to apply design best practices
and leverage the new
capabilities of watchOS 3
to design Apple Watch
experiences that are fast,
focused, and delightful.
But before we get there, I
want to start with some basics.
Now, after all, some of you
may have never designed a
X-TIMESTAMP-MAP=MPEGTS:181083,LOCAL:00:00:00.000
Now, after all, some of you
may have never designed a
watchOS app.
There are three basic components
to an Apple Watch app;
complications, notifications,
and apps.
A complication is
like a little widget
that people can display
on their watch face.
The term complication comes
from traditional watchmaking,
and it refers to any feature
on a timepiece beyond the
display of hours and minutes.
Complications made the
design, manufacturing,
and repair of watches
more expensive
and more complicated,
hence the name.
Now, fortunately for you,
complications are far easier
to make for Apple Watch and
they're way more powerful.
Complications on Apple
Watch offer the quickest way
for people to access information
and provide a really
fast way to get to apps.
Notifications tell people
about significant events
that they might otherwise
overlook.
And because they're also
interactive, they're a great way
X-TIMESTAMP-MAP=MPEGTS:181083,LOCAL:00:00:00.000
And because they're also
interactive, they're a great way
to push interactions to the
people who use your app.
And lastly, apps offer
a deeper experience
with your product or service.
Now, providing a complication
or making watch-specific
notifications requires you
to also have an app.
These three basic components
are designed to work together.
Each plays an integral role
in the overall user
experience of your watch app.
So, for example, let's say
that I'm ordering
dinner with my watch.
I might start out by tapping
a delivery app complication
to launch the app.
I then use the app
to place an order.
And after doing that, I would
probably receive a notification
with a time estimate about
when my order will arrive.
While I wait for
my food to arrive,
I might periodically
check the complication
to see how much longer
I have to wait.
And when my order
is about to arrive,
I might get another
notification letting me know.
X-TIMESTAMP-MAP=MPEGTS:181083,LOCAL:00:00:00.000
I might get another
notification letting me know.
And finally, if I hadn't already
tipped the delivery person,
I might get a notification
asking me
if I would like to do so.
So that's the basics
about the components.
Now this presentation
will help you to learn how
to design each of these well.
But before we get there, there's
something even more basic,
even more fundamental, that
I'd like to discuss with you.
And that's the concept of time.
Apple Watch was specifically
designed
to support lightweight
interactions,
meaning that people should
be able to get information
and take action in very,
very short amounts of time.
Now I suppose this is an obvious
point, but it's really easy
to lose sight of this.
Of just how quick
interactions need to be
when you're designing comps
or testing your builds
in simulator.
Now as you design your app,
always challenge yourself
to find faster and less
complicated user flows.
X-TIMESTAMP-MAP=MPEGTS:181083,LOCAL:00:00:00.000
to find faster and less
complicated user flows.
There's always a
way to optimize.
For instance, many
of our built-in apps
have been made simpler
and quicker to navigate.
Previously, starting a
workout required you to go
to the Home screen,
find and launch the app,
select a workout type, pick
a goal or reuse the one
that you used last,
and then tap Start.
The new flow is much simpler,
especially if you use
the workout complication.
You just tap the complication,
then click Start,
and you're off.
Now Quick Start lets
people bypass the screen
for selecting their workout
goal and removes the need
for a separate Start button.
Now most people workout the
same way, day in and day out.
So, for those people,
it just takes two taps
to start a workout.
And the UI shown
while you're working
out has also been optimized
for faster interaction.
Previously, there
were seven screens
that people could swipe through.
One for controls, and one for
each of the workout metrics.
X-TIMESTAMP-MAP=MPEGTS:181083,LOCAL:00:00:00.000
One for controls, and one for
each of the workout metrics.
And navigating between these
screens required just way too
much time.
In watchOS 3, there's just two
screens; controls and metrics.
There's basically no need to
navigate until you're done
with your workout or if
you want to take a break.
Now this frees people
up to focus
on what's most important
while they're going
for a run or riding their bike.
Focus on your cadence,
your pace, breathing.
Look out for cars, pedestrians.
Enjoy the scenery,
and try to look cool.
With watchOS 3, the
Apple Watch design
and engineering team rallied
around three important themes
for this release which I
think are relevant to us all.
Those themes are glanceable,
actionable, and responsive.
Glanceable means
presenting information
so that it's immediately
comprehensible.
Your design must communicate
clearly and without distraction.
X-TIMESTAMP-MAP=MPEGTS:181083,LOCAL:00:00:00.000
Your design must communicate
clearly and without distraction.
You should only display
the information that's
most relevant.
Ideally, the information
that your app displays
is also actionable.
This means inspiring people to
take physical action in response
to what your app communicates,
or making it easier for people
to access functionality from
your app or notifications.
And apps should be responsive.
Launch times and screen
loading should be kept
to an absolute minimum.
Content and data should
always be up-to-date,
and UI feedback should
be immediate.
Now to help your apps be
more glanceable, actionable,
and responsive, major
changes were made
to the navigational model and
core architecture of watchOS.
The new Dock provides people
with a browsable collection
of timely and
contextually-relevant moments
from their favorite apps.
Apps in the Dock
are kept in memory
and can periodically
perform background updates,
X-TIMESTAMP-MAP=MPEGTS:181083,LOCAL:00:00:00.000
and can periodically
perform background updates,
which means that navigating to
an app from the Dock is fast
and people will spend
less time waiting
for app content to update.
And once you're in an app,
you can now move directly
between detail screens,
which greatly reduces the
time spent navigating.
These changes can
significantly decrease overall
interaction time.
In fact, with watchOS 3 our
internal target interaction time
was reduced from 5
seconds down to 2.
Now, admittedly, the first time
I heard about this, I thought,
"That is pretty ambitious."
I mean, it literally
takes me about 2 seconds
to say the words "2 seconds".
But, the truth is
that performing tasks
like checking scores for a
game, or checking the weather,
or checking stocks can
and should be that quick.
Now, throughout the day,
you might spend way more
X-TIMESTAMP-MAP=MPEGTS:181083,LOCAL:00:00:00.000
Now, throughout the day,
you might spend way more
than a few seconds checking
the weather, scores, or stocks.
But each of those interactions
should be just a couple
of seconds.
And taking action
should be just as fast.
Simple actions that only require
a single decision work best
on Apple Watch.
People should be able to set
a timer, or turn on an alarm,
or check things off on
their Reminders List
in 2 seconds or less.
Now even if you can't
quite get interaction times
down to 2 seconds, the
act of trying to do
so will help you spot workflow
inefficiencies and find ways
to streamline your app.
All right, so now let's get
down into the details of how
to make really great apps,
notifications, and
complications.
Now, in my humble opinion,
complications are the easiest
X-TIMESTAMP-MAP=MPEGTS:181083,LOCAL:00:00:00.000
Now, in my humble opinion,
complications are the easiest
and most glanceable interaction
that someone can
have on Apple Watch.
Checking a complication
is as easy
as raising one's
wrist and looking.
No additional interaction
is required.
This is definitely
an interaction
that takes 2 seconds or less.
And with watchOS 3 and iOS
10, big changes were made
to raise awareness
about complications
to make them easier to install
and to give them
added capabilities.
So, for starters, you can now
use Apple Watch app on iOS
to browse and configure
complications, which makes a lot
of sense because this is
definitely an interaction
which takes more than 2 seconds.
Now the configuration UI
shows an accurate preview
of how the complication
will look on the watch face,
and it's easy for people to
see what your complication does
and the value it
will provide to them.
The Apple Watch app also
has a gallery of watch faces
that are preconfigured
with complications.
X-TIMESTAMP-MAP=MPEGTS:181083,LOCAL:00:00:00.000
that are preconfigured
with complications.
And there's a section dedicated
to third-party complications.
Now if you've made a
complication bundle,
Apple Watch owners who have your
iOS app already installed will
see your complication here.
If your complication
looks useful,
people can simply
tap to install it.
And this will install your
watch app in the background.
The feature complication
is a really great way
to raise awareness
about your watch apps.
It will now be so much
easier for people to learn
about the complications
that you make.
Now another big change has
to do with performance.
Any app with a complication
on the user's current watch
face will be kept in memory
and have more background
update opportunities.
This means that launch time
is going to be way faster
and app data should
be less stale.
Complications are great app
launchers, and the information
X-TIMESTAMP-MAP=MPEGTS:181083,LOCAL:00:00:00.000
Complications are great app
launchers, and the information
that they display
often motivates people
to want to know more.
So that process has to be quick.
So seeing the current
temperature might make you
curious about this
week's forecast.
Or, seeing that your primary
stock might be doing well could
make you want to know how
the overall market is doing.
And the last big change
to complications relates
to the frequency of updates.
In watchOS 3, your
app has opportunity
to update your complication
50 times in a day.
You control the frequency
and timing of these updates.
So a travel complication
could update most frequently
around the departure and
arrival time of a flight,
while a sport complication
might update most frequently
around a game that
you're following.
By controlling when
updates occur,
your complication can stay
current when it matters most.
Now as you work on
your complication,
X-TIMESTAMP-MAP=MPEGTS:181083,LOCAL:00:00:00.000
consider how external factors
and user activity patterns
might affect the timing
of your complication updates.
So, if you're going to
build an Apple Watch app,
you should make a complication.
There's a reason why they became
so popular among watch
owners and watchmakers.
All of that complexity
was worth the effort.
So I hope I've done a decent
job at least of selling you
on the idea of making
a complication.
And if so, I'd like to
talk to you a little bit
about what it takes to make
a really great complication.
Now the most important
consideration
when designing a complication is
just choosing what information
to display.
The best complications answer
those questions that people tend
to ask themselves
throughout their day.
Now I run most days
before I go to work.
So the night before,
I might check
X-TIMESTAMP-MAP=MPEGTS:181083,LOCAL:00:00:00.000
So the night before,
I might check
to see what time the sun
will rise before setting my
alarm clock.
And when I get up, I want
to know what the
temperature is outside
so I know how to
dress for my run.
And I'll check to see what
time my first meeting is
to make sure I have
enough time to run.
And I'll also check
to see the traffic
to make sure I don't need
to leave really early
to get to work.
Now the answers to these
questions will directly impact
how I plan my day.
And by answering these questions
for me with a simple raise
of the wrist, these
complications provide real
and immediate value
throughout my day.
And complications can be a
really powerful motivator.
They can inspire
you to take action.
More actionable.
The Activity complication,
for example,
shows me progress towards
my fitness goals throughout
the day.
I can see if I'm on track
to filling those rings,
or if I need to go
for an extra-long walk
X-TIMESTAMP-MAP=MPEGTS:181083,LOCAL:00:00:00.000
or if I need to go
for an extra-long walk
with my dogs after work.
And WaterMinder's complication
shows how much progress I'm
making towards my
daily hydration goal.
And it seems I'm actually a
little bit behind, so I'm going
to take this as an
opportunity to drink some water.
Hold on one second.
Ahh.
[ Laughter ]
[ Applause ]
So, if you had to pick just
one thing to communicate
with your complication
to the people
that use your app,
what would that be?
What's the thing that
they're most interested
in knowing throughout
the course of their day?
Does that information
change frequently enough
to remain interesting?
Now, sometimes, the answer to
that question is not so clear.
Now if you can't quite narrow
it down to just one piece
of information, consider
giving people options.
X-TIMESTAMP-MAP=MPEGTS:181083,LOCAL:00:00:00.000
of information, consider
giving people options.
That's what the app
CARROT Weather does.
They let you configure what type
of weather information
you want to see.
Temperature, temperature and
condition, wind, UV index,
precipitation, chance of
precipitation, or humidity.
Now during the summertime
in California, it
hardly ever rains.
So seeing the chance
of precipitation is
completely irrelevant.
0% today. That is
completely shocking.
Of course, just as an aside, I
saw the weather this morning.
It's actually supposed
to rain tomorrow.
So, heads up.
Just in time.
But, you know, during the same
period of time in the summer,
the UV index is incredibly
relevant information.
And allowing this complication
to be customizable is
a really great feature.
And CARROT Weather has
also done a great job
X-TIMESTAMP-MAP=MPEGTS:181083,LOCAL:00:00:00.000
And CARROT Weather has
also done a great job
of making their complication
glanceable.
Each one, except for
just current temperature,
uses a simple and
meaningful icon
to label the value that's shown.
And they don't try to cram in
too much information either
because that would just
lead to text and icons
that are too small to read.
Now if you haven't made
a complication before,
it's important to know
that there are multiple
complication families.
Circular, modular
small, modular large,
utility small, and
utility large.
And new to watchOS
3, extra-large.
I wanted to get a
sound effect for that,
but I didn't have time.
Now each of these complication
families consist of one
or more complication
templates and corresponds
to particular watch faces.
The Color watch face uses the
circular complication family.
The modular watch face uses
the modular large complication
family and the modular
small family.
X-TIMESTAMP-MAP=MPEGTS:181083,LOCAL:00:00:00.000
family and the modular
small family.
The simple utility
and chronograph watch faces use
utility small complications.
And the utility and Mickey watch
faces use the utility large
complication family.
And the all-new extra-large
watch face uses,
does anyone want to guess?
That's right.
Extra-large watch face uses the
extra-large complication family.
You guys are quick.
Now I hope you wrote
all that down
because that information
will never be shared again.
No, I'm just kidding.
All of that information
is available to you
in the watchOS Human
Interface Guidelines.
This is your go-to place
for all information related
to the design of your watch app.
I highly recommend
checking it out.
Now it's important that
you try to make something
for every complication family
so that people can
use your complication
on the watch face
that they like best.
And be sure to use
placeholder data
X-TIMESTAMP-MAP=MPEGTS:181083,LOCAL:00:00:00.000
And be sure to use
placeholder data
for your complication
that's representative
of what people will see
when they actually
use your complication.
Without placeholder data,
it's going to be impossible
for people to anticipate what
your complication will do.
All right.
As you can see, some
complications offer more room
for more detailed information.
On the modular watch face,
if someone has made your
complication the centerpiece,
they certainly care a lot about
what your app has to tell them.
Take this as an opportunity
to provide slightly
more information
that they might find helpful.
In fact, you may want to display
totally different information
based on the complication
family.
If weather information is
really important to you,
there's no reason why you
couldn't have two instances
of the CARROT Weather
complication on your watch face.
Maybe you'd use modular large
to show current temperature
and condition, and modular small
to show chance of precipitation.
X-TIMESTAMP-MAP=MPEGTS:181083,LOCAL:00:00:00.000
and condition, and modular small
to show chance of precipitation.
Now even if you can't quite
figure out what information
to show in your complication,
you can always just
make an app launcher.
The complication for Just
Press Record, which is an app
for recording voice memos,
is just an app launcher.
Tapping it launches
the app of course,
but it also begins
a new recording.
It's super convenient and fast.
So if it's not already clear, we
like complications, like, a lot.
And we think that
Apple Watch owners --
the more Apple Watch
owners learn
about how useful
complications are,
the more complications
they'll want to have.
Now to make it easier to access
all of those complications,
people can now easily switch
watch faces on watchOS 3.
With a simple swipe, you can go
from your workday complication
to the workout watch face, and
from the workout watch face
to the weekend watch face.
Now think about all of
the different things
X-TIMESTAMP-MAP=MPEGTS:181083,LOCAL:00:00:00.000
Now think about all of
the different things
that we do with our time.
Right? The variety
is staggering.
No, seriously.
We workout, we hangout,
we exercise, we travel,
we play sports and do countless
other types of activities.
Now, it'll be easier
to match the watch face
and complications installed to
what it is that you're doing.
And this should lead to
people using a wider number
of complications on Apple Watch.
Make one of those
complications yours.
All right, so that
was complications.
Now, let's move on to best
practices for notifications.
Notifications should
always be useful and timely,
and they should be
carefully designed
to communicate information
with precision and clarity.
In other words, they
should be glanceable.
Keep in mind that the person
receiving your notification
X-TIMESTAMP-MAP=MPEGTS:181083,LOCAL:00:00:00.000
Keep in mind that the person
receiving your notification
could be anywhere and
doing just about anything.
They could be at dinner,
hanging out with friends,
riding on the subway,
getting hydrated,
or in a meeting discussing
something of real importance.
Now, in so many situations,
people are fully engaged
in the task at hand or just
really paying attention
to the world around them.
So your notifications need
to communicate clearly
and get to the point.
Luckily, making your
notification glanceable is not
so difficult.
First, you just need to
provide a meaningful title.
Now notifications
come in two stages,
ashort look and a long look.
And as the name implies,
the short look is there
to give you a sense of
what the notification is
about really quickly.
And the title that you provide
will get displayed here.
Now, in some cases, that title
might tell you everything you
need to know about
the notification.
Second, only show
what's necessary.
I can't stress this enough.
X-TIMESTAMP-MAP=MPEGTS:181083,LOCAL:00:00:00.000
The more you show
in a notification,
the harder it's going to
be for people to focus
on what's most important.
So let's say you're making
a check-in notification
for a travel app.
The notification might
contain all sorts
of potentially useful
information
about the traveler's flight.
But seeing things like the
flight number or your own name
in a notification when it's
just really implied is not all
that important, so
we can just remove
that information altogether.
Third, present important
information first.
By putting the most
important things at the top,
people are more likely to
get the message quickly
without the need to scroll.
And this is really helpful if
someone is carrying stuff around
and they might not be able
to easily swipe the screen
or access the Digital Crown.
So for our check-in
notification,
we might move content
like the flight number
and boarding time a
little bit further
down in the notification.
Fourth, vary the size
and appearance of type
X-TIMESTAMP-MAP=MPEGTS:181083,LOCAL:00:00:00.000
Fourth, vary the size
and appearance of type
to establish a clear
visual hierarchy.
Your notification should
focus people's attention
on the most important
information first.
This notification has all the
right information and it's
in the right order, but
everything here is treated
with equivalent visual weight.
Apple Watch notifications
are very customizable.
You have full control over
font appearance, layout,
background and sash color.
Use this capability to
help people quickly pick
out what's most important.
Now this design really
puts the focus on things
like ticket class, seat number,
departure time, and route.
And the purpose of this
notification that it's time
for you to check in
now, is made very clear.
And lastly,
thoughtfully-designed
notifications often use icons,
graphics, and animations
to convey meaning
quickly and with impact.
Visuals can sometimes
communicate meaning faster
X-TIMESTAMP-MAP=MPEGTS:181083,LOCAL:00:00:00.000
Visuals can sometimes
communicate meaning faster
and more clearly than text.
Icons can help save space
and allow your notification
to display everything
on screen at once.
But be mindful that some
icons may not be universally
understood or could
be misinterpreted.
So you want to look for icons
that are widely understood
across regions and cultures,
or whose symbolism you know
to be clear to the
people who use your app.
And short, meaningful
animations can be a great way
to complement text and to
engage people's attention.
And graphs and other data
visualizations not only provide
for a more interesting visual
experience, but may pack
in far more meaning
than text alone.
But there's more to consider
when it comes to the design
of your notifications.
You also need to think
carefully about why
and when you're sending them.
Getting a notification
at the wrong time can be just
distracting or really annoying.
X-TIMESTAMP-MAP=MPEGTS:181083,LOCAL:00:00:00.000
at the wrong time can be just
distracting or really annoying.
If you got a notification
right now, you would be
so annoyed unless it was about
something even more important
than being here right now,
which is completely
ridiculous [laughter].
Now, because Apple Watch
effectively taps people
on their wrist when they
receive a notification,
notifications are
very hard to miss.
If your app sends
people notifications
that are not genuinely useful,
informative, and timely,
people are likely to just
turn off your app's ability
to send notifications
altogether.
So, how do you know why and
when to send notifications?
Well, the best approach is to
determine what's most relevant
to the people who use your app
and intelligently
time notifications
for when they're
most actionable.
Now I have two really
great apps that --
I have two really
great examples of this.
The first is from the
awesome weather app, Dark Sky.
X-TIMESTAMP-MAP=MPEGTS:181083,LOCAL:00:00:00.000
The first is from the
awesome weather app, Dark Sky.
Dark Sky notifies people
about significant
weather condition changes,
such as when it's
about to start raining
or when rain is about to stop.
Now, in the case of Dark
Sky, relevance is determined
by contextual factors.
Notifications are sent based on
the user's location or proximity
to an approaching or
departing weather system.
And notifications are sent early
enough so that there's time
to get the umbrella out
before it starts pouring
down raining cats and dogs.
Now, because these notifications
are contextually relevant
and timely, they
are more actionable.
Knowing that it's about to
stop raining might motivate me
to get ready to go for a run.
Knowing that it's about to
start raining might motivate me
to walk to my couch
and take a nap.
Now, in addition to contextual
factors, user preferences
and patterns can provide
really great insights
into what people want to know
X-TIMESTAMP-MAP=MPEGTS:181083,LOCAL:00:00:00.000
into what people want to know
and when they want
to know about it.
Now, to explain, let's
look at the other example.
Streaks is an app that helps
people form positive habits
and also just won an
Apple Design Award.
People can pick up to
six tasks that they want
to do on a daily basis.
Now, as the name suggests,
the objective here is to go
on streaks of daily tasks
because doing something
every day helps it
to become a routine.
So, if you want to
get into the habit
of doing core-strengthening
exercises every day.
Which I should be doing or
learning how to play guitar,
or remembering to refill your
dog's water bowl or take him
for a walk, Streaks is going
to help you remember to do it.
My dogs have never been
so fit and hydrated.
They don't realize it, but
they totally love this app.
Of course, the whole point
here is that these are things
that people want to
do on a regular basis
but just can't seem
to remember to do it.
X-TIMESTAMP-MAP=MPEGTS:181083,LOCAL:00:00:00.000
but just can't seem
to remember to do it.
So Streaks uses notifications
to keep people on track.
But these reminders are
only effective if they come
at just the right time.
They should arrive close to
when people are most likely
to take action.
Or, put another way, when
they're most actionable.
But how does Streaks
know when that is?
Well, at first, they don't.
To explain what it does, let's
look at a specific example.
Now I'm trying to get into
the habit of playing guitar.
And at a somewhat randomized
time towards the end of the day,
I'll get a reminder
to play guitar.
It doesn't arrive so late
that I might not have time
to play guitar or that
I'm already asleep.
But it's not so early that
I'm, say, still at work.
So, for simplicity's sake,
let's say I get the
notification at 7:00 PM.
Now, that's a bit early.
So I can tap a 30-minute
snooze button and keep delaying
X-TIMESTAMP-MAP=MPEGTS:181083,LOCAL:00:00:00.000
So I can tap a 30-minute
snooze button and keep delaying
and delaying that notification
until I'm finally
able to play guitar.
And when I play guitar,
I mark that task
as complete in the app.
Streaks takes note of this time.
Day after day, each time I
mark that task as complete,
Streaks gets an increasingly
more accurate understanding
of when I typically play guitar.
Streaks uses that time
to schedule my reminders
to automatically arrive
at just the right moments.
It's such a simple
and elegant heuristic.
The actual timing
is 30 minutes prior
because obviously I can't just
drop everything at the drop
of a hat and start
playing guitar.
However, automatically
adjusting the timing
and notifications might not
always be the right choice.
Some tasks you want to do
at very specific times,
and Streaks gives you
that capability as well.
Or maybe you don't want
individual notifications,
you just want one
single daily reminder.
X-TIMESTAMP-MAP=MPEGTS:181083,LOCAL:00:00:00.000
you just want one
single daily reminder.
So Streaks gives
you that choice.
And you can disable
individual task notifications
or turn off notifications
altogether.
So by smartly choosing when
notifications are scheduled,
and giving users full
control over why and when they
like to be notified,
the reminders
that Streaks sends are less
likely to be disruptive,
ignored, and unwelcome.
Now the notifications
that Streaks sends
are actionable insofar
as they remind people to
perform what's typically a
physical task.
But making notifications
actionable also means quite
literally adding actions
to your notifications.
Now I encourage you to explore
how to make the notifications
that you send actionable.
Being able to quickly triage
from your wrist is a
very powerful thing.
Notifications can push
interactions to the people
who use your app, and they're
great for offering brief periods
of engagement to people
throughout the course
X-TIMESTAMP-MAP=MPEGTS:181083,LOCAL:00:00:00.000
of engagement to people
throughout the course
of their day.
Now you can have up to four
actions in a notification.
And be sure to only show
actions that are truly relevant
to the content of
your notification.
Make sure that actions are
labeled clearly, succinctly,
and use action-oriented verbs.
And try to focus on actions
that can be completed
in one tap just one
tap and you're done.
However, sometimes one
or two additional steps
might be required.
Now multi-step flows will
bring people into your app,
and that used to be
a little bit painful
because apps would take a
little bit of time to load.
But in watchOS 3, when your
app's notification is displayed,
your app will be launched
in the background.
This gives you an opportunity
to make sure your app's data is
current and get your app ready
for people to show up.
So don't shy away from
taking people into your app
if that's what's necessary.
Now, speaking of taking
people into your app,
it's time to talk about apps.
X-TIMESTAMP-MAP=MPEGTS:181083,LOCAL:00:00:00.000
it's time to talk about apps.
watchOS 3 will profoundly
change how people experience
and interact with apps.
Let's take a look at the
most significant changes
and what they'll mean to you.
Let's start with the new Dock.
People can put up to 10 of their
favorite apps into the Dock,
and every app in the Dock is
kept in memory to make getting
from the Dock into an app fast.
And what's shown are
snapshots from each app.
These snapshots should
be designed
to be informative
and glanceable.
And snapshots from your app
can be regularly updated
to keep them current.
Apps in the Dock are
launched in the background
at least once an hour.
This lets you fetch new
data, update your app's UI,
and request that the
system takes a new snapshot
of your app if it's necessary.
And when your app is viewed in
the Dock, it'll be woken up so
that it can update its
snapshot if content is changed.
X-TIMESTAMP-MAP=MPEGTS:181083,LOCAL:00:00:00.000
that it can update its
snapshot if content is changed.
Now when someone puts
your app in the Dock,
you should be flattered.
Being in the Dock means that
your app contains information
that people want to be
regularly updated about.
Because of this, it's
important that the snapshots
of your app are not only
current but also relevant.
Now, in some situations,
showing people the last screen
that they saw when they were
using your app might not be
that relevant.
Fortunately, watchOS 3 provides
an API for navigating people
to a different screen
than the one
that they were last looking at.
So, for instance,
imagine a baseball app
that shows a list view of
current and upcoming games.
And of course, each of these
is tapable so that you can go
to a detail screen
about those games.
Okay. Now, imagine yourself
as a user of this app.
The last time you were in
the app, you were looking
at this particular game.
X-TIMESTAMP-MAP=MPEGTS:181083,LOCAL:00:00:00.000
at this particular game.
And when you exit out and
look at the app in the Dock,
you probably expect to continue
to see the details
about that game.
And when the game
ends, go Giants.
You probably still expect to see
this game in the detail view.
But after a little while,
the details about this
particular game become less
and less relevant.
You may have learned
about the final score
from a notification the app
sends, or from a friend,
on Twitter, in the news.
At some point, the content here
becomes completely irrelevant.
You're not interested
in that game at all.
Perhaps you're going
to be more interested
in seeing the next
day's schedule.
Or if your favorite team is
playing a new game that's
already started,
wouldn't you want
to see the details
about that game?
Now these are the sorts
of questions that you need
to be asking about your app.
And as you do so, I want you
to consider the following
best practices.
First and foremost,
your objective is
X-TIMESTAMP-MAP=MPEGTS:181083,LOCAL:00:00:00.000
First and foremost,
your objective is
to proactively anticipate
user interests and needs.
Put yourself in their
place and think it through.
Graphing events onto a timeline
is a very helpful technique
for doing this.
Plot out significant events
in time and then ask yourself,
"How do these events influence
what people would want to know?"
In the hypothetical baseball
app example I just went through,
I speculated that people will
want to see game details around
or during the times where
games are being played.
While, at other times, those
same people might want to know
about the overall
league schedule.
However, this is probably
a gross oversimplification.
Individual preferences
can have a big impact
on what's most relevant
to people.
For instance, a fair-weather
fan who only cares
about one team might expect to
see something totally different
than a hardcore baseball fanatic
who wants to follow every game.
And for other apps, other
contextual factors like time
X-TIMESTAMP-MAP=MPEGTS:181083,LOCAL:00:00:00.000
And for other apps, other
contextual factors like time
of day and location
can have a huge impact
on what people want to see.
Now, as a general rule,
people don't always love it
when an app changes
in unpredictable ways
and the state isn't saved.
And it can be confusing
or disorienting.
So if you choose to navigate
people to a different view,
you want to do so in a way
that's logical and predictable.
The hope is that
people won't even stop
to realize what's going on.
But if they do, they
should be able
to make some really accurate
guesses about why the state
of your app's UI changes
from time to time.
And I would also recommend
against making the snapshot
look radically different
from your app.
This can make your app a
little bit less recognizable,
and may be harder to find.
Now it's totally fine to just
focus on some information
or maybe hide some stuff
that isn't as relevant
when your app is
shown in the Dock.
But, you know, if you want
to exaggerate the size
of certain things for
legibility that might be fine.
But don't make it look
completely different.
X-TIMESTAMP-MAP=MPEGTS:181083,LOCAL:00:00:00.000
But don't make it look
completely different.
Now next, avoid showing
things like alerts,
or confirmation dialogues, or
error states in your snapshot.
When seen out of context,
these sorts of screens
may not be very helpful.
And in fact, they might
be easily misinterpreted
or make no sense at all.
So, depending on the situation,
consider programmatically
dismissing these screens
after some period of time.
And lastly, optimize your app
interface for being displayed
in a miniaturized form.
Now, in the Dock, apps
get scaled down to --
and this is, like, just
a ballpark rough figure
but 62.4851% of their
full size UI.
You'll want to avoid
text and graphics
from becoming illegible
at this small size.
Now for this very reason, the
font weight for status bars
and a lot of text in the
built-in apps was increased
from regular to medium.
At smaller sizes, bolder
fonts are more legible.
And for really key information,
try using large format type.
X-TIMESTAMP-MAP=MPEGTS:181083,LOCAL:00:00:00.000
And for really key information,
try using large format type.
This may require removing some
stuff out of your interface
to make space, but that's not
such a bad thing to do anyway.
Now, by following these
guidelines, your apps will be
as glanceable as
possible in the Dock.
And speaking of glanceable,
some of you may be
wondering about Glances.
Glances were designed to be a
browsable collection of timely
and contextually-relevant
moments
from the user's favorite apps.
Not coincidentally, the Dock
serves essentially the same
purpose while simplifying the
overall platform experience.
In a way, Glances
evolved into the Dock.
And the Dock, in turn, made
Glances kind of redundant.
So they were removed
from watchOS.
With that said, the time and
thought that you may have put
into designing your Glances is
totally applicable to thinking
about how to design your app
to look great in the Dock.
Okay. So, the next big change
to apps on watchOS 3 is a simple
X-TIMESTAMP-MAP=MPEGTS:181083,LOCAL:00:00:00.000
Okay. So, the next big change
to apps on watchOS 3 is a simple
but powerful improvement to how
people navigate within apps.
Most existing Apple Watch apps
are structured hierarchically.
Basically, a top-level list
and a bunch of detail screens.
Now that's not so
surprising because we tend
to organize data hierarchically.
Unfortunately, navigating
between those screens can
be inefficient as you have
to return to that top-level
view every single time.
So, for example, if I want
to get to those detail views,
I select an item,
drill in, go back,
select another item,
drill in, go back.
So forth and so on.
It's kind of like being in a
room in a house and you want
to get to the room
right next to you.
But in order to get there, you
have to go up a flight of stairs
and then back down
another flight of stairs.
It'd be so much more efficient
if there was just a
door to take you there.
So in watchOS 3, we now
have doors, I guess.
It's now possible to navigate
directly from one detail view
X-TIMESTAMP-MAP=MPEGTS:181083,LOCAL:00:00:00.000
It's now possible to navigate
directly from one detail view
to another by swiping vertically
or using the Digital Crown.
Think of it like vertical paging
from one detail to the next.
Now if your app is already
structured hierarchically,
you should really consider
enabling this feature.
But one thing to point out is
that this behavior
will only work
when the detail screens are
not taller than the display.
So with the previous
version of Weather,
the 10-day forecast made
the screen a lot taller.
It was accessed by scrolling
down from today's forecast.
In the new version of Weather,
that information was pushed
to a child view so that
everything could fit
on screen at once.
So if you want to opt into
this behavior, you may have
to refactor your design
to make everything fit.
And for those of you
with a page-based app,
now is a really good time
to switch to hierarchy
or to consider doing so.
Navigating with the Digital
Crown is far more efficient
than swiping horizontally
from one page to another.
X-TIMESTAMP-MAP=MPEGTS:181083,LOCAL:00:00:00.000
than swiping horizontally
from one page to another.
And page-based apps do
not support hierarchy.
Obviously, that's not
a limitation here.
And having a top-level
list view of a lot
of detail items can
be really useful.
By moving from a page-based
structure to a hierarchical one,
our Weather App can
show the current high
and low temperatures for
multiple cities at once.
This is very handy.
Okay. Now, the third
big change for apps
on watchOS 3 relates
to stickiness.
Now besides just being
a lot of fun to say,
stickiness describes how
long an app will remain
in the foreground.
On watchOS 3, apps can
stick around for 8 minutes,
which is quite a bit
longer than before.
So when someone is
using your Watch app
and then drops their wrist,
your app will be the
first thing they see
when they raise their
wrist again as long
as they do so within 8 minutes.
In fact, with every
raise of the wrist,
that timer gets reset
back to 8 minutes.
X-TIMESTAMP-MAP=MPEGTS:181083,LOCAL:00:00:00.000
Now making apps stickier is
a really significant change.
Apple Watch apps are intended
to compliment activities
that can occur over many
minutes of time, or even hours.
But during those periods, the
Watch display can be asleep
for many minutes at a time.
So, one example might
be a grocery list app.
When shopping, most of your
time is spent checking prices,
reading labels, inspecting
produce,
trying to avoid crashing
into other shopping carts,
and trying to look cool.
There are so many activities
that are just like this.
They're what we might
call sessions
or session-based activities.
Cooking dinner, playing sports,
working out, getting directions.
These things all take
extended periods of time
in which people will
periodically check their watch
to stay on task.
Stronger stickiness puts you
immediately back into the app
where you left off, which
saves a lot of time.
Okay. Now, the fourth
major watchOS change
X-TIMESTAMP-MAP=MPEGTS:181083,LOCAL:00:00:00.000
Okay. Now, the fourth
major watchOS change
for apps involves
letting people know
when it's okay to
drop their wrist.
When people initiate
a task in your app,
they expect to get
confirmation feedback.
Did the task succeed
or did it fail?
Unfortunately, providing
definitive success of failure,
conformation of success or
failure can take a while.
Slow networks, weak
Wi-Fi signal,
and long Bluetooth ranges might
create communication delays
or remote delays.
Apps that allow people to
control physical devices,
like garage doors or window
blinds, might be unable
to provide completion feedback
until those devices have
fully opened or closed.
And some services
such as food delivery
or ride-ordering apps
may involve communication
with other people.
And as we all know, people
do not always get back
X-TIMESTAMP-MAP=MPEGTS:181083,LOCAL:00:00:00.000
And as we all know, people
do not always get back
to you promptly.
Now on an iPhone or a Mac,
you would ordinarily
keep people engaged
with your app while
you're trying to get them
that confirmation feedback.
Progress indicators are a way
to hold people's attention.
They make people
anticipate feedback.
They basically say,
"Hold on a second.
I'll be right with you."
But, however, it might
be more than a second.
All the while, the person
who's using your app has their
wrist raised.
Their shoulder starts
to get a little tired.
Seconds start to
feel like minutes.
It really starts to slow down.
So, to avoid this
situation on Apple Watch,
you should use an NSURL
background download task
to communicate with your server.
This does two things.
First, it helps to make sure
that you can communicate
to your server before
your app gets suspended.
And second, when
your server responds,
Apple Watch will
wake up your app.
X-TIMESTAMP-MAP=MPEGTS:181083,LOCAL:00:00:00.000
Apple Watch will
wake up your app.
And then, in turn, you can
quickly run in the background
and do something like
send a local notification,
which is also new to watchOS
3, to provide feedback
to the person who's
using your app.
So, for example, say you're
working on a food-ordering app.
When someone places a
food order, your app needs
to make sure that the
restaurant can fulfill the order
and provide an estimated
delivery time.
You wouldn't want people to keep
waiting while your app figures
these things out.
Instead, it's way better to
provide immediate feedback
that their order has been
sent to the restaurant.
You can also let people know,
you also should let people know.
That once the restaurant
accepts the order
and provides an estimated
delivery time,
you'll send a final
confirmation to them
that the order has been
processed and is on its way.
Now, if you've done this
right, people should feel free
to drop their wrist, trusting
that your app is working hard
X-TIMESTAMP-MAP=MPEGTS:181083,LOCAL:00:00:00.000
to complete the task that
you've assigned to it.
And if all goes well, you send
a local notification to people
to let them know that the
order was successfully placed
and it is on its way.
And if there's a problem,
clearly state what went wrong
and help people address
the issue
with minimal additional
interaction.
Now, the key to making
all of this work is trust.
People need to trust that your
app works, that it won't crash,
and that you'll make sure
that they stay informed
about whether the task
succeeded or failed.
And related to trust, you
never want to mislead people
into thinking that a
task is fully complete
if it's actually
still in progress.
That's basically lying, which
is not good for building trust.
Okay, so that was a lot
of new stuff about apps.
And there's still a little bit
more to cover, but I just wanted
to pause here for a
second and take stock.
We looked at the new Dock
UI and how to make your app
X-TIMESTAMP-MAP=MPEGTS:181083,LOCAL:00:00:00.000
We looked at the new Dock
UI and how to make your app
as glanceable and
responsive as possible.
We saw how the Digital
Crown will make navigating
between detail screens
and hierarchical apps
way more efficient.
We learned how session-based
apps will benefit
from changes to app stickiness.
And we just saw how the ability
to schedule local notifications
while your app runs
in the background
can give the people
who use your app the
confidence to drop their wrist
to keep interactions quick.
Now we think that
these improvements
to watchOS will empower you to
create streamline user flows
that shorten user
interaction times.
Now, if the Apple Watch
team had stopped there,
this would have been a
really significant release.
I would have had plenty to
talk to you about today.
But they did not stop there.
They're like a bunch
of overachievers.
The kind of people who made me
look really bad in high school.
In watchOS 3, there's
some really cool new APIs
and frameworks to let you
do some amazing things.
X-TIMESTAMP-MAP=MPEGTS:181083,LOCAL:00:00:00.000
and frameworks to let you
do some amazing things.
For starters, watchOS 3 now
has SpriteKit and SceneKit,
our 2D and 3D graphics
frameworks.
SpriteKit and SceneKit let you
render and animate graphics.
They let you make elements
respond to gestures,
or to animate things
programmatically.
And you can implement
physics facts.
I mean, it's crazy.
Force fields, detect
collisions, and more.
Now you might think about these
things as being technologies
for games, but you can
use them in apps as well.
And watchOS 3 has
gesture support.
Up until now, touch input
was handled indirectly.
The controls and views that you
had in your app would respond
to touch events on your behalf.
Now, you have the ability to
do something totally custom.
So you can do something
custom with tap, or swipe,
or pan, or long press.
This one takes a
little bit of time.
X-TIMESTAMP-MAP=MPEGTS:181083,LOCAL:00:00:00.000
This one takes a
little bit of time.
Okay, in watchOS 3,
you now have access
to raw Digital Crown events.
You can use this data to
alter the color, dimensions,
and other visual
properties of UI elements.
Or, you can use the
Digital Crown
for changing selection
or modifying values.
So, what can you do with
all of these capabilities?
Well, for starters,
many of you have wanted
to visualize data
using a ring or an arc.
With SpriteKit, you
can draw an element
like this programmatically so
that you can easily animate
between any two arbitrary
values.
You can use the default
ease-in curve
which provides a really
nice ease in and ease out.
Or, you can do something
custom with ease-in curves
for a bouncy animation,
or really any kind
of animation that you'd like.
There's a ton of open
source ease-in curves made
by the very generous people
in the SpriteKit
developer community.
And you can even do things
like modify the fill color
of the rings to reflect
the current value.
X-TIMESTAMP-MAP=MPEGTS:181083,LOCAL:00:00:00.000
of the rings to reflect
the current value.
Data visualization, like charts
and graphs, can really come
to life with animation.
By drawing this chart
programmatically,
we can animate the built-in
to add visual interest,
or we can use animation
to draw people's attention
to a particular part
of the chart.
SpriteKit properties
are mutable,
so you can easily
repurpose one chart
to display different
properties based on user input.
Or, perhaps you want
to let people inspect
different values along the graph
with a pan gesture.
Totally. Or, better still,
you can let people
use the Digital Crown
to do the same thing.
Or, let people zoom
into the chart.
Or, maybe let people scroll.
And since you have full
control over the Digital Crown
and how the graph responds,
you can control how fast
or slowly things happen
in response to rotation.
Now, I could go on.
This is a lot of fun to just
try to think about this stuff,
X-TIMESTAMP-MAP=MPEGTS:181083,LOCAL:00:00:00.000
This is a lot of fun to just
try to think about this stuff,
but that would take all of
the fun out of it for you.
Now, I encourage you to
learn more about SpriteKit
and SceneKit, and experiment
with using these technologies
to create richer and more
meaningful experiences.
But just remember,
with increased freedom comes
increased responsibility.
Animating something just because
it looks cool is really not a
good reason.
When used well, animation
helps communicate meaning more
quickly, and thereby
shortens interaction times.
Similarly, making a graph
interactive should provide a
richer and more informative
user experience,
and ideally reduce the need for
more complicated or dense UIs.
Okay. So, we've covered a lot
of ground today, but I did want
to leave you with
one final thought
about designing your watch app.
Making a great Apple Watch
experience requires keeping
things simple.
X-TIMESTAMP-MAP=MPEGTS:181083,LOCAL:00:00:00.000
things simple.
But making something simple
is not so simple to do.
And bonus points if you
know where this is from.
Keeping things simple
involves making hard choices
about what your app will do.
It means saying no to a lot
of really interesting-sounding
ideas.
But just because you can
do something does not mean
that you should.
Keeping things simple
also means thinking deeply
about the journey that people
take throughout the course
of their day.
People will experience
your app over time.
And the way that you design
your app should be a reflection
of this.
Think less in terms of
static screens and more
in terms of user flows.
Account for the fact that
these flows are not continuous,
uninterrupted experiences.
People will drop in at arbitrary
times throughout the day.
And when they do, they'll always
expect your app to be current
and relevant to their
constantly-shifting needs.
X-TIMESTAMP-MAP=MPEGTS:181083,LOCAL:00:00:00.000
and relevant to their
constantly-shifting needs.
Your app should anticipate
what people want to do
at any given moment, and attempt
to proactively offer information
and functionality that's
contextually relevant
and timely.
Now doing that right
is not so simple.
Designing for Apple Watch
is different than designing
for an iPhone, an
iPad, Apple TV, or Mac.
What we know about
designing and building apps
for these devices has
shaped our notions
about how complex apps should
be, how people navigate them,
and how much time they're
willing to engage with your app.
Try to recognize and
challenge your own
deeply-rooted assumptions.
This is easier said than done.
I know. But this is a crucial
step towards making a really
great watch app.
Now, for Apple Watch,
perhaps the best advice
X-TIMESTAMP-MAP=MPEGTS:181083,LOCAL:00:00:00.000
Now, for Apple Watch,
perhaps the best advice
that I can offer you
is to think in terms
of features and not apps.
Making something great for Apple
Watch may involve offering just
one feature.
Just Press Record is
essentially just one feature.
The complication is
the Record button,
and the app is the recording
interface and Stop button.
It works great.
And I literally just described
the app in one sentence.
Two seconds goes by in a flash.
There's nothing simple
about designing
for such brief interactions.
But I hope the concepts
and techniques
that we discussed today will
empower you to do just that.
And I'm really excited to
see what you can do with all
of the new capabilities
in watchOS 3.
A lot of people worked
hard on this release,
and all of that work was in
the service of helping you
to build more innovative,
delightful,
and platform-defining
experiences.
X-TIMESTAMP-MAP=MPEGTS:181083,LOCAL:00:00:00.000
and platform-defining
experiences.
Okay. So for more information
about what we covered today,
please check out the video page
where there's a ton
of extra resources.
Again, definitely go and check
out the watchOS Human
Interface Guidelines.
There's a ton of really
great resources there.
And we're going to continue
updating this over the summer,
so check in regularly.
We also have a lot of great
Watch engineering sessions.
I would definitely
recommend going and checking
out SpriteKit one and watching
some of the videos of the ones
that have already happened.
And this year, we had a lot of
really good design sessions.
Some of them are still to come.
I highly recommend Inclusive
App Design, which will help you
to design for accessibility
and to be really great
for people around the world.
I also recommend the
video this morning
about Typography and Fonts.
And there's one more
design session
about Iterative UI Designs
that you can take your ideas
and refine them and come up with
something that's really awesome.
With that, thank you
very much for your time.
[ Applause ]