Beyond Tellerrand 2017

Bildnachweis: https://www.flickr.com/photos/szene/34009374403/in/album-72157684024890916/

Einmal im Jahr ist für mich Beyond Tellerrand in Düsseldorf. Das ist für mich eine Tradition geworden. Eine Tradition, die ich gerne pflege, immerhin war es jetzt mein sechster Besuch in Folge 1. Und wie jedes Jahr versuche ich mich an einen kleinen Recap der diesjährigen Konferenz.

Und jetzt bitte den Sound aufdrehen und zurück lehnen. Cinematique Intro Incoming.

Nachfolgend ein paar Worte zu meiner Meinung nach hervorragenden Talks 2. In keiner besonderen Reihenfolge.

Sarah Drasner - Storytelling in Javascript

Nachdem ich Sarah bereits letztes Jahr auf der Smashing Conference Freiburg zuhören durfte, habe ich mich bereits auf Ihren Talk gefreut. Sarahs Talk ging darum, dass wir als Webentwickler auch Geschichten erzählen, nicht nur Webseiten bauen.

Mit allem was wir machen und tun erzählen wir Geschichten. Sind es nun Maskottchen in einem Footer oder das Bewertungssystem von Netflix. Auch dass der Mensch zwar initial denkt dass ein Computer ein Computer ist und es schwer ist eine emotionale Beziehung aufzubauen, er aber kein Problem ihn trotzdem zu lieben oder zu hassen.

Als Beispiel hat Sarah hierbei Clippy genannt:

If we go back to the Clippy model, we can understand that Clippy was annoying because his personality was annoying. They ran these tests where they didn’t change the functionality of Clippy, but they had him make fun of himself, so he came out and he would say, like, “God, I’m back. Why am I here? Ah, this is so annoying. Why don’t you just, like, write a letter to Microsoft and really let them have it? No, no, that’s not rude enough. Really let them have it,” and people started rating that they loved Clippy because Clippy became a likeable person.

Ein weiteres Thema war Fake Performance, d.h. wie man einen Nutzer in die Illusion führen kann die Ladezeit nicht als störend wahrzunehmen.

Some things that we know about loaders are that uncertain wait times are longer than known or finite waits. Disney World and airports know this, so Disney World will give animatronic animals and stuff while you’re waiting in line so the kids don’t feel like the wait is quite as long. Airports will make you walk all the way around to get to baggage claim so that you feel like you just got to baggage claim and your bag was there. You can actually check it out the next time you’re at an airport. If you look at a map, you’re actually walking a really long way to get your bags.

Viget did a great experiment where they used the kind of normal spiny loader and then they made a custom loader that was just their logo with some dots. People were willing to wait twice as long between 14 seconds and 22 seconds for the custom loading experience. Your users actually just want to know that you care about them a little bit. It’s kind of interesting.

Worum es übrigens in diesem Talk nicht ging war: Javascript. Aber dass habe ich als nicht wirklich schlimm empfunden.

Die Slides finden sich hier. Und ein komplettes Transkript auf dieser Seite.

Jeremy Keith - Evaluating Technology

Jeremy. Oh Jeremy. Wie ich deine Talks liebe 3. Bereits in meinem Beitrag zur letztjährigen Veranstaltung im Jahr 2016 sagte ich, dass ich bei seinen Talks nicht objektiv bleiben kann. Und dieses hat sich nicht geändert. Wenn man einen Jeremy Keith Talks in wenigen Wörtern beschreiben müsste, würde ich es mit "Webtechnologie Philosophie" versuchen.

Sein diesjähriger Talk "Evaluating Technology" passte wie immer inhaltlich zu seinen bisherigen Talks aus den Vorjahren 4.

Technologien bestimmen unser Leben, einige existieren schon seit Jahrtausenden - wie z.B. die Axt. Und je besser unsere Technologie wird, desto aufwändiger wird die Herstellung. Hier sind alle gefragt, denn es braucht Kooperation um eine Axt herzustellen. Oder einen Bleistift.

There’s a famous book by Leonard Read called I, Pencil, and it’s told from the point of view of a pencil and describing how it requires cooperation. It requires human beings to come together to fell the trees to get the wood, to get the graphite, to put it all together. No single human being can do that by themselves. We have to cooperate to create technology.

