Dezember 28, 2019

ökonomisch, praktisch, gut - ein Design-System

Der Vorteil einer kleinen Inhouse-IT-Abteilung ist: man kann schnell mal unkompliziert und unbürokratisch was hacken.

So fällt es mir zurzeit leicht, quasi nebenläufig für die konkreten Projekte, die wir uns auferlegen, das zugehörige Design System zu erweitern. Und so wächst und gedeiht es - und wird langsam erwachsen. Schön anschaulich präsentiert durch KSS.

design-system.phoenixreisen.net

Die Basis besteht zum Teil aus Open Source Lösungen, wie Tachyons, Animate.css, Fort Awesome, Swiper und anderen Bibliotheken. Darauf aufbauend kommen nun immer mehr spezifische Eigenentwicklungen dazu.

So lässt es sich ziemlich angenehm arbeiten. Das Design System selbst bleibt JS-Framework agnostisch. Allerdings gibt es für die meisten Komponenten auch immer eine JS-Komponente in einem extra Repo und auf npm veröffentlicht mit dazu.

Das Schöne ist: die Doku ist auf Netlify gehostet. Ich muss meine gemachten Änderungen nur in den master branch auf Github pushen, woraufhin das Deployment automatisch angestoßen und durchgeführt wird. Danach noch ein npm publish und die neue Version ist veröffentlicht.

Schön ist auch, dass man seine eigenen Entwicklungen damit auch für andere Projekte verwenden kann. So steckt das Design System zum Beispiel auch in wer-steht-wofuer.de.

Wer braucht schon Material Design oder Bootstrap, wenn er das Design System von Phoenix Reisen nehmen kann? ¯\_(ツ)_/¯