{"id":178,"date":"2023-06-12T12:00:48","date_gmt":"2023-06-12T11:00:48","guid":{"rendered":"http:\/\/demo.krownthemes.com\/koncept\/?p=136"},"modified":"2023-06-17T11:38:36","modified_gmt":"2023-06-17T10:38:36","slug":"atomic-design-2-0","status":"publish","type":"post","link":"https:\/\/thomas-sokolowski.com\/de\/atomic-design-2-0\/","title":{"rendered":"Atomic Design 2.0"},"content":{"rendered":"

[vc_row][vc_column][vc_column_text]<\/p>\n

Das Internet hat einen Paradigmenwechsel in der visuellen Kommunikation bewirkt.<\/p>\n

Das seit Jahrtausenden verwendete Strukturierungselement \u00abSeite<\/strong>\u00bb ist mit einem Schlag obsolet geworden. Audio-visuelle Medien, Overlays, Navigationssysteme anstelle von Inhaltsverzeichnissen, Scrollen, Swipen und Klicken statt Bl\u00e4ttern sind nur einige der kommunkativen Ver\u00e4nderungen.<\/p>\n

Aus dieser Tatsache heraus m\u00fcssen wir uns Gedanken dar\u00fcber machen, wie wir in Zukunft miteinander kommunizieren wollen und was die Arbeit von Designern sein wird. Designer werden flexiblere Vorgehensweisen entwickeln m\u00fcssen, indem sie sich auf modulare Systeme und verst\u00e4rkt auf Interaktionen mit den Nutzern ausrichten m\u00fcssen. Um in Zukunft in Millionen von Informationseinheiten sichtbar zu sein und vor allem seinen Kunden ein Nutzererlebnis zu bieten, das einen klaren Mehrwert gegen\u00fcber herk\u00f6mmlichen Ans\u00e4tzen bietet, m\u00fcssen in der Folge auch die Auftraggeber diesen Wandel verstehen und akzeptieren.<\/p>\n

[\/vc_column_text][\/vc_column][\/vc_row][vc_row][vc_column width=”1\/1″][vc_column_text]<\/p>\n

Atomic Design<\/h2>\n

[\/vc_column_text][vc_single_image image=”882″][\/vc_column][\/vc_row][vc_row][vc_column width=”1\/1″][vc_column_text]<\/p>\n

Im Sommer 2013 stellte der amerikanische Frontend-Designer Brad Frost seinen neuen Designansatz \u00abAtomic Design\u00bb (http:\/\/atomicdesign.bradfrost.com<\/a>) der \u00d6ffentlichkeit vor. Er basiert auf einem designwissenschaftlichen Ansatz, der besagt, dass ein funktionierendes, also gutes Design in all seinen Bestandteilen koh\u00e4rent und modular aufgebaut sein muss.<\/p>\n

Umgekehrt gilt<\/strong>: Zerlegt man eine Website in ihre kleinsten Einzelteile, werden alle Schwachstellen und Widerspr\u00fcche viel deutlicher sichtbar, als wenn man sie als Ganzes betrachtet.<\/p>\n

Im Prinzip ist dieser Ansatz gar nicht so neu. Viele Designer arbeiten schon lange modular. Seit der Art & Crafts-Bewegung und dem Bauhaus gibt es auch \u00e4hnliche designtheoretische \u00dcberlegungen und Postulate, aber in seiner einfachen Metaphorik und in der auf Websites fokussierten Anwendung, wie Brad Frost sein System beschreibt, ist Atomic Design sehr zeitgem\u00e4\u00df, plausibel und vor allem n\u00fctzlich.<\/p>\n

Die Analogie zur physischen Welt, in der Materie aus Atomen und Molek\u00fclen besteht, die wiederum Zellen und Organismen bilden, verleiht dem Modell seinen metaphorischen Reiz.<\/p>\n

Anstatt die Website selbst zu entwerfen, wird von einem \u00abAtomic Designer\u00bb ein Designsystem aufgebaut, das die Grundlage f\u00fcr die zu entwerfende Website bildet. Er beginnt also im Kleinen und arbeitet sich dann Schritt f\u00fcr Schritt zum Gro\u00dfen vor; iterative R\u00fcckschritte sind jederzeit m\u00f6glich und durchaus notwendig.<\/p>\n

Die Vorteile dieses Workflows liegen auf der Hand: Inkonsistenzen werden vermieden und das entstehende Design ist ein in sich stimmiges Ganzes. Au\u00dferdem ist ein atomares Design technisch einfacher umzusetzen, da HTML und CSS den gleichen modularen Prinzipien folgen.<\/p>\n

Im Atomic Design System von Brad Frost werden f\u00fcnf Komponenten unterschieden:<\/p>\n

Atome<\/h4>\n