SlideShare a Scribd company logo
1 of 55
Bringing Live Video to iPhone
What is Justin.tv?
•Largest live video site in the world
•28.5 million monthly uniques
•275 million monthly streams
•55 million hours of video / month
Who am I?
Caleb Elston
VP Products Justin.tv
“When will I be able to watch JTV on my iPhone?”

         “Are you working on an iPhone app?”

“How can I watch my friends JTV channel on my iPod Touch?”

      “How long until you guys have an iPhone app?”

               “You should make an app!”

             “I want Justin.tv on my iPhone”
August 2009
Decide to build an iPhone App
What features?
Past Broadcasts
 Featured Videos
                       Chat          Profile
       Following
                     Search
 Live Video                     Twitter Chat
               Messages
      Follow                        Badges
                     Highlighting
  Email Sharing
                           Create Account
              Categories
Facebook Sharing      Sign In   Twitter Sharing
Past Broadcasts
 Featured Videos
                       Chat          Profile
       Following
                     Search
 Live Video                     Twitter Chat
               Messages
      Follow                        Badges
                     Highlighting
  Email Sharing
                           Create Account
              Categories
Facebook Sharing      Sign In   Twitter Sharing
Live Video
     Chat
    Follow
    Search
  Categories
 Email Sharing
Featured Videos
Challenges
Compelling Experience
Video Quality
Video Performance
Sept - Dec 2009
Design Palooza
Read the HIG
“The details are not the details.
       They make the design.”
                    -Charles Eames
Justin.tv Video
     ≠
iPhone Video
VC1     Flash

SeeToo   VLC

 VP6     On2
VC1     Flash

SeeToo   VLC     H.264

 VP6     On2
Spoke to Vendors
Problem was...
$250k+
We passed :)
“We can build it!”
Requirements
2,000+ live streams
Requirements
30+ hours video /min
Requirements
100% RealTime
Requirements
Plug-and-Play
January 2010
Live video on iPhone
February 2010
Private Beta
Feb 25, 2010
Submitted to Apple :)
March 1, 2010
Waiting...
March 4, 2010
Got a call...
March 4, 2010
It was Apple
March 4, 2010
Began work on EDGE Support
March 19, 2010
EDGE Support
March 22, 2010
App Launched!
March 25, 2010
60k Users First Day
March 25, 2010
#1 Social Networking 20 Geos
Today
Hard at work on Broadcasting
Thanks!
@calebelston on Twitter

More Related Content

Viewers also liked

Plans de millora
Plans de milloraPlans de millora
Plans de milloraMRURIS
 
Charlie's tale
Charlie's taleCharlie's tale
Charlie's taleMRURIS
 
Sommiar per innovar
Sommiar per innovarSommiar per innovar
Sommiar per innovarMRURIS
 
Power Point 2007
Power Point 2007Power Point 2007
Power Point 2007gueste9cbbf
 
La Por. Un petit marc teòric
La Por. Un petit marc teòricLa Por. Un petit marc teòric
La Por. Un petit marc teòricMRURIS
 
Vinod Khosla: “Smart Grid” or “Smart Hype” — An Analytical Perspective From a...
Vinod Khosla: “Smart Grid” or “Smart Hype” — An Analytical Perspective From a...Vinod Khosla: “Smart Grid” or “Smart Hype” — An Analytical Perspective From a...
Vinod Khosla: “Smart Grid” or “Smart Hype” — An Analytical Perspective From a...VentureBeat
 
Paraules Dolces i l'Ed. Emocional
Paraules Dolces i l'Ed. EmocionalParaules Dolces i l'Ed. Emocional
Paraules Dolces i l'Ed. EmocionalMRURIS
 
Conte koala reduit
Conte koala reduitConte koala reduit
Conte koala reduitMRURIS
 
Cançoner infantil
Cançoner infantilCançoner infantil
Cançoner infantilMRURIS
 
AppCityLife MobileBeat 2010 Startup Competition Presentation
AppCityLife MobileBeat 2010 Startup Competition PresentationAppCityLife MobileBeat 2010 Startup Competition Presentation
AppCityLife MobileBeat 2010 Startup Competition PresentationVentureBeat
 

Viewers also liked (10)

