SlideShare uma empresa Scribd logo
1 de 19
MEDIAMOSA PLAYER Open source html5 weblectures player opensourcewebdevelopment
TODAY who am I and who is One Shoe open source video player definition of HTML 5 the state of HTML 5 video browser adoption components the player challenges ahead future releases questions Introduction CONFERENCE MEDIAMOSA, WEBLECTURES AND OPEN VIDEO mediamosa Html 5 video weblectures MARCH 29th 2011 CONCLUSION
WHO is ONE SHOE 3 WHO am i Thijs Zoon Full service internet company General manager R&D / Product development based in utrecht, 38 employees, web development, advertising, digital branding, mobile, drupal specialist system architect, drupalnerd, research & developmenthoncho, code purist, music enthousiast thijs.zoon@oneshoe.nl +31 (0)30 2317521 www.oneshoe.nl info@oneshoe.nl @oneshoe +31 (0)30 2317521 opensourcewebdevelopment
4 Introduction 4 cooperating divisions webdesign websites intranet communities web applications seo/sea hosting drupal support research & development mobile websites iOS apps iphone/ipad android apps symbian apps windows phone apps qr codes mobile gaming mobile advertising crossmedia concepts online branding online marketing marketing development campaigns pr and advertising guerilla marketing concept development identity design communication strategies search engine strategies outdoor advertising
5 OPEN SOURCE MEDIAMOSA PLAYER opensourcewebdevelopment
OPEN SOURCE MEDIAMOSA PLAYER Multi-stream Captions / subtitles Slides HTML 5 6 MediaMosa
7 definition of HTML 5 opensourcewebdevelopment
8 HTML 5 video History of html Introduction of HyperTextMarkup Language First draft of HTML 5 specs are published HTML 3.2 and 4 specsreleased Standardization, first adoption as open standard, Mosaic browser  A stricter XHTML standard is released HTML 2.0 specsreleased, browser war between Netscape and Internet Explorer WHATWG (Web Hypertext Application Technology Working Group) 1995 1997 1999 2004 2008 1993 1989
DEFINITION OF HTML 5 Ongoing effort toimplement a standard forricher web applications Common name for a combination of JavaScript- HTML, CSS novelties Currently, not a single browser implements 75% of all HTML5 features HTML5 specs are in draft, expected full recommendation in 2022 9 HTML 5 video
HTML 5 The <video> element opensourcewebdevelopment
BROWSER ADOPTION HTML 5 video 55% of visitors have a browser that supports the video element 93% of visitors have Flash 10+ Codec war 11
CODEC WAR <video …>  <source src=”vid.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"' /> <source src=”vid.webm" type='video/webm; codecs="vp8, vorbis"' /> <source src=”vid.ogv" type='video/ogg; codecs="theora, vorbis"' /> ... </video> 12 HTML 5 video
WEBLECTURES BEYOND THE <video> element opensourcewebdevelopment
COMPONENTS Video (primary) Video (secondary) Slides Captions / subtitles Timed events, textand images Transcript(s) Additional downloads 14 Weblectures
MEDIAMOSA PLAYER OPEN SOURCE HTML5 WEBLECTURES PLAYER opensourcewebdevelopment
CHALLENGES AHEAD Changing HTML5 specificationsand browser implementations Codec war Bugs in Chrome, Mobile Safari 16 Conclusion
FUTURE RELEASES Better support foriOS (iPadandiPhone) Integratedfallbackplayer (Adobe Flash)  17 Conclusion
THANK YOU QUESTIONS ANYONE? Thijs Zoon Phone: E-mail: +31 (0)302317521 thijs.zoon@oneshoe.nl www.oneshoe.nl @oneshoe Web: Twitter: General manager R&D / Product development opensourcewebdevelopment
MORE INFORMATION In depth information on HTML5 videohttp://diveintohtml5.org/video.html HTML5 andit’s support historyhttp://en.wikipedia.org/wiki/HTML5_video Browser versionstatisticshttp://gs.statcounter.com/#browser_version-ww-monthly-201002-201102 Test a browser’sHTML5 supporthttp://html5test.comor http://caniuse.com VideoJS, HTML5 playerhttp://videojs.com Or contact OneShoe: www.oneshoe.nl 19 More information