Auch auf das Internet bezogen:

The World Wide Web project is a classic example of a piece of technology that didn’t come out of nowhere. It built on what came before. Like every other piece of technology, it built on what was already there, right? You can’t have Twitter or Facebook without the World Wide Web, and you can’t have the World Wide Web without the Internet. You can’t have the Internet without computers. You can’t have computers without electricity. You can’t have electricity without the Industrial Revolution. All right, so building on the shoulders of giants all the way up.

Jeremy Keith, Foto von Andreas Dantz, Creative Commons, https://www.flickr.com/photos/szene/34655879482/in/album-72157684024890916/

Und als weiteres Beispiel und weil vermutlich kein Jeremy Keith Talk ohne die Erwähnung von Tim Berners-Lee auskommt:

He [Tim Berners-Lee] didn’t create these things from scratch. HTTP, the protocol, is built on top of TCP/IP, the work of Bob Kahn and Vint Cerf. The URLs work on top of the domain name system and the work of Jon Postel. And HTML, this very simple format, was built on top of a format, a flavor of SGML that everybody at CERN was already using, right? So it wasn’t a hard sell to get people to use HTML because it was very familiar.

Und das führt unweigerlich zu der Schlüsselkomponente seines Talks - dem Satz der alles prägt und mir in Erinnerung bleibt:

Now when we look at new things added to HTML, new features, new browser APIs, what we tend to ask, of course, is, how well does it work? How well does this thing do what it claims it’s going to do? That’s an excellent question to ask whenever you’re evaluating a new technology or tool. But I don’t think it’s the most important question. I think it’s just as important to ask, how well does it fail?

Als Beispiel kann man hier Progressive Enhancement nehmen - Was mach ich mit meiner Technology wenn sie nicht unterstützt wird. Geht alles kaputt? Merkt man nicht dass es fehlt? Wie gut ist der Fallback? HTML ist auf diesem Prinzip aufgebaut. Ein Videoelement gibt alles aus was zwischen dem video Tag steht, wenn ein Codec oder vielleicht sogar das ganze Element nicht unterstützt wird.
Ein anderes Beispiel sind Service Workers:

Service workers fail superbly because here’s what happens with a service worker. The first time someone visits your site there, of course, is no service worker installed on the client. They must first visit your site, get the downloads, have that service worker installed, which means every browser doesn’t support service workers for the first visit.

Und zum Abschluss (nach dem ich einen sehr großen Teil übersprungen habe):

I mean in the way that we are slow geeks and we ask questions of our technology. We ask questions like, “How well does it work?” but also, “How well does it fail?” That we ask, “Who benefits from this technology?” And perhaps most importantly that we ask, “What are the assumptions of those technologies?” because when I look back at the history of human civilization and the history of technology, I don’t see technology as the driving force, that it was inevitable that we got to where we are today. What I see as the driving force are people, remarkable people, it’s true, but people nonetheless.

Dieser Talk hat noch soviele schöne Zitate und Ansichten, fast jede würde ich sofort unterschreiben. Schaut euch den Talk an oder wenn ihr gerade unterwegs seid: Lest ihn nach.

Mario Klingemann - Machimaginarium

Mario Klingemann hat sich mit AI beschäftigt. Und dass auf eine sehr interessante Art und Weise. Ich halte mich kurz mit Zitaten und empfehle direkt das Video anzusehen. Man könnte z.B. so etwas sehen:

Jonathan Barnbrook - What you want is not what you need

Jonathan Barnbrook is most well-known as David Bowie’s favourite graphic designer having worked on the designs of his last 4 albums. However he has had a long and distinguished career in type design being one of the original members of the “typographic new wave” – a 1990s international movement that rebelled against the Modernist conventions of the 20th century in favour of the new freedom that the rise of technology and a re-found interest in the vernacular gave them.

Einen Talk von Jonathan zu hören ist schon was besonderes, zwar bezeichne ich mich nicht als größten Fan von David Bowie, aber seine Cover sind ikonisch. Vorallem die Geschichte um das "The next day" Cover fand ich sehr interessant.

