Wie interessant Google gerade für Informatikstudenten ist, zeigte sich auch am dritten Novemberwochenende in Berlin: Auf der letzten Station der diesjährigen Google Developer Days (GDD) wurde das Internationale Congress Centrum in unserer Bundeshauptstadt zum Pilgerort für Entwickler aus ganz Europa. Auch ich machte mich am Freitagabend auf den Weg – nachdem das mit der Node.js Conference in Italien im September leider nicht geklappt hatte, bewarb ich mich in einem Anfall von Größenwahnsinn auf eines der Developer-Tickets. Und bekam eine Zusage.

Glücklicherweise kam ich auch noch kurzfristig in den Genuss günstiger Flugtickets. Ansonsten wäre der Wochenendtrip (mal eben für einen Tag nach Berlin) zum GDD sicher sehr viel stressiger verlaufen. Doch genug der langen Vorrede: Was gab es nun zu sehen?

Auf der Keynote wurden neue Services und das neue Android vorgestellt.

Wer die Akkreditiertung hinter sich gebracht hatte, sich vom großartigen Frühstücksbuffet loseisen konnte, auf den wartete die anderthalbstündige Keynote. Was in Apple-Manier anfing, scheiterte letztlich kläglich an mangelnder Technik. Und damit meine ich nicht nur versagende Mikros und ausfallende Internetverbindungen, sondern auch die vorgestellten Features ;) Irgendwie blieb ein richtiger Wow!-Moment leider aus.
Dafür sollten die anschließenden sieben Stunden, vollgepackt mit allerhand interessanter Themen, entschädigen. Den über 2000 Entwicklern boten sich insgesamt 35 Sessions in den Themenblöcken Android, Chrome & HTML5, Cloud und Google+. Einen eigenen Track füllten die Berliner Universitäten, die mit einigen wissenschaftlichen Themen aufwarteten. Eines von ihnen hieß “Internet architecture trends”, das ich auch als erstes besuchte.
Ich war beeindruckt, wieviel der Dinge, die dort als Pros und Contras zu alternativen Internetarchitekturen genannt wurden, ich doch schon richtig einordnen konnte. Es schien mir beinahe so, als hätte ich durch die letzten Wochen aus der Vorlesung “Grundlagen der Rechnernetze” gerade genug mitbekommen, um dem Thema folgen zu können. Insofern bot der Vortrag auf jeden Fall die Motivation, dass nicht alles, wofür ich in der Uni pauke, vollkommen umsonst ist.

Weiter ging es mit “Working Off the Grid: HTML5 Offline”. Durch die vielen guten Beispiele sind dort sicher viele Zuhörer rausgegangen in der Erkenntnis, HTML5 in eigenen Projekten sinnvoll anwenden zu können. Und sei es “nur” zur Ladezeitoptimierung. Mit Fallbeispielen zu den neuen HTML-Technologien hätte ich nach dem Mittagessen auch weitermachen können, aber ich entschied mich für etwas Abwechslung und eine Einführung in die neuesten Cloud Technologien von Google (“Building Integrated Applications on Google’s Cloud Technologies”). Vorgestellt wurden u.a. die Prediction API und Googles BigQuery. In meinem Kopf sprießen seitdem ein Haufen möglicher Anwendung. Die Begeisterung rührt sicher auch von der wirklich sympathischen Vortragsweise von @nTangledMichael. Wer irgendwo ein Video davon findet: Anschauen!

Auch die uulm war bei den Ausstellern vertreten!