Mais conteúdo relacionado

Destaque

Candace Negril
Candace NegrilCandace Negril
Candace Negrilchglat
 
Breathless Cabo San Lucas
Breathless Cabo San LucasBreathless Cabo San Lucas
Breathless Cabo San Lucaschglat
 
Beaches Turks and Caicos
Beaches Turks and CaicosBeaches Turks and Caicos
Beaches Turks and Caicoschglat
 
St. Thomas and Peter Island
St. Thomas and Peter IslandSt. Thomas and Peter Island
St. Thomas and Peter Islandchglat
 
Brenda Iberostar PUJ
Brenda Iberostar PUJBrenda Iberostar PUJ
Brenda Iberostar PUJchglat
 
Hawaii
HawaiiHawaii
Hawaiichglat
 
Presentació d'ausiàs march
Presentació d'ausiàs marchPresentació d'ausiàs march
Presentació d'ausiàs marchMoneta Jc
 
Blue Diamond Riviera Maya
Blue Diamond Riviera MayaBlue Diamond Riviera Maya
Blue Diamond Riviera Mayachglat
 
Reagan Great Exuma Option
Reagan Great Exuma OptionReagan Great Exuma Option
Reagan Great Exuma Optionchglat
 
Excellence Riviera Cancun
Excellence Riviera CancunExcellence Riviera Cancun
Excellence Riviera Cancunchglat
 
Lauren & Ryan
Lauren & RyanLauren & Ryan
Lauren & Ryanchglat
 
Jamaica Options
Jamaica OptionsJamaica Options
Jamaica Optionschglat
 
Jamaica Honeymoon Options
Jamaica Honeymoon OptionsJamaica Honeymoon Options
Jamaica Honeymoon Optionschglat
 
Dreams Costa Rica
Dreams Costa RicaDreams Costa Rica
Dreams Costa Ricachglat
 
Laura Honeymoon Options
Laura Honeymoon OptionsLaura Honeymoon Options
Laura Honeymoon Optionschglat
 
Jamaica
JamaicaJamaica
Jamaicachglat
 
Royalton Negril
Royalton  NegrilRoyalton  Negril
Royalton Negrilchglat
 
Azul fives destination wedding
Azul fives destination weddingAzul fives destination wedding
Azul fives destination weddingchglat
 

Destaque (20)

Candace Negril
Candace NegrilCandace Negril
Candace Negril
 
Breathless Cabo San Lucas
Breathless Cabo San LucasBreathless Cabo San Lucas
Breathless Cabo San Lucas
 
Beaches Turks and Caicos
Beaches Turks and CaicosBeaches Turks and Caicos
Beaches Turks and Caicos
 
St. Thomas and Peter Island
St. Thomas and Peter IslandSt. Thomas and Peter Island
St. Thomas and Peter Island
 
Brenda Iberostar PUJ
Brenda Iberostar PUJBrenda Iberostar PUJ
Brenda Iberostar PUJ
 
Hawaii
HawaiiHawaii
Hawaii
 
Presentació d'ausiàs march
Presentació d'ausiàs marchPresentació d'ausiàs march
Presentació d'ausiàs march
 
Blue Diamond Riviera Maya
Blue Diamond Riviera MayaBlue Diamond Riviera Maya
Blue Diamond Riviera Maya
 
Reagan Great Exuma Option
Reagan Great Exuma OptionReagan Great Exuma Option
Reagan Great Exuma Option
 
Excellence Riviera Cancun
Excellence Riviera CancunExcellence Riviera Cancun
Excellence Riviera Cancun
 
Lauren & Ryan
Lauren & RyanLauren & Ryan
Lauren & Ryan
 
