Skip to content

Dev & UX/UI Process

Willkommen auf der Seite für Entwicklungs- und Designprozesse im Developer-Bereich des Mate Design Systems. Unser Ansatz integriert User Experience (UX) und User Interface (UI) Design eng in den Entwicklungsprozess, um sicherzustellen, dass unsere Produkte nicht nur technisch hochwertig, sondern auch benutzerfreundlich sind. Wir nutzen Figma als zentrales Tool für das Screendesign, um eine nahtlose Zusammenarbeit zwischen Designern und Entwicklern zu gewährleisten.

Nutzerzentriertes Design

Unser Prozess folgt den Prinzipien des nutzerzentrierten Designs, bei dem die Bedürfnisse und Rückmeldungen der Benutzer im Mittelpunkt stehen. Dieser Ansatz hilft uns, Produkte zu entwickeln, die wirklich auf die Anforderungen und Wünsche der Nutzer eingehen.

  • Design Übergabe in Figma: Nachdem die UX/UI-Designer die Screendesigns in Figma erstellt und optimiert haben, werden diese direkt an das Entwicklungsteam übergeben. Figma dient als Brücke zwischen Design und Entwicklung, wodurch eine klare und effiziente Kommunikation ermöglicht wird.

Figma Dev Mode

Figma bietet einen speziellen „Developer Mode“, der es Entwicklern ermöglicht, alle notwendigen Designspezifikationen wie Farben, Schriftarten, Abmessungen und Assets direkt einzusehen. Dieser Modus ist darauf ausgelegt, die technische Umsetzung zu erleichtern und sicherzustellen, dass die endgültigen Produkte genau den Designvorgaben entsprechen. In den meisten Fällen sollte dies aber nicht nötig sein, da die zur Verfügung gestellten Komponenten bereits über alle Mittel verfügen, um die Erforderlichen Designs über Properties oder Attribute erfüllen zu können.

  • Spezifikationen und Assets: Im Developer Mode können Entwickler auf eine detaillierte Ansicht aller Elemente zugreifen, was die Genauigkeit bei der Umsetzung des Designs in den Code verbessert.

Kommentarfunktion in Figma

Die Kommunikation und das Feedback sind essentielle Teile unseres Entwicklungsprozesses. Figma ermöglicht es Entwicklern, direkt im Tool Kommentare zu hinterlassen. Diese Funktion fördert eine aktive Diskussion und schnelles Feedback zwischen den Teammitgliedern.

  • Feedback und Anpassungen: Entwickler können spezifische Fragen oder Anmerkungen zu den Designs als Kommentare in Figma einfügen, was eine direkte und nachvollziehbare Kommunikation ermöglicht.

Inspektion von Screendesigns

Einer der größten Vorteile von Figma ist die Fähigkeit, dass Entwickler die Screendesigns direkt im Tool inspizieren können. Diese Funktionalität ermöglicht es den Entwicklern, präzise Einblicke in die gestalterischen Details zu erhalten, die für die Codierung notwendig sind.

  • Detailgenaue Inspektion: Entwickler können die genauen Spezifikationen jedes Designelements untersuchen, was die Umsetzungstreue des finalen Produkts sicherstellt.