JONATHAN BERI: Hi, I'm Jonathan Beri and I'm on the
developer relations team for Google+.
Today I'm going to introduce you to the
Google+ Hangouts API.
Hangouts let you set up a one click video conversation with
friends, family, coworkers and interesting people
from around the world.
You can catch up with your fantasy football teammates,
get face to face feedback on your vocal solo, meet other
model train lovers, or collaborate with remote
colleagues on a shared document in real time.
All over a high quality, easy to use video chat.
If Hangouts are a room where you can bring people together,
Hangout Apps are the kitchen table you're all sitting at.
A shared space for board games, sketchbooks, sewing
machines, or calendars.
They're the feature that spark the conversation.
The Google+ Hangouts API allows you to develop
collaborative Apps that run inside of Google+ Handout.
Hangout Apps are normal web apps that can take advantage
of rich, real time functionality in
the Hangouts API.
Apps have the ability to control aspects of the user
interface, synchronize data between people, and respond to
events in the Hangout.
With Hangouts it's better to show you then to tell you, so
I'll fire up a Hangout and invite a few of my friends
from the Hangouts page.
I'll log in to Hangout and invite my friends from
developer relations, Wolf and Jenny.
Hey Jenny.
Hey Wolf.
JENNY: Hi Wolf.
WOLF: Hey Jenny.
JONATHAN BERI: We have a team offsite coming up.
Why don't we use a Hangout App to plan out our trip?
WOLF: Sounds good.
JENNY: Sounds like a great idea.
JONATHAN BERI: I'll pull up one of
the Apps we've developed.
So what you're seeing here is a Hangout App running inside
of a Hangout.
This is a demo using the Google Earth plug-in and I'm
going to go fly around the world, pick some cool places
to go to, and we're going to collaborate
on that list together.
So I'm thinking Malpais, Costa Rica.
WOLF: I hear exciting things are happening in Mountain
View, California.
JONATHAN BERI: See what just happened there?
Wolf picked Mountain View, California, on his map and it
showed up on my screen using the data channel API.
So if I tag it, he'll see Malpais on his map.
And as Jenny's looking for a cool place,
that'll show up as well.
Tagged by Jenny, nice.
It's a very simple API that allows you to synchronize any
type of information across the App.
But we can do more than just locations on a map.
We can actually follow each other using that same API.
So I'm going to click on Wolf and see what he sees.
WOLF: Well, I'm thinking we should take our offsite to
McMurdo Station in Antarctica.
It's pretty cool.
We can look around here.
Pull back.
JONATHAN BERI: Neat.
So we're using the same API that we used to synchronize
the locations.
We can do more than just sync data across the Apps.
We can do fun things like moustaches and overlays.
I'll show you with the costume App.
Now here are a bunch of costumes that
I can try out virtually.
Let's say, top hat.
Oh yeah, looks pretty good.
What we're actually doing here is using our overlay API.
With the overlay API I can pick a resource, create it
inside the plug-in, and attach it to any parts of our face.
And then that overlay tracks along.
Looking stylish, Jenny.
Wolf, I think you've got to get a little bit smaller on
that mustache.
WOLF: No, I think--
I've had almost any size mustache here and I'm not
sure, I'm thinking this kind.
JONATHAN BERI: Wolf's using the ability to scale and
offset his mustache using the API as well.
Now, because this is an API we can use great features of
HTML5 to do more than just images.
For example, we can actually draw our costume.
So switch over to the drawing canvas, pick a cursor, I think
I'm going to make a crown for myself.
Yeah.
Yeah, it's a good crown.
How do I look guys?
WOLF: You look like a king or somebody
wearing a sponge cake.
JONATHAN BERI: Wolf, you look way better.
Glasses on glasses.
WOLF: I look this good all the time even without overlays.
There you go, Jenny.
JONATHAN BERI: So now you have goggles and glasses.
JENNY: Exactly, multi-goggle.
JONATHAN BERI: Let's now demonstrate how you can add
animations into your App.
Switch over to the animate mode, guys.
The API also includes the ability to access parts of the
hardware, such as the mic volume.
So I like PBR, I'm going to click the PBR option.
Now I've got a cool fedora with my hipster character.
WOLF: I've always wanted to be a bear, so now I'm a bear.
JONATHAN BERI: Nice.
JENNY: And I had techno colored hair
before, it was cool.
So, oh perfect.
Blue hair.
WOLF: There you go.
JONATHAN BERI: We can all talk in sync right?
WOLF: Yes.
JONATHAN BERI: Cool.
JENNY: Can indeed.
JONATHAN BERI: We've also added the ability for you to
respond to facial motion within your application.
Let me share a cool demo.
So in this demo I've loaded up a WebGL of a giant funny head
and it's actually responding to my facial movement.
Literally your face can become a controller.
I can zoom in, I can zoom out.
Left, right, up, down.
And for kicks we've added the ability to track your mouth
movement using your volume.
Pretty neat, huh?
It's just that easy.
You can find all the details that you need, including
sample code, tutorials, and reference documentation, on
the Google+ Developer site today.
This means you can get started right now.
Thanks for watching.