Jonathan Barnbrook, Foto von Andreas Dantz, Creative Commons, https://www.flickr.com/photos/szene/34655798532/in/album-72157684024890916/

Seb Lester - Peace, Hellfire & Outer Space

Lester’s passion and obsession is letterforms. He has created typefaces and letterform based illustrations for some of the world’s biggest companies, publications and events, including the likes of NASA, Apple, Nike, Intel, The New York Times, The 2010 Vancouver Winter Olympics and JD Salinger’s final reissue of The Catcher in the Rye. 

Previously a Senior Type Designer at Monotype for nine years, he developed custom typefaces for clients including British Airways, The Daily Telegraph, H&M and Barclays. His limited edition prints are becoming increasingly popular and collectible. In recent years a love of calligraphy has pushed his work in exciting new directions.

Seb Lester war der diesjährige Typographie Talk. Und es hätte kein besserer machen können. Ich liebe seine Arbeit.

Von Seb Lester hörte ich vor einigen Jahren das erste Mal. Und zwar wurde ich auf seinen Instagram Channel aufmerksam gemacht. Er machte handgemachte Typography und zeigte dabei eine ruhige Hand mit dem er auch Chirurg werden könnte. Jedes seiner Werke sieht aus wie gedruckt, kein Fehler oder Strich zuviel und wie man beim Zeichnen überhaupt so denken kann zum Schluss so etwas herauskommt, wird mir wohl für immer ein Rätsel bleiben.

In seinem Talk (mit dem wahrscheinlich auch besten Titel) erzählte er von seinem Werdegang als Typograph und wie es dazu kam dass er nun nicht nur auf der Erde bekannt ist.

Sketch Notes von Eva Lotta Lamm

Leider gibt es weder Video noch Slides zu diesem Talk. Vielleicht vermitteln aber die großartigen Sketchnotes von Eva Lotta-Lamm eine Idee.

Christian Heilmann - Breaking out of the Tetris Mindset

Ein sehr allgemeiner Talk von Christian Heilmann 5 über den derzeitigen Stand der Webentwicklung, dem Zusammenspiel von Komponenten und Paradigmen.

Moneyquote:

Think about what W3C defines. “Users over authors over implementers over specifiers over theoretical purity.” This is a very simple thing to think about. Your users are the ones that make you money, not your tool chain creators, not you yourself because you don’t want to spend money on that stuff.

Nadieh Bremer - Hacking the visual norm

Nadieh beschäftigt sich mit Datenvisualisierungen, vornehmlich mit D3.js. Ihre Slides und Beispiele sind auf Github und unbedingt anzugucken. Zumindest wenn man sich nur ansatzweise für Visualisierungen interessiert.

I found that, in data visualization, I tend to be a perfectionist. I love spending hours and hours on some small detail to make it exactly as I have in mind or sketched out on paper. However, usually what I have in mind isn’t quite the default setting or what all of the examples are using, and that forces me to try and be creative with the available charts and tools like using a donut chart to create a radial bar chart, for example.

You don’t have to be some sort of code wizard to go beyond the norm. By combing existing charts and forms and layouts in inventive ways, you can assign a new meaning to the whole or even simply reusing an existing chart in a different manner can open up more possibilities for new data displays. And don’t underestimate the power that a good use of fonts and colors and hierarchy you can have on the end result in terms of visual appeal and effectiveness. Of course, for drastic changes, you can even decide to go into the underlying source code if possible and turn an existing chart into something completely different, but based on somebody else’s fantastic work.

Nadieh Bremer, Foto von Andreas Dantz, Creative Commons, https://www.flickr.com/photos/szene/34655970292/in/album-72157684024890916/

Espen Brunborg - The secret life of comedy

Dieser Talk hatte wahrscheinlich mit das beste Opening. Die Geschichte des Webs, illustriert und nach Art des Buches Genesis. Oder so.

On the second day God created Flash. And He was very hung over when He did so. And He said, “Praise me, for I have given you vector graphics and animation,” and His followers praised Him as they waited for the page to load. Then they clicked “skip intro,” and God was very disappointed because He worked really hard on that intro.

