TranSvias-Viewer

Style Guide

Ein Style Guide ist ein wichtiges Element des UI-Design Prozesses und spezifiziert alle wichtigen Daten, die ein Entwicklerteam für die technische Umsetzung des Designs benötigt.

Anhand des Style Guides für den tranSvias viewer zeigen wir auf, wie ein solcher
Style Guide aussehen kann und was er beinhaltet.

Cover image tranSvias

In folgenden Punkten können wir unseren Kunden Vorteile bieten:

  • Durch die enge Zusammenarbeit mit unseren Software-Abteilungen, wissen wir genau, welche Daten relavant sind, um eine reibungslose Umsetzung des Designs in eine Software zu ermöglichen
  • Viele erfolgreich durchgeführte UX-/UI-Designs mit hoher Kundenzufriedenheit
  • Erfahrung im Design für Desktop und Mobile Applikationen
  • Technisches Verständis
  • Breites Portfolio an UX-/UI-Designs, von industriellen Anwendungen, über IoT-Projekte, bis hin zu Consumer-Apps
  • Design nach Software Ergonomischen Normen (DIN EN ISO 9241)
  • Kostengünstige Umsetzung des UI-Designs dank unserer Zusammenarbeit mit EPSza
  • Enge Zusammenarbeit mit dem Kunden und kurze Rückmeldezyklen für eine optimale Qualitätssicherung
  • Sehr strukturierte und transparente Arbeitsweise sowie Dokumentation aller Arbeiten und Entscheidungen
Page 5 tranSvias Style guide
  • Übersicht aller relevanten Stile und Elemente für die technische Umsetzung
  • Farbschemas, Farbverläufe, Schattenwürfe
  • Typographie aller Text-Elemente
  • Übersicht aller Icons
  • Bildschirmaufteilung und Standard-Dimensionen/-Abstände, je nach Anforderung für verschiedene Bildschirmauflösungen (Desktop, Tablet, Mobile)
  • Standard-Komponenten, wie z.B. Buttons und Input-Felder, inkl. verschiedener Status
  • Projekt spezifische Komponenten
Page 3 tranSvias Style guide

Bei der Entwicklung eines passenden UI-Designs lassen wir uns vom Corporate Design und der Vision des Kunden leiten, sowie des Verwendungszwecks und der Zielgruppe der Applikation und den Rahmenbedingungen derer Anwendung, wie beispielsweise die Einsatz-Umgebung.

Zusammen mit unserem Partner in Südafrika, der EPSza, entwickeln wir ein ausgearbeitetes UI-Design anhand eines repräsentativen Screens der Applikation, das wir dem Kunden vorstellen.
Auf Wunsch des Kunden erstellen wir auch zusätzliche Design-Variationen, von denen der Kunde auswählen kann.

Auf diese Weise erarbeiten wir über mehrere Iterationen hinweg ein geeignetes UI-Design, das in die Produkt-Palette unseres Kunden passt und gleichzeitig modern und intuitiv zu bedienen ist.

Liegt das finale UI-Design vor, spezifizieren wir anhand dieses Designs den Style Guide, der alle wichtigen Angaben beinhaltet, die für die technische Implementierung relevant sind. Hier werden auch Komponenten definiert, die für die Applikation benötigt werden, aber nicht unbedingt in dem ersten UI-Screen enthalten waren, um eine möglichst vollständige Referenz für die Umsetzung zu gewährleisten.

Page 7 tranSvias Style guide

.

Page 6 con library tranSvias Style guide

Ähnliche Projekte

Get a quote

tranSvias Team
Yeesss - wir haben es geschafft!!!

tranSvias LSVA ist offiziell NETS-zertifiziert!

Herzlichen Dank unseren Pilotkunden für ihre Geduld, das ehrliche Feedback und Vertrauen!