Sketch verschlingt schnell seine Konkurrenz und ist bereit, Photoshop als Go-to-Interface-Prototyping-Tool zu überholen, so dass viele Entwickler es jetzt vorziehen, dass Designer Sketch-Dateien anstelle von überlagerten Photoshop-Dateien übergeben.
Im Gegensatz zu Photoshop wurde die Sketch-Grafiksoftware von Grund auf für die Gestaltung interaktiver Benutzeroberflächen entwickelt.
Es werden Live-Kompositionen erstellt, sodass Kunden eine Vorschau der Vorgänge anzeigen können, wenn sie auf ihrem Desktop, Laptop, Tablet oder Telefon auf Ihr Design klicken, wischen oder darauf tippen.
Aus diesem Grund möchten Designer, die Photoshop zum Erstellen von Benutzeroberflächen für Desktops und mobile Geräte verwenden, Sketch möglicherweise genauer betrachten.
Sketch stammt aus den Niederlanden und ist ein reines Mac-Vektor-Design-Programm, dessen Schwerpunkt auf der Erstellung interaktiver Prototypen von Web- und App-Designs liegt.
Durch die Art des von Sketch erstellten Arbeitsdesigns erhalten Ihre Kunden ein besseres Gefühl dafür, wie alles aussieht und wie es reagiert.
Dies wiederum ermöglicht es ihnen, nützlicheres Feedback zu den Funktionen (Benutzeroberfläche oder Benutzeroberfläche) und der Benutzererfahrung (UX) zu geben, und ermöglicht folglich eine fundierte Genehmigung vor der Entwicklungsphase - wodurch Frustrationen eingedämmt und Zeit und Geld gespart werden.
Die vergleichsweise aktuelle Konzeption von Sketch (2008) konzentrierte sich auf das kollaborative Design von Bildschirmen.
Sie hat also einen Vorteil gegenüber Photoshop, das 30 Jahre zuvor debütierte, als das Wort kam Bildschirm hatte mit der Messung der Dichte von Halbtönen zu tun.
Designer stützten sich auf Adobe Photoshop (9,99 USD / Monat bei Adobe), um Schnittstellendesigndateien zu organisieren und zu übergeben, da dies das beste Tool in der Box war, um die Aufgabe zu erledigen - nicht, weil es ein speziell für diesen Zweck entwickeltes Tool war.
Sketch ist jedoch nicht allein im UX-Designbereich.
Adobe XD (XD steht für Experience Design), das 2016 als Teil der Creative Cloud für Windows und Mac von Adobe veröffentlicht wurde, ist auch ein vektorbasiertes Tool für das Wireframing und die Erstellung interaktiver Click-through-Prototypen.
Ein zweiter vektorbasierter Konkurrent, der als "das leistungsstärkste Bildschirmdesign-Tool der Welt" angepriesen wird, ist Studio von InVision (kostenlos für ein Prototyp, 25 US-Dollar pro Monat für unbegrenzte Prototypen).
Im Gegensatz zu Sketch und XD verfügt Studio über ein integriertes erweitertes Animationsmodul.
In Sketch erledigte Arbeiten können mit ihrem eigenen Craft Manager-Plugin mit der InVision-Plattform synchronisiert werden.
Adobe bietet einen kostenlosen XD-Starterplan mit begrenztem Speicherplatz (2 GB) und Verwendung eines Teils der Adobe Fonts-Sammlung.
Die Vollversion von XD ist als Teil des Adobe Creative Cloud (CC) -Abonnements ab 20,99 USD pro Monat für die einzelne App oder ab 54,99 USD pro Jahr für alle Creative Cloud-Apps erhältlich, einschließlich Illustrator (19,99 USD bei Adobe), InDesign und Photoshop.
Sketch verwendet eine Variante eines Abonnementmodells, die für Einzelpersonen 99 USD pro Jahr und Gerät (entweder Computer oder Mobiltelefon) kostet.
Dies umfasst ein Jahr Updates und Sketch Cloud (für Online-Freigabe und Zusammenarbeit).
Danach können Sie Ihre aktuelle Version für immer behalten und verwenden oder für 69 USD pro Jahr verlängern, um regelmäßige Updates und Cloud-Vorteile wiederzugewinnen.
Die Volumenlizenzierung reicht von 64 USD pro Jahr und Gerät für zwei bis neun Geräte bis zu 49 USD pro Gerät für 50 oder mehr Geräte.
Es ist erwähnenswert, dass Sie beim Kauf einer Lizenz nur einen einzigen Sitzplatz erhalten (nur für die Verwendung auf einem Computer).
Wenn Sie mehrere Macs wie einen Desktop und einen Laptop verwenden, haben Sie kein Glück und müssen zwei Sitzplätze erwerben.
Viele abonnementbasierte Apps bieten zwei Sitzplätze pro Lizenz als gute Gelegenheit für hart arbeitende Kreative, die im Büro auf ihrem Desktop und zu Hause auf ihrem Laptop arbeiten.
Eine damit verbundene Unannehmlichkeit besteht darin, dass Sie, wenn Sie Sketch auf einem neuen Mac verwenden möchten oder Ihr Laufwerk neu formatieren mussten, die Registrierung von Sketch von Ihrem alten Computer / Laufwerk aufheben und sich dann erneut registrieren müssen.
Einstieg
Sketch ist ein Kinderspiel, das Sie von der Website des Unternehmens (skizze App.com) herunterladen können.
Es gibt eine kostenlose 30-Tage-Testversion, für die keine Kreditkarte erforderlich ist.
Für Sketch ist MacOS 10.13.4 (High Sierra) oder höher erforderlich.
Das Unternehmen weist darauf hin, dass bei der Arbeit mit komplexen, mehrseitigen Dokumenten mit Hunderten von Zeichenflächen einer der leistungsstärkeren Macs mit RAM-Speicher empfohlen wird.
Ich habe Sketch 53.2 auf einem MacBook Pro 2018 mit einem 2,9-GHz-Intel Core i9-Prozessor, 32 GB RAM und einer Radeon Pro 560X-Grafikkarte getestet.
Direkt auf der Download-Seite bietet Sketch einen Leitfaden für Anfänger, umfangreiche Dokumentationen, Tutorials und Tipps sowie Links zu den Communitys für soziale Medien und Entwickler, zu Blogs und Chats sowie zu Dribble.
Es ist einladend und inspirierend, eine Liste globaler Treffen und Veranstaltungen der Design-Community zu sehen.
Darüber hinaus bietet die Website eine Vielzahl kostenloser und erstklassiger UX / UI-Ressourcen für Sketch App, darunter Wireframe-Kits, Kits für mobile Benutzeroberflächen, Vorlagen, Modelle, Dashboards, Konzepte und Symbole.
Schnittstelle und Leinwand
Sketch geht mit gutem Beispiel voran und bietet eine saubere, kontextbezogene Benutzeroberfläche mit drei Hauptabschnitten - und (von Natur aus) keinen schwebenden Bedienfeldern.
Wenn Sie bereits ein Mac-Benutzer sind, ist Ihnen die Sketch-Benutzeroberfläche bekannt, da sie den Schnittstellen von Apple-Apps wie Pages, Numbers und Keynote nachempfunden ist.
Mit dieser neuesten Version wird jetzt der Dunkle Modus von Apple unterstützt.
Auf der linken Seite des Bildschirms finden Sie die Seitenliste mit einem Inventar Ihrer Ebenen, einzelnen Inhaltselementen auf diesen Ebenen und Zeichenflächen sowie dem darauf angegebenen Inhalt.
Auf der rechten Seite befindet sich der Inspektor, in dem Sie mit den Eigenschaften des Inhalts auf der von Ihnen ausgewählten Ebene experimentieren können.
Oben haben Sie die Symbolleiste, in der Werkzeuge und Aktionen gespeichert sind.
Im Mittelpunkt steht Ihre Leinwand, auf der Sie die Magie erschaffen.
Die Seitenliste erleichtert das Organisieren, Zuweisen oder Ändern von Ebenen sowie das Benennen, Gruppieren, Auswählen und Duplizieren von Inhaltselementen, damit Ihr Workflow effizient ist.
Sie sind in Topform, wenn es darum geht, Dateien an einen Entwickler zu übergeben.
Sketch schmiert Ihren Workflow, indem es allgemeine Aufgaben mit einfach zu erstellenden Bibliotheken, Text- und Ebenenstilen, Symbolinstanzen und Voreinstellungen erleichtert oder automatisiert.
Darüber hinaus stehen Hunderte von zeitsparenden UI-Kits, Vorlagen und Plug-Ins zur Verfügung, die die Funktionalität von Sketch auf vielfältige Weise erweitern.
Zeichnen und Setzen in Skizze
Wie ein Gepard zum Laufen ist, ist Sketch zum Prototyping.
Ein Gepard ist sicherlich in der Lage zu gehen, aber was er entwickelt hat, ist Laufen.
Ebenso können Sie absolut in Sketch zeichnen, und das ist in Ordnung, aber das Außergewöhnliche an Sketch ist das Prototyping.
Es lohnt sich jedoch, einen Überblick darüber zu erhalten, was mit den Zeichenwerkzeugen von Sketch getan werden kann.
Das Erstellen, Importieren und Zusammenstellen von Inhalten beginnt mit einem Klick auf die Dropdown-Liste Einfügen.
Dort finden Sie die erwarteten Form-, Zeichen- und Textwerkzeuge.
Auf der rechten Seite befinden sich die Anordnungsvorgänge wie Nach vorne bringen, Ausrichten und Verteilen.
und zerstörungsfreie grundlegende boolesche Werkzeuge wie Union, Subtract, Intersect und Difference.
Die intuitiven und effizienten Vektorwerkzeuge ermöglichen das Erstellen und Bearbeiten von Formen, ihren Punkten und Bezier-Kurven.
Während Sketch wichtige Zeichenaufgaben erledigen kann, ist es weder Illustrator noch soll es so sein.
Die grundlegende Typografie in Sketch ist unkompliziert und bietet vertraute Microsoft Word-ähnliche Funktionen sowie dekorative Optionen für Schatten, Füllungen und Rahmen.
Das Formatieren von Typblöcken erfordert möglicherweise einige manuelle Anstrengungen in Sketch, die beispielsweise das Tabulieren nicht unterstützen.
Sie müssen die Leertaste verwenden, um den gewünschten Effekt zu simulieren.
Das ist in Ordnung, da jeder komplexe Satz beim Entwerfen von reaktionsschnellen Layouts umsonst ist: Bei der Anzeige auf Geräten unterschiedlicher Größe ändert sich alles Typografische (Größe, Zeilenumbrüche, Silbentrennung usw.).
Prototyping und Responsive Design
Im Gegensatz zu anderen Zeichenprogrammen (aber sehr ähnlich wie Adobe XD) erleichtert Sketch das Erstellen eines interaktiven Prototyps.
Um den Pfad Ihrer Website oder App (UI) und die Erfahrung (UX) zu simulieren, können Sie bestimmte Bereiche als Bildlauf- oder Nicht-Bildlauf-, Link- und Crosslink-Menüs, Symbole, Abschnitte, Seiten und zuweisen Instanzen und definieren Hotspots (anklickbare Bereiche).
Sie können nicht nur eine Vorschau Ihrer Bemühungen in der App anzeigen, sondern auch Sketch Mirror verwenden (mehr zu dieser Funktion weiter unten).
Eine neue Besonderheit in Sketch ist, dass Sie Prototyptext- und Formfelder mit dynamisch realistischen Daten füllen können, anstatt sich an die übliche Langeweile von Lorum Ipsum zu binden.
In ausgewählten Text- oder Formebenen können Sie eine Quelldatei zuweisen, aus der Text oder Bilder importiert werden.
Sketch spielt sich sehr gut mit anderen - und das nicht nur innerhalb der App.
Es war eine Freude zu entdecken, dass ich ein in Illustrator erstelltes Symbol kopieren und einfügen konnte.
Beim Importieren hat Sketch eine gruppierte Ebene für meine Grafik erstellt.
Von dort aus konnte ich das Symbol unverändert verwenden, einer Bibliothek hinzufügen oder ein Symbol erstellen - genau wie bei jeder in der App erstellten Grafik.
Auf dem heutigen Markt muss jedes gut durchdachte, für den Bildschirm bestimmte Design reaktionsschnell sein.
Dies bedeutet, dass der Inhalt eines App-Bildschirms oder einer Webseite je nach Anzeigegerät (Desktop, Laptop, Handy, Tablet) automatisch in der Größe geändert und verschoben wird.
Je nachdem, was auf jedem Gerät am besten aussieht, wird die Größe des Texts geändert, Zeilenumbrüche geändert und Bilder werden verkleinert, erweitert oder ausgeblendet.
In Sketch müssen Sie Variantenlayouts und Vereinfachungen der verschiedenen Seitenverhältnisse manuell erstellen, indem Sie jedes Element oder jede Gruppe kopieren und einfügen.
Ich wünschte jedoch, es gäbe eine intelligente Anpassungsoption für reaktionsschnelle Layoutänderungen, die der reaktionsschnellen Größenänderung in XD oder sogar der InDesign-Funktion "Layout anpassen" ähneln.
Obwohl das Anpassen des Layouts fast nie eine perfekte Lösung darstellt, spart es sicherlich Zeit und bietet einen besseren Ausgangspunkt als eine leere Seite.
Für die Vorschau Ihrer Sketch-Designs in Echtzeit auf Ihren Geräten gibt es den kostenlosen Sketch Mirror für iOS sowie mehrere Apps für Android-Geräte.
In allen Fällen benötigen Geräte WLAN oder eine USB-Verbindung.
Das Treffen fundierter Entwurfsentscheidungen kommt dem Workflow eines jeden zugute.
Zu diesem Zweck ist es ein großer Vorteil, wenn Sie Ihre Anpassungen, Zuschnitte und Textgrößen live mit Sketch Mirror auf dem tatsächlichen Gerät sehen können.
Ausgabe und Zusammenarbeit
Wenn Ihre Arbeit für Kundenfeedback oder Teamzusammenarbeit bereit ist, gibt es verschiedene Möglichkeiten zum Teilen.
Die primäre Methode besteht darin, Ihr Dokument in die Sketch Cloud hochzuladen.
Nach dem Hochladen erhalten Sie eine URL und können auswählen, wen Sie zum Anzeigen des Dokuments einladen möchten, und eine von drei Zugriffsebenen festlegen: Kommentieren, Herunterladen oder Als Bibliothek verwenden.
Jeder mit dem Link kann die integrierten Kommentartools verwenden.
Wenn er die Seite auf einem Tablet oder Telefon öffnet, kann er eine Vorschau der Zeichenfläche (n) in voller Auflösung anzeigen, sofern ein Layout für seine ..
.