Maddi
MaddiMaddi
Maddi
 
Jamaica Options
Jamaica OptionsJamaica Options
Jamaica Options
 
Jamaica Honeymoon Options
Jamaica Honeymoon OptionsJamaica Honeymoon Options
Jamaica Honeymoon Options
 
Dreams Costa Rica
Dreams Costa RicaDreams Costa Rica
Dreams Costa Rica
 
Laura Honeymoon Options
Laura Honeymoon OptionsLaura Honeymoon Options
Laura Honeymoon Options
 
Jamaica
JamaicaJamaica
Jamaica
 
Royalton Negril
Royalton  NegrilRoyalton  Negril
Royalton Negril
 
Azul fives destination wedding
Azul fives destination weddingAzul fives destination wedding
Azul fives destination wedding
 
AB Design
AB DesignAB Design
AB Design
 

Último

Google Gemini An AI Revolution in Education.pptx
Google Gemini An AI Revolution in Education.pptxGoogle Gemini An AI Revolution in Education.pptx
Google Gemini An AI Revolution in Education.pptxDr. Sarita Anand
 
Exploring_the_Narrative_Style_of_Amitav_Ghoshs_Gun_Island.pptx
Exploring_the_Narrative_Style_of_Amitav_Ghoshs_Gun_Island.pptxExploring_the_Narrative_Style_of_Amitav_Ghoshs_Gun_Island.pptx
Exploring_the_Narrative_Style_of_Amitav_Ghoshs_Gun_Island.pptxPooja Bhuva
 
How to Manage Global Discount in Odoo 17 POS
How to Manage Global Discount in Odoo 17 POSHow to Manage Global Discount in Odoo 17 POS
How to Manage Global Discount in Odoo 17 POSCeline George
 
Unit 3 Emotional Intelligence and Spiritual Intelligence.pdf
Unit 3 Emotional Intelligence and Spiritual Intelligence.pdfUnit 3 Emotional Intelligence and Spiritual Intelligence.pdf
Unit 3 Emotional Intelligence and Spiritual Intelligence.pdfDr Vijay Vishwakarma
 
Salient Features of India constitution especially power and functions
Salient Features of India constitution especially power and functionsSalient Features of India constitution especially power and functions
Salient Features of India constitution especially power and functionsKarakKing
 
Key note speaker Neum_Admir Softic_ENG.pdf
Key note speaker Neum_Admir Softic_ENG.pdfKey note speaker Neum_Admir Softic_ENG.pdf
Key note speaker Neum_Admir Softic_ENG.pdfAdmir Softic
 
SOC 101 Demonstration of Learning Presentation
SOC 101 Demonstration of Learning PresentationSOC 101 Demonstration of Learning Presentation
SOC 101 Demonstration of Learning Presentationcamerronhm
 
Sociology 101 Demonstration of Learning Exhibit
Sociology 101 Demonstration of Learning ExhibitSociology 101 Demonstration of Learning Exhibit
Sociology 101 Demonstration of Learning Exhibitjbellavia9
 
Jamworks pilot and AI at Jisc (20/03/2024)
Jamworks pilot and AI at Jisc (20/03/2024)Jamworks pilot and AI at Jisc (20/03/2024)
Jamworks pilot and AI at Jisc (20/03/2024)Jisc
 
Python Notes for mca i year students osmania university.docx
Python Notes for mca i year students osmania university.docxPython Notes for mca i year students osmania university.docx
Python Notes for mca i year students osmania university.docxRamakrishna Reddy Bijjam
 
Food safety_Challenges food safety laboratories_.pdf
Food safety_Challenges food safety laboratories_.pdfFood safety_Challenges food safety laboratories_.pdf
Food safety_Challenges food safety laboratories_.pdfSherif Taha
 
How to Give a Domain for a Field in Odoo 17
How to Give a Domain for a Field in Odoo 17How to Give a Domain for a Field in Odoo 17
How to Give a Domain for a Field in Odoo 17Celine George
 