Mit “These aren’t the Sites You’re looking for: Modern HTML5 Web Apps” verschlug es mich zurück in den HTML5-Track. Viele praktische Tipps, aber zugegebenermaßen auch kaum neues. Gerade die Erfolgszahlen von Unternehmen, die durch den Chrome Web Store unglaublich reich geworden sein müssen, wurden beginnend bei der Keynote in fast jeder Session nochmal vorgekramt.
Nicht so bei bei der Vorstellung der neuen “programming language for structured web programming”: Dart. Es war eine nette kleine Einführung – aber eben auch nicht mehr. Interessant war die Feststellung, dass ein Teil der ehemaligen GWT-Entwickler nun an Dart mitarbeiten würde. Leider erschließen sich mir aber immer noch nicht die großen Vorteile von Dart gegenüber Javascript. Aber das wird sich vielleicht auch erst mit der Zeit zeigen.

Zuletzt standen die beiden Blöcke “Monetizing Web Apps” und “DevTools – Tips and Tricks” an. Ersteres überzeugte vor allem durch die Einfachheit, die Google zur Abwicklung von Micropayment Entwicklern bietet. Wer im Laufe des Tages Ideen für eine tolle Web-Anwendung bekommen hatte, wusste nun auch, wie man sie zu Geld macht. Ein Überblick über die Tools, die Chrome Entwicklern bietet, brachte dann den Ausklang der Sessions.

Der Abend klang aus mit einem Meet’n’Greet im großen Foyer des ICCs. Bei Bier und Brezeln konnte noch über so allerhand Technik diskutiert werden. Für mich war der Abend damit aber trotzdem schnell beendet, denn nach der späten Landung am Vorabend, der frühen Anreise in den Westen Berlins und dem vielem neuen Input hatte ich dann auch langsam genug.

Mein Fazit? Googler sind unglaublich jung! In dem etwa 40 Mann umfassenden Team, das für den GDD nach Berlin angereist war, fanden sich nur junge oder junggebliebene Leute. Die Speaker, die sich stets als Product Manager von irgendwas (Chrome zum Beispiel) vorstellten, waren allesamt nicht älter als 35. Das spricht für flache Hierarchien und viel Vertrauen in junge Leute.
Ganz allgemein präsentierte sich Google unglaublich sympathisch. Das fing damit an, dass der Deutschland-Chef meinte, dass wir nicht den Googlern danken sollten, sondern die mehr als 2000 anwesenden Entwickler eben diesen Dank verdient hätten. Daneben überzeugte der Developer Day durch viele kleine Details, sei es nur, dass es beim Mittagsbuffet eben u.a. auch typisch Berliner Essen gab.
Schön fand ich auch, dass es seitens der Speaker keinerlei Engstirnigkeit gab. Als ich mich angemeldet hatte, fragte ich mich noch, ob man wohl besser nur von Google Plus statt Facebook, Android statt iOS und Chrome anstelle von Firefox sprechen sollte. Aber nichts dergleichen. Die Googler zeigten auch mit ihren vielen MacBooks, dass man eben immer damit arbeiten sollte, was für die jeweilige Aufgabe am besten ist. Und dies bedeutet beim Browser-Beispiel etwa auch, dass sie sehr am Fortschritt von Firefox und anderen Konkurrenten interessiert sind, da nur so die im Chrome bereits umgesetzten HTML5-Features Anklang bei der breiten Masse finden und zum Standard werden können.

Alles in allem also eine gelungene Veranstaltung, mit der Google nicht nur Werbung für neue Technologien gemacht hat, sondern vor allem für sich selbst!

Weiterführende Links:

• Fotos auf Google+
• Noch mehr Fotos…
• Übersicht der Themen, Speaker und Slides

Nicht nur die Frage, wie man richtig präsentiert (Stichwort Zen vs. Death by PowerPoint), sondern auch die Frage, mit welchen Anwendungen man präsentiert, ist oft umstritten. Ich persönlich konnte mich bisher mit Powerpoint und Konsorten eher wenig anfreunden – vor allem Typografie und Einschränkungen bei der Gestaltung waren problematisch. Als Alternative habe ich bisher oft LaTeX Beamer verwendet, was allerdings je nach visueller Komplexität auch oft relativ zeitaufwendig ist, sich aber zumindest bei Grafiken in Vektorformaten und mathematischen Inhalten auch schnell auszahlt.

