GitHub bringt seine Zusammenarbeitskultur auf ein neues Level

Für die in diesem Beitrag erwähnten Funktionen ist ein Figma Organization-Abo erforderlich. Mehr erfahren.

Wo arbeiten Entwickler*innen an Software? Natürlich bei GitHub, wo mehr als 31 Millionen Entwickler auf der ganzen Welt zu Hause sind. Die 2008 gegründete und seit 2018 zu Microsoft gehörende Entwicklungsplattform GitHub ist der Ort, an dem Entwickler*innen sich weiterbilden, teilen und zusammenarbeiten, um fantastische Software zu programmieren.

Auf der Plattform können Entwickler leichter zusammenarbeiten, anspruchsvolle Probleme lösen und die wichtigsten Technologien der Welt entwickeln. Dies geschieht durch die Förderung einer kollaborativen Gemeinschaft, die als Einzelpersonen und in Teams zusammenkommt, um die Software der Zukunft zu entwickeln und die Welt zu verändern.

„GitHub hat eine großartige Zusammenarbeitskultur“, sagt Diana Mounter, Design Operations Manager bei GitHub. „Aber wir sind auch ein Remote-Unternehmen mit Designer*innen, Entwickler*innen, Produktmanager*innen und anderen Mitarbeiter*innen an vielen verschiedenen Standorten arbeiten. Wir brauchten eine Möglichkeit, Barrieren der Zusammenarbeit und Kreativität abzubauen, die entstehen können, wenn Kolleg*innen nicht im selben Raum sitzen.“

Ausbau des Design-Systems und des Teams, das es unterstützt

Als Mounter 2015 zu GitHub kam, hatte das Unternehmen noch keine Mitarbeiter*innen, die sich Vollzeit um ein Design-System kümmerten. „Designer*innen mussten immer wieder dasselbe neu erstellen, es fehlte an Dokumentation, die Muster waren veraltet und es gab noch andere Probleme, die die Leute im Alleingang zu lösen versuchten“, sagt Mounter. „Wir haben uns entschieden, unsere Prozesse von Grund auf mit einem Design-System und einem dokumentierten Workflow zu optimieren.“ Innerhalb von sechs Monaten nach Beginn der Aktivitäten wurde ein festes Team gebildet, dem neben Mounter noch eine weitere Person angehörte.

Das war damals. Heute besteht das Design-System-Team aus sieben Personen (von 25 im gesamten Produktdesignteam), die sich der Bereitstellung wiederverwendbarer, austauschbarer Komponenten widmen, um den Designprozess bei GitHub effizient, wiederholbar und skalierbar zu machen. „Design-Systeme haben sich zu einem Kernstück der Art und Weise entwickelt, wie wir bei GitHub designen und entwickeln“, erklärt Mounter in einem von ihr veröffentlichten Artikel.

Fehler im Design-Workflow beheben

Ein eigenes Team für den Aufbau und die Pflege des Design-Systems half zwar dabei, einige der Probleme bezüglich dessen Effizienz und Einheitlichkeit zu lösen, doch der Workflow für das System und die zur Unterstützung benötigten Tools hinderten das Team daran, effizient und gemeinsam an Kernkomponenten zu arbeiten.

„Unser Workflow beinhaltete einige mühsame Schritte. Mitwirkende, die Dinge wie Icons in unserer SVG-Symbolbibliothek weiterentwickeln oder aktualisieren wollten, fanden das einschränkend und verwirrend“, sagt Jon Rohan, Systemdesigner und Entwickler bei GitHub. „Die Leute mussten eine bestimmte Software installiert haben und sich mit bestimmten Tools auskennen, um etwas beitragen zu können.“

Um die Probleme bei der Aktualisierung der Icon-Bibliothek namens Octicons zu beheben, startete GitHub ein Experiment mit Figma. „Wir waren von Figma begeistert, weil wir als Teil des Workflows keine Software herunterladen und installieren mussten, um Icons zu aktualisieren“, so Mounter.

Für Rohan war es die Kombination aus Figma und der Figma-API, die es GitHub ermöglicht, ihre Beiträge so reibungslos wie möglich zu gestalten. „Durch die Migration von Octicons zu Figma und die Verwendung der Figma-API ließ sich der Workflow automatisieren. Jetzt können Mitarbeitende mit leistungsstarken, plattformunabhängigen Design-Tools zum Design-System beitragen, ohne dass eine komplexe Einrichtung nötig ist.“ Die ganze Geschichte über Octicons findest du im GitHub-Blog.

Als das Design-System-Team erkannte, wie Figma den Workflow des Teams verändern könnte, begann es, auch seine UI-Komponenten zu Figma zu migrieren. „Nahezu alles, was Designer*innen und Entwickler*innen von GitHub für ihre Arbeit brauchen, ist jetzt in Figma verfügbar“, sagt Mounter.