Wellbeing inclusion and digital dystopias.pptx
Wellbeing inclusion and digital dystopias.pptxWellbeing inclusion and digital dystopias.pptx
Wellbeing inclusion and digital dystopias.pptxJisc
 
Micro-Scholarship, What it is, How can it help me.pdf
Micro-Scholarship, What it is, How can it help me.pdfMicro-Scholarship, What it is, How can it help me.pdf
Micro-Scholarship, What it is, How can it help me.pdfPoh-Sun Goh
 
Kodo Millet PPT made by Ghanshyam bairwa college of Agriculture kumher bhara...
Kodo Millet  PPT made by Ghanshyam bairwa college of Agriculture kumher bhara...Kodo Millet  PPT made by Ghanshyam bairwa college of Agriculture kumher bhara...
Kodo Millet PPT made by Ghanshyam bairwa college of Agriculture kumher bhara...pradhanghanshyam7136
 
Graduate Outcomes Presentation Slides - English
Graduate Outcomes Presentation Slides - EnglishGraduate Outcomes Presentation Slides - English
Graduate Outcomes Presentation Slides - Englishneillewis46
 
ICT Role in 21st Century Education & its Challenges.pptx
ICT Role in 21st Century Education & its Challenges.pptxICT Role in 21st Century Education & its Challenges.pptx
ICT Role in 21st Century Education & its Challenges.pptxAreebaZafar22
 
Understanding Accommodations and Modifications
Understanding  Accommodations and ModificationsUnderstanding  Accommodations and Modifications
Understanding Accommodations and ModificationsMJDuyan
 
REMIFENTANIL: An Ultra short acting opioid.pptx
REMIFENTANIL: An Ultra short acting opioid.pptxREMIFENTANIL: An Ultra short acting opioid.pptx
REMIFENTANIL: An Ultra short acting opioid.pptxDr. Ravikiran H M Gowda
 
HMCS Vancouver Pre-Deployment Brief - May 2024 (Web Version).pptx
HMCS Vancouver Pre-Deployment Brief - May 2024 (Web Version).pptxHMCS Vancouver Pre-Deployment Brief - May 2024 (Web Version).pptx
HMCS Vancouver Pre-Deployment Brief - May 2024 (Web Version).pptxmarlenawright1
 

Último (20)

Google Gemini An AI Revolution in Education.pptx
Google Gemini An AI Revolution in Education.pptxGoogle Gemini An AI Revolution in Education.pptx
Google Gemini An AI Revolution in Education.pptx
 
Exploring_the_Narrative_Style_of_Amitav_Ghoshs_Gun_Island.pptx
Exploring_the_Narrative_Style_of_Amitav_Ghoshs_Gun_Island.pptxExploring_the_Narrative_Style_of_Amitav_Ghoshs_Gun_Island.pptx
Exploring_the_Narrative_Style_of_Amitav_Ghoshs_Gun_Island.pptx
 
How to Manage Global Discount in Odoo 17 POS
How to Manage Global Discount in Odoo 17 POSHow to Manage Global Discount in Odoo 17 POS
How to Manage Global Discount in Odoo 17 POS
 
Unit 3 Emotional Intelligence and Spiritual Intelligence.pdf
Unit 3 Emotional Intelligence and Spiritual Intelligence.pdfUnit 3 Emotional Intelligence and Spiritual Intelligence.pdf
Unit 3 Emotional Intelligence and Spiritual Intelligence.pdf
 
Salient Features of India constitution especially power and functions
Salient Features of India constitution especially power and functionsSalient Features of India constitution especially power and functions
Salient Features of India constitution especially power and functions
 
Key note speaker Neum_Admir Softic_ENG.pdf
Key note speaker Neum_Admir Softic_ENG.pdfKey note speaker Neum_Admir Softic_ENG.pdf
Key note speaker Neum_Admir Softic_ENG.pdf
 
