Tip:
Highlight text to annotate it
X
ALOK CHANDEL: Hello, my name is Alok Chandel.
I'm a user experience designer on Project Glass.
Today, we'll be talking about how
to create some great experiences on Glass.
We'll look at what are the great experiences on Glass, and then,
how do you go about creating some of those?
Let's get right to it.
What are the experiences which feel right at home on Glass?
Keep the user in the moment.
As a user of Glass, if I'm walking down a bridge,
I have a question, I ask, get answered instantly.
What's important on Glass is that you
allow the user to stay in the physical world, while still
taking these short, small dips in the digital world
and continue through rest of their day.
Voice first.
Now, this is really important.
Because unlike other devices where
voice may be just one of the ways
the user interact with it, on Glass, voice is critical.
It is also fast and a natural way to interact.
As a Glassware developer, you will have an opportunity
to provide some voice commands.
When you are doing such a thing, think
about what are the actions your users are going
to take to invoke your Glassware.
Something like "OK, Glass, take a picture," is a great command.
"OK, Glass, start a camera," not so much.
Just like any other wearable device, speed truly matters.
If you can deliver amazing experiences
in less than five seconds, they're
just going to become perfect.
If you have a feature-rich mobile or web application,
think about what are the specific nuggets
of amazing experiences you can provide on Glass.
And then you can use voice or one tap actions for users
to access those.
If you can reduce the amount of time
between an intent that the user has
and the action they need to take to fulfill that intent,
you will be able to create brilliant Glasswares.
Keep things relevant.
Now, on Glass, you want to deliver experiences
which are relevant right down to the moment
user is interacting with them.
If I have a Glassware which lists all of my shopping list,
and I walk into a grocery store, show
me only the part of the shopping list
which I can purchase in the grocery store.
Something which I'm going to order online
just doesn't belong on Glass at that moment.
Understand the context, like a location, time of day,
day of the week, even my personal preferences.
Combine all of these to create some amazing experiences.
The display of the Glass sits so close to the user's eyes
that you have a unique opportunity
to create Glassware which orient to the view
that the user is having of the world.
Now, it's important, that when you're
creating these experiences, that you update the view
the moment user is turning their head.
Now, that's how you create good experiences.
What makes these experiences even better
are if you can use either voice or head gestures to free up
the hands, so that the users can interact
with the world around them.
Let's summarize what are the experiences which work great
on Glass.
Those who keep the user in the moment.
Those who use voice for quick and natural interactions.
Make sure that experiences of delivering
the right amount of information at just the right time, that
orient to the view of the world around me.
And finally, free up my hand so that I
can interact with the world around me.
In the next section, let's take a look
at some of the recommendations on how
to create some great experiences.
Let's start with typography.
On Glass, the default system font is Roboto.
We use two weights of this font, thin and light.
When you look at all the templates,
40 pixel is the font size we use almost
as a regular or normal font size.
You can increase it to 50, something like large,
or 70 pixel, like an extra large font size.
Anything larger than this may not
give you enough space on Glass to write full sentences.
However, you may be able to use larger font
sizes for very specific pieces of information.
For example, temperature or sports scores.
Let's take a look at the other end of the spectrum.
If you go down to 34 pixel font size, think of it as small.
30 pixel, extra small.
Anything smaller than this in the body text,
it's just not going to be legible for a user.
So stay away from those sizes.
Let's look at a very important facet of designing really,
really good and legible Glassware-- padding.
You'll notice that all of our templates
will have 40 pixel padding on all sides.
Now, this is important so that the content that you're
putting in front of the user doesn't
get clipped on the left or the right side.
Similarly, this will allow some of the system UIs
like scroll bar or progress bar to easily occupy
this 40 pixel space without interacting with the content
that you're presenting to the user.
The closer you can present the content
to the center of the screen, the easier
it will be for a user to focus on it.
Let's take a look at some of the core templates that we provide.
This is a basic template.
Really good for putting in a lot of text which
is still digestible on Glass.
One important thing that you'll notice on all the templates
is there is a space provided to put in metadata.
Now, this metadata allows the user
to understand who is providing this content,
and also, what is the context in which this content is
being provided.
Another template, we call it Otter.
This is great for both providing who is the sender, as well
as the subject line, of course, in addition to
the body of the message.
There are tons of other templates
which you can find at our developer website
that deal with things like lists, full-bleed images, et
cetera.
Glanceable UIs.
Now, this is an important part.
Glass is a device which is designed from grounds up
to be used out and about.
When you are presenting the user an information which
is divided up into lots of small chunks, really start thinking,
can you actually spread this information
across couple of different screens?
Can you reduce this information into something
which is much more easily digestible?
So, for example, if I change this screen
to something like this, all of a sudden
it is much more easy for me to read this information even
when I'm jogging.
If you are able to reduce the number of chunks down
to just one without diminishing the value of information,
you may actually have a truly great Glassware.
Low density, high quality.
Now, you may have created some great experiences
on mobile and web using responsive design.
If you want to scale down those designs on Glass
and expect that those experiences are going to work,
you may not actually have that much luck.
If you want to create experience on Glass
think about creating them from grounds up.
There are certain experiences which
work especially beautiful, especially nice on Glass.
Things like full-bleed images.
Again, make use of the space provided for metadata
to make sure that the user is understanding what
is the context in which this image is being provided
to them.
The last point here, and this is really important.
When you are creating experiences on Glass,
make sure that you are testing it both indoors and outdoors.
Now, it is important because some colors
may look different on Glass compared
to how they look on your computer monitor.
This happens because Glass is a transparent display.
A color like black may actually be just transparent.
White may actually provide you with the max amount of contrast
to improve the legibility of your text.
Make sure that you are truly testing
all of your UIs, both indoors and outdoors.
Let's recap some of the recommendations
we talked about.
Use proper typography.
If you have your own brand related fonts, use them.
But make sure that they are following
the guidelines we talked about.
Similarly, make sure that you're using the standard templates,
or at least using them as guidelines
to create really rich, nice, legible content on Glass.
Make sure that the content you are presenting to a user
is in small bite-size chunks that they can easily digest.
And lastly, make sure that every single interface
you're creating on Glass, you test both indoors and outdoors.
As you go about creating some amazing Glassware,
think about what can you do on Glass which can be done better
on Glass than any other device?
At the same time, think about some of the things
we talked about in this talk.
Create the content which is relevant
right down to the moment.
Use voice for fast and natural interactions.
Work with some of the standard patterns and styles
to create truly useful Glassware.
And finally, the better you can do these things
together, the better the experience for your users
is going to be.
We have some amazing documentation
on our developer website, which you can take a look.
At the same time, make sure that you
continue exploring more and more ways in which you can create
amazing experiences for your users.
Thank you very much.