Plans de millora
Plans de milloraPlans de millora
Plans de millora
 
Charlie's tale
Charlie's taleCharlie's tale
Charlie's tale
 
Sommiar per innovar
Sommiar per innovarSommiar per innovar
Sommiar per innovar
 
Power Point 2007
Power Point 2007Power Point 2007
Power Point 2007
 
La Por. Un petit marc teòric
La Por. Un petit marc teòricLa Por. Un petit marc teòric
La Por. Un petit marc teòric
 
Vinod Khosla: “Smart Grid” or “Smart Hype” — An Analytical Perspective From a...
Vinod Khosla: “Smart Grid” or “Smart Hype” — An Analytical Perspective From a...Vinod Khosla: “Smart Grid” or “Smart Hype” — An Analytical Perspective From a...
Vinod Khosla: “Smart Grid” or “Smart Hype” — An Analytical Perspective From a...
 
Paraules Dolces i l'Ed. Emocional
Paraules Dolces i l'Ed. EmocionalParaules Dolces i l'Ed. Emocional
Paraules Dolces i l'Ed. Emocional
 
Conte koala reduit
Conte koala reduitConte koala reduit
Conte koala reduit
 
Cançoner infantil
Cançoner infantilCançoner infantil
Cançoner infantil
 
AppCityLife MobileBeat 2010 Startup Competition Presentation
AppCityLife MobileBeat 2010 Startup Competition PresentationAppCityLife MobileBeat 2010 Startup Competition Presentation
AppCityLife MobileBeat 2010 Startup Competition Presentation
 

More from VentureBeat

frog design Presentation: Kickstarting a Movement
frog design Presentation: Kickstarting a Movementfrog design Presentation: Kickstarting a Movement
frog design Presentation: Kickstarting a MovementVentureBeat
 
InThrMa Innovation Competition Presentation
InThrMa Innovation Competition PresentationInThrMa Innovation Competition Presentation
InThrMa Innovation Competition PresentationVentureBeat
 
GRIDbot Innovation Competition Presentation
GRIDbot Innovation Competition PresentationGRIDbot Innovation Competition Presentation
GRIDbot Innovation Competition PresentationVentureBeat
 
Capire Micropower Innovation Competition Presentation
Capire Micropower Innovation Competition PresentationCapire Micropower Innovation Competition Presentation
Capire Micropower Innovation Competition PresentationVentureBeat
 
Redwood Systems Innovation Competition Presentation
Redwood Systems Innovation Competition PresentationRedwood Systems Innovation Competition Presentation
Redwood Systems Innovation Competition PresentationVentureBeat
 
Power Map Innovation Competition Presentation
Power Map Innovation Competition PresentationPower Map Innovation Competition Presentation
Power Map Innovation Competition PresentationVentureBeat
 
WIT Innovation Competition Presentation
WIT Innovation Competition PresentationWIT Innovation Competition Presentation
WIT Innovation Competition PresentationVentureBeat
 
Ecofactor Innovation Competiton Presentation
Ecofactor Innovation Competiton PresentationEcofactor Innovation Competiton Presentation
Ecofactor Innovation Competiton PresentationVentureBeat
 
Mytalk MobileBeat 2010 Startup Competition Presentation
Mytalk MobileBeat 2010 Startup Competition PresentationMytalk MobileBeat 2010 Startup Competition Presentation
Mytalk MobileBeat 2010 Startup Competition PresentationVentureBeat
 
Micello MobileBeat 2010 Startup Competition Presentation
Micello MobileBeat 2010 Startup Competition PresentationMicello MobileBeat 2010 Startup Competition Presentation
Micello MobileBeat 2010 Startup Competition PresentationVentureBeat
 
Snaptu MobileBeat 2010 Startup Competition Presentation
Snaptu MobileBeat 2010 Startup Competition PresentationSnaptu MobileBeat 2010 Startup Competition Presentation
Snaptu MobileBeat 2010 Startup Competition PresentationVentureBeat
 
Sentegra MobileBeat 2010 Startup Competition Presentation
Sentegra MobileBeat 2010 Startup Competition PresentationSentegra MobileBeat 2010 Startup Competition Presentation
Sentegra MobileBeat 2010 Startup Competition PresentationVentureBeat
 