SOC 101 Demonstration of Learning Presentation
SOC 101 Demonstration of Learning PresentationSOC 101 Demonstration of Learning Presentation
SOC 101 Demonstration of Learning Presentation
 
Sociology 101 Demonstration of Learning Exhibit
Sociology 101 Demonstration of Learning ExhibitSociology 101 Demonstration of Learning Exhibit
Sociology 101 Demonstration of Learning Exhibit
 
Jamworks pilot and AI at Jisc (20/03/2024)
Jamworks pilot and AI at Jisc (20/03/2024)Jamworks pilot and AI at Jisc (20/03/2024)
Jamworks pilot and AI at Jisc (20/03/2024)
 
Python Notes for mca i year students osmania university.docx
Python Notes for mca i year students osmania university.docxPython Notes for mca i year students osmania university.docx
Python Notes for mca i year students osmania university.docx
 
Food safety_Challenges food safety laboratories_.pdf
Food safety_Challenges food safety laboratories_.pdfFood safety_Challenges food safety laboratories_.pdf
Food safety_Challenges food safety laboratories_.pdf
 
How to Give a Domain for a Field in Odoo 17
How to Give a Domain for a Field in Odoo 17How to Give a Domain for a Field in Odoo 17
How to Give a Domain for a Field in Odoo 17
 
Wellbeing inclusion and digital dystopias.pptx
Wellbeing inclusion and digital dystopias.pptxWellbeing inclusion and digital dystopias.pptx
Wellbeing inclusion and digital dystopias.pptx
 
Micro-Scholarship, What it is, How can it help me.pdf
Micro-Scholarship, What it is, How can it help me.pdfMicro-Scholarship, What it is, How can it help me.pdf
Micro-Scholarship, What it is, How can it help me.pdf
 
Kodo Millet PPT made by Ghanshyam bairwa college of Agriculture kumher bhara...
Kodo Millet  PPT made by Ghanshyam bairwa college of Agriculture kumher bhara...Kodo Millet  PPT made by Ghanshyam bairwa college of Agriculture kumher bhara...
Kodo Millet PPT made by Ghanshyam bairwa college of Agriculture kumher bhara...
 
Graduate Outcomes Presentation Slides - English
Graduate Outcomes Presentation Slides - EnglishGraduate Outcomes Presentation Slides - English
Graduate Outcomes Presentation Slides - English
 
ICT Role in 21st Century Education & its Challenges.pptx
ICT Role in 21st Century Education & its Challenges.pptxICT Role in 21st Century Education & its Challenges.pptx
ICT Role in 21st Century Education & its Challenges.pptx
 
Understanding Accommodations and Modifications
Understanding  Accommodations and ModificationsUnderstanding  Accommodations and Modifications
Understanding Accommodations and Modifications
 
REMIFENTANIL: An Ultra short acting opioid.pptx
REMIFENTANIL: An Ultra short acting opioid.pptxREMIFENTANIL: An Ultra short acting opioid.pptx
REMIFENTANIL: An Ultra short acting opioid.pptx
 
HMCS Vancouver Pre-Deployment Brief - May 2024 (Web Version).pptx
HMCS Vancouver Pre-Deployment Brief - May 2024 (Web Version).pptxHMCS Vancouver Pre-Deployment Brief - May 2024 (Web Version).pptx
HMCS Vancouver Pre-Deployment Brief - May 2024 (Web Version).pptx
 