Das Espen scheinbar nicht ganz so glücklich mit dem derzeitigen Stand des Webs ist, kann man relativ schnell rauslesen.

Of course, everything looks dull, but who cares when you have this: the publishing machine. The publishing machine comes in three parts. The first part is about the CMS, and we got a whole bunch of choices there. For example, if you want to make a blog, you can press the top button is for WordPress. If you want a magazine, you press the other button for WordPress. If you have a brochure site or marketing site, or any site, really, you can press the third button, which is also WordPress. There’s other choices too like Joomla or Drupal or the Grid or Squarespace, but you know we have this world of choices, maybe like five choices. It’s amazing.

Seine Thesen für den good shit sind dass gutes Webdesign

  • universell, aber auch individuell
  • intuitiv, aber auch überraschend
  • unsichtbar, aber auch beeindruckend
  • user centric, aber auch visionär
    sein sollte.
Espen Brunborg, Foto von Andreas Dantz, Creative Commons, https://www.flickr.com/photos/szene/34818977785/in/album-72157684024890916/

Generell scheinen Gegensätze für Espen oft eine gute Kombination zu sein. Ein weiteres Beispiel sind Musik und Komödie

Ultimately, music and comedy work because they’re based on rhythm, right? Musical rhythm is fairly easy to explain. You know we can nod along, to tap our fingers, finger drum, whatever. Everybody knows what musical rhythm is. To explain comedic rhythm, I’ve got a bonus chapter called Hipster Jokes. Ultimately, comedic rhythm is simple. It’s a one, two, three thing. It’s your setup, your anticipation, and then your punch line. [...]
Comedic rhythm is basically, you know, you set something up and then you have a punch line, which means that rhythm in both cases is expectation and reward. In music you have a beat. You set up the expectation that we’re going to hear the next beat or feel the next beat. With comedy, you have a setup, so you expect a punch line at some point.

The difference is that the reward in music and the reward in comedy is completely different. In music the reward is that our expectation is met. When we get that next beat, when we get to a certain harmony, it feels good, it feels right, and then we experience music. [...]
My point is, comedy is funny when the expectation is violated or broken, and it’s only funny then. If we see the joke coming a mile off, well, then it’s not as funny any more.

Worauf es in diesem Talk hinausläuft ist, dass man manchmal mit den Erwartungen des Nutzer spielen sollte. Kreativität ausleben und eine denkwürdige Erfahrung liefern. Auch wenn es heißt dass man ungewöhnliche Wege gehen muss, wie dieses Beispiel zeigt:

Who knew if you want to sell Swedish trucks, you use aging action stars and Enya? [...] It works. [...] The message is this: creative stuff makes more money because it’s memorable or emotional or whatever it is. You create a connection to your audience and then they buy your product instead of these other people’s products.

Every year in Cannes there’s a festival dedicated to creativity. It’s the Cannes Lions. Basically they award campaigns because of their creativity, right? McDonald's are saying that the stuff that win awards there have a way higher return on investment than the stuff that doesn’t. Heineken is saying the same thing. The stuff that wins creative awards is more profitable. It’s got a higher return.

Gabs noch mehr?

Ja - noch einige mehr. Jeder mit seinen eigenen Stil / Themengebiet. Manches interessiert mich halt weniger, aber war dennoch interessant. Nur ein Talk hat mir überhaupt nicht gefallen, das Thema war vielversprechend, der Inhalt aber mehr eine Werbeveranstaltung als ein Vortrag 6.

Rundherum

Location
Das Düsseldorfer Capitol Theater war wie immer eine sehr gute Location. Kleine Tische mit roten Lampen in Theateratmosphäre sind schwer zu schlagen. Bestuhlung wird zwar gefühlt jedes Jahr härter, aber dass nimmt man gerne in Kauf. Temperatur ist immer ein Streitthema, da hier Kompromisse zwischen einer lauten Klimaanlage und Temperatur schließen muss, aber auch hier war es dieses Jahr sehr erträglich. Ich habe bereits viele anderer Konferenzen dieser Art besucht und das Capitol ist bislang ungeschlagen 7.