AFK Interactive MobileBeat 2010 Startup Competition Presentation
AFK Interactive MobileBeat 2010 Startup Competition PresentationAFK Interactive MobileBeat 2010 Startup Competition Presentation
AFK Interactive MobileBeat 2010 Startup Competition PresentationVentureBeat
 
Edupath MobileBeat 2010 Startup Competition Presentation
Edupath MobileBeat 2010 Startup Competition PresentationEdupath MobileBeat 2010 Startup Competition Presentation
Edupath MobileBeat 2010 Startup Competition PresentationVentureBeat
 
BlogRadio MobileBeat 2010 Startup Competition Presentation
BlogRadio MobileBeat 2010 Startup Competition PresentationBlogRadio MobileBeat 2010 Startup Competition Presentation
BlogRadio MobileBeat 2010 Startup Competition PresentationVentureBeat
 
Call Loop MobileBeat 2010 Startup Competition Presentation
Call Loop MobileBeat 2010 Startup Competition PresentationCall Loop MobileBeat 2010 Startup Competition Presentation
Call Loop MobileBeat 2010 Startup Competition PresentationVentureBeat
 

More from VentureBeat (16)

frog design Presentation: Kickstarting a Movement
frog design Presentation: Kickstarting a Movementfrog design Presentation: Kickstarting a Movement
frog design Presentation: Kickstarting a Movement
 
InThrMa Innovation Competition Presentation
InThrMa Innovation Competition PresentationInThrMa Innovation Competition Presentation
InThrMa Innovation Competition Presentation
 
GRIDbot Innovation Competition Presentation
GRIDbot Innovation Competition PresentationGRIDbot Innovation Competition Presentation
GRIDbot Innovation Competition Presentation
 
Capire Micropower Innovation Competition Presentation
Capire Micropower Innovation Competition PresentationCapire Micropower Innovation Competition Presentation
Capire Micropower Innovation Competition Presentation
 
Redwood Systems Innovation Competition Presentation
Redwood Systems Innovation Competition PresentationRedwood Systems Innovation Competition Presentation
Redwood Systems Innovation Competition Presentation
 
Power Map Innovation Competition Presentation
Power Map Innovation Competition PresentationPower Map Innovation Competition Presentation
Power Map Innovation Competition Presentation
 
WIT Innovation Competition Presentation
WIT Innovation Competition PresentationWIT Innovation Competition Presentation
WIT Innovation Competition Presentation
 
Ecofactor Innovation Competiton Presentation
Ecofactor Innovation Competiton PresentationEcofactor Innovation Competiton Presentation
Ecofactor Innovation Competiton Presentation
 
Mytalk MobileBeat 2010 Startup Competition Presentation
Mytalk MobileBeat 2010 Startup Competition PresentationMytalk MobileBeat 2010 Startup Competition Presentation
Mytalk MobileBeat 2010 Startup Competition Presentation
 
Micello MobileBeat 2010 Startup Competition Presentation
Micello MobileBeat 2010 Startup Competition PresentationMicello MobileBeat 2010 Startup Competition Presentation
Micello MobileBeat 2010 Startup Competition Presentation
 
Snaptu MobileBeat 2010 Startup Competition Presentation
Snaptu MobileBeat 2010 Startup Competition PresentationSnaptu MobileBeat 2010 Startup Competition Presentation
Snaptu MobileBeat 2010 Startup Competition Presentation
 
Sentegra MobileBeat 2010 Startup Competition Presentation
Sentegra MobileBeat 2010 Startup Competition PresentationSentegra MobileBeat 2010 Startup Competition Presentation
Sentegra MobileBeat 2010 Startup Competition Presentation
 
AFK Interactive MobileBeat 2010 Startup Competition Presentation
AFK Interactive MobileBeat 2010 Startup Competition PresentationAFK Interactive MobileBeat 2010 Startup Competition Presentation
AFK Interactive MobileBeat 2010 Startup Competition Presentation
 
Edupath MobileBeat 2010 Startup Competition Presentation
Edupath MobileBeat 2010 Startup Competition PresentationEdupath MobileBeat 2010 Startup Competition Presentation
Edupath MobileBeat 2010 Startup Competition Presentation
 
