{"id":3447,"date":"2012-12-20T12:11:05","date_gmt":"2012-12-20T10:11:05","guid":{"rendered":"http:\/\/www.centigrade.de\/blog\/en\/?p=3447"},"modified":"2021-01-07T14:02:21","modified_gmt":"2021-01-07T13:02:21","slug":"form-follows-function-ein-missverstaendlicher-gestaltungsleitsatz","status":"publish","type":"blog","link":"https:\/\/www.centigrade.de\/de\/blog\/form-follows-function-ein-missverstaendlicher-gestaltungsleitsatz\/","title":{"rendered":"\u201cForm Follows Function\u201d \u2013 Ein missverst\u00e4ndlicher Gestaltungsleitsatz"},"content":{"rendered":"

Einleitung<\/h2>\n

„Form Follows Function (FFF)“ (Die Form folgt aus der Funktion) \u2013 Drei W\u00f6rter, \u00fcber die man stundenlang nachdenken kann und f\u00fcr deren Erkl\u00e4rung dann doch einige W\u00f6rter mehr n\u00f6tig sind. Denn es handelt sich hierbei um einen h\u00e4ufig missverstandenen Gestaltungsleitsatz.<\/p>\n

Kommunikationsziel<\/h3>\n

In meinem Blog-Artikel m\u00f6chte ich erl\u00e4utern, welche Missverst\u00e4ndnisse in Bezug auf FFF bestehen und welche Bedeutung der Gestaltungsleitsatz f\u00fcr die Arbeit von Designern hat.<\/p>\n

Kurzer geschichtlicher Abriss<\/h2>\n

FFF wurde erstmals von dem amerikanischen Bildhauer Horatio Greenough im Jahre 1852 erw\u00e4hnt1<\/sup>. Dennoch wird FFF meist mit dem Architekten Louis Sullivan in Verbindung gebracht, der in seinem Aufsatz \u201eThe tall office building artistically considered\u201c<\/a> im Jahr 1896 schreibt: „[…] dass die Form immer der Funktion folgt“1<\/sup>. Der Leitsatz ist also inzwischen \u00fcber 150 Jahre alt und hat dennoch in der heutigen Welt der digitalen Medien nicht an Aktualit\u00e4t verloren.<\/p>\n

Definition<\/h2>\n

Funktion<\/h3>\n

„Funktion“ leitet sich aus dem lateinischen „functio“<\/a> ab und bedeutet im urspr\u00fcnglichen Sinn „Verrichtung“2<\/sup>. Die Frage nach der Funktion zielt auf den Zweck ab, wof\u00fcr etwas verwendet werden kann. Der Begriff Funktion kann jedoch aus unterschiedlichen Perspektiven betrachtet werden. Ein Usability-Experte wird tendenziell an Funktionen denken, die dazu dienen ein Ziel effizient zu erreichen. Sullivan ber\u00fccksichtigt bei seinen vielen Beispielen aus der Natur nicht nur diese Interpretation von Funktion<\/a>. Er legt den Begriff „Funktion“ viel umfassender aus3<\/sup>.<\/p>\n

Form<\/h3>\n

„Form“ kann mit dem Begriff \u00c4sthetik gleichgesetzt werden. \u00c4sthetik leitet sich aus dem griechischen Wort „aisthesis“<\/a> ab und bedeutet „Wahrnehmung“ und „Empfindung“4<\/sup>. Bei der \u00c4sthetik geht es also darum, wie wir die Welt mit unseren f\u00fcnf Sinnen wahrnehmen und interpretieren. Somit bedeutet die Aussage „das ist \u00e4sthetisch“ nicht „das sieht sch\u00f6n aus“. Denn bei \u00c4sthetik<\/a> geht es nicht nur um den visuellen Teil unserer Wahrnehmung5<\/sup>.<\/p>\n

Gr\u00fcnde f\u00fcr Missverst\u00e4ndnisse<\/h2>\n

Gerade weil der Ursprung von FFF schon sehr alt ist, kommt es zu einigen Missverst\u00e4ndnissen. Zudem bezog sich FFF urspr\u00fcnglich auf die Architektur<\/a>, weshalb beim \u00dcbertragen auf den Bereich der digitalen Medien Fehler passieren k\u00f6nnen.
\nDie Einfachheit von FFF ist Fluch und Segen zugleich. Einerseits ist es eine einpr\u00e4gsame Alliteration. Andererseits handelt es sich um eine komplexe Thematik, die durch den vereinfachten Ausspruch nicht umfangreich kommuniziert werden kann.<\/p>\n

Missverst\u00e4ndnisse<\/h2>\n

Nun aber zu den zahlreichen Missverst\u00e4ndnissen, die mit FFF verbunden sind:<\/p>\n

Erstes Missverst\u00e4ndnis: Die Funktion ist wichtiger als die Form<\/h3>\n

Sch\u00f6nheit geht \u00fcber die reine Dekoration hinaus. Vielmehr bringt Sch\u00f6nheit weitere Vorteile mit sich, welche ich nachfolgend erl\u00e4utern m\u00f6chte:<\/p>\n

\u00c4sthetik kommuniziert Eigenschaften<\/h3>\n

\u00c4sthetische Aspekte, also Aussehen, Haptik, Geruch, Ger\u00e4usch und Geschmack eines Objekts geben Aufschluss \u00fcber dessen Funktionsweise. Daher k\u00f6nnen \u00e4sthetische Mittel nicht nur dazu benutzt werden ein Objekt sch\u00f6n aussehen zu lassen, sondern auch um zu erkl\u00e4ren, um was es sich dabei handelt bzw. was damit getan werden kann.<\/p>\n

\u00c4sthetik beeinflusst Bewertung der Usability<\/h3>\n
\"\"<\/a>

Urheber: Gexon; Quelle: flickr<\/p><\/div>\n

Das Erscheinungsbild einer fremden Person ist beispielsweise anfangs die einzige Bewertungsgrundlage, da noch keine anderen Informationen bekannt sind. Das Aussehen der Person beeinflusst ma\u00dfgeblich die Einsch\u00e4tzung unbekannter Eigenschaften. Dieses Ph\u00e4nomen wird als so genannter Halo-Effekt bezeichnet. Eine attraktive Person wird kompetenter als eine weniger attraktive Person eingesch\u00e4tzt.
\nIn zahlreichen Studien wurde untersucht, ob der Halo-Effekt auch die Bewertung von Interfaces beeinflusst. Der Vergleich der Studien zeigt, dass es hierzu kein eindeutiges Ergebnis gibt6<\/sup>. Doch es ist stark davon auszugehen, dass Nutzer aufgrund des Halo-Effekts gut aussehende Interfaces vor der Interaktion f\u00fcr besser bedienbar halten als schlecht aussehende Interfaces7<\/sup>. Diese Einsch\u00e4tzung findet statt, obwohl die M\u00f6glichkeit besteht, dass das schlecht aussehende Interface besser bedienbar ist als das gut aussehende Interface.
\nOb die Einsch\u00e4tzung nach der Interaktion genauso positiv ist, h\u00e4ngt von der tats\u00e4chlichen Usability<\/a> ab. Falls es sich um eine schlechte Usability handelt, wird die anfangs positive Bewertung des Aussehens durch den Nutzer wieder herabgestuft6<\/sup>.<\/p>\n

\u00c4sthetik beeinflusst Emotionen<\/h3>\n

Usability-Experte Don Norman erkl\u00e4rt in seinem Artikel „Emotion & Design – Attractive things work better“<\/a>, dass \u00c4sthetik eine wichtige Rolle f\u00fcr die Bedienbarkeit eines interaktiven Systems spielt: alles Visuelle spricht unsere Emotionen (affektives System) an. Von unseren Emotionen wiederum h\u00e4ngt ab, wie wir Probleme l\u00f6sen und Aufgaben ausf\u00fchren. Dies bedeutet, dass unser emotionaler Zustand bei der Interaktion mit einem Interface beeinflusst, wie gut wir mit diesem Interface interagieren k\u00f6nnen. Wenn eine Person in einem negativen emotionalen Zustand ist, dann sind deren Gedanken extrem eingeengt. Dies schr\u00e4nkt eine Person dabei ein, ein Problem zu l\u00f6sen. Ein positiver emotionaler Zustand erm\u00f6glicht der Person mit viel Kreativit\u00e4t an die Probleml\u00f6sung heranzugehen. In diesem Zustand wird die Person ein angenehmeres Bedienerlebnis haben und die Usability<\/a> des Interfaces positiv beurteilen8<\/sup>.<\/p>\n

Ornamente sind nicht zwangsl\u00e4ufig \u00fcberfl\u00fcssig<\/h3>\n

FFF verbietet visuelle Elemente, die keine Funktion kommunizieren. Daher liegt die Vermutung nahe, dass FFF Skeumorphismus verbietet. Ein „Skeuomorph“ ist ein Merkmal, das eine Objekt von dessen altem Vorl\u00e4ufer „vererbt“ bekommen hat. Ein Beispiel hierf\u00fcr ist der Motor eines Elektroautos: dieser ist urspr\u00fcnglich ger\u00e4uschlos. Einige Elektroautos erhalten aber als „Skeuomorph“ das Ger\u00e4usch eines benzinbetriebenen Autos. Obwohl das k\u00fcnstlich hinzugef\u00fcgte Ger\u00e4usch scheinbar \u00fcberfl\u00fcssig ist, macht es bei genauerer \u00dcberlegungen einen Sinn: es f\u00fchrt dazu, dass Fu\u00dfg\u00e4nger Elektroautos besser wahrnehmen, weil sie es h\u00f6ren.<\/p>\n

Der Stilrichtung wird oft vorgeworfen, dass damit \u00fcberfl\u00fcssige ornamentale Elemente einhergehen. Falls man Skeuomorphismus jedoch richtig umsetzt, dienen dessen Stilmittel der Funktion ein Interface unerfahrenen Nutzern verst\u00e4ndlicher zu machen, indem an Objekte und Konzepte aus der realen Welt erinnert wird.<\/p>\n

Fazit<\/h3>\n

Aus den genannten Gr\u00fcnden sollte die Form nicht untersch\u00e4tzt, sondern auf gleicher Ebene mit Funktion betrachtet werden. FFF darf nicht daf\u00fcr missbraucht werden, \u00e4sthetisch minderwertige und damit rein funktionale Interfaces zu rechtfertigen.<\/p>\n

Zweites Missverst\u00e4ndnis: Es gibt nur eine Funktion<\/h3>\n

Fast jedes Produkt erf\u00fcllt mehrere Funktionen. Selbst ein L\u00f6ffel erf\u00fcllt nicht nur die Hauptfunktion der Nahrungsaufnahme. Eine weitere Funktion des L\u00f6ffels kann darin bestehen, dass dieser positive Erinnerungen in einem hervor ruft, weil es ein Erbst\u00fcck der Gro\u00dfeltern ist. Oder es handelt sich um einen besonders teuren L\u00f6ffel, weshalb man ihn benutzt um anderen seinen eigenen Reichtum zu zeigen9<\/sup>.
\nEs gibt also nicht nur Funktionen, die der N\u00fctzlichkeit dienen<\/a>. Funktionen k\u00f6nnen auch von sozialen, kulturellen, historischen, religi\u00f6sen und wirtschaftlichen Faktoren abh\u00e4ngen9<\/sup>. Zum Beispiel kauft man ein Produkt nicht immer nur deshalb, weil es n\u00fctzlich ist. Der Grund f\u00fcr den Kauf kann auch sein, dass es bestimmte Bed\u00fcrfnisse erf\u00fcllen soll, wie etwa anderen den eigenen sozialen Status oder die Zugeh\u00f6rigkeit zu einer bestimmten Religion zu zeigen10<\/sup>.<\/p>\n

Da es also viele verschiedene Funktionen geben kann, steht immer die Frage im Vordergrund was die wichtigste Funktion ist, die durch die Form kommuniziert werden soll.<\/p>\n

Drittes Missverst\u00e4ndnis: F\u00fcr ein und dieselbe Funktion gibt es nur eine Form<\/h3>\n

Da die Form von der Funktion abh\u00e4ngt, liegt die Vermutung nahe, dass es f\u00fcr eine spezielle Funktion auch nur eine spezielle Form gibt. Dies ist jedoch nicht der Fall. Wie beim zweiten Missverst\u00e4ndnis beschrieben gibt es sehr viele Faktoren wie etwa kulturelle Faktoren, die zu einer hohen Varianz f\u00fchren: F\u00fcr die Funktion Essen aufzunehmen wurden Messer und Gabel aber auch St\u00e4bchen entwickelt. Der kulturelle Einfluss hat also auch eine gewichtige Rolle gespielt und letztendlich zu unterschiedlichen Formen f\u00fcr ein und dieselbe Funktion gef\u00fchrt.<\/p>\n

Bedeutung f\u00fcr die t\u00e4gliche Arbeit von Designern<\/h3>\n

Da nun also alle Missverst\u00e4ndnisse ausger\u00e4umt sind, kann ich n\u00e4her darauf eingehen, was es bedeutet, mit FFF als Grundsatz zu gestalten.
\nEs ist wichtig eine Hauptfunktion festzulegen, weil es viele verschiedene Funktionen gibt, die ein Produkt erf\u00fcllen kann. Nur durch das Fokussieren kann wiederum gute Usability<\/a> entstehen.
\nApple versteht es sehr gut die Hauptfunktion zu identifizieren und dieser bis in allerletzter Konsequenz nachzugehen. Das macht den Erfolg von Apple aus. Die Hauptfunktion des iPads ist das Konsumieren von Medien, nicht die produktive Arbeit. Nur durch diese Konzentration auf die Hauptfunktion ist die Einfachheit und der Erfolg des iPads zu erkl\u00e4ren.
\nWenn die Hauptfunktion eines Produkts feststeht, sollte man als Designer alles daran setzen, diese mit visuellen Mitteln zu kommunizieren. Dies impliziert, dass zuerst die Hauptfunktion feststehen muss, bevor eine Form daf\u00fcr entwickelt werden kann. Daher ist die einzig seri\u00f6se Vorgehensweise im Designprozess, zuerst Methoden des Usability Engineering anzuwenden und erst danach mit dem Visual Design zu beginnen.
\nDas genannte Prinzip kann ich auch auf meinen Blog-Artikel anwenden. Zuerst muss ich mir im Klaren sein, was die Funktion dieses Artikel sein soll. Die Funktion kann in diesem Fall mit dem Kommunikationsziel gleichgesetzt werden. Steht einmal das Kommunikationsziel fest, dann m\u00fcssen alle Beispiele, textuelle Beschreibungen und Abbildung dieses Ziel unterst\u00fctzen.<\/p>\n

Beispiele: Hauptfunktion visuell kommunizieren<\/h3>\n

Alles Visuelle dient einem Ziel: die Hauptfunktion deutlich herauszustellen. Ich bin der Meinung, dass man statt der Formulierung „form follows function“ besser die Formulierung „aesthetics communicates main function“ verwenden sollte. Letztere Formulierung kann man sich zwar weniger gut merken, dennoch k\u00f6nnte diese einige Missverst\u00e4ndnisse aus der Welt schaffen.<\/p>\n

Die „Magic Mouse<\/a>“ von Apple erf\u00fcllt nicht die Funktion, dass man auf angenehme Art und Weise mit ihr arbeiten kann, wenn es um die traditionelle Mausbedienung geht. Denn aufgrund der sehr abgeflachten Form, liegt die Maus nicht gut in der Hand und weist daher aus ergonomischen Gesichtspunkten deutliche Schw\u00e4chen auf. Doch Apple hat eine andere Funktion als wichtiger empfunden, n\u00e4mlich dass der Nutzer Touchgesten auf der Maus ausf\u00fchren kann. Aus dieser Hauptfunktion hat sich letztendlich die abgeflachte Form abgeleitet.
\nFarben dienen nicht nur der reinen Dekoration. Sie transportieren kulturabh\u00e4ngig eine bestimmte Bedeutung.<\/p>\n

Farben k\u00f6nnen dazu genutzt werden, dem Nutzer die Interpretation einer Funktion zu erleichtern. Beispielsweise bietet sich es an bei einem Dialogfenster, das vor etwas warnen oder einen Fehler anzeigen soll, die Farbe Rot zu verwenden.<\/p>\n

Ein weiteres beliebtes Mittel um die Bedeutung von Funktionen zu erkl\u00e4ren sind visuelle Metaphern<\/a>. Das bekannteste Beispiel hierf\u00fcr ist die Schreibtischmetapher, die festes Bestandteil von Betriebssystemen wie Windows und OSX ist. Dort gibt es einen virtuellen Schreibtisch. Auf diesem gibt es Ordner und einen Papierkorb, da diese Elemente f\u00fcr einen realen Arbeitsplatz typisch sind. Somit kann der Nutzer ihm bekannte Konzepte aus der realen Welt in die virtuelle Welt \u00fcbertragen und verstehen.<\/p>\n

Der Fachbegriff „Affordance“ wird im Interaction Design dazu benutzt, um zu beschreiben, dass jedes Objekt einen Aufforderungscharakter haben sollte. Wenn der Aufforderungscharakter visuell gut kommuniziert wird, wei\u00df der Nutzer was er mit dem Objekt machen kann.<\/p>\n

\"\"<\/a>

Urheber: Alan Levine; Quelle: flickr<\/p><\/div>\n

Das Thema Affordance<\/a> kann gut am Beispiel von T\u00fcren erkl\u00e4rt werden, die sich nur in eine Richtung \u00f6ffnen lassen11<\/sup>. Wenn sich die T\u00fcr nur durch Dr\u00fccken \u00f6ffnen l\u00e4sst, sollte kein Griff daran vorhanden sein. Dann gibt es ganz klar auch f\u00fcr den Nutzer nur die M\u00f6glichkeit, die T\u00fcr zu dr\u00fccken. Wenn ein Griff vorhanden ist, dann kann es sein, dass man die T\u00fcr dr\u00fccken oder ziehen kann. Wenn sich durch die Form des Griffs aber nicht R\u00fcckschl\u00fcsse auf dessen Funktion ziehen lassen, dann liegt eine schlechte Affordance vor und der Griff wurde nicht nach dem FFF-Grundsatz gestaltet.<\/p>\n

Negativbeispiel: Form wurde falsch aus der Hauptfunktion abgeleitet<\/h4>\n
\"\"<\/a>

Urheber: Miles Goodhew; Quelle: flickr<\/p><\/div>\n

Wenn die Form falsch aus der Hauptfunktion abgeleitet wird, kann sich dies sehr nachteilig auswirken. Ein sehr scharfes Messer, das aufgrund seiner Farbe ausschaut wie ein Kinderspielzeug ist ein Beispiel hierf\u00fcr. Die Farbe kommuniziert nicht die Gef\u00e4hrlichkeit des Messers, da sie falsche R\u00fcckschl\u00fcsse auf das Material zul\u00e4sst: das Material schaut aus wie Plastik, es handelt sich aber in Wirklichkeit um Edelstahl. Infolge dessen besteht die Gefahr, dass der Nutzer \u2013 oder im schlimmsten Falle das Kind \u2013 unachtsam damit umgeht und sich schneidet.<\/p>\n

Balance<\/h4>\n

Was ist nun wichtiger? Die Form oder die Funktion? Diese Frage ist irrelevant. Erst durch die gut ausbalancierte Kombination von Form und Funktion erreichen Interfaces ihre wahre St\u00e4rke: „Good design means that beauty and usability are in balance.“<\/a> (Don Norman)8<\/sup>.<\/p>\n

Nachfolgend m\u00f6chte ich erl\u00e4utern, welche negativen Auswirkungen sich ergeben, wenn Form und Funktion unausbalanciert sind:<\/p>\n

Wenn die Form \u00fcberwiegt<\/h3>\n
\"\"<\/a>

Urheber: Jimee, Jackie, Tom & Asha; Quelle: flickr<\/p><\/div>\n

\n

Kunst ist ein typisches Beispiel f\u00fcr ein starkes \u00dcbergewicht der Form. Die Funktion r\u00fcckt meist stark oder komplett in den Hintergrund. Daher fragt man sich auch oft als Betrachter: „Was will der K\u00fcnstler mir damit sagen?“. In der Kunst mag diese Frage gewollt sein, doch im Design darf diese niemals aufkommen. Die weit verbreitete Meinung, dass die Begriffe „Kunst“ und „Design“ Synonyme sind, ist daher falsch! Ein Designer ist kein reiner „Sch\u00f6nmacher“. \u00c4sthetik ist nur ein Teilbereich von Design.<\/p>\n<\/div>\n

 <\/p>\n

<\/h3>\n

<\/h3>\n

<\/h3>\n

<\/h3>\n

<\/h3>\n

<\/h3>\n

<\/h3>\n

Wenn die Funktion \u00fcberwiegt<\/h3>\n

Ein starkes \u00dcbergewicht der Funktion f\u00fchrt zu Langeweile. Wenn die Form unterrepr\u00e4sentiert ist, dann ist die wichtige Komponente Emotionalit\u00e4t kaum vorhanden.
\nDadurch erkl\u00e4rt sich auch, dass man als Usability Ingenieur allein mit Wireframes Kunden nur schwer von einem Konzept \u00fcberzeugen kann.<\/p>\n

Beispiel: Kaufentscheidung<\/h3>\n

Ein weiteres Beispiel sind Produkte die funktional einwandfrei sind, aber \u00e4sthetisch nicht \u00fcberzeugen. Diese werden sich nur schlecht verkaufen. Der Grund hierf\u00fcr kann sein, dass aufgrund der unterrepr\u00e4sentierten Form nicht klar ist, wie gut und auf welche Weise das Produkt funktioniert. Des Weiteren besteht die M\u00f6glichkeit, dass das schlecht aussehende Produkt negative Emotionen beim Nutzer ausl\u00f6st oder er vermutet, dass die Bedienung des Produkts keinen Spa\u00df machen wird. Emotionen beeinflussen Entscheidungen<\/a> ma\u00dfgeblich5<\/sup>.<\/p>\n

Rein funktionale Angaben \u00fcber ein Produkt, wie etwa Hardware Spezifikationen, interessiert potentielle K\u00e4ufer oft nicht in erster Linie. Letztendlich kommt es eher darauf an welche Emotionen das Produkt ausl\u00f6st: „Electronics should always be reviewed from the user experience point of view, not the technology point of view\u2026 yet no one does that.“<\/a> (Dustin Curtis) 12<\/sup><\/p>\n

So erkl\u00e4ren sich auch Produktversprechen von Apple wie etwa f\u00fcr den iPod Touch: „Entwickelt f\u00fcr maximalisierten Spa\u00df.“13<\/sup><\/p>\n

Fazit<\/h2>\n

FFF hei\u00dft, dass Form und Funktion ausbalanciert sein m\u00fcssen. Es hei\u00dft auch, dass die Form immer die Hauptfunktion richtig kommunizieren muss.
\nF\u00fcr den Bereich Interface Design bedeutet dies, dass \u00c4sthetik und Usability<\/a> gleichbedeutend sind und sich gegenseitig beeinflussen: ein sch\u00f6nes Interface verbessert die wahrgenommene und tats\u00e4chliche Usability. Visuell schlecht kommunizierte Funktionen wirken sich erheblich negativ auf die Usability aus. Und eine gute Usability erh\u00f6ht die Toleranz f\u00fcr eine minderwertige \u00c4sthetik.
\nIm Idealfall wurde aber im Entwicklungsprozess gleich viel Wert auf Usability und \u00c4sthetik gelegt, wodurch das bestm\u00f6gliche Ergebnis f\u00fcr den Nutzer erzielt werden konnte. Dies ist auch die Ma\u00dfgabe und Philosophie f\u00fcr unsere allt\u00e4gliche Arbeit als User Interface Designer und Usability Engineers.<\/p>\n

Wenn Sie mehr \u00fcber unsere Arbeitsweise herausfinden oder uns beauftragen m\u00f6chten, werfen Sie doch einen Blick auf unsere Usability<\/a> und Design<\/a> Service Seiten.<\/p>\n

Quellen<\/h2>\n