Musik von Baldower aka. Toby Lessnow
Er ist einfach nur großartig. Seine Musik und Performance lösen Twitter Dance Gifs aus und für viele (auch für mich) eines der ganz großen Highlights. Jedes Jahr.

Die Leute!
Die Beyond Tellerand gilt inzwischen als Klassentreffen der (Frontend) Entwickler in Deutschland. Ich freue mich immer, wenn ich die altbekannten Gesichter der letzten Jahre wiedersehe und auch neue Bekanntschaften mache 8. Der Austausch ist groß und bei weitem nicht nur auf Webentwicklung fokussiert.

Videos und Transkripte
Ich möchte nur mal kurz erwähnen dass die Videos der Konferenz teilweise noch am selben Tag online sind. Und noch erstaunter war ich beim Schreiben dieses viel zu lang gewordenen Artikels - Marc hat sich scheinbar die Mühe gemacht und Transkripte der Talks erstellt. Transkripte. Der Talks. Der ganzen Talks. Wort für Wort. Wow. Ihr findet am Ende dieser Seite.

Update: Das Geheimnis um die Transkripte ist gelöst.

Sehen wir uns nächstes Jahr wieder?

Mit ziemlicher Sicherheit, ja. Kommt ihr auch?

Links

  1. Weitere Traditionen die für mich rund um dieses Event entstanden sind, sind der Besuch am Sonntag Abend vor der Konferenz im Restaurant Club Portuguese und das traditionelle Burger Essen bei Whats Beef am Montag Mittag. In der Tat werden meine Beyond-Tellerrand-Düsseldorf Traditionen immer umfangreicher und stehe wahrscheinlich kurz vor einer Zwangsneurose

  2. Dies sind bei weitem nicht alle, aber manche Bereiche interessieren mich einfach weniger und ausserdem wäre dieser kleine Blogbeitrag dann doppelt so lang

  3. Lieber Marc, falls du diese Zeilen hier liest: Bitte mache Jeremy einfach zu einer jährlichen festen Konstante, er kommt ja sowieso irgendwie immer auf die Bühne.

  4. Zur Auffrischung, hier der Talk von 2013, der Talk "Enhance" von 2015, und "Resilience" von 2016.

  5. Auf der Smashing Conference 2016 haben wir irgendwann aufgrund der schlechten Luft und Hitze den Saal verlassen und dachten, dass wir uns den Talk auch in der Lounge auf den Fernsehern ansehen könnten. Unser Plan ging auch soweit auf, wir hatten Fat Boys, nicht ganz warme Softdrinks und Atemluft. Dazu aber auch Christian Heilmann der die meiste Zeit vor dem Bildschirm stand und mehr oder weniger lustige Zwischenrufe in den Raum warf. Vielleicht räche ich mich jetzt indirekt damit, dass ich jetzt garnicht soviel über diesen Beitrag schreiben werde. Obwohl er gut war. Aber halt kein Jeremy Keith. Ach Jeremy. 2018 dann auch wieder, ok?

  6. Ich bin mir nicht sicher ob diese Person mit dem Unternehmen verbandelt ist, aber wenn ich das Gefühl habe dass mir nur jemand etwas verkaufen möchte, dann bin ich gereizt, klappe mein Notizbuch zu und öffne lieber Reddit auf dem Smartphone

  7. U.a. war ich auf einigen Konferenzen und Barcamps die in Unis stattgefunden haben. Ein Vorlesungssaal ist allerdings keine gute Atmophäre für ein Event. Schon in der Uni waren solche Räume keine tollen Räume. Warum soll es eine gute Event Location sein?

  8. Eine Geschichte die ich gerne erzähle ist die von Mario. Den traf ich auf meiner ersten Tellerrand Konferenz und verbrachte die beiden Tage sehr viel Zeit mit ihm. Vor ca. zwei Jahren bekam ich eine E-Mail von ihm und er schrieb mir dass mein Name ihm wohl irgendwie im Gedächtnis geblieben ist, er jetzt Vater geworden und es jetzt einen weiteren Florenz auf dieser Welt gibt. Hat mich schon ein bisschen berührt. Gruß an dieser Stelle an Mario! Egal - wo war ich ach ja ...