How-to Video heute: im Web, mobile und überhaupt

1.338 Aufrufe

Veröffentlicht am

Videos sind heute ein selbstverständlicher Bestandteil jeder Homepage. War die Einbindung früher "dank" Flash und FLV-Player unspektakulär, sind mit HTML5 und den mobilen Devices neue Möglichkeiten, aber auch neue Herausforderungen hinzugekommen. Dieser Vortrag ist ein Streifzug durch die komplette Prozesskette und beleuchtet die dabei entstehenden Fragen. Eine 360-Grad-Betrachtung der Aufgabenstellung Video im Web und auf mobilen Devices zwischen Bequemlichkeit und Perfektionismus.

Veröffentlicht in: Internet
0 Kommentare
0 Gefällt mir
Statistik
Notizen
  • Als Erste(r) kommentieren

  • Gehören Sie zu den Ersten, denen das gefällt!

Keine Downloads
Aufrufe
Aufrufe insgesamt
1.338
Auf SlideShare
0
Aus Einbettungen
0
Anzahl an Einbettungen
121
Aktionen
Geteilt
0
Downloads
0
Kommentare
0
Gefällt mir
0
Einbettungen 0
Keine Einbettungen

Keine Notizen für die Folie

How-to Video heute: im Web, mobile und überhaupt

  1. 1. How-toVideo heute: im Web, mobile und überhaupt MobileTech Conference, München, 19. September 2013 How-toVideo heute © fredmantel - Fotolia.com
  2. 2. Make or Buy?
  3. 3. Produktion Encoding Darstellung Distribution Prozess
  4. 4. Encoding
  5. 5. • Welche Browser? • Welche Formate? • Welche Auflösungen? • Welche Bandbreiten? • WieTranscodieren? Encoding Fragen
  6. 6. Encoding
  7. 7. Encoding Grafik: encoding.com + Ogg + Ogg FLV, MP4
  8. 8. Auflösungen Grafik: Wikipedia.de
  9. 9. Formate Was machtYouTube? Quelle:Wikipedia.com
  10. 10. Formate Was machtYouTube? Quelle:Wikipedia.com
  11. 11. Encoding zu Fuß
  12. 12. Encoding zu Fuß
  13. 13. Encoding zu Fuß
  14. 14. + gute Qualität + flexibel -- extrem aufwändig - nicht automatisierbar -- Skaliert garnicht Encoding zu Fuß
  15. 15. Encoding automatisiert, in House
  16. 16. Encoding automatisiert, in House
  17. 17. Encoding automatisiert, in House
  18. 18. + gute Qualität + schnell + automatisierbar + Rohdaten verlassen das Haus (den Kontinent) nicht - erfordert Wartung - bei kleiner Menge relativ teuer - skaliert schlecht Encoding automatisiert, in House
  19. 19. Encoding in der Cloud
  20. 20. Encoding in der Cloud
  21. 21. Encoding in der Cloud
  22. 22. + bequem + bei kleinen Menge billig + skaliert gut + wartungsfrei - Rohdaten verlassen das Haus - langsam - eingeschränkter Funktionsumfang Encoding in der Cloud
  23. 23. iOS, in App OfflineVideo • iPhone 3G and 3GS 640 x 480 • iPhone 4 and iPad 1 1280 x 720 • iPhone 4S and iPad 2 & 3 1920 x 1080 Encoding
  24. 24. Android, in App OfflineVideo Encoding Quelle: developer.android.com
  25. 25. Produktion Encoding Darstellung Distribution Prozess
  26. 26. Darstellung
  27. 27. • HTML5 oder Flash? • Welcher Player? Darstellung Fragen
  28. 28. Darstellung Grafik: Longtail Video
  29. 29. Darstellung Quelle: CanIUse.com HTML5Video Browser Support
  30. 30. Grafik: Longtail Video Darstellung HTML5Video Browser Support
  31. 31. Was machtYouTube? Quelle:Wikipedia.com Darstellung
  32. 32. Was machtYouTube? Flash Player HTML5 native Quelle:Wikipedia.com Darstellung
  33. 33. Demo www.bokowsky.net/de/knowledge-base/video
  34. 34. Darstellung ÜbersichtVideo Player www.praegnanz.de/html5video
  35. 35. Demo www.bokowsky.net/de/knowledge-base/video
  36. 36. Produktion Encoding Darstellung Distribution Prozess
  37. 37. Distribution
  38. 38. • Progressive Loading oder Streaming? • Streaming-Server oder Adaptive Bitrate Streaming? Distribution Fragen
  39. 39. Distribution Progressive Loading
  40. 40. Distribution Streaming Server
  41. 41. Distribution Streaming Server
  42. 42. Distribution Streaming Server
  43. 43. + Bandbreitenschonend, wichtig bei vielen gleichzeitigen Abrufen + Auch Set-Top-Boxen und alte Clients können damit umgehen + Springen und Spulen problemlos möglich ++ Automatische Bandbreitenerkennung -- Probleme mit Firewalls - Problematisch mit CDNs Distribution Streaming Server
  44. 44. Aber, muss das wirklich sein?
  45. 45. HLS
  46. 46. Distribution HTTP Live Streaming (HLS) Grafik: encoding.com
  47. 47. Distribution HTTP Live Streaming (HLS) Grafik: encoding.com
  48. 48. + Läuft per http, braucht nur einen Webserver + Geht durch die Firewall + Mit CDNs kompatibel + Automatische Bandbreitenerkennung - Läuft native nur auf iOS und MacOS + Mit JWPlayer auf allen Browsern - unter Android ein Alptraum Distribution HLS (HTTP Live Streaming)
  49. 49. Demo www.bokowsky.net/de/knowledge-base/video
  50. 50. Distribution HTTP Dynamic Streaming (HDS) Grafik: encoding.com
  51. 51. Distribution Cloud Streaming Services
  52. 52. Distribution Cloud Streaming Services
  53. 53. Distribution Cloud Streaming Services
  54. 54. Distribution Cloud Streaming Services
  55. 55. Distribution Cloud Streaming Services
  56. 56. Distribution Serverseitige Geräteerkennung
  57. 57. • mp4 and webm files anbieten (flv und ogg ignorieren) • Versionen in 240p, 360p, 480p, 720p und 1080p anbieten • Für iOS Devices HLS bereitstellen • HTML5Video dem Flash-Player vorziehen • Für den IE8 ein Flash Fallback bereithalten • Über serverseitige Gerätererkennung nachdenken Zusammenfassung Meine Empfehlung
  58. 58. Diese Folien und noch viel mehr gibt‘s unter www.bokowsky.net/de/knowledge-base/
  59. 59. Come and see us Club Mate and fritz-kola for free
  60. 60. Vielen Dank Markus Bokowsky markus@bokowsky.de @MarkusBokowsky sowie auf Facebook, Google+, Foursquare, LinkedIn, Lanyrd, Pinterest, etc. Bokowsky + Laymann GmbH www.bokowsky.de @BokowskyLaymann sowie auf Facebook, Slideshare, YouTube, Flickr P.S: Bokowsky + Laymann sucht Entwickler Objective-C, Java (Android), PHP, ColdFusion jobs@bokowsky.de oder im Social Network IhresVertrauens

×