Detailed illustration of Apple Watch onboarding flow with some UX analysis, criticism and suggestions. A lot of screen shots and photos.
User onboarding is the process of improving a person's success with a product or service.
2. In this deck I’ll illustrate how Apple has designed
user onboarding flow for the Apple Watch.
And will put in my two cents’.
• Blue is OK
• White is neutral and suggestions
• Yellow is criticism
• Red is WTF Apple?
6. If by some reason I
don’t know what
Apple Watch is,
here I can get an
idea. Different
versions of the
watch with
different screens
rotate in loop.
Nice detail, the title
depends on time
Ok, that’s clear
7. Nice detail, the title
depends on time
Ok, that’s clear
If by some reason I
don’t know what
Apple Watch is,
here I can get an
idea. Different
versions of the
watch with
different screens
rotate in loop.
A single clear call
to action. Good.
8. Nice detail, the title
depends on time
Ok, that’s clear
If by some reason I
don’t know what
Apple Watch is,
here I can get an
idea. Different
versions of the
watch with
different screens
rotate in loop.
A single clear call
to action. Good.
But why so small
text and pale
button?
9. Nice detail, the title
depends on time
Ok, that’s clear
If by some reason I
don’t know what
Apple Watch is,
here I can get an
idea. Different
versions of the
watch with
different screens
rotate in loop.
Useful for those
who don’t read
news.
A single clear call
to action. Good.
But why so small
text and pale
button?
10. If by some reason I
don’t know what
Apple Watch is,
here I can get an
idea. Different
versions of the
watch with
different screens
rotate in loop.
Useful for those
who don’t read
news.=?
A single clear call
to action. Good.
But why so small
text and pale
button?
Is this similar to Learn more?
11. If by some reason I
don’t know what
Apple Watch is,
here I can get an
idea. Different
versions of the
watch with
different screens
rotate in loop.
Useful for those
who don’t read
news.
A single clear call
to action. Good.
But why so small
text and pale
button? =?
Is this similar to Learn more?
No. Explore is educational
videos inside the app while
Learn more opens Apple web
site in web browser.
12. If by some reason I
don’t know what
Apple Watch is,
here I can get an
idea. Different
versions of the
watch with
different screens
rotate in loop.
Useful for those
who don’t read
news.
A single clear call
to action. Good.
But why so small
text and pale
button? =?
Featured what?Is this similar to Learn more?
No. Explore is educational
videos inside the app while
Learn more opens Apple web
site in web browser.
13. If by some reason I
don’t know what
Apple Watch is,
here I can get an
idea. Different
versions of the
watch with
different screens
rotate in loop.
Useful for those
who don’t read
news.
A single clear call
to action. Good.
But why so small
text and pale
button?
Is this similar to Learn more?
No. Explore is educational
videos inside the app while
Learn more opens Apple web
site in web browser.
=?
Featured what?
Apps. Why not
just “Apps”?
14. If by some reason I
don’t know what
Apple Watch is,
here I can get an
idea. Different
versions of the
watch with
different screens
rotate in loop.
Useful for those
who don’t read
news.
A single clear call
to action. Good.
But why so small
text and pale
button?
Is this similar to Learn more?
No. Explore is educational
videos inside the app while
Learn more opens Apple web
site in web browser.
=?
Search for what?
Featured what?
Apps. Why not
just “Apps”?
15. If by some reason I
don’t know what
Apple Watch is,
here I can get an
idea. Different
versions of the
watch with
different screens
rotate in loop.
Useful for those
who don’t read
news.
A single clear call
to action. Good.
But why so small
text and pale
button?
Is this similar to Learn more?
No. Explore is educational
videos inside the app while
Learn more opens Apple web
site in web browser.
=?
Search for what?
For apps. Why not
in Apps?
Featured what?
Apps. Why not
just “Apps”?
16. Useful for those
who don’t read
news.
A single clear call
to action. Good.
But why so small
text and pale
button?
Is this similar to
No.
videos inside the app while
Learn more
site in web browser.
=?
Search for what?
For apps. Why not
in
Featured what?
Apps. Why not
just “Apps”?
Btw, where should I tap to order the watch?
19. This is cool!
I don’t need to go
to my General
Settings >
Bluetooth and look
for the watch
20. If something goes
wrong you can use
old fashioned
Bluetooth pairing.
This is cool!
I don’t need to go
to my General
Settings >
Bluetooth and look
for the watch
22. It’s time to get our hands on the watch.
DISCLAIMER.
If you proceed to the next page you will see macro shots of my hairy wrist.
The good news is the wrist will mostly be covered with an Apple Watch.
29. Meanwhile on
the phone
Clear instruction
on what to do next.
Back button is a
smart move.
What if I tapped
Chinese?
30. Meanwhile on
the phone
Clear instruction
on what to do next.
Back button is a
smart move.
What if I tapped
Chinese?
And call to action.
31. Meanwhile on
the phone
Wow! Apple, thank
you for these small
pleasing details!
An animated star
cluster instead of
boring QR code.
By the way, today I read a good article from Facebook’s product design director Margaret Gould Stewart about these
nice touches and surprises that make people feel that we (designers) care about their experience.
Why Beauty Matters: Unexpected Learnings from a Refugee Camp
32. Now let’s imagine you align your phone’s viewfinder with the watch.
Unfortunately I don’t have a relevant photo as the phone was occupied.
34. And in a moment, the star cluster animation turns into the image consistent with what is on
the watch screen which is also very close to engraving on the back of the watch case.
35. To make sure you connected the
right watch? Looks good anyway.
53. Isn’t this too small
and not obvious?
I know it’s a
standard button
in iOS, but still…
54. Shouldn’t I read
this before
connecting my
Apple ID?
Isn’t this too small
and not obvious?
I know it’s a
standard button
in iOS, but still…
55. Shouldn’t I read
this before
connecting my
Apple ID?
Isn’t this too small
and not obvious?
I know it’s a
standard button
in iOS, but still…
Newbie like: “What
is Digital Touch
and Apple Pay?
Not convincing.
Skip”.
57. What if this screen looked like this?
Btw, tapping
Digital Touch and
Apple Pay user
could learn more in
a modal view with
external links to
more details on the
Apple web site.
58. What if this screen looked like this?
Btw, tapping
Digital Touch and
Apple Pay user
could learn more in
a modal view with
external links to
more details on the
Apple web site.
Am I getting
tedious?
67. Wait! It’s about
Messages.
The difference
between this and
previous screen is
imperceptible!
I’d suggest to add
icons to both
screens for better
differentiation.
Did anything happen?
73. Still think that
“What is this?” title
is redundant.
OK what?
Where is call to action by the way?
74. Still think that
“What is this?” title
is redundant.
OK what?
Where is call to action by the way?
If there is no choice, why didn’t Apple include this to Terms and
Conditions and enable Location Services in stealth mode?