Transkripte
1. Es kann losgehen!: Ich bin Dan Mall, ein Designer und Creative Director und Gründer und Direktor von SuperFriendly Design Collaborative in Philadelphia. der heutigen Klasse geht es um das Design von Systemen, wie man sie erstellt, wie man mit ihnen arbeitet und wie man alle Kollegen an Bord bringt. Ein Designsystem ist ein Werkzeug, um Ihnen dabei zu helfen effizienter und effektiver in Ihrer Arbeit zu werden. Es sollte Ihnen helfen, schneller zu gehen. Es sollte Ihnen helfen, besser mit anderen Menschen zu arbeiten, und ehrlich gesagt, sollten Sie einfach mehr Spaß haben. Eine Sache, die ich sehe, wie Designer und Entwickler immer und immer
wieder tun , ist, das Rad neu zu erfinden. Wie oft Sie diese Schaltfläche oder dieses Formular entwerfen möchten, oder einfach nur die Dinge, die wirklich trocken an einem Projekt sind. Lasst uns das Zeug aus dem Weg bringen. Ein Designsystem sollte sich um dieses Zeug kümmern, so dass Sie befreit werden können, um
all die lustigen Dinge zu tun , die Sie normalerweise keine Zeit zu tun haben, aber Sie tatsächlich wollen, um anders zu tun. Nachdem
Sie diesen Kurs absolviert haben, haben Sie alle Kenntnisse und Werkzeuge, die Sie benötigen, um mit einem Designsystem arbeiten, Ihr eigenes
erstellen und mit anderen Menschen arbeiten zu können. Mein Ziel für Sie ist es, mehr und mehr über das Design von Systemen nachzudenken, eines
auszuprobieren und dann wirklich eines für Ihr Projekt zu verwenden. Kein guter Unterricht ist komplett ohne Hausaufgaben, also werde ich dir auch ein paar Sachen geben. Was wir tun werden, ist, dass wir eine Checkliste mit Dingen erstellen, die Ihnen helfen herauszufinden, warum Sie
ein Designsystem verwenden müssen und Sie wirklich begeistert darüber machen. Sie können es in der Projektgalerie freigeben, kommentieren und sehen, was andere Personen tun. Danke, dass du diesen Kurs genommen hast. Lasst uns loslegen.
2. Was sind Designsysteme?: Wenn Sie an ein Designsystem denken, weiß
ich nicht, dass wir eine kanonische Definition dafür haben,
aber es sollte etwas sein, das Ihnen hilft, leicht die Dinge zu machen, die Sie machen wollen. Die meisten Konstruktionssysteme haben eine Menge Gemeinsamkeiten. Sie haben Komponenten oder Muster, die wirklich
die kleinen Stücke sind , die Sie verwenden werden, um zusammen zu setzen, was Sie machen. Dann gibt es auch die Anleitung und die Referenz dafür, wie Sie diese Dinge verwenden werden. Diese Dinge werden in der Regel in einer Referenzstelle zusammengefasst. Diese Referenzseite hat alle Arten von Anweisungen für Sie. Dinge wie, wie man anfängt, wie lade ich das herunter und beginne es tatsächlich zu
benutzen, wenn wir über ein digitales Produkt sprechen. Was soll ich damit machen? Woher bekomme ich die Akten? Woher bekomme ich all das Zeug, das ich brauche? Wie benutze ich sie dann, wenn ich sie habe? Was sind die Best Practices
sowohl in Bezug auf Best Practices der Branche als auch auf die Best Practices dieses Systems im Besonderen? Diese Dinge sind in der Regel die Dinge, die mit einem Designsystem kommen. Ich denke, es ist auch wichtig, darüber zu sprechen, was ein Designsystem nicht ist. Diese Antwort wird super nuanciert weil das, was ein Designsystem nicht ist, eine Skizzendatei zu sagen. Eine Skizzendatei kann Teil eines Entwurfssystems , ist
aber an sich kein Konstruktionssystem. die gleiche Weise ist eine Musterbibliothek oder eine Komponentenbibliothek kein Konstruktionssystem für sich, da sie das Leitungsteil fehlt, nur die Teile. Eine Musterbibliothek und eine Komponentenbibliothek sind Teil eines Entwurfssystems, aber es ist nicht das Ganze. Ich denke also wirklich, was
am Designsystem wichtig ist, ist, dass es die Kombination dieser Dinge ist. Es ist nicht nur eines dieser Dinge für sich allein. Auch diese Kombination muss ein Ergebnis haben. Das Designsystem muss uns dabei helfen, besser zusammenzuarbeiten. Als Designer, Entwickler, Produktleute, Content-Mitarbeiter, sollte
das Design-System ein Werkzeug sein, mit dem wir alle zusammenkommen
und uns dabei helfen können , bessere Arbeit zu machen. Wenn wir Teile davon fehlen, kann unsere Arbeit nicht besser sein. Es gibt viele tolle Dinge über Designsysteme. Die erste große Sache ist ein Design-System sparen Sie Zeit und sparen Sie Geld. Das könnten Sie als Freiberufler oder eine einzelne Person sein, die an etwas arbeitet. Oder es könnte Ihre gesamte Organisation sein. Wie spart es Zeit? Nun, denken Sie darüber nach, wie oft Sie eine Schaltfläche entworfen haben oder wie oft Sie ein Formular entworfen haben. Nehmen wir an, es dauert einen ganzen Tag, um
eine Formularseite zu entwerfen , und Sie tun das für jedes einzelne Projekt. Stellen Sie sich nun vor, ein Werkzeug zu haben, das von einem Tag bis zu zehn Minuten reicht. Das ist schon ein Tag, an dem du rettest. Das ist ein Tag, an dem du etwas anderes tun kannst. Wenn Sie Ihre Zeit abrechnen, ist
das ein ganzer Tag, an dem Sie das Ding nicht in Rechnung stellen müssen. Sie können tatsächlich etwas anderes in Rechnung stellen. Es hilft Ihnen, es hilft Ihren Kunden, es hilft Ihrer Organisation. Es hilft Ihnen, Zeit zu sparen, die Dinge zu tun, die Sie nicht mehr tun müssen. Es spart jedem Geld, weil sie sich um diese Dinge keine Sorgen machen müssen. Es spart auch Geld in ein wenig indirekter
Weise, da es Ihnen Konsistenz gibt. Eines der Dinge, die Organisationen aufschlüsseln und Projekte auf
einer nuancierten Ebene aufschlüsseln , ist wirklich, wie konsistent etwas ist. Wenn die Dinge inkonsistent sind, macht
es den Benutzern unbequem, es macht Designer unbequem. Es macht Entwickler haben, etwas andere Dinge zu bauen. Konsistenz hilft Ihnen tatsächlich, etwas einmal zu bauen und zu wissen, dass es sich im Rest Ihres Systems ausbreitet. Ein anderer Weg, der ein Designsystem hilft, ist, dass es allen Mitarbeitern in einem Team
helfen sollte , zusammenzuarbeiten. Ich weiß, dass ich, wenn ich an meiner Arbeit mit einem Team arbeite, manchmal der Designer bin und mit einem Entwickler zusammenarbeiten werde. Was ich daran liebe, ein Designsystem zu haben, ist, dass wir es als gemeinsame Referenz verwenden können. Wir kennen die gleiche Sprache. Wir können uns um ein Whiteboard setzen und sagen: „Oh, benutzen wir die Drop-Down-Komponente.“ Jeder weiß, was ich meine. Was das getan hat, ist es mir Zeit
gespart und es hat unsere Zusammenarbeit Zeit gespart, wo ich nicht weggehen muss, eine Photoshop- oder Sketch-Datei an einen Entwickler
übergeben und dann müssen sie das erstellen. Wir können das eigentlich einfach zusammen skizzieren. Manchmal muss ich nicht einmal in Photoshop springen, um diese Dinge zu tun. Wir werden es zusammen skizzieren. Der Entwickler kann es bauen, und dann kann ich danach zurückkommen und sagen: „In Ordnung. Lasst uns das ändern. Lassen Sie uns die Abstände optimieren“ und solche Dinge. Es hilft bei der Zusammenarbeit, indem Sie Ihnen
eine gemeinsame Sprache geben , die Sie alle das gleiche Wort verwenden und die gleichen Dinge über die Dinge
sagen, die Sie zu entwerfen und zu bauen versuchen. Vielleicht meine Lieblings-Art und Weise, dass ein Design-System
Ihnen helfen wird , ist es eigentlich sollte Sie befreien, um die Dinge zu tun, die Sie wirklich tun wollen, dass Sie
normalerweise nicht einmal auf ein Projekt bekommen können. Ich weiß, dass ich eine Liste mit all den Dingen habe, die ich manchmal nicht in einem Projekt machen kann. Ein Designsystem oder etwas zu haben, um mir zu helfen und mir dort etwas Effizienz zu geben, hilft mir, diese Dinge zu erreichen. Als Beispiel, wenn ich diese Schaltfläche nicht immer und immer entwerfen musste, oder diese Form oder diese Kopfzeile oder diese globalen Elemente. Stattdessen könnte ich mich Zeit nehmen, um diese Animation zu machen, die ich wirklich wollte, oder vielleicht diese Illustration, oder vielleicht eine neue Technik ausprobieren oder eine neue Technologie lernen oder vielleicht Sigma oder eine neue App oder so etwas gelernt haben. Wenn Sie diese Dinge bereits in der Dose haben, wenn Sie die Komponenten haben, wenn Sie die Hauptbenutzer haben und sie verwenden
, sparen Sie nur Zeit. Jetzt können Sie zu diesem zusätzlichen kleinen bisschen Oomph kommen, das Sie in Ihr Projekt einfügen möchten, für das Sie normalerweise keine Chance haben.
3. Beispiele für Designsysteme: Über Definitionen zu sprechen ist ziemlich abstrakt, also schauen wir uns ein paar Beispiele an, um es für uns realer zu machen. Dies ist das grafische Normenhandbuch für die New York City Transit Authority und das gibt es schon seit langem. Dies ist wirklich die Bibel der grafischen Standards Handbücher. Ein Teil der Gründe, warum ich denke, dass die New York City Transit Authority
so lange gedauert hat , ist, weil dieses Handbuch so gut geschrieben ist, weil dieses Designsystem so gut geschrieben ist. Werfen wir einen Blick auf die Eingeweide davon. Sie werden hier sehen, dass ein Teil dieses Handbuchs nur die Teile sind. Sie werden sehen, dass sie alles
davon haben , wie jeder Buchstabe hier angegeben werden soll. Hier ist, wie Sie ein doppeltes A drucken, hier ist, wie Sie ein B drucken Hier ist, wie Sie ein doppeltes C drucken und es ist in akribischen Details. Es ist jeder einzelne Buchstabe des Alphabets, um Ihnen zu zeigen, ob es eine U-Bahnlinie
gab , die diese Buchstaben hatte, so würden Sie es drucken. Sie schonen keine Kosten, um sicherzustellen, dass Sie Spezifikationen für jede einzelne Sache, die Sie verwenden möchten, alle Buchstaben des Alphabets. Es ist nicht so, als würden sie dir eins zeigen und dann sagen sie: „Ja, mach den Rest einfach so.“ Sie gehen in mühsame Details, um Ihnen das Zeug zu zeigen. Dieses Buch ist voll von all den verschiedenen Teilen, aber es ist nicht nur die Teile. Es ist auch voll von Beispielen, wie man Dinge verwendet und Anleitungen, wie man diese Dinge benutzt. Lassen Sie mich Ihnen ein Beispiel dafür zeigen. Diese Seite hier ist eine Seite über temporäre Zeichen und dies zeigt den Personen, die das System implementieren, wie Sie ein temporäres Zeichen erstellen können. Hier gibt es Hinweise, dass es Ihnen sagt, was ein vorübergehendes Zeichen ist. Die Art des temporären Zeichens erfordert, dass es einfacher ist zu produzieren, platzieren und zu entfernen, und dann gibt es Anweisungen, wie man ein temporäres Zeichen erzeugt. Dann zeigt es auch Beispiele, wo dieses temporäre Zeichen gesetzt werden
soll, wie es aussehen soll, wohin es gehen soll und wie es tatsächlich funktionieren soll. Dies ist eine großartige Anleitung für ein Designsystem. Dieses ganze Buch, dieses ganze Handbuch ist teilweise nur die Teile, teilweise die Komponenten selbst, aber dann teilweise die Führung und hatte die Gründlichkeit der beiden Teile und die Führung ist ich denke, was dieses System halten für so lange. Jetzt sind diese beiden Bücher wirklich großartig. Dies sind Bücher, die in den späten 70er Jahren über Architektur geschrieben wurden. Christopher Alexander spricht im Grunde in diesen Büchern darüber, wie man sich der Gebäudearchitektur systematisch nähern kann und wie das Cover des Buches sagt: „Eine zeitlose Art des Bauens“. Dies ist ein Teil 1 und Teil 2 in der Mustersprache Seite davon ist, wie implementieren Sie diese Dinge tatsächlich? Das ist die Theorie davon. Es ist fast wie ein Konstruktionssystem in zwei Teilen, wobei ein Teil davon die Teile sind und dann ein Teil davon die eigentliche Anleitung für diese Teile ist. Es gibt eine Menge großer Theorie und Philosophie, wie man
Architektur auf diese Weise bauen kann, viele davon
gilt, wie wir heute digitale Produkte bauen können. Wenn Sie etwas Moderneres suchen, ist dies ein fantastisches Buch von Alla Kholmatova, es heißt Design Systems. Es geht darum, wie man ein modernes Designsystem baut. All die Dinge, über die wir in Bezug auf
die Theorie und in Bezug auf die Praxis und in Bezug auf Teile gesprochen , Alla kompiliert in diesem Buch und spricht darüber, wie man tatsächlich Design-Systeme nutzen und
Design-Systeme machen und sie als eine fantastische Referenz für alle, die mehr über dieses Thema erfahren möchten. Jetzt ist dies ein bisschen ein nicht-traditionelles Beispiel hier. Die meisten Dinge, die wir uns angesehen haben, sind eigentlich Handbücher und dieses Buch heißt Design by Apple in Kalifornien. Es ist ein bisschen anders als einige der anderen Beispiele. Wenn ich dieses Buch durchschaue, werden Sie sehen, dass es nicht viele Worte gibt. Es gibt wirklich nur Fotos. Dies sind schöne Fotos, die dokumentieren, wie Apple-Produkte tatsächlich aussehen. Nun, Sie könnten dies ein Fotografiebuch mehr als als ein Design-System nennen, aber es hat ein wenig Referenz für Design-System. Was ich damit meine ist, dass es hier
ein paar 100 Seiten gibt und wie Sie einfach durch dieses Buch blättern, nur Seite für Seite betrachten Hardware, Blick auf all die verschiedenen Geräte, die sie machen, und nur bekommen und sehen sie aus verschiedenen Blickwinkeln. Was Sie hier finden, ist, dass Sie durch die paar 100 Seiten dieses Buches blättern können, und am Ende des Buches, obwohl es keine Worte gab, können
Sie verstehen, wie Apple ihre Produkte baut. Sie können wahrscheinlich am Ende etwas schließen, das sagt: „Hier sind die Prinzipien, die für Apples Arbeit wichtig sind.“ Ich denke, das ist die Aufgabe eines guten Designsystems. Es ist auch, in der Lage
zu sein , durch all die Dinge zu schauen und zu schließen „Okay, das ist, was für diese Organisation wichtig ist, wie Produkte gebaut werden.“ Obwohl dies ein bisschen ein nicht-traditionelles Beispiel ist, denke
ich, es macht immer noch einen guten Punkt, was ein Designsystem tun sollte. Eines der Dinge, auf die ich hier hinweisen möchte
, ist , dass nicht alle Designsysteme gleich aussehen müssen. Das Ergebnis ist, was wichtig ist, nicht das eigentliche Format davon. Dies ist ein Beispiel für ein Designsystem, das Apple haben könnte. Sie haben auch eine andere, die vielleicht ein wenig beliebter ist als dieses Buch. Es heißt die Apple HIG, die Human Interface Guidelines und das ist für jeden, der eine iPhone-App erstellen möchte. Wenn wir uns das HIG ansehen und uns das ansehen, es zwei Beispiele für Designsysteme desselben Unternehmens. Das heißt nicht, dass Sie nur ein Designsystem haben können. Sie können zwei haben, wenn sie auf
unterschiedliche Weise angewendet werden oder wenn Sie Ihre Produkte auf unterschiedliche Weise zeigen möchten. Es gibt auch digitale Versionen von Designsystemen, nicht nur in Büchern und so schauen wir uns ein paar der beliebtesten an. Material Design ist eine, die von Google erstellt wird und viele Menschen verwenden Materialdesign für Nicht-Google-Produkte, aber auch Google verwendet sie für Google-Produkte. Was Sie hier sehen, ist, dass es eine einheitliche Schnittstelle für Android-Apps ist, für Apps, die von Google sind, für Dinge wie G-Mail und Google Maps, aber auch einige ihrer Tochtergesellschaften wie YouTube. Das ist ein Designsystem, das all das Zeug hat, über das wir gesprochen haben. Es hat Komponenten und es hat eine Anleitung, also lasst uns hier herumklicken. Wenn wir auf die Registerkarte Entwickeln für Entwickler gehen, hat
es alle Komponenten, die wir tatsächlich brauchen, und es wird nach Plattform verteilt. Ich habe Android, iOS, Web und Flutter. Wenn ich hier in den Webbereich klicke, sehen Sie, dass ich zu den Komponenten gelangen kann und ich zur Dokumentation selbst gelangen kann. Komponenten gibt mir diese ganze Liste von Dingen und ich werde einfach in eins klicken. Wenn ich eine Schaltfläche als Teil des Materialdesigns verwenden wollte, die mir ein Beispiel dafür gibt, was das ist, und ich kann nach unten scrollen und es gibt mir alle Anweisungen, wie man dieses Ding installiert und wie es benutzt, und noch mehr als das, dieses ganze System gibt mir Anleitungen wie man diese Dinge aus philosophischer Sicht nutzen kann. Es hat die ganze technische Arbeit sowie die philosophische Arbeit. All dies ist an einem Ort und das ist ziemlich üblich bei Designsystemen,
ist in der Lage, eine Art Liste aller Komponenten zu sehen, die Komponente hier in Aktion zu sehen, eine Live-Version davon, und dann eine Anleitung, wie , um es zu verwenden und wann es verwendet werden soll. Dasselbe gilt für das Designende für Material, das ist
das Codierende, aber das Designende führt Dinge wie Prinzipien ein also schauen wir uns zum Beispiel die Farbprinzipien für Material Design an. Was dies zeigt alle Farbpaletten, die mit Material geliefert werden und wie Sie sie verwenden können. Viele robuste Farbpaletten hier für den ganzen Weg von Shades 50 bis 900. Sie zeigen Ihnen die Primär- und Sekundärfarben, sowie alle Varianten, die Farbtöne und die Farbtöne. Dies kommt auch mit Prinzipien, so dass sie über Lesbarkeit als Prinzip und Ausdruckskraft als Prinzip und Hierarchie als Prinzip sprechen. Auch hier sehen Sie diese Kombinationen, so dass es nicht nur die Komponenten und es ist nicht nur die Anleitung, all diese Dinge zusammen im Kontext. Wir springen zu einem anderen Beispiel. Dies ist ein von den Vertriebsmitarbeitern entwickeltes System, und dies wird das Lightning Design System genannt. Sehen Sie hier eine Art ähnlicher Ansatz, bei dem sie Richtlinien
haben und sie auch Komponenten haben, aber sie haben auch spezifische Details zu Dingen wie Zugänglichkeit und Token und Symbole. Wenn wir uns die Komponenten selbst ansehen, werden
Sie hier wieder sehen, das Gleiche. Hier ist eine Liste aller Komponenten, die mit diesem System geliefert werden. Wenn ich hier in Schaltflächen gehe, wirst
du sehen, dass ich die ganze Varianz bekomme. Ich habe all die Schaltfläche basiert, die Neutrale, die Marke, die Umrissmarke, die destruktive, und den Erfolg und wieder, direkt unten ist nur der Code, um das zu verwenden. Aus Designsicht,
hier ist, wie das Ding aussehen würde, aus Entwicklungssicht hier ist der Code, den ich brauche, um dies zu implementieren. Dann wieder, genau im Kontext ist die Anleitung. Auch hier ist eine Faustregel der Eingabehilfen für die Schaltfläche. Ich muss nicht woanders hin, um es wirklich zu sehen. Es ist in Kontexten, dass die Komponente selbst. Das letzte Beispiel, das wir uns hier ansehen werden, ist Polaris von Shopify. Dies ist ein Designsystem und so hat es wieder, die gleichen Dinge, die Material und Aufhellung haben, aber auf eine etwas andere Art und Weise und ich möchte etwas Besonderes darauf hinweisen. Wenn wir uns die Komponenten von Shopify ansehen, ist
Shopify eine E-Commerce-Plattform und was wirklich großartig an ihrem Designsystem Polaris ist, dass sie tatsächlich Dinge zeigen, die für ihre Benutzer und ihre Kunden
spezifisch sind . Es ist nicht nur, hier ist eine Schaltfläche zu verwenden, weil es eine Schaltfläche ist und die Leute brauchen, um Tasten zu verwenden, aber sie tatsächlich zeigen Dinge in Bezug auf Händler und in Bezug auf Käufer. Als Beispiel, gehen Sie in Aktionen hier und ich gehe in eine Aktionsliste und diese Aktionsliste gibt mir eine Anleitung. Dasselbe, was wir im Material und im Blitz gesehen haben, wo wir die Komponente in Aktion haben und sehen, wie es funktioniert, und ich bekomme den Code, um das zu implementieren. Aber worüber sie hier sprechen, das für sie spezifisch ist, wenn ich
diese Anleitung hier lese , ist eine Aktionsliste, die eine Liste von Aktionen oder auswählbaren Optionen darstellt, das ist universell, das ist generisch, aber dann werden sie spezifischer. Diese Komponente wird normalerweise in einem Pop-over-Container platziert, um ein Dropdown-Menü zu
erstellen, mit dem Händler aus einer Liste von Optionen auswählen können. Auch hier ist dies wirklich spezifisch darauf, wie sie wollen, dass Händler diese Komponenten verwenden können. Das ist eines der Dinge, die ich am meisten an diesem Polaris-System liebe, ist, dass es nicht nur jeder ist, der eine Liste hier verwenden will,
die ich verwenden Liste, die speziell für Händler und für Käufer entwickelt.
4. Deine Designsystem-Wunschliste erstellen: Lassen Sie uns mit unserem ersten Auftrag beginnen. Nehmen wir an, Sie haben kein Designsystem, mit dem Sie arbeiten, entweder allein oder vielleicht mit Ihrem Team. Fangen wir an, eine zu erstellen. Das erste, was wir tun wollen, um
eine zu erschaffen , ist wirklich nur zu verstehen, warum wir es brauchen. Also lasst uns das machen. Schnappen Sie sich ein Stück Papier und falten Sie das Stück Papier in zwei Hälften. Auf der linken Seite möchte ich, dass Sie alle Aufgaben
aufschreiben , die Sie im letzten Projekt durchgeführt haben. Denken Sie also an das letzte Projekt, das Sie getan haben. Alles, was du getan hast, egal wie nuanciert, schreib das Zeug auf. Das könnte sein, dass ich die Icons entwerfe. Es könnte sein, dass ich diese Seite entworfen habe. Es könnte sein, dass ich einen Brief geschrieben habe. Es könnte sein, was auch immer es ist. Ich schickte diese E-Mail über diese besondere Sache. Versuchen Sie, alles zu schreiben, an das Sie sich über Ihr letztes Projekt erinnern können. Okay, der nächste Schritt. Nun, da Sie eine Liste von allem haben, was Sie bei
Ihrem letzten Projekt auf der rechten Seite der Zeitung getan haben, möchte
ich, dass Sie all die Dinge schreiben, die
Sie sich wünschen , dass Sie auch keine Chance bekommen hätten. Das ist wirklich wie dein Traumzeug. Denk an diese Animation, die du nicht tun konntest. Dieses zusätzliche kleine bisschen Barrierefreiheit hat geholfen, dass Sie nicht eingebaut haben. Das könnte das Icon-System sein, das Sie entwerfen möchten, kundenspezifisch, aber Sie mussten stattdessen eine Aktienbibliothek verwenden. Was ist das alles, was du wünschst, du könntest in diesem Projekt oder vielleicht in jedem Projekt tun? Hier ist, wo es interessant wird. Auf der linken Seite Ihres Papiers haben
Sie alle Dinge, die Sie beim letzten Projekt gemacht haben. Ich möchte, dass Sie die Dinge umkreisen, von denen Sie denken, dass sie effizienter gemacht werden könnten. Ein gutes Format, um darüber nachzudenken, ist, wenn ich nur x hätte, wäre
dieses Ding einfacher gewesen. Letzter Schritt, jetzt, da Sie alle Sachen auf der linken Seite von Dingen
einkreist haben , die Sie effizienter sein könnten, möchte
ich, dass Sie eine Linie von diesem Ding zu etwas auf der rechten Seite ziehen. Das wird dein Merkmalsblatt sein. Zum Beispiel, auf der linken Seite, könnten
Sie so etwas haben, wie ich alle Tasten entworfen habe. Auf der rechten Seite haben Sie möglicherweise etwas, das Design benutzerdefiniertes Symbol besagt. Wenn Sie eine Linie von den Schaltflächen zum Icon-Set zeichnen, haben
Sie im Wesentlichen eine Handelsliste gemacht, um zu sagen, wenn ich bereits eine Reihe von Schaltflächen hatte, jetzt könnte ich Zeit mit diesem Icon-Set verbringen. Hier kommt die Magie ins Spiel. Sie haben gerade Ihre erste Wunschliste für das erstellt, was Ihr Designsystem tun soll. Jetzt, da Sie wissen, wofür Sie System entwerfen möchten, beginnen Sie, Sachen von der linken Seite zu kreuzen, wo auf Ihrem Design-System, wie Sie darauf beginnen,
zuerst, was Sie kümmern, Knöpfe. Sobald Sie sich um diese Schaltflächen gekümmert
haben, erhalten Sie Ihr Symbol für das nächste Projekt. Hier ist der coole Teil. Nun, da Sie Ihre Aufgabe erledigt haben, haben
Sie eine Liste aller Dinge, die in Ihrer Version 1 Ihres Designsystems enthalten sein sollten. Das ist großartig, wenn du alleine arbeitest. Was das noch besser macht, ist, dass Sie das jetzt mit Ihrem Team tun können und Sie diese Übung mit Ihrem Team machen können. Du kannst das anführen. Du machst deine Liste. Vielleicht können Sie Ihre Kollegen bitten, auch ihre Liste zu erstellen. Wenn Sie ein Designer sind, fragen Sie
vielleicht Entwickler, mit denen Sie arbeiten, um ihre Liste zu erstellen. Was ist das Zeug, das sie sich wünschten, sie könnten tun? Was ist das Zeug, für das sie tauschen würden,
etwas, das sie schon in der Dose haben könnten. Bitten Sie dann Ihre Teammitglieder, sie zu tauschen. Das ist die Sache, die ich ständig in Workshops mache. Ich lasse Designer eine Liste mit all den Sachen machen, die sie machen wollen. Dann lasse ich Entwickler eine Liste mit all den Dingen erstellen, die sie tun
wollen und alle anderen arbeiten an dem Projekt. Dann tauschen wir Listen aus und was das
tut, ist, dass es Empathie füreinander schafft, weil
Designer manchmal nicht einmal wissen, dass ein Entwickler gerne ein bisschen extra Design Politur auf das Ding gesetzt
hätte. Vielleicht war das eine Sache auf ihrer Liste. Designer haben es wirklich satt mit Entwicklern wie, oh Mann, sie haben nicht die Zeit in, aber es hätte sein können, dass sie einfach nicht die Zeit hatten. Also, diese Listen zu enthüllen, sie öffentlich zu
machen und alle
anderen sehen zu können , wird dazu beitragen, etwas Empathie aufzubauen, um zu sagen ,
naja, ich wusste nicht einmal, dass du das tun willst, also kann ich dir jetzt helfen Ihr nächstes Projekt. Das ist eine wirklich großartige Teambuilding-Übung und etwas, das die Leute
wirklich über die Vision eines Designsystems teilen lässt. Selbst dieser Prozess des Erschaffens eines könnte etwas sein, das die Menschen mehr auf derselben Seite bringt. Jetzt, da Sie diese Liste haben, wissen
Sie, warum Sie ein Designsystem benötigen. Als nächstes reden wir darüber, wie wir tatsächlich einen machen.
5. Dein eigenes Designsystem erstellen: Konstruktionssysteme bestehen in der Regel aus zwei Teilen, Mustern und Prozessen. Mit welchem du anfängst, liegt wirklich an dir. Es gibt keine richtige oder falsche Ordnung. Wo ich empfehlen würde, dass Sie beginnen, obwohl, ist diejenige, für die Sie die meisten Ideen haben. Was ist nur Juckreiz, um aus dem Kopf zu kommen? Wissen Sie nur, welche Schaltflächen Sie
entwerfen möchten oder welche Dropdown-Komponenten Sie entwerfen möchten? Dann fangen Sie dort an. Vielleicht haben Sie aber, wenn Sie keine Ideen dafür haben, vielleicht haben Sie mehr Ideen für Prinzipien,
Dinge, die Sie das System leiten möchten. Wenn das etwas ist, das für Sie interessant ist und Sie bereits wissen, was Sie dort sagen wollen, beginnen Sie mit denen. Also irgendwann musst du beides erreichen, aber wo immer du anfangen willst, liegt an dir. Lasst uns in die Prinzipien eintauchen. Es gibt zwei Arten von Prinzipien. Es gibt universelle Prinzipien, und es gibt spezifische Prinzipien. So könnte zum Beispiel ein gutes universelles Prinzip so etwas wie Zugang für alle sein. Das ist etwas, das Sie beim Erstellen von Apps und Websites wünschen, dass jeder Zugriff hat. Aber das gilt auch für jede Website. bedeutet nicht, dass es nicht in Ihrem Designsystem sein sollte, sondern es dort hineinlegen sollte. Lassen Sie uns jedoch über bestimmte Prinzipien sprechen. Spezifische Prinzipien sind diejenigen, die nur für Ihr System funktionieren. Ein gutes Beispiel für ein bestimmtes Prinzip ist von TiVo. Eines der Prinzipien von TiVo ist, dass es TV dumm ist. Was ich an diesem Prinzip für TiVo liebe, ist, dass es so toll für sie ist, es ist ein großartiges Mantra für sie zu folgen. Es ist der Geist von ihnen, es ist lässig, es ist ein bisschen respektlos, es passt zu ihrer Marke und auch, es würde nicht für eine andere Organisation funktionieren. Es würde nicht für sagen,
Quickbooks oder Salesforce oder solche funktionieren . Ein bestimmtes Prinzip sollte etwas sein, das wirklich großartig für Sie und Ihre Organisation ist, aber eine peinliche Passform für jemand anderen. Ich stelle mir vor, wenn ich bei TiVo arbeite und ich ein Problem mit etwas hätte, das ich zu entwerfen versuchte,
dann könnte ich auf diese Prinzipien schauen, wie kann mir das helfen? So Prinzip sollte wirklich helfen Sie in Punkten der Spannung. Wenn Sie also nicht wirklich wissen, was zu tun ist, sollten
Sie in der Lage sein, auf Ihre Prinzipien zu verweisen und zu gehen, oh richtig, das ist es, was es sagt zu tun. Also ein Prinzip wie es ist TV dumm, wenn ich versuche, zwischen zwei verschiedenen Schnittstellen zu entscheiden. Vielleicht würde ich das einfachere wählen weil es mehr im Einklang mit dem Prinzip des Unternehmens steht. Beide Prinzipien und Muster sollten
sowohl universelle Anwendung als auch spezifische Anwendung haben . Lassen Sie uns also über die Musterseite davon sprechen. Wenn wir darüber sprechen, dass Muster universell sind, gibt es einige Dinge, die jede Seite haben wird. Text ist ein gutes Beispiel dafür. Eine Form ist wahrscheinlich auch ein gutes Beispiel dafür. Vielleicht müssen Sie das Rad nicht so neu erfinden, wie Sie Text anzeigen
möchten. Das ist in Ordnung. Aber Sie werden auch einige spezifische Muster für Sie,
für dieses Projekt, an dem Sie arbeiten,
oder für die Organisation, in der Sie arbeiten möchten. Als Beispiel, sagen
wir, Sie arbeiten für die IRS. Ihr Designsystem für die IRS sollte sich wahrscheinlich wirklich auf Foren und Dateneingabe konzentrieren. Aber sagen wir, Sie arbeiten für Entertainment-Unternehmen. Es geht wahrscheinlich weniger um die Dateneingabe, als es um Werbetafeln und Helden geht. Stellen Sie daher sicher, dass die Muster, an denen Sie arbeiten, die Komponenten, die Sie erstellen, wirklich spezifisch für Ihre Organisation und Anforderungen
Ihrer Organisation oder die Anforderungen des Projekts sind, an dem Sie tatsächlich arbeiten. Es gibt eine interessante Nuance für Muster und Komponenten und die Sprache zwischen ihnen. Wenn man sich alle Designsysteme anschaut, die öffentlich sind und gerade da draußen sind, verwenden
nicht alle diese Wörter auf die gleiche Weise. Komponenten bedeuten also im Allgemeinen die kleinen Teile und Teile, die Sie benötigen, um dieses System erstellen zu können. Muster bedeutet das manchmal. Aber ich habe gesehen, wie viele Organisationen Muster auf andere Weise verwenden. Manchmal ist ein Muster ein Beispiel für einen Fluss. Zum Beispiel könnte eine Komponente so etwas wie ein Dropdown-Menü sein, aber ein Muster könnte so etwas wie ein Checkout-Flow sein. Es liegt an dir, was besser zu dir passt. Stellen Sie einfach sicher, dass Sie konsistent sind, wie Sie es verwenden. Wenn Sie eine Checkliste Art von Person sind, gibt es einige große Ressourcen für Sie als auch. Designer Nathan Curtis hat eine tolle Checklisten für Designsysteme , die alle verschiedenen Teile, die Sie in Ihrem Designsystem benötigen, umreißt. Du brauchst sie nicht alle. Aber vielleicht werfen Sie einen Blick durch sie und Sie werden feststellen, dass sie wahrscheinlich auch mit Ihrer Liste übereinstimmen. Was sind einige Dinge, an die Sie vielleicht nicht gedacht haben. Die anderen Dinge, die du von Nathans Liste schnappen kannst. Dies sind die Teile, die Sie für die erste Version Ihres Entwurfssystems benötigen. Eine weitere wirklich gute Möglichkeit, ein Designsystem zu erstellen,
besteht darin, Dinge zu nehmen, die bereits funktionieren und all das gute Zeug daraus zu extrahieren. Vor allem, wenn Sie in einer großen Organisation arbeiten, haben
Sie wahrscheinlich Sachen und andere Teams gemacht, die wahrscheinlich Sachen gemacht haben, das ist wahrscheinlich wirklich gut. So haben Sie vielleicht ein Produkt da draußen, das einen wirklich guten Fluss darin hat. Vielleicht ist es ein Checkout-Flow, vielleicht ist es ein Login-Flow, vielleicht ist es eine wirklich großartige Komponente, wie es große Konsistenz darin gibt oder die Topographie dort ist wirklich gut. Was Sie tun können, um Ihr Designsystem zu starten, ist wirklich auf das Zeug zu schauen und zu gehen, wissen Sie, was dort funktioniert? Die Topographie. Die Topographie dort ist, was wir für viele weitere Dinge verwenden sollten. Also fangen Sie an, das Zeug aus diesem Projekt zu extrahieren, nennen wir Piloten. Verwenden Sie die als Piloten und sagen Sie, okay, wir können das Zeug aus dem Piloten extrahieren und das wird die Grundlage unseres Designsystems sein. Wenn Sie dieses Zeug nicht haben, können
Sie anfangen, es zu erstellen. Nehmen wir an, Sie haben für ein Entertainment-Unternehmen gearbeitet, und vielleicht haben Sie nicht das ideale Produkt. Nun, Sie können es schaffen. Sie können sagen, in Ordnung, wir werden eine fiktive Übung machen in der wir eine Guide-App erstellen. Sie können diese Guide-App erstellen und dann sagen, in Ordnung, wir werden das Zeug von dieser Guide-App nehmen und
wir werden das verwenden, um unser Designsystem zu starten. Der Schlüssel hier, wenn Sie Pilotprojekte verwenden, besteht also darin, Dinge zu betrachten, die real sind, nicht abstrakt. Manchmal ist es schwer, einen Knopf zu entwerfen, wenn man nicht weiß, was er tun soll. Statt eine Schaltfläche isoliert zu entwerfen, entwerfen Sie einen ganzen Bildschirm, nehmen Sie
dann die Schaltfläche aus diesem Bildschirm und
sagen Sie, dass dies die Schaltfläche sein wird, die wir verwenden werden. Pilotprojekte sind also wirklich nützlich dafür,
ist es, Dinge im Kontext zu betrachten und sie dann aus dem Kontext zu nehmen. Wenn du es andersherum machst, wird
es viel schwieriger. Das ist, wo Dinge, die echte Apps sind, sind wirklich praktisch. Wie organisierst du das ganze Zeug? Nehmen wir an, Sie haben ein paar Sachen aus einem Pilotprojekt genommen. Du hast ein paar deiner eigenen Sachen erschaffen. Sie haben eine Liste von Dingen erstellt, die Sie tun möchten. Was machst du? Nun, ich denke, der erste Schritt darin ist, es zu organisieren. Das liegt wirklich an Ihnen und der Kultur Ihrer Organisation. Für einige Organisationen haben
Sie vielleicht bereits ein Jira Board oder ein Trello Board oder einen Zusammenfluss oder so etwas, wo Sie einen schönen Platz bekommen können, um Dinge zu platzieren und sie zu organisieren. Aber vielleicht nicht. So können Sie Ihr eigenes Google Doc oder ein Excel -Blatt oder einen Ordner auf Ihrem Computer starten, um es zu starten. Das ist okay. Jeder dieser Wege ist der richtige Weg, um Dinge zu tun. Es gibt keinen falschen Weg, es zu tun. Ich denke, das ist eine gute Sache, die du tun kannst. Organisieren Sie es und dann wäre der nächste Schritt herauszufinden, wie Sie das teilen können. Also, was ist der beste Weg, um es zu teilen? Schickt es eine E-Mail an den Rest Ihres Teams? Nun, großartig. Tun Sie das. Bereitet es einen Basislagerposten oder einen Slackposten vor? Tu das auch. Also fangen Sie an, über diese Möglichkeiten nachzudenken, dass Sie einige
dieser Materialien organisieren könnten , so dass diese die Komponenten und einige vielleicht die Richtlinien um sie herum sein könnten, und herausfinden, wie Sie es teilen können. Eine gute Sache ist, sich anzusehen, wie andere Referenzseiten dies tun. Wenn Sie also ein Beispiel benötigen, ist
es in Ordnung, Materialdesign oder Bootstrap
oder das Lighttening Design-System zu kopieren und ihr Ding als Leitfaden zu verwenden. Wenn Sie also Ihr Word-Dokument auf die gleiche Weise strukturieren möchten, ist
das in Ordnung, das ist ein guter Anfang, und es gibt keinen falschen Weg, dies zu tun. Es ist wichtig, dass Sie es organisieren und in der Lage sein, es zu teilen, und das wird Ihnen den Einstieg auf dem rechten Fuß. Als Designer selbst gibt es eine interessante Eigenart, die ich über Designer finde. Wir sind immer so wertvoll an unserer Arbeit. Wir versuchen, alles wirklich etwas Besonderes zu machen. Arbeit an einem Designsystem ist ein wenig kontraintuitiv, da die erste Version Ihres Designsystems vor allem, wenn Sie in einem großen Unternehmen arbeiten, die langweiligen Sachen kümmern
sollte. Mein Freund Josh Clark hat einen tollen Beitrag über Designsysteme, die sich um das langweilige Zeug kümmern. Er sagt, die spannendsten Designsysteme sollten langweilig sein. Es sollte sich um all das kümmern, was du nicht tun willst. Es sollte nicht all das besondere Schneeflockenmaterial sein, das du eigentlich machen willst. Speichern Sie das für sich selbst und speichern Sie das für etwas, in das Sie tatsächlich Ihre Zeit und Mühe gießen können. Also, wenn Sie das erste Mal ein Designsystem starten, egal ob Sie in einem großen Unternehmen arbeiten oder einfach selbst an einem Projekt arbeiten. Fang mit all dem langweiligen Zeug an. Machen Sie die Schaltflächen, machen Sie die Foren, machen Sie die Flattern. Holen Sie das Zeug aus dem Weg, damit Sie tatsächlich an den Sachen arbeiten
können, die viel kühler sind.
6. Gut aufgestellt für Projektkooperationen: Einer der schwierigsten Teile an Designsystemen ist es, Menschen an Bord zu bringen. Meiner Erfahrung nach ist das die harte Arbeit. Wir sind Designer, wir sind Entwickler, wir wissen, wie man das Design und die Entwicklung wirklich einfach macht. Das ist, was wir tun, das ist es, worin wir wirklich gut sind, was schwer ist, jemanden zu überzeugen, dass und dass wir das brauchen, und dass sie dazu Anreize haben sollten. Das ist für mich immer das Schwierigste an Designsystemen, Menschen an Bord zu bringen. Ich hatte das Glück, mit
wirklich großartigen Kunden arbeiten zu können , die das wissen, und sie haben
gute Arbeit geleistet , um den Ton zu setzen und den Tisch auf ihrem Ende zu setzen, damit wir gute Arbeit leisten können. Als Beispiel haben wir mit der Siebenten-Tags-Adventistenkirche zusammengearbeitet, um
ihnen bei einem Designsystem zu helfen , und ein Jahr zuvor haben
wir mit ihnen gearbeitet. Unser Kunde, Brent, der dort der Webmanager war, ging zu seinem Chef und er tat etwas, das wirklich interessant war. Sie machen eine Menge von Websites dort, was er tat war, dass er diese Websites ausgedruckt und diese kleinen Thumbnails ist drei Zoll mal drei Zoll Thumbnails und legte sie alle auf Montagebilden und er endete mit sechs oder sieben Montage-Boards etwa 150 verschiedene Thumbnails. Alle von ihnen sehen anders aus und er ging in seinen Chef mit diesen Mountain Boards und er sagte, schau dir all das Geld an, das wir verschwenden, alle diese sind maßgeschneidert gebaut von Grund auf
neu, neu erfinden das Rad alle Zeit und wir machen das einfach nicht schnell genug. Wir sind nicht in der Lage, dies mit der Geschwindigkeit und dem Volumen zu tun, das
wir wollen, und so verschwenden wir Geld, ich weiß, wie ich das beheben kann, wir brauchen ein Designsystem, und wenn Sie mir das Budget dafür geben können, und wenn Sie mir den Raum geben können, schaffen diese gut, können
wir viel effizienter zu bekommen, können
wir viel weiter in unserer Organisation gehen. Für ihn war das wirklich toll, und auch für uns ist, dass er wirklich den Tisch gesetzt hat, damit wir gute Arbeit leisten können. Er hat die Arbeit gemacht, alle auf die Idee
zu bekommen , warum sie es brauchen und unsere Arbeit wurde wirklich einfach. Wir konnten die Arbeit wirklich gut machen, das war einfach für uns, was die Design- und Entwicklungsarbeit ist, weil wir nicht wirklich das Überzeugende machen mussten. Jemand anderes muss auch das Überzeugende tun. Ich denke, das ist ein wichtiger Teil dieser Arbeit. Wie bringen Sie jemanden dazu, etwas für Sie zu tun? Nun, Sie müssen herausfinden, was ihr Anreiz ist. Denn nicht viele Menschen sind von ihrem guten Willen, etwas für Sie tun, selbstlos. Stattdessen müssen sie wissen, was für sie drin ist. Es hängt davon ab, mit wem du sprichst und du musst ihre Sprache sprechen. Wenn Sie mit einem Entwickler sprechen, warum möchte ein Entwickler ein Designsystem? Nun, sie wollen es, damit sie keine Codes von Grund auf schreiben müssen, oder vielleicht wollen sie keine Codes schreiben, die fehlschlagen, weil sie jedes Mal von Grund auf neu beitreten, vielleicht ist Konsistenz die Sprache, die Sie mit ihnen sprechen. Vielleicht geht es für Ihren Chief Financial Officer in Ihrem Unternehmen, für sie darum zu wissen,
dass wir Geld sparen werden, weil wir nicht
so viele Teams aufdrehen müssen , oder wir müssen nicht so lange dafür ausgeben. -Projekte. Sprechen, die Sprache der Effizienz ist wahrscheinlich eine gute Sache für sie. Es kommt wirklich darauf an, mit wem Sie reden und versuchen
herauszufinden , was die Sprache ist, die sie brauchen, was sie hören müssen, um zu wissen, dass es
vielleicht der CEO eines Unternehmens ist und für diese Person, Es geht darum, die Mission des Unternehmens zu erfüllen. Vielleicht geht es für sie darum, wie dieses Designsystem uns helfen wird, unsere Mission zu erreichen? Denken Sie wirklich daran, dass Ihr Designsystem in der Lage ist , alle verschiedenen Teile Ihrer Organisation
gerecht zu werden. Hochebene, niedrige Ebene im Unkraut, im Wald und in den Bäumen. Was an einem Designsystem cool ist, ist, dass es all diese verschiedenen Teile hat. Wenn Sie diese Teile extrahieren und sagen, dass dieser Teil über Finanzen ist, es in
diesem Teil um Effizienz, diesem Teil geht es um Mission. Ich denke, Sie werden die Menschen viel effektiver überzeugen können. Wenn Sie jemanden von irgendetwas überzeugen, müssen
Sie recherchieren. Eine der Möglichkeiten, wie ich das wirklich effektiv finde, ist, nur mit Menschen zu reden, das ist ein guter Weg. Wenn wir mit Kunden anfangen, sprechen
wir mit ihnen darüber, was ihre Bedürfnisse sind, was der Schmerz ist, was gerade schmerzt. Wir sind nur sehr langsam bei diesem Ding. Okay, cool, wenn das schneller wäre, wie würde es dir helfen. ist hilfreich, wirklich grundlegende Fragen zu stellen. Manchmal ist das Eins-zu-Eins weniger Druck, als wenn es in einer Gruppe ist. Eines der Dinge, die ich empfehlen würde, ist, zu beginnen, mit Menschen zu sprechen wie diese Sache ihnen helfen könnte oder allgemein sogar, wie sie geholfen werden können. Vielleicht ist die Lösung kein Designsystem, sondern oft in einer Organisation mit
Fragen zu Effizienz und Schnelligkeit und Geld und Zeit. Ein Designsystem ist wirklich ein gutes Werkzeug dafür. Ein guter Weg, sich dafür einzurichten und das Buy-in zu bekommen, ist zu sagen, nun, jeder sagt mir, wo es jetzt weh tut, sag mir, was die Schmerzen sind und dann kann ein Designsystem eine Lösung für diese Schmerzen sein. Ich denke, es ist nützlich, andere Designsysteme als eine Möglichkeit zu betrachten, zu sagen, hier ist eine Lösung für ein Problem, das ähnlich dem ist, was wir haben. Aber was daran hart ist, was wirklich unklar ist, ist, die Leute sich nicht wirklich Sorgen um die Lösung des Problems machen. Sie machen sich wirklich Sorgen um das Ergebnis. Es ist schwer, auf ein anderes Designsystem zu schauen und zu gehen, ich sehe, wie das die Effizienz in dieser Organisation geholfen hat. Was wirklich nützlich ist und leider gibt es nicht viele Statistiken darüber im Moment, aber mehr und mehr kommen heraus,
was ich finde, ist wirklich großartig, nicht nur zu sagen, naja, Salesforce hat ein Lightning-Designsystem, aber stattdessen sagen, Salesforce hat ihre Zeit Projekte aufgrund ihres Entwurfssystems halbiert. Ich denke, das ist das Zeug, das den Menschen wirklich hilft, ist, das zu verstehen und diese Statistiken zu hören. Weil wir im selben Boot sind und wenn das das Ergebnis ist, das sie mit diesem Tool bekommen haben, können wir
vielleicht ein ähnliches Ergebnis mit einem ähnlichen Werkzeug haben. Ein Designsystem ist ein wirklich großes Werkzeug für eine Organisation, um den Prozess des Entstehens eines zu übernehmen, eines bauen, eines zu implementieren, ist eine herkulische Anstrengung. Es ist nicht etwas, das Sie wahrscheinlich an einem Tag tun können. Eine Sache, die Sie vielleicht denken, ist, na ja, was ist die Version davon, die Sie an einem Tag tun können? Was ist die Sache, die Sie in ein paar Stunden einrichten und sagen können, in Ordnung, im
Laufe einer Woche in diesem Projekt,
dieses kleine Werkzeug hat mir geholfen, indem ich meine Zeit in zwei Hälften reduziert. Stellen Sie sich vor, wenn wir dieses Werkzeug nach oben skalieren, dass es auch die Zeit halbieren würde, wenn wir
jetzt das Werkzeug hätten, das uns sechs Monate
sparen könnte , was normalerweise bei einem 12-monatigen Projekt wäre, wäre das großartig. Wenn Sie keine Statistiken haben, wenn Sie keinen Zugriff auf haben,
nun, was eine andere Organisation damit gemacht hat. Vielleicht können Sie Ihren eigenen kleinen Testfall erstellen und sagen, Ordnung, jetzt, wenn wir das skalieren, wenn wir das hochrechnen, können
wir sehen, dass wir wahrscheinlich so viele Einsparungen bekommen, und was großartig daran ist, wird es wirklich spezifisch für Ihre Organisation. Es werden keine anekdotischen Daten sein. Es werden keine Daten sein, die besagen, dass diese Organisationen das haben, oder vielleicht können wir das hier bekommen. Es wird wirklich auf dem basieren, was Sie Erfahrung in dieser bestimmten Umgebung haben. Genehmigung ist bei Designsystemen wirklich wichtig, und der Grund dafür ist, dass ein Designsystem
so breit ist , dass es jeden Teil einer Organisation berührt. Es ist nicht nur für Designer, obwohl es ein Designsystem genannt wird. Es ist nicht nur für Designer, es ist für Entwickler, Produktleute und Content-Menschen und alle in der Organisation. Jeder muss gekauft werden, weil es in der gesamten Organisation
implementiert werden wird . Für viele Dinge auf einem großen Befürworter bitten um Vergebung statt um Erlaubnis mit einem Design-System, das die Ausnahme sein könnte. Ich denke, dass die Leute gekauft werden und es wird dir später
eine Menge Kopfschmerzen ersparen denn selbst wenn du am Boden beginnst und gehst, nun, lasst uns einfach anfangen und wir werden herausfinden, wie man es später umsetzt, gehst
du , um in eine Straßensperre zu laufen, wenn Sie zu dem Punkt kommen, wo Sie wie okay sind müssen
wir dies implementieren, wir müssen uns in unsere Infrastruktur oder einen Teil davon engagieren. Du wirst dort in eine Mauer laufen. Mehr nach einem Vorfeld zu bekommen, ist in der Regel vorteilhafter. Buy-in und eine Organisation zu bekommen, ist ein bisschen anders, als Buy-in für ein Projekt. Nehmen wir an, Sie sind Freiberufler, Sie arbeiten in einer Agentur, vielleicht in einer kleinen Agentur, und Sie sprechen mit einem Kunden über ein Designsystem für sie. Einige der Nuancen gibt, sind wirklich interessant, wo ich an der Gestaltung von Systemen für Kunden gearbeitet habe, ist manchmal wird eine Musterbibliothek und einen Referenzführer nur für unser Team erstellen, und manchmal hat der Kunde kein Interesse daran. Es wird ein hilfreiches Werkzeug für unser Team und sagen hier ist, wie wir die Arbeit für den Kunden machen werden. Der Client möchte die Ausgabe dieser Arbeit. Ich habe einige Kunden sagen lassen, wir kümmern uns nicht wirklich um die Muster-Bibliothek oder die Referenzseite, wir wollen nur die letzten Seiten und das ist völlig in Ordnung. Wenn Sie ein Designsystem für sich selbst verwenden, um die Ausgabe für den Client zu machen, ist das großartig. Es war nützlich für Sie. Du musst nicht das Gefühl haben, dass du das aushändigen musst. Nun, ich denke, dass Sie bereit sein sollten, das an Ihren Kunden zu
übergeben und tatsächlich
die Gespräche mit ihnen zu führen und offen mit ihnen zu sein, um zu sagen, hören Sie, wie wir das Ding
so machen konnten effektiv in dieser Qualität und wirklich schnell, denken
wir, dass, wenn wir es Ihnen auch geben, Sie tatsächlich in der Lage, das mit Ihrer Organisation zu tun. Manche Klienten kaufen das, manche Kunden nicht. Aber wenn Sie in einer Agentur arbeiten oder ein Freiberufler sind, haben Sie keine Angst, es einfach für sich selbst zu verwenden, um die Ausgabe zu erstellen und dann bieten Sie es
als Bonus für den Kunden, wenn sie tatsächlich wollen, dass Teil des Tools als auch. Ob Sie den Kunden extra für dieses Designsystem berechnen, liegt wirklich an Ihnen.
7. Dein Designsystem implementieren: Die Implementierung ist sehr wichtig, um Systeme zu entwerfen. Sie sind alle Designer, denken Sie daran, wie oft Sie einen PDF-Styleguide
bekommen haben , den eine Marke gesagt hat,
ja, verwenden Sie einfach, folgen Sie dem Styleguide und dann was wir tun, ist, dass wir es
einfach wegwerfen und dann tun wir, was wir glauben, dass es richtig ist. Wenn ein Designsystem wirklich nur eine Referenzwebsite ist und nicht tatsächlich in
die Tools und die Kultur Ihrer Organisation oder Ihres Projekts implementiert ist, wird es niemand verwenden. So sicherzustellen, dass es wie ein Teil der Mischung ist, ist super wichtig für ein Designsystem. Eines der Prinzipien, die mein Team viel verwendet, wenn wir an Design-Systemen arbeiten, ist
einer unserer Favoriten, das Beste zu machen, was am einfachsten ist. Viele Teams, mit denen wir arbeiten, verwenden Bootstrap und wenn sie anfangen, ein Designsystem zu wollen, ist ein
Teil unserer Herausforderung, wie wir das Designsystem besser machen als Bootstrap? Bootstrap ist so ein großartiges Tool und was auch immer wir benutzt haben, das es ersetzen muss, muss besser sein und es gibt viele Versionen von dem, was besser sein kann. Als Beispiel ist
Bootstrap ziemlich Vanille. Wenn ich Bootstrap verwende und das für meine Organisation verwenden möchte, habe ich immer noch eine Menge Arbeit, die ich damit zu tun habe. Ich muss meine Markenschriftarten einbetten, ich muss meine Organisation oder meine Projekte Farbpaletten haben, also gibt es Arbeit, die ich erledigen muss. Wenn das Designsystem bereits dieses Zeug eingebacken hatte, jetzt das Beste,
was zu verwenden ist das Designsystem eigentlich die einfachste Sache, da ich nicht so viel Arbeit darin erledigen muss. Eines der Prinzipien, die wir versuchen zu verwenden und wie wir mit Kunden zusammenarbeiten und wie Sie das mit Ihrer Arbeit
tun können , ist, wie können Sie es
einfacher machen als das, mit dem Menschen gerade arbeiten? Der heilige Gral eines Designsystems ist ein Werkzeug, das in jedem Workflow implementiert wird. So erleichtert es Designern das Design und erleichtert die Programmierung, das Front-End einfacher für Front-End-Entwickler. Es erleichtert das Codieren des Back-Ends für Back-End-Entwickler. Es verfügt über Produktmanagement-Tools für Produktmanager. Die besten Implementierungen sind also die eine und so ist
der Heilige Gral derjenige, den jeder das Designsystem nutzen kann. Nun, das ist wirklich schwer zu tun. Es gibt viele Werkzeuge, die gebaut werden müssen, es gibt viele Prozesse, die
implementiert werden müssen und Workflow, der implementiert werden muss. Idealerweise würde ein Designsystem sagen, dass die Designreferenzen für Designer
hätten, es hätte die Front-End-Tools für Front-End-Entwickler und es würde auch in die Implementierung
integriert werden , so dass Back-End-Entwickler es verwenden könnten als auch. Ich habe selten gesehen, dass passieren, und so arbeiten viele Organisationen darauf hin, aber es gibt nur eine Handvoll , die es tatsächlich erreicht haben und noch weniger, so dass tatsächlich darüber veröffentlicht. Lonely Planet ist eine Organisation, die es vor
ein paar Jahren getan hat , und sie haben ein großartiges System namens Rizzo, das lohnt sich zu betrachten und vor kurzem hat
Airbnb ein ziemlich gutes System, wo es in eine Menge ihrer Werkzeuge implementiert ist. Ich denke, ein guter Weg, darüber nachzudenken, wie man ein Designsystem in den Workflow integriert, ist es, wie jedes neue Werkzeug darüber nachzudenken. Wenn es ein neues Tool gibt, das Sie verwenden, werden
Sie wahrscheinlich bemerken, dass eine Menge. Sie werden wahrscheinlich in der Lage sein, es auszurufen, Sie werden wahrscheinlich darüber reden müssen, Sie werden wahrscheinlich die Leute daran erinnern müssen, es zu benutzen. Wenn Sie also zum ersten Mal ein Designsystem in Ihrer Organisation implementieren, werden
Sie wahrscheinlich ein Projekt ohne es machen und dann wird jemand sagen, oh, wir sollten dafür ein Designsystem verwenden und das ist in Ordnung, das ist wahrscheinlich Teil der Probezeit, die Onboarding-Zeit davon. Da es immer mehr in Ihren Workflow integriert wird, wenn Sie sich daran gewöhnen, beginnt
es zu einer zweiten Natur zu werden, wo Sie jetzt
nicht mehr ohne Ihr Designsystem bauen oder entwerfen, jetzt greifen Sie tatsächlich häufiger danach und Es wird einfach Teil Ihrer Natur, Teil Ihrer Werkzeuge, Teil des natürlichen Teils Ihres Workflows. Häufiger in Organisationen ist
ein Designsystem wirklich nützlich für Designer und Front-End-Entwickler und das ist ein großartiger Ort, um zu beginnen, mit einigen Designreferenzen und Anleitungen und auch mit einigen Front-End-Code, etwas HTML, CSS und JavaScript, mit dem
ein Front-End-Entwickler arbeiten kann, um Schnittstellen erstellen zu können, das ist ein wirklich guter erster Schritt. Integration in ein Back-End-Tool ist wahrscheinlich die nächste Phase Ihres Designsystems, wie eine Version zwei aussehen könnte, es gibt einige Werkzeuge für diese Art von Sachen. Also, wenn das der Ort ist, an dem du anfängst, ist
das okay, das ist ein wirklich guter Ort, um zu sein. Eine der Definitionen, über die wir mit Designsystemen gesprochen haben, ist ein Designsystem ist ein Produkt und so müssen Sie es wie ein Produkt behandeln. Wie können Sie Leute an einem Produkt interessiert machen? Nun, du musst Marketing für dieses Produkt machen. Das könnte E-Mail sein, Newsletter, es könnte ein Twitter-Account sein, es könnte eine Slack-Gruppe sein, es könnte nur Möglichkeiten, dass Sie Menschen engagieren und interessiert. Ein Designsystem, auch innerhalb oder Organisation, ist keine Ausnahme davon. So müssen Sie vielleicht die gleiche Art von Evangelisation tun, die Sie tun würden, wenn Sie Software als Service-Produkt
machen, außer dass Sie es nur intern tun. Das bedeutet also, Leute an Bord zu bringen, wir haben darüber gesprochen, ein bisschen zu kaufen, das heißt, sie ein wenig evangelisieren zu können, Materialien zu
senden, häufige Updates zu senden, also musst du es wie ein vollwertiges Produkt behandeln. Es ist nicht nur ein Werkzeug, es ist ein tatsächliches Produkt, das Sie jetzt unterstützen müssen. Was wirklich toll an dem Designsystem ist, dass es Opt-In werden kann, also muss nicht jeder es verwenden. die gleiche Weise, wie einige Organisationen, die Sie nicht die Entwurfstools oder Entwicklungstools für Benutzer benötigen, können
Benutzer ihre eigenen Code-Editoren verwenden oder wenn Sie Skizze im Vergleich zu Sigma oder Illustrator
verwenden möchten , Sie haben die Freiheit, dies zu tun. Nun, Sie können einen Anreiz für die Leute machen zu sagen, wenn wir alle dieses eine Werkzeug verwenden, profitieren wir alle, aber es muss nicht beauftragt werden. Ich habe festgestellt, dass Mandate von oben nach unten sehr selten funktioniert, es hat nie so funktioniert, dass alle Entwickler gezwungen wurden, dieselbe Codierplattform zu verwenden, es hat nicht funktioniert, Designer die gleiche App verwenden zu lassen, es wird nicht mit es auch mit einem Designsystem zu tun. Anstatt also darüber nachzudenken, wie es manduliert werden kann, anstatt darüber nachzudenken, wie man Menschen dazu anregen kann, das zu nutzen. Incentives sind interessant, darüber zu sprechen. Wie bringt man eigentlich Leute dazu, etwas zu benutzen? Du appellierst an sie. So sprechen verschiedene Dinge verschiedene Menschen an. Sicherlich Effizienz und solche Dinge sind wirklich hilfreich, um Leute davon zu überzeugen, dass, oh, du solltest dieses Ding benutzen. Aber manchmal, als Art von weicheren Möglichkeiten, es zu tun, wollen die Leute
manchmal einfach Teil von etwas sein und so ist die
Schaffung von Gemeinschaft eine gute Möglichkeit, Menschen Anreize zu geben, zu sagen, Blick auf alle Menschen, die dieses Design-System verwenden intern oder schauen Sie sich all die Leute an, die es benutzen können und wollen Sie nicht Teil dieses Clubs sein? Also ich glaube nicht, dass es nur die schwer greifbaren Vorteile sein muss, es könnte auch so sein, dass
du dem coolen Kids Club beitrittst oder du machst diese neue Sache oder du bist Teil
des neuesten Teils dieser Organisation und was wir tun oder sogar schauen in der Welt zu sagen,
schauen Sie sich an, was all die coolen Unternehmen wie Google und Airbnb und Facebook mit ihren Designsystemen tun, lassen Sie uns unsere Organisation zu einer dieser Arten von Organisationen machen. Die Art und Weise, wie ein Designsystem in eine Organisation integriert wird, ist wirklich interessant, weil es viele Leute gibt, bevor Sie ein entworfenes System haben, gibt es viele Leute, die ihre alten Möglichkeiten haben,
Dinge zu tun weil Sie kein Designsystem hatten. Jetzt haben Sie dieses neue Werkzeug jedem vorgestellt und das ist eine Hürde an
sich, um alle, die dort bereits auf eine andere Weise arbeiten, an Bord zu bringen. Neue Mitarbeiter sind manchmal etwas mehr eine Komplikation, aber ich denke, dass es auch einige Vorteile gibt. Als Beispiel arbeiten
wir jetzt mit einer Organisation zusammen, in der wir ihnen dabei helfen das erste Designsystem zu
erstellen, und sie stellen gleichzeitig ein. Also die Leute, die gerade dort arbeiten, arbeiten
wir irgendwie zusammen mit ihnen an dem Designsystem, und so ist das Designsystem ein wenig peinlich, es ist ein wenig peinlich für sie. Aber was sie tatsächlich tun, was ich denke, ein wirklich großartiger Schritt ist, diese neuen Mitarbeiter an Bord kommen, sie sind nur Teil des Protokolls, das wir das Designsystem verwenden, das ist Teil der Werkzeuge, die Du arbeitest hier. Hier ist, was Sie für Ihr HR-Portal verwenden, hier ist, was Sie für die Kommunikation mit dem Rest des Teams verwenden, hier ist, wie Sie Produkte erstellen. Selbst wenn es an dieser Stelle nicht ganz stimmt, versuchen
alle das Kostüm an, sie sagen,
lasst uns einfach so handeln, als ob dies ein Werkzeug ist, das wir benutzen werden und immer benutzt
haben und mal sehen, wie das geht. Also für neue Mitarbeiter, haben
Sie
auch dort eine Möglichkeit , weil es ein wenig leerer Schiefer ist, zu sagen, nun, das ist die Art, wie wir Dinge machen und für eine neue Einstellung, sie wissen es nicht besser, sie wissen nicht, dass Sie verwenden das nicht in dieser Organisation. Probieren Sie es bei neuen Angestellten aus und informieren Sie sie
vielleicht, dass wir so arbeiten wollen, wir das jetzt nicht gerade, aber wenn Sie an Bord kommen, könnten Sie vielleicht einer der sein, die die Anklage leiten. Es gibt tatsächlich einen neuen Anreiz zu sagen, oh,
das ist ein Weg, dass ich involviert sein könnte und
den Leuten, die hier sind, tatsächlich helfen könnte, anstatt sich zu fühlen, als würde ich schon aufholen.
8. Dein Designsystem weiterentwickeln: Designsysteme müssen unbedingt gepflegt werden, wie wir darüber gesprochen haben, es ist ein Produkt und jedes Produkt muss gepflegt werden. Einige Produkte werden mehr gepflegt als andere, einige sitzen dort für ein Jahr, bis das Team daran
arbeitet und dann auf Version 2 aktualisiert wird. Ich habe einige Designsysteme gesehen, die so sind. Andere sind ein Produkt, an dem Menschen jede Woche und manchmal sogar jeden Tag arbeiten. Es liegt wirklich an Ihrer Organisation oder Ihrem Team wie häufig Sie am Designsystem arbeiten möchten, es auf dem neuesten Stand
halten, die Komponenten auf dem neuesten Stand halten, die Anleitung auf dem neuesten Stand halten,
sie verbessern ,
sie, eine andere Version von ihnen zu tun. Das kann so langsam oder so schnell sein, wie Ihr Unternehmen unterstützen kann und tatsächlich unterstützen sollte. Es liegt wirklich an der Trittfrequenz deiner Anstrengung, wie verfügbar jeder ist, daran zu arbeiten und wie oft du es brauchst. Governance für Designsysteme ist ein so kniffliges Thema. Ein Teil davon ist nur, weil die Idee von Designsystemen, obwohl sie schon lange in der Druckwelt existieren, sie sind neu in der digitalen Welt. Ich weiß nicht, dass es ein Designsystem gibt, das lange genug gibt, um tatsächlich zu
sagen, dass Governance funktionieren sollte. Ein Teil davon ist, dass die Industrie herausfindet, wie ein Designsystem aufrechterhalten werden
sollte und wer dafür verantwortlich sein sollte und all diese Art von Sachen. Es gibt viele verschiedene Modelle der Governance. Ein offensichtliches Modell ist, dass es eine Person in unserer Organisation gibt und Person für dieses Designsystem verantwortlich ist. Das funktioniert gut, aber es funktioniert nur für kurze Zeit gut, denn idealerweise möchten Sie, dass Ihr Designsystem ein Erfolg wird, und Sie möchten, dass es etwas ist, das jeder verwendet. Je mehr Menschen, die es verwenden, desto schnell wird diese Person überwältigt mit Leuten, die ihnen Fragen stellen,
herausfinden, wie sie sich mit ihm integrieren können, es wächst sehr schnell aus einem Vollzeitjob. Viele Design-Systeme beginnen mit, es gibt eine Person, die verantwortlich für dieses Ding, aber sehr schnell entwachsen, dass. Der nächste Schritt ist, nun, von einer Person, vielleicht wachsen wir einfach ein Team um das Designsystem. Statt dass eine Person dafür verantwortlich ist, gibt es sechs Personen, die dafür verantwortlich sind. Das ist ein Modell, das wir zuvor in unterschiedlichem Grad an Erfolg gesehen haben. Wo dieses Modell wirklich zusammenbricht, ist, jetzt scheint es,
naja, es gibt sechs Leute,
die für dieses Designsystem verantwortlich sind, und sie sind nicht wirklich verantwortlich für die Herstellung anderer Produkte für diese Organisation und so sind sie ein außer Berührung für das, was das Designsystem tatsächlich unterstützen muss. Manchmal arbeitet dieses Team in einer Organisation wie eine interne Agentur, um Dinge zu erstellen und Anfragen von
anderen Produktteams innerhalb der Organisation entgegenzunehmen , und es fühlt sich ein wenig getrennt an. Eines der Modelle, die wir gesehen haben, funktioniert am besten, und ich denke, das ist auch in diesen Artikeln, was man ein verbundenes Modell nennt. Es gibt kein engagiertes Team für das Designsystem, das genau darauf funktioniert. Aber es könnte ein oder zwei Leute geben, die nur auf dem Designsystem waren, und dann besteht der Rest dieses Teams tatsächlich aus Leuten, die an anderen Produktteams arbeiten. Es ist ein bisschen ein repräsentatives Modell zu sagen, einige Leute, die direkt daran gearbeitet haben und nur das, aber dann lassen Sie uns ein paar Leute für andere Teams auf. Es ist fast wie ein Vorstand von Beratern, aber Leute, die tatsächlich raten können zu sagen, auf diesem einen Produkt haben
wir diese eine Sache gemacht, lasst uns das ins Designsystem rollen oder wir brauchen dieses Ding hier, damit erhalten Sie unterschiedliche Perspektiven aus der Organisation. Das ist das Modell, das wir bisher am erfolgreichsten gesehen haben. Wieder, ich denke, es ist ein wenig zu jung, um zu sagen, das ist definitiv das Modell, das nach vorne geht. Es gibt viele Möglichkeiten, um an Komponenten zu arbeiten und sie zu
aktualisieren und Anleitung und Aktualisierung, dass im Designsystem. An einem Ende des Spektrums wird das gesamte System auf einmal aktualisiert. Sie veröffentlichen es am ersten Tag,
ein Jahr später, können Sie Version 2 des gesamten Entwurfssystems veröffentlichen. Jede Komponente wird aktualisiert, alle Leitfäden werden aktualisiert, alles auf einen Schlag. Auf der anderen Seite des Spektrums ist
es möglich, an jeder Komponente unabhängig zu arbeiten. Innerhalb einer Woche
können Sie ein Upgrade einer Komponente von Version 1 auf Version 1.1 durchführen. Eine andere Komponente könnte Version 1 für weitere zwei Jahre bleiben. Sie können auf Komponentenebene daran arbeiten. Es gibt Vor- und Nachteile für jeden Ansatz. Die Vorteile für die Arbeit auf einem sehr endlichen Niveau und ein sehr detailliertes Niveau ist, dass Sie tatsächlich an diesem Ding in Echtzeit arbeiten und Sie nicht ein ganzes Jahr warten, um zu versuchen, eine ganze Reihe von Arbeit zu machen. Sie können die Arbeit daran in
sehr kleine Stücke aufteilen , die viel überschaubarer sind. Der Nachteil davon
ist, dass man jetzt engagierte Menschen dazu haben muss. Man muss Leute haben, die Vollzeit daran arbeiten, um daran zu arbeiten, sagen wir jede Woche oder jeden Tag sogar, um zu wissen, dass eine Komponente aktualisiert werden muss. Die andere Seite des Spektrums, der Vorteil, es einmal im Jahr zu tun, ist, dass Sie alles auf einmal tun können. Die Nachteile, dies auf diese Weise zu tun,
ist, dass Sie sagen, dass Sie ein Komponenten-Update benötigen. Nun, ein Jahr auf dieses Komponenten-Update warten zu müssen, ist es keine tolle Sache, besonders für andere Teile Ihrer Organisation, die gehen, nun, entweder müssen wir das jetzt reparieren, oder wir werden vom System abweichen. Ihre Kilometerleistung kann je nach Organisation, in
der Sie arbeiten und wie beschäftigt sie sind, und wie viel Aufwand und Zeit Sie dem Designsystem und seiner Wartung widmen können variieren. Aber es ist wahrscheinlich nicht die eine oder andere Seite, aber wahrscheinlich irgendwo in der Mitte landet. Eine der häufigsten Fragen rund um Designsysteme ist, wie viel es sich ändern sollte und ob es
eine einzige und erledigte Sache sein sollte, oder es gibt etwas, das Sie die ganze Zeit twittern sollten. Eines der Dinge, die ich an der digitalen Arbeit liebe, ist, dass wir die Fähigkeit haben, Dinge so oft zu ändern, wie wir wollen. Das ist anders als Druckarbeiten, wenn man etwas falsch auf einem Papier druckt und einen Tippfehler gemacht hat, muss
man das Papier wegwerfen und ein völlig neues drucken. Mit Digital müssen Sie nicht, wir können iterieren. Das ist eines der Dinge, die an Produktdesign und digitalem Design großartig sind
, ist , dass wir Dinge auf eine kleine Art und Weise verändern können. Die Frage, ob Sie Ihr Designsystem so machen sollten, sehr breite Änderungen oder iterieren, hängt
wirklich davon ab, wie gut es ist. Ich sage, wenn es wirklich toll ist, kannst
du es in Ruhe lassen. Wenn es nicht so toll ist, dann sollten Sie es wahrscheinlich reparieren. Aber was wir vom digitalen Produktdesign wissen, ist, dass sehr selten jemand von uns etwas über ein digitales Produkt vorhersagen kann. Mach es beim ersten Mal richtig gut und kann es nageln, perfekt
haben und dann nie wieder anfassen müssen. Die Antwort ist wahrscheinlich, dass Sie es etwas berühren müssen nachdem Sie Ihre anfängliche Hypothese gemacht haben und es beim ersten Mal machen. Es gibt wahrscheinlich irgendwo eine Version 2 um die Ecke. Ob das ein Jahr weg ist, sechs Monate oder sechs Wochen entfernt,
ich denke, hängt davon ab, wie gut du das erste Mal erraten hast. Das Spannende an Designsystemen ist auch, dass sie
grundlegend sind und daher in der Lage sein sollten, auf ihnen aufzubauen. Design-Systeme, wie wir sie heute sehen, wenn Sie sich Aufhellung ansehen oder wenn Sie Material betrachten, wenn Sie sich eines der beliebten Open-Source-diejenigen ansehen, die da draußen sind, sind viele von ihnen für die Standard-Plattformen, Web und vielleicht nativen Apps. Möglicherweise werden Android-Apps oder iOS-Apps angezeigt. Wir leben heute in einer wirklich coolen Zeit, wo das
nicht nur die Geräte sind, mit denen wir interagieren. Viele von uns haben Amazon Echos in unseren Häusern oder Google Homes. Wir interagieren mit Dingen, die nur Stimme sind oder nur
berühren und nicht nur Dinge, für die wir eine Maus verwenden, Tablets und solche Dinge. Ich denke, wie ein Designsystem das aus
einer Plattform- und Musterperspektive unterstützen sollte , hängt davon ab, wie Sie es implementieren werden. Aber eine Sache, die den ganzen Weg standhaft bleiben sollte, ist eigentlich Ihre Prinzipien sollten diese neuen Dinge unterstützen. Ein Test Ihrer Prinzipien ist zu sagen, wenn wir uns dieses Prinzip ansehen, führt dies unsere Web-Arbeit so gut wie es,
sagen wir, ein Sprachgerät führen kann ? Wenn nicht, gibt es vielleicht etwas Feinabstimmung mit Ihren Prinzipien zu tun. Auch wenn die Plattformen kommen und gehen, darüber nachdenken, Sie könnten reagieren in einer Version Ihres Designsystems unterstützen,
und dann, wenn die Reaktion nach ein paar Jahren verschwindet, werden
Sie vielleicht wollen, dass in den Ruhestand gehen. Ihre Plattformen können kommen und gehen, aber vielleicht denken Sie darüber nach, dass Ihre Prinzipien die ganze Zeit durchhalten. Einer der häufigsten Stolpersteine, die ich bei
Designsystemen sehe , ist, zu spezifisch in eine Technologie zu gelangen. Es gibt immer einen Geschmack der Woche. Ein Designsystem aus visueller Design-, Grafik- und UI-Designperspektive. Diese Dinge sind erprobt und wahr, visuelles Design hat sich nicht geändert, die Prinzipien des Grafikdesigns bleiben standhaft. sind großartig, aber es gibt immer einen Geschmack der Woche in Bezug auf Technologie. Eine Woche, es ist eckig eine Woche, es reagiert eine weitere Woche, es ist Sicht. Eine der Fallstricke, die ich mit Design-Systemen sehe, ist alles in einer Technologie. Wenn Sie beabsichtigen, dass Ihr Designsystem eine lange Zeit hält, würde
ich vorschlagen, nicht zu weit in den Geschmack der Technologie zu gehen und stattdessen mit etwas etwas Agnostikerem zu gehen. Viele Möglichkeiten, wie wir Designsysteme erstellen, besteht darin, HTML, CSS
und Vanilla JavaScript zu unterstützen und dann Technologieschichten darüber hinaus zu bauen. Hier unsere HTML- und CSS-Komponenten und JavaScript-Komponenten und dann hier die reaktive Version dieser Komponenten oder die eckige Version dieser Komponenten. Aber wirklich sicherstellen, dass Sie beide Versionen haben. Wenn Sie alles rein gehen und sagen, unser Design-System reagiert nur,
dann, wenn Sie weg von reagieren aus irgendeinem Grund, müssen Sie das gesamte System umrüsten. Wenn Sie über Langlebigkeit nachdenken, würde
ich vorschlagen, auf HTML-, CSS- und JavaScript-Technologien zu gehen, die bereits seit Jahrzehnten existieren und weiterhin bestehen bleiben, anstatt etwas, das in drei oder vier Jahre. Teil der Falle eines guten Design-Systems ist, dass es sich
anfühlt , wenn Sie das Werkzeug richtig haben, das ist alles, was Sie brauchen. Wenn Sie bereits ein großartiges Designsystem eingerichtet haben, haben
Sie die Arbeit getan, um die richtigen Komponenten zu identifizieren, große Prinzipien ,
Sie haben universelle , Sie haben spezifische, zu identifizieren,
Sie haben universelle, Sie haben spezifische,
ist Sagen Sie, nun, wir haben es. Jetzt können wir einfach machen, was wir wollen, ohne zu reden. Ich denke, ein Teil der Sache, die mit einem Designsystem leicht zu vergessen
ist, ist, dass das Designsystem die Zusammenarbeit fördern und nicht davon abhalten sollte. Wenn Sie ein Designer sind und ein tolles Designsystem oder einen Entwickler haben und Sie ein großartiges Designsystem haben, sollte
das keine Entschuldigung für Sie sein, ich kann es einfach machen, ohne mit jemandem zu reden, obwohl Sie es können. Ich denke, das wird eine der großen Versuchungen sein, ein gutes Designsystem zu haben,
ist es, sagen zu können, dass dies eine Sache sein sollte, die mich mit
Leuten sprechen lässt , mit denen ich arbeite, anstatt mit etwas, das mich gehen lässt, ich weiß nicht müssen mehr mit ihnen arbeiten. Das ist die Art und Weise, wie sich das Designsystem verbessert. Wenn Sie nicht zusammenarbeiten, wird
Ihr Designsystem zum Stillstand kommen. Es wird sehr leicht abgestanden werden. Je mehr Sie zusammenarbeiten, desto mehr Möglichkeiten finden Sie, Ihr Designsystem tatsächlich zu verbessern.
9. Abschließende Gedanken: Wir haben es geschafft. Wir sind bis zum Ende des Unterrichts gekommen. Jetzt hoffe ich, Sie wissen alles, was Sie wissen müssen, um mit Designsystemen zu beginnen. Wenn du noch keinen benutzt hast, gib ihm einen Schuss. Wenn Sie eine zuvor verwendet haben, jetzt wissen Sie, wie Sie es besser machen können? Ich hoffe, dass Sie von hier aus mehr zusammenarbeiten,
anfangen, mehr mit Ihren Kunden, mit Ihren Projekten,
mit Ihren Teammitgliedern, mit Ihrer Organisation zu arbeiten , aber wie Sie Designsysteme implementieren und sie optimal nutzen können Ihre Fähigkeit. Im Laufe dieser Klasse haben Sie einige Listen erstellt, Sie generieren Ideen, Sie haben einige Gedanken,
jetzt, teilen Sie diese mit anderen Menschen. Das ist der Sinn eines Designsystems ist die Zusammenarbeit. Setzen Sie das in die Praxis um. Sie können sich die Projekt-Galerie ansehen. Dort können Sie Ihre Arbeit einreichen. Sie können Feedback zu Ihrem erhalten und sehen, was andere Leute tun, also stellen Sie sicher, dass Sie das nutzen. Jede gute Klasse würde Ihnen wahrscheinlich mehr Fragen als Antworten hinterlassen, also hoffe ich, dass das hier der Fall ist. Wenn Sie Fragen oder Kommentare haben, lassen Sie sie in der Projektdiskussion, und ich werde ziemlich häufig einchecken, um zu sehen, was Sie zu sagen haben. Vielen Dank, dass Sie die Klasse genommen haben. Ich kann es kaum erwarten, zu sehen, was du machst.
10. Mehr Kurse auf Skillshare: Art und Weise.