Warum wir Sketch als Webdesign-Tool nutzen
Eigentlich haben wir (wie die meisten Designer) unsere Webdesigns schon immer in Photoshop erstellt. Vor einiger Zeit sind wir durch die Zusammenarbeit mit einem Freelancer auf das Programm Sketch aus dem Hause Bohemian Coding aufmerksam geworden. Er brachte uns die Vorteile von Sketch für User-Interface-Designs nahe und er kam dabei regelrecht ins Schwärmen. Wir probierten es aus und waren direkt begeistert. Da merkt man wirklich, dass bei der Entwicklung des Programms Spezialisten am Werk waren. Da wir seitdem ebenfalls begeisterte Sketch-Nutzer sind, haben wir uns nun einmal daran gemacht, Ihnen die Vorteile von Sketch für die UI/UX-Gestaltung aufzuzeigen.
Hier kommen nun unsere Gründe, weshalb wir Sketch als Webdesign-Tool nutzen
Effizient und intuitiv
Mit Sketch lässt es sich sehr effizient und intuitiv arbeiten. Um auf Sketch umzusteigen und sinnvoll damit arbeiten zu können, braucht es in der Regel nicht länger als einen Tag. Das liegt größtenteils daran, dass Sketch sehr schlank ist und eine klare, aufgeräumte Struktur hat. Es konzentriert sich auf das, wofür es geschaffen wurde- auf User Interface Design. Bildbearbeitung ist nur im ganz kleinen, rudimentären Rahmen möglich und ist absolut kein Ersatz für die Funktionen, die Photoshop in dieser Hinsicht bietet. Aber dafür ist es ja auch nicht da.
Quelle: digital.manufaktur GmbH
Multiple Artboards
Da Sketch für UI/UX-Design konzipiert ist, ist es auch super simpel, für verschiedenste Endgeräte zu gestalten. Es ist ganz einfach möglich, multiple responsive Artboards anzulegen und nebeneinander darzustellen, um parallel daran zu arbeiten. Für ein sauberes User Interface lassen sich Grids und Layouts definieren und auf andere Artboards übertragen.
Quelle: digital.manufaktur GmbH
Vektorbasiert und Code-freundlich
Alle Formen und Schriften sind vektorbasiert. So sieht das Layout immer gestochen scharf aus und es ist kein Problem, die Datei in jeder beliebigen Größe zu exportieren. Darüber hinaus lassen sich bei vielen Funktionen Parallelen erkennen, die man auch in der Programmierung wiederfindet. So können zum Beispiel bestimmte Einstellungen, wie Farbflächen oder Schattierungen, mehrmals auf ein Element zugewiesen werden und CSS-Eigenschaften können einfach über einen Rechtsklick kopiert werden. Die Gestaltung funktioniert zu einem großen Teil komponentenbasiert und lehnt sich damit an die Strukturen in der Frontend-Entwicklung an.
Quelle: digital.manufaktur GmbH
Schnellerer Time-To-Market
Mit Sketch lässt es sich einfach fixer und effizienter arbeiten. Durch die komponentenbasierte Gestaltung lassen sich Anpassungen und Änderungen im Design, die sich während des Gestaltungsprozesses ergeben, wesentlich schneller und sauberer durchführen. Mit einer einzigen Anpassung einer Elementvorlage aktualisiert sich das komplette Design. Das bedeutet, dass nachträgliche kleinere Änderungen keinen großen Mehraufwand mehr darstellen. Auch die Übergabe der Designs an die Entwicklung läuft schneller ab, weil der Aufbau und die Art zu Gestalten sich an Regeln orientiert, wie man sie auch aus dem Frontend-Bereich (CSS) kennt. Dadurch rücken die Bereiche Design und Entwicklung ein ganzes Stück zusammen. Der Arbeitsprozess vom Design bis hin zur Entwicklung beschleunigt sich. Durch diesen effizienten Workflow kommt man also in der Regel schneller zu einem präsentierfähigen und umsetzbaren Ergebnis, was nicht zuletzt auch eine höhere Investitionssicherheit und einen schnelleren Time-To-Market für den für den Kunden bedeutet.
Quelle: giphy.com
Tolle Plugins
Sketch lässt sich nochmal ordentlich durch die große Auswahl an Plugins erweitern, die dem eh schon tollen Programm noch mehr Power geben. Wir haben Sketch im Laufe der Zeit mit einer Sammlung an Funktionen erweitert, die das Arbeiten nun noch komfortabler und hilfreicher machen. Beispielsweise kann man mit Hilfe von Plugins mit wirklichem Content arbeiten, mit ein paar Klicks Styleguides erstellen oder synchron mit dem Prototyping-Tool Invision arbeiten. Invision in Kombination mit Craft ist bei uns schon seit einiger Zeit nicht mehr aus unserem Workflow für Projekte und Kundenpräsentationen wegzudenken.
Quelle: sketchapp.com; digital.manufaktur GmbH
Kleines Programm, kleine Dateien
Ein weiterer sehr angenehmer Effekt der reduzierten Struktur von Sketch ist, dass es sich dadurch viel schneller arbeiten lässt. In ein paar Sekunden ist das Layout geöffnet, synchronisiert oder hochgeladen, egal ob man mit vielen verschiedenen Artboards und Pages arbeitet.
Da die Dateien vektorbasiert aufgebaut sind, verbrauchen auch die Dateien extrem wenig Festplattenspeicher, auch wenn man mit vielen verschiedenen Artboards gleichzeitig arbeitet. Auch die Synchronisation in Clouds oder in Prototyping-Tools geht dadurch super schnell.
Kostengünstig und regelmäßige Updates
Der Preis einer Sketch-Lizenz ist wirklich fair. Man zahlt einmalig eine geringe Summe für eine Sketch-Lizenz und dann kann man das Programm dauerhaft auf einem Gerät nutzen. Für ein Jahr sind dann noch regelmäßige Updates und Fehlerbehebungen inbegriffen. Danach bleibt es bei der letzten Version, bis man wieder für eine weitere Lizenz zahlen will. Danach kann man wieder ein Jahr die aktuellste Version nutzen and so on… Auch sehr nett: Alle Versionen sind abwärtskompatibel! Juhuu!
Zu guter Letzt: doch noch ein kleiner Nachteil
Ein Nachteil von Sketch ist leider, dass das Programm bislang nur macOS-Nutzern zur Verfügung steht. Für uns in der Agentur kein Problem, auch für die Mehrheit der Designer wird dieser Umstand nicht problematisch sein, da die meisten Designer einen Mac als Arbeitswerkzeug nutzen. Und doch gibt es natürlich auch Designer, die mit Windows arbeiten. Für sie ist es mehr als schade, dass sie das Programm nicht nutzen können. Aber wer weiß, vielleicht gibt es ja in ferner Zukunft auch eine Windows-Version…
Wir lieben Sketch!
Wir sind der Meinung, dass Sketch ein Must-have für alle Webdesigner ist. Falls Sie bislang noch nichts davon gehört haben oder Sie das Programm noch nicht getestet haben, dann probieren Sie es doch einfach direkt mal aus. Es gibt eine kostenlose Testversion 🙂
In einem anderen Blogpost werden wir Ihnen dann auch nochmal unsere Lieblings-Sketch-Plugins vorstellen.
Wie sieht es denn an Ihrer Designer-Front aus? Sind Sie oder Ihr Design-Team auch schon umgestiegen oder sind sie glücklich mit einem anderen Tool?