![\"Programmieren](\"https:\/\/www.centigrade.de\/wordpress\/wp-content\/uploads\/Programmieren-und-Phtoshop.jpg\")
<\/p>\n<\/p>\n
Gerade in der UX Branche entstehen oft neue Fachbereiche. Fachbereiche, bei denen Mitarbeiter mit verschiedenen Skills notwendig sind und als Schnittstelle zu anderen Fachbereichen ihre St\u00e4rken voll auspielen k\u00f6nnen. \u201eHybride\u201c, Menschen die zwei oder ggf. sogar mehrere Dinge k\u00f6nnen oder sich zumindest f\u00fcr mehrere interessieren. Designer die programmieren k\u00f6nnen, Autoren die designen k\u00f6nnen, Analysten die programmieren k\u00f6nnen.<\/p>\n
<\/p>\n
Man k\u00f6nnte jetzt meinen, welches Unternehmen m\u00f6chte so unentschlossene Mitarbeiter haben oder diese sogar f\u00f6rdern. Ganz schnell werden sie als \u201edie k\u00f6nnen alles, aber nichts richtig\u201c, abgestempelt. Die Vorteile sind jedoch nicht von der Hand zu weisen: Hybride sind gro\u00dfartig an Schnittstellen oder in kleinen Projektteams, wo jeder mehrere Aufgaben \u00fcbernehmen muss. Gleichzeitig k\u00f6nnen Hybride aber auch extrem anstrengend sein, da sie durch Ihr Wissen aus verschiedenen Themengebieten in jedem<\/strong> Fachbereich \u201eSchw\u00e4chen und Probleme\u201c aufdecken und damit allen unglaublich auf die Nerven gehen k\u00f6nnen.<\/p>\n W\u00e4hrend sich die Konzepter beispielsweise noch mit User Needs<\/strong>, Personas<\/strong> und Szenarios <\/strong>besch\u00e4ftigen und die Entwicklung noch gar nicht im Boot ist, macht ein Designer mit Coding-Background sich schon Gedanken darum, wie das Ganze letztendlich umgesetzt werden kann und schmei\u00dft den Konzeptern schon Steine in den Weg, bevor sie \u00fcberhaupt loslaufen k\u00f6nnen. \u201eWie wird das denn mit dem Keyboard bedient?\u201c, \u201eDie Animationen werden aber nervig in der Umsetzung\u201c, \u201eDie Tabellencontrol funktioniert in anderen Kontexten nicht, wir m\u00fcssen modularer denken\u201c etc.<\/p>\n Ein Entwickler mit Design Background f\u00e4hrt in der Entwicklung vielleicht dem Designer in die Parade. W\u00e4hrend der Designer sich individuelle Farbsemantiken f\u00fcr Zust\u00e4nde und einzelne Bereiche ausdenkt, versucht der Code-Design-Hybrid s\u00e4mtliche Designprobleme mit SCSS Mixins<\/a> zu l\u00f6sen. Gleichzeitig versucht er, dem Designer zu erkl\u00e4ren, warum zu viel Individualit\u00e4t die Wartbarkeit des Codes erschwert, anstatt eine gute L\u00f6sung zu finden das Design m\u00f6glichst pixelgetreu umzusetzen.<\/p>\n Hybriden k\u00f6nnen dazu neigen, \u00fcberall mitreden zu wollen. Und da es einfacher ist Probleme zu finden als sie zu l\u00f6sen, neigen sie auch dazu allen Fachbereichen Probleme zu \u201emachen\u201c.<\/p>\n Wiederum gern gesehen, zumindest aus Unternehmersicht, sind Hybride, die nicht nur \u00fcberall Probleme sehen, sondern diese Probleme auch l\u00f6sen k\u00f6nnen. Denn auch wenn sie eben keine \u201eSpecialists\u201c sind und bei tiefgreifenden Problemen l\u00e4nger brauchen, k\u00f6nnen Sie vor allem schnell oberfl\u00e4chliche Probleme direkt selbst l\u00f6sen und in Kommunikation<\/strong> und Ablauf<\/strong> zwischen den einzelnen Fachbereichen<\/strong> unterst\u00fctzen. Besonders wenn es um Themen der Spezifikation geht, wie z. B. Dokumentation, Styleguides, UI-Kits oder ganzen Design Systemen. Ein Designer, der sich in Entwickler hineinversetzen kann, wird es jedenfalls einfacher haben die Sprache der Entwickler zu verstehen.<\/p>\n Aus Entwicklersicht versuchen wir immer Designs so pixelgenau wie m\u00f6glich umzusetzen. Gleichzeitig wollen wir aber auch Designer m\u00f6glichst wenig kreativ einschr\u00e4nken (zumindest in den Anfangsphasen eines Projektes). Das f\u00fchrt oft dazu, dass z.B. Abst\u00e4nde, Schriftgr\u00f6\u00dfen, Farben etc. innerhalb eines Screens sinnvoll genutzt werden, aber innerhalb des CSS-Frameworks (wie z. B. Bootstrap) das Ganze Probleme verursacht. W\u00e4hrend der Designer Abst\u00e4nde und Gr\u00f6\u00dfen immer \u201efrei\u201c w\u00e4hlen kann, macht es in Bootstrap mehr Sinn mit den vorgegebenen Klassen zu arbeiten. W\u00e4hrend ein aufmerksamer Entwickler vermutlich eigene Klassen anlegen w\u00fcrde, um mit Bootstrap das Design m\u00f6glichst pixelgetreu abzubilden, kann der Entwickler mit Design-Background entsprechend das Designs \u201eableiten\u201c um konsistent mit den Gegebenheiten des Frameworks alles trotzdem abbilden zu k\u00f6nnen. Auch wenn hier und da nicht mehr alles 100 % pixelgenau ist, sollte es konsistent bleiben. Letztendlich ist wartbarer und schnell produzierter Code genauso wichtig wie gutes Design.<\/p>\n Mir als Designer, der ein wenig Coding-Background hat, fallen mir Inkonsistenzen in meinen eigenen Designs schnell auf. Tools wie Sketch<\/a> oder Figma<\/a> helfen dabei ungemein m\u00f6glichst \u201emodular\u201c zu arbeiten. Mit Symbolen und Styles k\u00f6nnen flexible und wiederverwendbare \u201eKomponenten\u201c erstellt werden, die den Arbeitsablauf deutlich beschleunigen und das Design konsistenter machen.<\/p>\n Auch Wireframes m\u00fcssen nicht zwangsweise ein festes Layout vorgeben oder genaue Komponenten. Solange Interaktionsm\u00f6glichkeiten ersichtlich sind, kann sich ein Designer mit einem guten Verst\u00e4ndnis von User Experience, Standards und Interaktionsdesign kreativ austoben und wird zu einem guten Ergebnis kommen, auch ohne besonders detaillierte Wireframes als Basis zu nutzen.<\/p>\n Anwenden von Framework Standards setzen auch eine gewisse Entwicklern\u00e4he voraus. Wenn ich z. B. zu Beginn des Projektes wei\u00df, mit welchem Framework die letztendliche Front-End-Entwicklung durchgef\u00fchrt wird, habe ich als Designer direkt eine Dokumentation der verf\u00fcgbaren UI-Komponenten. Ich muss mir als Designer eben nicht \u201ealles\u201c selber ausdenken, sondern kann mich auf die Standards des Frameworks beziehen. Scrollt das Kalenderwidget oder bl\u00e4ttere ich durch die Monate? Filtert das Standardgrid im Header der Tabelle oder au\u00dferhalb der Tabelle? Werden Spalten \u00fcber ein<\/strong> dediziertes Menu ein-\/ ausgeblendet oder wird ein Kontextmenu o. \u00c4. benutzt.<\/p>\n Das hei\u00dft nat\u00fcrlich nicht im Umkehrschluss, dass es keine Customization geben darf und alles nur noch \u201eStandard\u201c ist, aber viele Designentscheidungen sind leider nicht wichtig genug, um einen Haufen von Customcontrols oder hohe Entwicklungsaufw\u00e4nde zu rechtfertigen.<\/p>\n Durch die Arbeit mit verschiedenen Front-End-Frameworks geht mir das Schreiben von Dokumentationen (Patternguides, Styleguides, UI-Kits etc.) auch deutlich leichter von der Hand. Gerade in den hei\u00dfen Phasen wo m\u00f6glichst schnell geliefert werden muss, wei\u00df ich, dass Entwickler z. B. keine \u201eausgereifte\u201c Button Dokumentation brauchen. S\u00e4tze wie \u201eButtons are used to trigger actions\u201d oder \u201cThe Buttons provide a clickable UI functionality with arbitrary content.\u201d sind an dieser Stelle nicht zielf\u00fchrend. Front-End-Entwickler wissen in der Regel was ein Button oder Dropdown ist und wof\u00fcr es benutzt wird. Wichtiger ist dann z. B. die Unterscheidung zwischen Links (Navigation) und Buttons (Aktion), also die \u201eimpliziteren\u201c Verhaltensregeln der Controls, als deren funktionale Beschreibung.<\/p>\n Die Welt braucht Hybriden! UI-Entwicklung ist an sich schon ein sehr spezieller Bereich, da hilft es ungemein ein paar Mitarbeiter zu haben, die sich nicht noch<\/strong> weiter spezialisieren.<\/p>\n Klar die Welt braucht weiterhin Experten in eigenen Bereichen. Kaum ein Entwickler wird Interesse daran haben eine Kernkompetenz in Typographie und Nutzerinterviews aufzubauen, aber Entwickler mit einem gewissen Ma\u00df an Sympathie f\u00fcr den Nutzer helfen ungemein.<\/p>\n Wir (Designer) denken mittlerweile immer an Nutzer, aber wir vergessen dabei gerne, dass wir nicht nur f\u00fcr die Endbenutzer arbeiten, die hinterher das Produkt sehen, sondern das dazwischen noch ein kompletter Fachbereich sitzt, der die Designs erstmal programmieren muss. Ich pl\u00e4diere also daf\u00fcr, dass Designer auch Entwickler als relevanten Nutzergruppe ansehen und nicht nur einfordern, dass sie mit ihrer Codingmagie die Designvision umsetzen.<\/p>\n","protected":false},"author":31,"featured_media":0,"template":"","tags":[618,619,517,617],"class_list":["post-9947","blog","type-blog","status-publish","hentry","tag-hybrid","tag-specialist","tag-ui-design","tag-ux-engineering"],"acf":[],"_links":{"self":[{"href":"https:\/\/www.centigrade.de\/de\/wp-json\/wp\/v2\/blog\/9947","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.centigrade.de\/de\/wp-json\/wp\/v2\/blog"}],"about":[{"href":"https:\/\/www.centigrade.de\/de\/wp-json\/wp\/v2\/types\/blog"}],"author":[{"embeddable":true,"href":"https:\/\/www.centigrade.de\/de\/wp-json\/wp\/v2\/users\/31"}],"version-history":[{"count":0,"href":"https:\/\/www.centigrade.de\/de\/wp-json\/wp\/v2\/blog\/9947\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.centigrade.de\/de\/wp-json\/wp\/v2\/media?parent=9947"}],"wp:term":[{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.centigrade.de\/de\/wp-json\/wp\/v2\/tags?post=9947"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}Fluch und Segen<\/h2>\n
![\"Cat](\"https:\/\/www.centigrade.de\/wordpress\/wp-content\/uploads\/2-2.jpg\")
<\/p>\nDer Alltag eines Hybriden<\/h2>\n
![\"Farbpaletten\"](\"https:\/\/www.centigrade.de\/wordpress\/wp-content\/uploads\/Farbpaletten.jpg\")
<\/p>\nFazit<\/h2>\n