Pattern Library leicht gemacht?

A talk about how we created a simple but maintainable Web Pattern Library for immonet.de. (Language: German)

http://wudhh.de/rueckblick/rueckblick-2016/programm/pattern-library-leicht-gemacht

Transcript

1. PATTERN LIBRARY Leicht gemacht ? @jjchieferson
2. 2 Was ist ein Design Pattern? Eine bewährte Lösung für ein wiederkehrendes Problem @jjchieferson
3. 3 Warum muss das sein? @jjchieferson
4. 4 Kommunikation Regeln & Definitionen @jjchieferson
5. 5 Wer kennt… @jjchieferson
6. 6 @jjchieferson Quelle: Google Material Design
7. 7 @jjchieferson Quelle: MailChimp Pattern Library
8. 8 @jjchieferson Quelle: Lonely Planet – Rizzo
9. 9 @jjchieferson Quelle: GOV.UK – Government Digital Service
10. 10 Ziele der Immonet Pattern Library effiziente Prozesse responsive Webdesign konsistente Designsprache @jjchieferson
11. @jjchieferson 11 Be consistent, not uniform Quelle: https://www.gov.uk/design-principles Government Digital Service – Design Principles
12. 12 Lessons Learned „Henne-Ei-Problem“ Content wichtiger als Prozess Zu starker Fokus auf Entwicklung Pattern Library Usability „Maintenance is key“ @jjchieferson
13. @jjchieferson […] once your Style Guide falls out of sync with your application(s) it has entirely lost its purpose. Quelle: http://ianfeather.co.uk/a-maintainable-style-guide/ Ian Feather 13
14. 14 Wie entsteht ein Pattern? 1. Product Feature mit neuem Pattern 2. Feature Implementierung 3. Pattern abstrahieren 4. Pattern in Library anlegen & Beschreibung ergänzen 5. Pattern mit nächstem Feature verbessern @jjchieferson
15. 15 Pattern Must Have eindeutiger Name verständliche Struktur Pattern Visualisierung (Demo) @jjchieferson
16. 16 Pattern User Experience Kontext & Abhängigkeiten Best Practice & Research Erkenntnisse Community vs. Dokumentation @jjchieferson
17. 17 @jjchieferson Zwei Ansätze zur Living Pattern Library Automatisch Generieren simple Maintenance vs.
18. 18 DEMO Los geht’s… @jjchieferson
19. 19 Wo soll man nur anfangen? Produkt Design / Interface Inventory Basics definieren Essentielle Patterns anlegen Immer weiter machen… nie aufhören! @jjchieferson
20. 20 Meine Tipps Iteratives Vorgehen Share your Best Practices Community vs. Dokumentation Eigene Erfahrungen machen @jjchieferson
21. DANKE Jan Kiekeben User Experiece Design - Immonet GmbH @jjchieferson @jjchieferson