2017 Favoriten Der Redaktion

0
22

Es war ein sehr Produktives Jahr für die web-Gemeinschaft, und wie alle von uns hier bei CSS-Tricks herumschwirrten, Konferenzen, Lesen Beiträge und integrierte Projekte, gab es noch einige Höhepunkte Beiträge, die wirklich fest zu uns. Jeder von uns abgeholt, 5 Ressourcen, die entweder die meisten hilfreich, die die meisten einzigartig, oder Dinge, die Sie vielleicht übersehen haben, dass wir denken, lohnt sich.

Sarah ‘ s Picks

Das Wunder von Generatoren

Ich ganz gerne, wenn jemand nimmt einen tiefen Tauchgang zu einem bestimmten Thema und tut es auch. Ich hatte die Ehre, zu sehen, Bodil Stokke verleihen diesem Vortrag auf der Frontend Conference Zürich, und es ist so charmant und unterhaltsam wie lehrreich.

Gestalten mit Raster

Jen Simmons deckt den status der CSS-Raster, und wie mit ihm zu arbeiten-vom design bis zur Entwicklung. Jen ist ein Meister der Gitter und der lab-Abschnitt Ihrer Website zeigt die Fähigkeit dieses Mediums.

Ein update, da diese zu sprechen kommen: Grid hat auch Bestandteil von Microsoft Rand.

Vue Apollo

Das ist mehr wie zwei Dinge, die ich bin daran interessiert, eingewickelt in eine einzige Sache. Guillaume Chau getan hat einen tollen job der Schaffung einer Apollo/GraphQL integration für Vue, darunter ein paar große demos zu erkunden.

Die Codierung Zug

Diese Ressource wurde für eine Weile, aber Dan hat jetzt eine so große Sammlung, dass es eine tolle Zeit, es zu erwähnen.

Codierung Zug sind kleine, halb-Stunden-Brocken-tutorials – alles von der Erstellung von ein-Sterne-Bereich, um zu lernen, wie Neuronale Netze arbeiten. Dan ist eine unglaublich einnehmende und liebenswerte Lehrer und man fühlt sich sehr willkommen, beim entdecken neuer Konzepte.

Motion-Design-Systeme

Val Kopf bekommt, um das Herz der Sache, wenn es um die Integration von Motorsteuerung in einem System-oder Komponenten-Bibliothek.

Es kann wirklich hart, um zu kommunizieren, animation, da Sie notwendigerweise eine Zusammenarbeit zwischen design und engineering. Val bietet Ihnen einige tools, um diesen Prozess gut funktionieren.

Robin ‘ s Picks

Design Systems

Design-Systeme von Alla Kholmatova war eins der besten design-Bücher, die ich gelesen 2017.

Es ist ein Buch darüber, wie die Zusammenarbeit mit einem team und verrät, dass der code-Qualität ist nur ein Teil der Gestaltung großer Systeme auf dem web. Das Buch ist nicht so viel design, so viel wie es ist zu lernen, wie die Kommunikation über große Gruppen von Menschen und wie können wir besser kommunizieren mit allen in einer Organisation.

Web-Typografie

Ein weiteres tolles Buch, das ich gelesen in diesem Jahr wurde die Web-Typographie von Richard Rutter, diese Zeit konzentriert sich viel mehr auf die Beziehung zwischen CSS und Satz.

Mein Lieblings-Teil des Buches ist jedoch, wo Richard beschreibt, dass web-Typografie unterscheidet sich grundlegend von anderen Formen der Satz-und erfordert eine Reihe von neuen Fähigkeiten. Es sorgt für spannende Lektüre.

Lila.pm

Für die meisten ich bin dieses Jahr der Schwerpunkt auf der Verbesserung meiner UX und Produkt-design-Fähigkeiten, und ich muss sagen, dass Lila war die nützliches Werkzeug für die Organisation großer Mengen an Daten und Forschung. Ich habe es als Archiv gespeichert, jedes Dokument, das ich gemacht, jeden Balsamiq-wireframe und hi-fi-Figma-mockup erstellt habe ich alles an einem Ort. Dies machte es so viel einfacher zu kommunizieren, sich mit anderen teams und erklären, mein denken auf ein Projekt.

Figma

In diesem Jahr wechselte ich auf die mithilfe der web-basierte design-tool Figma Vollzeit. Es ist so sehr hilfreich, da mein Tag, job, Arbeit erfordert die Zusammenarbeit mit Dutzenden von Ingenieuren, Produktmanagern und anderen Designern — so in der Lage, schnell ein mockup mit Ihnen und bekommen feedback hat sich exponentiell verbessert mein design Koteletts. Plus, es erinnert mich an das Feuerwerk, welches wahrscheinlich eine der besten apps, die jemals gemacht.

Inkwell

In diesem Jahr Hoefler & Co. veröffentlicht Tintenfass, eine neue Familie von Schriftarten, die imitiert eine Vielzahl von Handschrift-Stilen und ich kann nicht aufhören an Sie zu denken. Ein großartiges Beispiel für Ihre Verwendung ist auf Chris’ blog, wo all diese eigenartigen Stile nicht funktionieren sollte, aber irgendwie machen Sie einfach.

