Vienna Calling: Digital Visions 2013

13.10.2013 5.712 Aufrufe Events 5,00

Seit Mai 2013 arbeite ich nun im Development-Team bei karriere.at, Österreichs führender Karriere-Plattform. Das Unternehmen tritt bei vielen Veranstaltungen als Sponsor auf und erfreut seine Mitarbeiter mit einem Kontingent an Freikarten. Diesmal gehörte ich zu den „Auserwählten“ und fuhr gemeinsam mit einem Kollegen zur Digital Visions nach Wien.

Digital Visions 2013
Digital Visions 2013

Digital Visions – Worum geht’s?

Digital Visions ist die Konferenz für User Experience und Frontend-Webentwicklung in Wien. Bereits zum zweiten Mal wollen wir gemeinsam Trends beim User Interface Design und in der Frontendprogrammierung setzen.
Der Konferenztag konzentriert sich auf qualitative Themen rund um Screendesign, Usability und HTML Trends.

Die Konferenz konnte mit sechs spannenden und abwechslungsreichen Talks aufwarten.

Digital Visions 2013
Digital Visions 2013

Status Quo der Webtypografie

Webtypografie-Experte Gerrit van Aaken eröffnete seinen Vortrag mit einer historischen Betrachtung des Themas: „We’ve come a long way“. Gerrit beleuchtete die Problematik der je nach Betriebssystem und Browser unterschiedlichen Darstellungstechniken, die zu unterschiedlichen Schriftdarstellungen führen. Um etwaige Darstellungsprobleme zu kompensieren, empfiehlt Gerrit hohe Schriftgrade: Ab 18px fängt der Spaß an!

Custom Webfonts werden laut Gerrit zum „No-Brainer“, wenn

  • alle Screens mehr als 300ppi haben,
  • alle Datenverbindungen (auch mobil) stabile 2 Mbit besitzen,
  • Billigsmartphones genug CPU und Speicher aufweisen können und
  • der User absolut keinen qualitativen Unterschied mehr zwischen eingebauten und eingebundenen Fonts bemerkt!

Bezüglich Webfonts-Einbindung empfiehlt Gerrit Hosted Webfonts, wie zum Beispiel Google Fonts. Vorteile: Schnelle Auslieferung dank CDN, Rechtssicherheit (!) und für die Einbindung reicht oft eine einzige Zeile Code.

Visionair – UX Flughafen-App

Im Rahmen des Projektes „Visionair“ wurde in einem Zeitraum von über drei Jahren an einer interaktiven Datenvisualisierung für die Prozessabläufe am Wiener Flughafen gearbeitet. Creative Director Gregor Hofbauer präsentierte den vielversprechenden Prototyp und gewährte interessante Einblicke in das Projekt – sowohl hinsichtlich Konzeption und technischer Umsetzung als auch aus organisatorischer Sicht.

Mobile User Experience

Interaction und UX Designer Thomas Nägele konfrontierte uns in seinem Talk gleich mal mit der spannenden Frage: Was ist überhaupt „mobile“? Es gibt keine klare Grenze mehr und täglich wird sie noch ungenauer. Auflösungen, die wir früher nur am Desktop hatten, haben wir mittlerweile auch am Smartphone. Notebooks haben ein Touch-Display, das früher noch als Indiz für ein mobiles Endgerät galt.

Just because my screen is small doesn’t give anyone insight to my behaviours, desires and needs.

Luke Wroblewski

Wir sprechen immer mehr von einem Nutzungskontext, der je nach Ziel, Zeit, Ort und Gerät variieren kann. Immer häufiger starten wir eine Aktion auf einem Gerät (z.B. Smartphone) und führen sie dann zu einem späteren Zeitpunkt auf einem anderen Gerät (z.B. Desktop-PC) fort. Daraus abgeleitet formulierte Thomas Nägele einen wichtigen Grundsatz um dieser „Multi-Screen-Herausforderung“ zukünftig gewachsen zu sein: Content first – der Inhalt steht im Mittelpunkt!

Content precedes design. Design in the absence of content is not design, it’s decoration.

Jeffrey Zeldman

Thomas beleuchtete auch die technische Basis, Responsive Webdesign, und präsentierte einen praxistauglichen Workflow.
In Zeiten des Responsive Webdesign müssen Designer und Frontend-Entwickler intensiv zusammenarbeiten, denn immer mehr Design-Entscheidungen werden bereits im Browser getroffen und nicht mehr im Photoshop. Fixe Größen sind nicht mehr zeitgemäß.

Digital Visions 2013
Digital Visions 2013

Das perfekte Steak

Frontend-Experte Stefan Baumgartner predigte auf unterhaltsame Weise „Browser Awareness“ und sein Vortrag war mit vielen Praxis-Tipps gespickt. Wir verlieren zunehmend die Kontrolle über die Umgebungen, in der unsere Applikationen laufen und die Erwartungen an die Endgeräte sind meist zu hoch geschraubt.
Generell sollte man auf Progressive Enhancement setzen: Ausgehend von einer Basis-Version, die wirklich überall funktioniert, erweitert man die Komplexität der Applikation schrittweise, falls die jeweiligen Rahmenbedingungen das zulassen.

  • Features? Scrolling! Use, when certain that it’s there!
  • Implementation quality? Tried, trusted and robust! Modern features should be an add-on!
  • Browser speed? iPad-near JS execution time! Less JavaScript dependent content!
  • Memory? A shitload! Optimize images, reduce image footprint!
  • Resolution? Of course Retina! Use SVG and responsive images!
  • Connection speed? Harddrive! Fear for worst, reduce requests!

