Smashing Conference Freiburg 2014 Tag 1 – Meine Notizen

Smashing Conf 2014 Tag1

Die Talks am ersten Tag der Smashing Conference 2014 in Freiburg waren wieder sehr interessant und lehrreich. Ich habe für euch die wichtigsten Links, Zitate, Notizen, Slides und Buch-Tipps zusammengestellt.

Good is the enemy of great

Marcin Wichary
@mwichary
http://www.aresluna.org
https://medium.com/@mwichary

The details are not the details. They make the design.

– Charles Eames

Passender Artikel zum Talk: https://medium.com/designing-medium/crafting-link-underlines-on-medium-7c03a9274f9

medium.com verwendet teilweise Canvas für Hintergrundbilder, bspw. hier. Sie haben auch die Unterstreichung von Links selber gemacht, weil ihnen die defaultmäßige nicht gefallen hat. (Lösung mit Gradients). Erklärung im Artikel.

-moz-osx-font-smoothing: grayscale; ist das Firefox Pendant zu -webkit-font-smoothing: antialiased;

http://streetmix.net/-/158212 - Straßen planen

Good is the enemy of perfect. Perfect is the enemy of good.

Man muss ein Mittelding finden.

http://songexploder.net/ - "A podcast where musicians take apart their songs, and piece by piece, tell the story of how they were made."

http://littlebigdetails.com/ - "Your daily dose of design inspiration."

Toronto Subway Font

Design Decisions Through The Lens Of a Performance Budget

Yesenia Perez-Cruz
@yeseniaa
http://www.yeseniaperezcruz.com/

Ähnlich wie ein Finanz-Budget, kann man, bevor man zu designen beginnt, ein Performance-Budget definieren. Beispielsweise könnte man festlegen, dass die Website beim ersten Mal laden nur maximal 800kb groß sein darf. Basierend auf diesem 800kb-Maximum überlegt man sich dann, welche und wieviele Designelemente, Bilder, Widgets, Schriften, etc. man einbinden wird.

Auf das Budget kommt man, wenn man sich ansieht "wie hoch das Budget" bei der Konkurrenz ist.

Pagespeed testen:

Dynamic static site strategies

Phil Hawksworth
@philhawksworth
http://hawksworx.com

Artikeltipp: Bake, Don't fry

Nicht immer ist es notwendig ein CMS zu verwenden oder überhaupt eine Datenbank im Hintergrund zu haben. Manchmal reicht eine statische Seite, wobei statische Seiten auch dynamisch sein können (bspw. Suche mit JS, Kommentare mit Hilfe von third party services). Vorteile von statischen Seiten sind Performance und niedrige/keine Hostingkosten.

Es gibt eine Vielzahl von Generatoren, die aus „einfachem Text“ Websites generieren. Bspw. jekyll (ruby), hyde (python), middleman (js) oder harp (js). Weitere auf http://staticgen.com bzw. http://staticsitegenerator.net.

Any application that can be written in JavaScript will eventually be written in JavaScript.

– Jeff Atwood

Automatisierungstools:

Hosting:

Slides: https://speakerdeck.com/philhawksworth/dynamic-static-site-strategies-smashing-conference

Responsive Games

Josh Emerson
@joshje
http://www.joshemerson.co.uk

Nintendo hat ursprünglich Spielkarten hergestellt.

http://joshje.github.io/drawpath – Pfade für Canvas zeichnen und Code dafür generieren
http://labs.ft.com/ - Dev-Team der Financial Times

Slides: https://speakerdeck.com/joshje/responsive-games

Javascript <3 Unicode

Mathias Bynens
@mathias
https://mathiasbynens.be/

http://jsperf.com/ - JS Performancetest erstellen, teilen und vergleichen
https://mothereff.in/js-escapes - Javascript Escapes
Pile of Poo
http://sachaschmid.ch/Countable/ - Worte und Zeichen zählen

Notes: https://mathiasbynens.be/notes/javascript-unicode

Design Consistency for the Responsive Web

Patty Toland
@pattytoland

Es ist schwieirig mit einem 12 Spalten Grid zu arbeiten, wenn man für so viele verschiedene device-widths optimieren muss. Es ist besser ein einfaches Grid zu haben und dafür Komplexe Module.

One could describe Design as a plan for arranging elements to accomplish a particular purpose.

– Charles Eames

Responsive Webdesign is more than fitting stuff on screens.

– Patty Toland

http://www.ericsson.com/mobility-report
http://www.slideshare.net/Ericsson/ericsson-mobilityreportaugust2014interim

Artikeltipp: http://www.nytimes.com/2012/03/01/technology/impatient-web-users-flee-slow-loading-sites.html?pagewanted=all&_r=0

RWD Geschwindigkeitsprobleme:

  • Bilder
  • Third party tools (Werbung, Social Media, Tracking)
  • Frameworks
  • Netzwerk

Artikeltipp: http://filamentgroup.com/lab/performance-rwd.html

filamentgroup open-source code

Sie verwenden SVG statt Icon-Fonts

Buchtipp: Jason Santa Maria - „On Web Typography“

Buchtipp: Scott Jehl - „Responsible Responsive Design“

consistent != identical

– Patty Toland

Nur weil die Usagestatistiken sagen, dass wenige Benutzer die Website auf mobilen Geräten verwenden, heißt das nicht, dass sie das nicht tun, weil sie nicht wollen. Es kann ganz einfach daran liegen, dass es keine mobile Website gibt und sie deswegen eher ein Desktopgerät verwenden (müssen). Lego wollte 4% mehr Umsatz haben durch die Responsive Website, 16% hatte sie dann tatsächlich.

Slides: https://docs.google.com/presentation/d/19JmUdMvOzsrIdtJv7jYlwEptTCOQCHOE10KzjL84hXY/edit?pli=1

Co-design Not Redesign

Kevin M. Hoffman
@kevinmhoffman
http://kevinmhoffman.com/

the pen is mightier than the keyboard

– Kevin M. Hoffman

Meetings sollten designed werden und sehr partizipativ gestaltet sein. Vor Meetings sollte man sich und dem Team die Frage stellen, welche Entscheidungen getroffen werden in diesem Meeting. In Meetings müssen die einzelnen Teilnehmer die Möglichkeit haben, aktiv am Prozess teilzunehmen. (Papier, Stifte, Plakte, Karten, etc. zur Verfügung stellen.)

Buchtipp: The Year Without Pants - Scott Berkun

Slides: http://kevinmhoffman.com/smashingconf/2014/

Sein Buch: http://rosenfeldmedia.com/books/meeting-design/

It's about time

Christopher Murphy
@fehler

Buchtipp: Status Anxiety - Alain de Botton
Buchtipp: Ken Robinson - Finding your Element
Buchtipp: Peter F. Drucker - Managing oneself

Be curious. Read widely. Try new things. What people call intelligence just boils down to curiosity.

– Aaron Swartz

Artikeltipp: Shit or get off the pot

Buchtipp: The Dip von Seth Godin

Sonstiges:

Manuel Matuzovic

Frontend Developer aus Wien.

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind markiert *