Chris Nimmt

Ein Design-System für Alle Amerikaner von Mina Markham

Eine masterclass in der öffentlichkeit zu sprechen, wenn Sie mich Fragen. Lustige, persönliche, und direkt am Ziel für die Art von Arbeit, die viele von uns tun.

Vorstellung

Begriff ist wahrscheinlich das am meisten signifikante bit der neuen software habe ich eingeschaltet, um in diesem Jahr. Es ist eine Notiz-app an ihm ist Kern, und es ist feature-rich, in dieser Hinsicht. Einer meiner Favoriten-Funktionen ist, dass jede note auch eine Ordner, so können Sie sich als geschachtelte, wie Sie mit Ihrer Organisation. Wenn Sie give it a shot, ich Wette, Sie werden in der Lage sein zu sehen, wie es schnell ersetzen können viele andere apps.

Wichtigsten, um eine Liste wie diese, ist, dass es gebaut für das web, aber auch native apps auf einer Vielzahl von Plattformen. Ich denke, 2017 war signifikant, wir haben begonnen, wirklich das Gefühl, die Unschärfe zwischen dem, was ist web-und was ist Plattform-nativen. Ich vermute, es wird noch härter, und schwer zu sagen, und dann mit allen Vorteilen der web inhärent, es macht immer weniger Sinn zu bauen, nirgendwo sonst.

CSS

CSS hatte ein banner Jahr. CSS-Grid, natürlich, aber wir haben auch font-Anzeige ab auf Schiff, die ist wunderbar für die Leistung. Wir haben Wahrzeichen Selektoren wie :focus-in, die beweisen, dass parent-Selektoren sind nicht unmöglich. Vektor-Grafiken hat, zog es Weg in die CSS-Datei mit einer Auflistung von Eigenschaften, einschließlich animation und Bewegung. Man könnte sagen, CSS ist mittlerweile mehr fähig und leichter. Ich genoss das schreiben von posts wie diesem, über einen Schieberegler, der zeigt, wie weit man in der CSS in diesen Tagen.

RIP Firebug

Ich finde es schön das Firebug-homepage ist eine Hommage, auf Wiedersehen, und kurze Geschichte Firebug. Firebug legte den Grundstein für das, was gut DevTools sein könnte. Ich bin froh, dass Browser Sie in-house und stellte sich Ihnen in den Kraftwerken, die wir jetzt benutzen, aber das ist alles Dank Firebug.

Wenn ich auswählen müsste, die wichtigsten drei Dinge, die gemacht haben die web-Entwicklung Plattform, die es heute ist: 1) DevTooling, angefangen von Firebug 2) Die Vereinbarung von allen Browsern, die web-standards, die allen zugute kommen und die wirklich disziplinierte Anwendung des Denkens 3) Evergreen-Browser.

PWAs

Ich fühle mich wie Progressive Web-Apps sind im wesentlichen gutes marketing für eine Sammlung von guten Ideen profitieren, dass jede website. Das ist genau dann der Fall, Jason Grigsby macht:

Das macht es eine einfache Wahl für 2017. HTTPS! Service-Mitarbeiter für die offline-Freundlichkeit! Performance konzentriert! Diese Dinge zu tun, und werden belohnt mit mehr features, die nativen apps genießen, wie eine position auf dem home-screen auf mobile Geräte. Verwischen Sie die Linien, y ‘ all! Auch wenn Sie nicht alles tun, auf der Liste, es gibt große Vorteile für jeden Schritt entlang der Weise.

Geoff ‘ s Picks

CSS Grid

Dieses kommt als keine überraschung, aber es ist sicherlich würdig von mehreren erwähnt. Grid hat wirklich verjüngt meine Liebe für CSS. Nicht nur, dass es viel der Komplexität von aus-layouts erfordern kreative Verwendungen von Schwimmern, zeigt und Positionierung, aber es hat mir erlaubt, schneiden Sie CSS-frameworks komplett aus meinem workflow. Ich meine, es ist, dass Rahmenbedingungen schlecht sind oder nicht benutzt werden sollten, aber ich persönlich lehnte sich auf Ihnen eine Menge für Ihre grid-Systeme. Das ist nicht mehr der Fall und das Ergebnis ist eine weniger Abhängigkeit in meinem Stapel und die Freiheit, mehr zu schreiben, Vanille CSS.

Prototyping-Tools

Robin bereits erwähnt Figma und das ist völlig im Einklang mit was ich mich beziehe. Es schien eine explosion von innovation in prototyping tools. Skizze, Figma, InVision und, ja, alle Adobe steigerte Ihre Spiele in diesem Jahr-und web-Designer waren die Nutznießer. Diese tools geöffnet haben, haben es leichter gemacht, die Zusammenarbeit mit anderen designs, Kritik der Arbeit, um das Kunden-feedback, und letztendlich in den browser schneller. Ich habe nie verbrachte weniger Zeit in Grafik-design-software und es war fantastisch.

Hier ein kleiner Vorgeschmack auf was ich mich beziehe:

  • Die Einführung Von InVision Studio
  • Einführung In Freehand
  • Privates Sharing in der Cloud-Skizze