The Next Generation of Social is in a Hangout
Upcoming SlideShare
Loading in...5
×

Like this? Share it with your network

Share

The Next Generation of Social is in a Hangout

  • 1,119 views
Uploaded on

Make your apps come alive with live audio/video conversations using the Hangouts Platform API. Using the Google+ Hangouts API, you can develop collaborative apps that run inside of a Google+ Hangout.

Make your apps come alive with live audio/video conversations using the Hangouts Platform API. Using the Google+ Hangouts API, you can develop collaborative apps that run inside of a Google+ Hangout.

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
    Be the first to like this
No Downloads

Views

Total Views
1,119
On Slideshare
1,097
From Embeds
22
Number of Embeds
5

Actions

Shares
Downloads
10
Comments
0
Likes
0

Embeds 22

http://coderwall.com 14
http://www.linkedin.com 4
https://www.linkedin.com 2
http://www.flickr.com 1
http://hedhub.co 1

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. Developers
  • 2. The Next Generation of SocialIs in a HangoutJonathan Beri Amit FulayDeveloper Advocate Product Manager #io12
  • 3. Jonathan BeriDeveloper Advocate, Google+jonathanberi.com/+
  • 4. Today’s Agenda • The Hangouts Story • Demos • Code-Slingin’ 4
  • 5. Amit FulayProduct Manager, Google+http://goo.gl/HlOaO
  • 6. The Hangouts Story
  • 7. The Hangouts Story + Social Real Time 7
  • 8. YouTube 8
  • 9. Google Docs 9
  • 10. Launched Google+ Hangouts Platform
  • 11. Activities
  • 12. Aces Poker 12
  • 13. Scoot & Doodle 13
  • 14. Enhance Live Conversations
  • 15. Mustache 15
  • 16. Effects 16
  • 17. Cheer On 17
  • 18. Bring Hangouts to Your Apps
  • 19. SlideShare 19
  • 20. Cacoo 20
  • 21. Symphonical Text 21
  • 22. Google+ Hangouts Platform 1.Build Activities inside hangouts 2.Build enhancements for live conversations 3.Bring Google+ Hangouts to your app 22
  • 23. Demos
  • 24. Hangouts are a New OpportunityHangout Apps are Something You Should be Building Today
  • 25. What Can You Do?Scenarios You Can Build into a Hangout App
  • 26. Show Who is Playing 26
  • 27. Watch While Someone Draws 27
  • 28. Use Your Face as a Controller 28
  • 29. Building Blocks of a Hangout AppHow You Can Integrate the Power of Hangouts
  • 30. JavaScript + Hangout Features Your HTML/JavaScript hangout.js 30
  • 31. App.xml: Pure Web with a Sprinkle of XML XML<?xml version=“1.0” encoding=“UTF-8” ?><Module> <ModulePrefs title=“Your App Name”> <Require feature=“rpc” /> <Require feature=“views” /> </ModulePrefs> <Content type=“html”> <!CDATA[ <script src=“//talkgadget.google.com/hangouts/_/api/hangout.js?v=1.1”></script> <!-- Your application code --> ]]> </Content></Module> 31
  • 32. App.xml: Pure Web with a Sprinkle of XML XML<?xml version=“1.0” encoding=“UTF-8” ?><Module> <ModulePrefs title=“Your App Name”> <Require feature=“rpc” /> <Require feature=“views” /> </ModulePrefs> <Content type=“html”> <!CDATA[ <script src=“//talkgadget.google.com/hangouts/_/api/hangout.js?v=1.1”></script> <!-- Your application code --> ]]> </Content></Module> 32
  • 33. Anything you can do in an iFrame, youcan do in a Hangoutbut you can do so much more...
  • 34. JavaScript + Hangout Features Your HTML/JavaScript hangout.js 34
  • 35. hangout.js• Including hangout.js gives you access to many hangout features, including: - Participants - Data Channels - A/V - Effects - Metadata JavaScript <script src="//talkgadget.google.com/hangouts/_/api/hangout.js?v=1.1"></script> 35
  • 36. Code-Slingin’ TimeLet’s Build a Hangout App
  • 37. Guess the pastry 37
  • 38. What We’d Like• Show who’s playing - List current participants• Track whose voted - Record votes “somewhere”• Congratulate the winners - Web badge of honor 38
  • 39. There’s a Lot More Possible Code Lab: http://goo.gl/Ezt0v 39
  • 40. Insights to be SuccessfulDesign & UX Best Practices for Building Hangout Apps
  • 41. Put People First Identify Who is Playing with Profile Pictures and Overlays 41
  • 42. Social is About Being Together Make everything collaborative and synchronous 42
  • 43. Users Will Join When You Least Expect Them There are tons Participant callbacks - use them liberally! 43
  • 44. Playing Alongside Friends Can be Fun Too Think about different ways you can group users 44
  • 45. React Immediately, Respond in Real-Time Use the Data Channels to keep your App in sync 45
  • 46. We are at the Cusp 46
  • 47. Next Steps• Get Started with Hangout Apps - http://developers.google.com/+/hangouts• Promote Your App - https://developers.google.com/+/hangouts/button• Attend the Hangouts Fireside Chat - https://developers.google.com/events/io/sessions/gooio2012/809/ 47
  • 48. Credits• Slides - 12: http://aceshangout.com/ - 13: http://scootdoodle.com/ - 19: http://www.slideshare.net/ - 20: https://cacoo.com/ - 21: https://www.symphonical.com/ - 24: http://tabletopforge.com/ - 28: http://www.experimentsplus.com/details/donut-horns - 29: http://flic.kr/p/8syc8C - 37: http://flic.kr/p/9QwfyD 48
  • 49. Credits• Live coding - Pastry: http://flic.kr/p/9QwfyD - Nyan Cat: http://nyan.cat• Slides - 40: http://flic.kr/p/9m9Nty - 41: http://goo.gl/qFQRP - 42: http://flic.kr/p/bAoSsK - 43: http://flic.kr/p/7qHfdt - 44: http://flic.kr/p/5jrwbw - 45: http://flic.kr/p/52D411 49
  • 50. <Questions?>https://developers.google.com/+/hangouts/Jonathan Beri Amit Fulay #io12jonathanberi.com/+ http://goo.gl/HlOaO
  • 51. Developers