Ein „DesignHub“ für die Remote-Zusammenarbeit

Obwohl das Team schon immer unabhängig von bestimmten Tools arbeitete, verbreitete sich die Nutzung von Figma wie ein Lauffeuer. Die Tatsache, dass Figma webbasiert ist, ermöglichte es dem Team, die räumliche Trennung zu überwinden und auf sehr reale und effiziente Weise zusammenzuarbeiten.

„Wenn man in der Lage ist, mit anderen in die gleiche Datei zu gehen, schließt dies die Lücke, die dadurch entsteht, dass man sich nicht mit ihnen um ein Whiteboard herum versammeln kann“, sagt Mounter. „Figma hat für uns das Whiteboard ersetzt.“

Kathy Zheng, Senior Product Designer bei GitHub, kann dem nur zustimmen. „Seit ich bei GitHub bin, kann ich zum ersten Mal die Zusammenarbeit bei der Entwicklung miterleben und genieße alle Vorteile eines Teams, das räumlich zusammen ist. Und vielleicht macht es sogar mehr Spaß als Whiteboarding, weil man leistungsstarke Funktionen zur Hand hat.“

Für Zheng bringt Figma die Kreativität zurück in den Prozess. „Egal, wo du dich in deinem Designprozess befindest: Wie kannst du ein wenig experimentieren und etwas ganz Neues entdecken?“, fragt sie. „In dem Moment, als ich anfing, bei Design Jams mit anderen Designer*innen mit Figma-Dateien herumzuspielen, bekam ich das Gefühl zurück, dass wir einer Idee durch die gemeinsame Arbeit daran Substanz und Eigendynamik verleihen können.“

Heute benutzt Zheng Figma für „grundsätzlich alles rund um Storytelling“. Design ist Storytelling, und Prototyping erweckt eine Geschichte zum Leben. „Prototyping ist jetzt ein integraler Bestandteil meines Workflows, weil es so einfach ist“, sagt sie. „Ich kann schnell Dinge hin und her ziehen, um den Ablauf vorzuschlagen, für den ich designen möchte, ohne die Tools zu wechseln.“

Schnelleres Feedback für kürzere Bereitstellungszyklen

Designer*innen wie Zheng wissen es zu schätzen, wie Figma den Feedback-Zyklus verbessert und beschleunigt und so die Hürde für Nicht-Designer*innen senkt, mitzumachen. „Bei GitHub arbeiten wir immer eng mit unseren Projekt- und Entwicklungsteams zusammen“, sagt Zheng. „Je mehr wir die Entwickler*innen in unseren Feedback-Zyklus einbeziehen, desto besser ist das Ergebnis für alle Beteiligten und desto kürzer ist der gesamte Zyklus.“

Ash Guillaume, Grafikdesigner bei GitHub, stimmt dem zu. „Ich kann mein Design mit allen meinen Teammitgliedern direkt per Link teilen“, sagt er. „Sie können es in Figma öffnen und mir über das Kommentarsystem Feedback geben, wodurch der Feedback-Zyklus beschleunigt wird.“

Rohan vom Design-SystemTeam findet es wichtig, mehr als nur einen Screenshot zum Feedback zu teilen. „Die Leute können sich das tatsächliche Design ansehen, was für uns sehr wertvoll ist, weil wir inkrementell, früh und oft liefern und die Geschwindigkeit und Dynamik zur raschen Umsetzung von Änderungen entscheidend sind“, sagt er. „Viele Entwickler*innen lieben es, einen Figma-Link aufzurufen und Designs und Prototypen zu sehen.“

Den Erfolg zieht sich durch das gesamte Unternehmen

Wenn man Mounter nach dem Einfluss von Figma bei GitHub fragt, betont sie in erster Linie, inwiefern es dem Design-System-Team hilft. „Mit Figma ist es einfacher, unser Design-System zu aktualisieren“, sagt sie. „Ein weiteres Zeichen für den Erfolg ist meiner Meinung nach, dass immer mehr Entwickler*innen und Produktmanager*innen mitmachen und die Zusammenarbeit mit Designer*innen schätzen. Der ultimative Erfolg ist die Verbreitung von Figma in der gesamten GitHub-Organisation.“

Mit Figma können Designschaffende bei GitHub besser sehen, was zwischen dem Beginn einer Idee und dem fertigen Design passiert. Laut Mounter „gibt es weniger Hindernisse für den Zugang zu einem laufenden Projekt für Menschen außerhalb des Designteams, was bedeutet, dass mehr Menschen mitwirken können und mehr Innovation entsteht“.

Diese Zusammenarbeit ist der Kern dessen, worum es bei GitHub schon immer ging – etwas Außergewöhnliches zu schaffen, indem Einzelpersonen und Teams an einem Ort zusammenfinden.