BlogRadio MobileBeat 2010 Startup Competition Presentation
BlogRadio MobileBeat 2010 Startup Competition PresentationBlogRadio MobileBeat 2010 Startup Competition Presentation
BlogRadio MobileBeat 2010 Startup Competition Presentation
 
Call Loop MobileBeat 2010 Startup Competition Presentation
Call Loop MobileBeat 2010 Startup Competition PresentationCall Loop MobileBeat 2010 Startup Competition Presentation
Call Loop MobileBeat 2010 Startup Competition Presentation
 

"Bringing Live Video to iPhone" presentation by Caleb Elston, VP of Products, Justin.tv

Editor's Notes

  1. Caleb Elston VP of products at Justin.tv. I oversee all of our web and mobile products. Working with our designers and engineers to curate a great experience for our users.
  2. Caleb Elston VP of products at Justin.tv. I oversee all of our web and mobile products. Working with our designers and engineers to curate a great experience for our users.
  3. We got many requests over email, talking with users on the site and on our weekly Founder Chat live broadcast.
  4. We got many requests over email, talking with users on the site and on our weekly Founder Chat live broadcast.
  5. We got many requests over email, talking with users on the site and on our weekly Founder Chat live broadcast.
  6. We got many requests over email, talking with users on the site and on our weekly Founder Chat live broadcast.
  7. We got many requests over email, talking with users on the site and on our weekly Founder Chat live broadcast.
  8. We got many requests over email, talking with users on the site and on our weekly Founder Chat live broadcast.
  9. After getting so much feedback we decided in August to build an app
  10. Once we decided we were going to build. Had to pick features.
  11. Lots of features on JTV. Ways to communicate chat or private messages, share on the major social networks, view past broadcasts, and many others.
  12. Lots of features on JTV. Ways to communicate chat or private messages, share on the major social networks, view past broadcasts, and many others.
  13. Lots of features on JTV. Ways to communicate chat or private messages, share on the major social networks, view past broadcasts, and many others.
  14. Lots of features on JTV. Ways to communicate chat or private messages, share on the major social networks, view past broadcasts, and many others.
  15. Lots of features on JTV. Ways to communicate chat or private messages, share on the major social networks, view past broadcasts, and many others.
  16. Lots of features on JTV. Ways to communicate chat or private messages, share on the major social networks, view past broadcasts, and many others.
  17. Lots of features on JTV. Ways to communicate chat or private messages, share on the major social networks, view past broadcasts, and many others.
  18. Lots of features on JTV. Ways to communicate chat or private messages, share on the major social networks, view past broadcasts, and many others.
  19. Lots of features on JTV. Ways to communicate chat or private messages, share on the major social networks, view past broadcasts, and many others.
  20. Lots of features on JTV. Ways to communicate chat or private messages, share on the major social networks, view past broadcasts, and many others.
  21. Lots of features on JTV. Ways to communicate chat or private messages, share on the major social networks, view past broadcasts, and many others.
  22. Lots of features on JTV. Ways to communicate chat or private messages, share on the major social networks, view past broadcasts, and many others.
  23. Lots of features on JTV. Ways to communicate chat or private messages, share on the major social networks, view past broadcasts, and many others.
  24. Lots of features on JTV. Ways to communicate chat or private messages, share on the major social networks, view past broadcasts, and many others.
  25. Lots of features on JTV. Ways to communicate chat or private messages, share on the major social networks, view past broadcasts, and many others.
  26. Lots of features on JTV. Ways to communicate chat or private messages, share on the major social networks, view past broadcasts, and many others.
  27. Lots of features on JTV. Ways to communicate chat or private messages, share on the major social networks, view past broadcasts, and many others.
  28. Lots of features on JTV. Ways to communicate chat or private messages, share on the major social networks, view past broadcasts, and many others.
  29. But we focused on what would be best for when you want to see what your friend is broadcasting or watch someone playing the latest Starcraft beta.
  30. And so we came to focus on a small set of features we wanted to execute on and were most essential to the experience. Live video. Chat, and a way to discover video.
  31. There were 3 main challenges
  32. We wanted to make the app that users would love. Use wherever they were and didn’t get in there way.
  33. Make it look awesome on 3G and Wifi
  34. Have it load quickly and have low latency. Unlike YouTube, we can’t buffer video. It has to flow every single second. That’s hard.
  35. We spent 2 months working on sketches and mocking up wireframes. Then a month on the visual design and pixel perfect mocks. Tips Read the HIG from Apple. Sweat the details. The structure of your app is critical to whether or not it will eventually “feel right”.
  36. We spent 2 months working on sketches and mocking up wireframes. Reading the HIG from Apple.
  37. The structure of your app is critical to whether or not it will eventually “feel right”.
  38. Sweat the details. Make sure it feels like an iPhone app. Make sure the people working on your app USE iPhones. Build it for iPhone. The fluidity of scrolling, the loading indicators, the way text goes white when it is selected.
  39. One such detail was how we would indicate to users that new chat messages were coming in, without covering the video. Looking around we realized apple had already solved this...
  40. They solved it with the SMS and Mail app. So now when a chat message comes in, this little indicator pops up. Simple and expected by users.
  41. Once we had the design humming along we brought in our video engineers. Reconcile our video formats would not play on iPhone.
  42. We support all sorts of video formats and resolutions. From basic webcam quality to 1080P 10Mbit streams from an Xbox360. We had to find a way to transcode all of our video into Apple’s chosen H.264.
  43. We support all sorts of video formats and resolutions. From basic webcam quality to 1080P 10Mbit streams from an Xbox360. We had to find a way to transcode all of our video into Apple’s chosen H.264.
  44. We support all sorts of video formats and resolutions. From basic webcam quality to 1080P 10Mbit streams from an Xbox360. We had to find a way to transcode all of our video into Apple’s chosen H.264.
  45. We support all sorts of video formats and resolutions. From basic webcam quality to 1080P 10Mbit streams from an Xbox360. We had to find a way to transcode all of our video into Apple’s chosen H.264.
  46. We support all sorts of video formats and resolutions. From basic webcam quality to 1080P 10Mbit streams from an Xbox360. We had to find a way to transcode all of our video into Apple’s chosen H.264.
  47. We support all sorts of video formats and resolutions. From basic webcam quality to 1080P 10Mbit streams from an Xbox360. We had to find a way to transcode all of our video into Apple’s chosen H.264.
  48. We support all sorts of video formats and resolutions. From basic webcam quality to 1080P 10Mbit streams from an Xbox360. We had to find a way to transcode all of our video into Apple’s chosen H.264.
  49. We support all sorts of video formats and resolutions. From basic webcam quality to 1080P 10Mbit streams from an Xbox360. We had to find a way to transcode all of our video into Apple’s chosen H.264.
  50. So we spoke with a bunch of vendors who provide transcoding solutions...
  51. Problem was
  52. They wanted around $250k for custom hardware and additional yearly licensing fees.
  53. Needless to say we passed.
  54. One of our video engineers said we could build it, and started down the path of building our own solution.
  55. We wanted to allow any stream on our site to play on the iphone. Anyone could broadcast on the site and see themselves on their iPhone.
  56. Massive amount of video would need to be transcoded. Any stream on the site would be viewable on iPhone. You start broadcasting and you can watch it on your iPhone.
  57. Needed to keep up and be able to transcode even our highest quality streams in real time.
  58. And we wanted it to fit our existing architecture so we could add more commodity servers we already use.
  59. In early january we got live video from our system working on the iPhone reliably.
  60. Private beta with 50 passionate JTV users
  61. Fixed a ton of bugs and submitted to Apple. Very exciting day
  62. Then my phone rang
  63. They liked the app. Wanted to make sure we had low quality stream for EDGE.
  64. That day we began the process of creating a companion stream, effectively doubling the amount of video we had to transcode.
  65. Apple was great to work with and in the end the app was better for it.
  66. Launched on March 22. Got some press.
  67. Launched on March 22. Got some press.
  68. Launched on March 22. Got some press.
  69. Launched on March 22. Got some press.
  70. Launched on March 22. Got some press.
  71. 60k users started streaming video the first day.
  72. #1 in 20 Geos
  73. Here is a chart of the user adoption for the app since we launched.
  74. We are no hard at work on brining live video broadcasting to the app using Apple’s latest API’s in iOS4
  75. Thanks so much. Will be around.