One Shoe - MediaMosa player

  • 1. MEDIAMOSA PLAYER Open source html5 weblectures player opensourcewebdevelopment
  • 2. TODAY who am I and who is One Shoe open source video player definition of HTML 5 the state of HTML 5 video browser adoption components the player challenges ahead future releases questions Introduction CONFERENCE MEDIAMOSA, WEBLECTURES AND OPEN VIDEO mediamosa Html 5 video weblectures MARCH 29th 2011 CONCLUSION
  • 3. WHO is ONE SHOE 3 WHO am i Thijs Zoon Full service internet company General manager R&D / Product development based in utrecht, 38 employees, web development, advertising, digital branding, mobile, drupal specialist system architect, drupalnerd, research & developmenthoncho, code purist, music enthousiast thijs.zoon@oneshoe.nl +31 (0)30 2317521 www.oneshoe.nl info@oneshoe.nl @oneshoe +31 (0)30 2317521 opensourcewebdevelopment
  • 4. 4 Introduction 4 cooperating divisions webdesign websites intranet communities web applications seo/sea hosting drupal support research & development mobile websites iOS apps iphone/ipad android apps symbian apps windows phone apps qr codes mobile gaming mobile advertising crossmedia concepts online branding online marketing marketing development campaigns pr and advertising guerilla marketing concept development identity design communication strategies search engine strategies outdoor advertising
  • 5. 5 OPEN SOURCE MEDIAMOSA PLAYER opensourcewebdevelopment
  • 6. OPEN SOURCE MEDIAMOSA PLAYER Multi-stream Captions / subtitles Slides HTML 5 6 MediaMosa
  • 7. 7 definition of HTML 5 opensourcewebdevelopment
  • 8. 8 HTML 5 video History of html Introduction of HyperTextMarkup Language First draft of HTML 5 specs are published HTML 3.2 and 4 specsreleased Standardization, first adoption as open standard, Mosaic browser A stricter XHTML standard is released HTML 2.0 specsreleased, browser war between Netscape and Internet Explorer WHATWG (Web Hypertext Application Technology Working Group) 1995 1997 1999 2004 2008 1993 1989
  • 9. DEFINITION OF HTML 5 Ongoing effort toimplement a standard forricher web applications Common name for a combination of JavaScript- HTML, CSS novelties Currently, not a single browser implements 75% of all HTML5 features HTML5 specs are in draft, expected full recommendation in 2022 9 HTML 5 video
  • 10. HTML 5 The <video> element opensourcewebdevelopment
  • 11. BROWSER ADOPTION HTML 5 video 55% of visitors have a browser that supports the video element 93% of visitors have Flash 10+ Codec war 11
  • 12. CODEC WAR <video …> <source src=”vid.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"' /> <source src=”vid.webm" type='video/webm; codecs="vp8, vorbis"' /> <source src=”vid.ogv" type='video/ogg; codecs="theora, vorbis"' /> ... </video> 12 HTML 5 video
  • 13. WEBLECTURES BEYOND THE <video> element opensourcewebdevelopment
  • 14. COMPONENTS Video (primary) Video (secondary) Slides Captions / subtitles Timed events, textand images Transcript(s) Additional downloads 14 Weblectures
  • 15. MEDIAMOSA PLAYER OPEN SOURCE HTML5 WEBLECTURES PLAYER opensourcewebdevelopment
  • 16. CHALLENGES AHEAD Changing HTML5 specificationsand browser implementations Codec war Bugs in Chrome, Mobile Safari 16 Conclusion
  • 17. FUTURE RELEASES Better support foriOS (iPadandiPhone) Integratedfallbackplayer (Adobe Flash) 17 Conclusion
  • 18. THANK YOU QUESTIONS ANYONE? Thijs Zoon Phone: E-mail: +31 (0)302317521 thijs.zoon@oneshoe.nl www.oneshoe.nl @oneshoe Web: Twitter: General manager R&D / Product development opensourcewebdevelopment
  • 19. MORE INFORMATION In depth information on HTML5 videohttp://diveintohtml5.org/video.html HTML5 andit’s support historyhttp://en.wikipedia.org/wiki/HTML5_video Browser versionstatisticshttp://gs.statcounter.com/#browser_version-ww-monthly-201002-201102 Test a browser’sHTML5 supporthttp://html5test.comor http://caniuse.com VideoJS, HTML5 playerhttp://videojs.com Or contact OneShoe: www.oneshoe.nl 19 More information

Notas do Editor

  1. Open the demo of the player