11.06.2017 in entwicklung

Collaboration Tools für Designer & Entwickler

Wir stellen euch Zeplin und Invision vor

Neben der einfachen Bedienung steht bei der App Entwicklung ein ansprechendes Design an oberster Stelle. Da wir mit unseren Kunden und anderen Stakeholdern häufig räumlich getrennt voneinander arbeiten, nutzen wir Design Collaboration Tools, die uns die Zusammenarbeit so einfach wie möglich machen.

Wir stellen euch zwei dieser Tools vor: Zeplin und Invision.
Beide Anwendungen sind sehr ähnlich aufgebaut, haben jedoch einige unterschiedliche Features. Das Grundprinzip funktioniert wie folgt: Sobald das Design einer App feststeht, legt der Designer ein Projekt an, dass nur über einen Nutzeraccount erreichbar ist. So haben Designer und Entwickler Zugriff auf alle Screens. Der Designer kann direkt die Sketch Datei importieren und bei Invision einen Prototyp der App in Form eines Click Dummys erstellen. Dies ermöglicht dem Kunden einen ersten realistischen Einblick, wie die App aussehen wird und wie sich die Klickpfade gestalten.

Auch für unsere Entwickler ist diese Form der Präsentation extrem hilfreich, da sie so nicht nur das Layout sehen, sondern auch im Inspect-Modus alle wichtigen Styling Informationen wie Farben, Fonts, Größen und Abstände entnommen werden können. In beiden Tools ist es sogar möglich einen vereinfachten CSS Code eines Elements zu exportieren. Ein weiteres hilfreiches Feature ist die Kommentar Funktion. An beliebiger Stelle eines Screens kann ein Kommentar eingefügt werden. Das vereinfacht die Abstimmung zwischen Kunde und Agentur aber auch von Designer und Entwickler.

Inspect Modus bei Invision

Auch bei Zeplin können alle Screens direkt von Sketch importiert werden und dem Entwickler zur Verfügung gestellt werden, der dann alle wichtigen Informationen entnehmen kann. Die Besonderheit gegenüber Invision ist, dass bei Zeplin automatisch ein Styleguide erstellt wird, der alle genutzen Farben und Schriften zusammenfasst. Außerdem können hier alle Assets in verschiedenen Größen direkt von den Screens heruntergeladen werden. Bei Invision müssen diese erst vom Designer separat hochgeladen werden.

Styleguide bei Zeplin

Beide Tools erfüllen ihren Zweck und ihre Vorteile. Viele Designer nutzen jedoch auch beide Tools in Kombination: Invision für das Prototyping einer App und Zeplin für die schnelle Erstellung des Styleguides.

Weitere Beiträge

Alle Artikel lesen
01.07.2018

Cross-Platform Apps mit React Native

Vor- und Nachteile
lesen
06.06.2018

Right-to-Left Support with Ionic

Challenges and Solutions
lesen
25.10.2017

React Native vs. Ionic

Das sind die Unterschiede
lesen
01.07.2018

Cross-Platform Apps mit React Native

Vor- und Nachteile
lesen

Wir helfen Ihnen gerne

Wir sind gespannt auf Ihr Projekt! Schreiben Sie uns eine Nachricht und wir melden uns innerhalb weniger Stunden zurück. Oder rufen Sie uns einfach an!

hello@hybridheroes.de
+49 30 23390434
Sprechen Sie uns an!