Stefan zeigte auch auf, dass es nur bedingt sinnvoll ist Browsern nicht vorhandene Funktionen auf Biegen und Brechen mit irgendwelchen Polyfills „nachzurüsten“. Oft hat es einen guten Grund, dass bestimmte Features manchen Browsern (noch) untersagt sind. Selbiges gilt übrigens auch für die Vendor-Prefixes ‑moz‑, ‑webkit‑, ‑ms‑ und ‑o‑.

Take care of your content. Provide a solid HTML base. Present your content. Add robust and future friendly CSS. Enhance behaviour by adding JavaScript.

Beyond the Screen

Die selbstständige UX Designerin Nicole Neuberger spezialisierte sich aus persönlichen Gründen auf den Gesundheitsbereich. Sie zeigte anhand zahlreicher Beispiele auf, wie man mit Human-Centered Design die „ganzheitliche Service-Erfahrung“ im Gesundheitsbereich enorm verbessern könnte. Hier besteht definitiv Handlungsbedarf.
Der Talk tanzte meiner Ansicht nach thematisch etwas aus der Reihe, war aber durchaus interessant. Es lebe die Vielfalt!

Digital Visions 2013
Digital Visions 2013

RWD – Die Geister, die ich rief

Speaker Sven Wolfermann, freier Webentwickler mit Schwerpunkt Frontend, eröffnete seinen Vortrag mit ein paar interessanten Zahlen: Irgendwann 2014 übersteigt die mobile Internetnutzung die Desktop-Internetnutzung! Tja, aber was ist schon alles „mobile“?

19% of Facebook users access the service ONLY on mobile, never desktop. Friends, huge swath of people see your content only on small screen.

Josh Clark

In weiterer Folge ging Sven auf wichtige Aspekte des Responsive Webdesign ein und hatte hier dank der „Vorarbeit“ von Thomas und Stefan schon viele Anknüpfungspunkte.
Auch er wies darauf hin, dass Breakpoints abhängig von den Inhalten und nicht von irgendwelchen Geräteauflösungen gesetzt werden sollten. Sven ist auch ein Freund vom Konzept Design in the Browser, denn:

Using photoshop/fireworks for responsive design is like bringing a knife to a gunfight.

Andy Clarke

Bezüglich technischer Umsetzung setzt Sven auch auf den „Mobile first“-Ansatz, wobei damit gemeint ist, dass der Fokus der gesamten Planung, Konzeption und Umsetzung auf mobilen Endgeräten liegen sollte. Man sollte sich schon sehr früh die Frage stellen was denn überhaupt die wichtigsten Inhalte sind. Content first!
Zum Abschluss des sehr umfangreichen Vortrags gab es noch einen Exkurs zum Thema Responsive Images: Hier gibt es bereits sehr viele Ansätze, jedoch noch keine standardisierte Implementierung.
So könnte es mal aussehen:

<picture width="500" height="500">
  <source media="(min-width: 45em)" srcset="lrg-1.jpg 1x, lrg-2.jpg 2x">
  <source media="(min-width: 18em)" srcset="med-1.jpg 1x, med-2.jpg 2x">
  <source srcset="sml-1.jpg 1x, sml-2.jpg 2x">
  <img loading="lazy" src="sml-1.jpg" alt="">
  <p>Accessible text</p>
</picture>Code-Sprache: HTML, XML (xml)

Dieser Vorschlag wird gerade heiß diskutiert. Sind wir mal gespannt was da noch so auf uns zukommt!

Mein Fazit

Spannende und interessante Vorträge, tolle Location!
Der Preis für das Ticket – auch wenn ich diesmal nichts bezahlen musste – ist mehr als fair. Überhaupt wenn man bedenkt, dass auch die gesamte Verpflegung (Kaffee, Kuchen, Sandwiches, Softdrinks, Bier!) bereits im Ticketpreis inkludiert ist.
Es hat Spaß gemacht – gerne 2014 wieder!

Digital Visions 2013
Digital Visions 2013

Das Nachtprogramm

Im Anschluss an die Konferenz tauchte ich noch ein wenig in das Nachtleben ein und begab mich auf eine von Conrad Seidl inspirierte „5-Krügerl-Tour“ durch Wien. Das gehört auch dazu!

Weiterführende Links

Beitrag bewerten

1 Stern2 Sterne3 Sterne4 Sterne5 Sterne 5,00 von 5 Sternen nach 6 Bewertungen.

Beitrag kommentieren

Du hast Anmerkungen zum Beitrag?
In den Kommentaren ist der optimale Platz dafür!

Kommentar verfassen

Kommentar verfassen