HTML5-basierte Foliensätze

Mit dem Aufkommen von HTML5 entstand eine zusätzliche Möglichkeit. Dank der neuen Multimedia-Tags wie <audio> und <video> sowie mächtigeren CSS Stilen bietet HTML nun die Grundlagen für browser-basierte Präsentationen. Mittlerweile gibt es hierfür auch schon mehrere Templates:

• DZSlides
• html5slides
• S5: A Simple Standards-Based Slide Show System

Noch mehr Alternativen gibt es in dieser Auflistung. Ein weiteres sehr schönes Beispiel ist ein Foliensatz zu HTML5, der selbst quasi eine Technologiedemonstration enthält: http://slides.html5rocks.com

Der Vorteil von HTML-basierten Präsentationen ist die hohe Anzahl von Medien (u.a. auch SVG, Flash Videos oder ganze Webseiten als IFrames), die man einbetten kann. Ein einfaches, weitläufig bekanntes Markup ermöglicht das schnelle Erstellen von Folien, und mit einer Kombination aus HTML, CSS und JavaScript lassen sich dennoch auch komplexe Spezialfunktionen realisieren.

Mir persönlich hat das html5slides Template ganz gut gefallen, das Google entwickelt und für die Google I/O Slides eingesetzt hat. Da das Template unter einer Apache License veröffentlicht wurde, habe ich zunächst damit begonnen, es an das Uni Ulm Corporate Design anzupassen. Außerdem hatte ich ein paar kleine Änderungen am Code vorgenommen, um zum Beispiel eine Nummerierung der Folien zu ermöglichen.

Presenter Mode?

Prinzipiell war das Ergebnis schon mal akzeptabel, allerdings wurden die oft genannten Probleme bei solchen HTML-Foliensätzen schnell offensichtlich – fehlende Notizen für den Vortragenden und nur eine Ausgabe.

Eher durch Zufall bin ich auf ein anderes Konstrukt gestoßen, dass seit HTML5 Cross-Frame-Communication erlaubt, also den Austausch von Nachrichten zwischen zwei verschiedenen Frames (mit einigen Einschränkungen): window.postMessage()

Die Möglichkeit, zwischen Frames zu kommunizieren, ist natürlich auch ideal dafür, Daten zwischen Frames zu synchronisieren. Übertragen auf zwei verschiedene Präsenationsframes ermöglicht dies beim Weiterschalten der Folien in einem Frame, den zweiten Frame zu aktualisieren. Schematisch sieht das so aus:

(CC-BY-NC) Icons by picol.org / w3.org

Im Hauptfenster kann per Tastendruck ein zusätzliches Popup geöffnet werden (1). Das neue Popup öffnet die gleiche URI der Präsentation und wird auf dem Bildschirm des Vortragenden platziert. Schaltet der Vortragende nun im Hauptfenster weiter zu nächsten Folie, so erzeugt dies ein Nachricht an das zweite Frame (2), das dann ebenfalls weiterschaltet.

Eine weitere Ergänzung war die Unterstützung von Notizen als Overlay über die Folien. Kombiniert mit dem Dual-Screen-Ansatz ermöglicht dies, dem Publikum die Folien zu zeigen, dem Vortragenden auf einem zweiten Bildschirm die Folien plus den verfügbaren Notizen.

Ausführliche Beispiele mit Code gibt es in einer Beispielpräsentation, den kompletten Code auf github: https://github.com/berb/html5slides-uulm

Auf der Feature Wishlist steht noch ein alternativer CSS-Stylesheet für den Druckexport. Außerdem ein Tool, dass externe Daten wie Bilder per Base64 encoding als Data URI integriert und JavaScript sowie Stylesheets inline einbindet, sodass die Präsentation als einzelne HTML5 Datei ohne externe Abhängigkeiten abgespeichert werden kann.