Dieter Petereit 18. Mai 2018

Adobe Illustrator: Die 14 besten Alternativen für Webdesigner

ist seit 1994 im Netz unterwegs, aber bereits seit über 30 Jahren...

Vektoren gehört die Zukunft. Das ist gut, denn Pixel-Editoren waren im Webdesign ohnehin nur solange geeignet, wie uns nichts besseres zur Verfügung stand. Skalierbare Designs hingegen sind mit Vektor-Editoren wesentlich besser zu gestalten.

Adobe öffnet die Büchse der Pandora

Noch vor wenigen Jahren durfte sich Adobe fast schon als Alleinherrscher des grafischen Marktes betrachten. Kaum ein Wettbewerber zeigte sich, und wenn doch, dann nur mit gebremstem Schaum. Speziallösungen für einzelne Aufgaben gab es einige, aber große Allrounder wie Photoshop oder Illustrator wurden, wohl mangels realistischer Erfolgschancen, nicht ernsthaft in Angriff genommen.

Dann entschied sich Adobe dafür, seine Kunden zu zwingen, ein monatlich oder jährlich zahlbares Abo abzuschließen, wenn sie weiterhin die Produkte nutzen wollten. Aus der Sicht eines treuen Adobe-Kunden war das zunächst kein größeres Problem. Denn. wenn du bisher ohnehin schon die jährlichen Updates mitgemacht hattest, dann kostete das Abo genauso viel wie die Einzelupdates. Durch das neue Modell und die monatlichen Zahlungen konntest du zudem die eigene Liquidität etwas strecken. Nicht unattraktiv erschien auch die theoretische Möglichkeit, dass Updates nicht mehr nur einmal im Jahr ausgespielt werden konnten.

Allerdings gab es durchaus eine nennenswerte Zahl an Kunden, die eben nicht jedes Update mitmachten. Das konnte man durchaus vertreten, denn die Neuerungen waren, wie bei jeder anderen ausgereiften Software, zumeist für die Alltagsaufgaben zumeist verzichtbar.

Der Abo-Zwang und der damit verbundene Sturm der Entrüstung in der Grafikdesign-Branche ermutigte offenbar andere Hersteller, es nun doch ernsthaft zu versuchen. Dabei kamen durchaus einige interessante Alternativen zustande, die Adobe den Rang ablaufen können.

Ich habe mich bemüht, eine möglichst vollständige Übersicht der Alternativen zu erstellen. Alle vorgestellten Lösungen arbeiten mit SVG, manche nativ, alle zumindest zusätzlich. Habe ich eine Software vergessen, schreib sie gerne in den Kommentaren dazu. Ich würde sie dann prüfen und den Beitrag eventuell erweitern.

Plattformübergreifende Illustrator-Alternativen

Gravit Designer

Illustrator-Alternativen: Gravit Designer (Screenshot: D. Petereit)

Gravit Designer ist aus dem beliebten Tool Gravit entstanden, über das unsere Kollegen vom Smashing Magazine hier ausführlich berichteten. Designer stellt eine massive Fortentwicklung dieses Ansatzes dar. Zusätzlich zur Web-App steht Gravit Designer als native App jeweils für macOS, Windows und Linux bereit. Gravit Designer bietet quer über alle unterstützten Plattformen den gleichen Funktionsumfang und ist dabei komplett kostenlos.

Der Vektor-Editor entfernt als native App einige Limitierungen der bisherigen Web-App. So ist er in der Lage, mehrere Seiten in einem Dokument zu verwalten, sowie auf Systemfonts zuzugreifen. Die Benutzeroberfläche ist detaillierter und ausgereifter als jene des Vorläufers Gravit. Sie erinnert stark an die UI der aktuellen Adobe-Produkte. Aktuell liegt das Tool in Version 3.1 vor.

Gravit Designer exportiert JPEG, PNG, SVG (auch Compressed) und PDF. Dateien können in der Gravit Cloud gespeichert werden. Mit dem Produkt Gravit Klex will das Team hinter dem Designer nun auch Crello, Canva und Spark Konkurrenz machen.

  • Website: Designer.io
  • Preis: kostenlos
  • Anwendungsbereich: Web- und App-Design
  • Kompatibilität: Native Apps für macOS, Windows und Linux; Web-App für alle Betriebssysteme geeignet

Vectr

Vectr: Benutzeroberfläche (Screenshot: Vectr)

Vectr schlägt in die gleiche Kerbe wie Gravit Designer und bietet ebenfalls ein komplettes Featureset für die Vektorbearbeitung. Die Funktionalität der nativen Apps ist identisch zur Web-App.

Eine Besonderheit des Produkts war die ursprüngliche Zielsetzung: Vectr wollte das Google Docs der Vektorbearbeitung werden. Im Team hätte es sich dann in Echtzeit gemeinsam an den Dateien arbeiten lassen.

Derzeit läuft Vectr nur in Chrome vollständig, eine entsprechende Chrome-Extension bringt die Offline-Fähigkeit mit. Jede Grafik in Vectr erhält eine eindeutige URL. Grafiken können so in bestehende Designs eingebettet werden und ändern sich an dieser Stelle automatisch, wenn die Ursprungsdatei bearbeitet wird. Ansonsten unterstützt Vectr mehrere Seiten und Ebenen und arbeitet nativ mit SVG.

Auch die UI von Vectr erinnert sehr stark an die Produkte aus dem Hause Adobe. Das Vectr WordPress-Plugin erlaubt dir, Grafiken direkt innerhalb eines WordPress-Posts zu bearbeiten.

Viel Wert haben die Macher hinter Vectr auf die Dokumentation gelegt. Die meisten Features kannst du dir mit aussagekräftigen Videos erläutern lassen. Das beschleunigt den Einstieg ungemein.

Seit Vectr allerdings im November 2017 von Inmagine (123RF, Pixlr, TheHungryJPEG und einige andere) übernommen wurde, ist die Update-Frequenz nicht mehr als solche zu bezeichnen. Da das Tool kostenlos ist, wollen wir uns mal nicht zu laut beschweren. Das Google Docs für das Vektor-Editing dürfen wir aber wohl nicht mehr erwarten. Dem Vernehmen nach soll eine Integration mit dem Portfolio von 123RF erfolgen. Warten wir es ab.

  • Website: Vectr
  • Preis: kostenlos
  • Kompatibilität: Native Apps für macOS, Windows und Linux; Web-App für alle Betriebssysteme geeignet
  • Anwendungsbereich: Web- und App-Design, eingeschränkt auch Grafikdesign
  • Review: Vectr 1.0: Vektorgrafiken für jedermann | Dr. Web

Inkscape

Inkscape: Benutzeroberfläche (Screenshot: Inkscape-Projekt)

Anfang des Jahres 2017 ist die aktuelle Version 0.92 des Vektor-Editors Inkscape erschienen. Zwei Jahre Entwicklungszeit stecken in der aktuellen Fassung und zahlreiche Neuerungen bezeugen den Zeitbedarf.

Die standardkonforme Umsetzung hat bei Inkscape besondere Priorität. Um etwa dem CSS-Standard zu entsprechen, wurde die Standardauflösung von 90 auf 96 dpi angehoben. Die Software bietet verschiedene Konvertierungsoptionen an, wenn du versuchst, eine ältere Inkscape-Datei zu öffnen.

Insgesamt haben sich die Entwickler darauf fokussiert, möglichst viele SVG2- und CSS3-Eigenschaften zumindest korrekt im Programm darzustellen. Über die Benutzeroberfläche lassen sich allerdings nicht alle dieser Eigenschaften dann auch ändern. Die Verwendung komplexer Gitterverläufe erfordert unter Inkscape 0.92 keine Tricks mehr, sondern steht als Standardfunktion bereit.

Inkscape ist Open Source und steht kostenlos für Windows, macOS und Linux zur Verfügung. Die Software ist der Dinosaurier unter den hier vorgestellten Lösungen und spielt im Feature-Bingo ganz vorne mit. Neuere Lösungen, wie Vectr oder Affinity Designer, sind allerdings einfacher zu bedienen.

  • Website: Inkscape
  • Preis: kostenlos
  • Anwendungsbereich: Web- und App-Design, Grafikdesign und Illustration
  • Kompatibilität: Native Apps für macOS, Windows und Linux; keine Web-App

Method Draw

Method Draw: Benutzeroberfläche (Screenshot: D. Petereit)

Wenn du Method Draw in deinem Browser aufrufst, stellst du fest, dass die Webanwendung sich von der Bedienoberfläche eines klassischen Zeichenprogramms nicht allzu sehr unterscheidet. Sie ist nur deutlich aufgeräumter und reduzierter. In der Werkzeugleiste findest du die üblichen Tools, um Linien, Rechtecke und Ovale zu zeichnen. Außerdem gibt es einen Stift zum Freihandzeichnen und ein Pfadwerkzeug, um beliebige Polygone und Bézierkurven erstellen zu können.

Über eine Formenbibliothek hast du Zugriff auf eine Vielzahl unterschiedlicher vordefinierter Formen, die in zwölf Kategorien sortiert sind. Darüber hinaus findest du verschiedene Symbole zu Themen wie Wetter, Musik und Natur. Hast du dir eine dieser fertigen Formen auf die Zeichenfläche gezogen, kannst du sie nach Belieben verändern. Über eine Farbauswahl definierst du die Füll- und Rahmenfarbe einer Form. Jede Form kannst du frei auf der Zeichenfläche platzieren, skalieren und drehen.

Im Gegensatz zu Illustrator und Inskscape besitzt Method Draw einen eigenen Quelltexteditor. Über diesen kannst du dir jederzeit den generierten SVG-Quelltext deiner Zeichnung anschauen und diesen auch bearbeiten. Auf diese Weise fügst du sehr schnell eigenen SVG-Quelltext ein oder änderst bestehenden Quelltext, um beispielsweise manuell eine Form zu bearbeiten. Das Ergebnis deiner Bearbeitung wird anschließend direkt in Method Draw umgesetzt.

Method Draw ist eine gute Alternative zu klassischen Desktopanwendungen für Webdesigner, wenn es rein ums SVG-Format geht. Vor allem die direkte Bearbeitbarkeit des Quelltextes im Programm ist ein interessanter Ansatz. Method Draw ist kostenlos nutzbar und erfordert keine Anmeldung.

  • Website: Method Draw
  • Preis: kostenlos
  • Anwendungsbereich: Web- und App-Design
  • Kompatibilität: Web-App für alle Betriebssysteme geeignet

Boxy SVG

Boxy SVG (Screenshot: Jaroslaw Foksa)

Boxy SVG ist eine sehr einfach zu bedienende Lösung für die schnelle Bearbeitung von SVG-Dateien. Optisch folgt die App dem Gaming-Ansatz, was zwar die Bedienung sehr einfach werden lässt, aber schon Rückschlüsse auf die Begrenztheit des Featuresets erlaubt. Hier muss allerdings der Innovationskraft des Entwicklers Jaroslaw Foksa Gerechtigkeit widerfahren. Er entwickelt tatsächlich überaus aktiv an seinem Produkt und bringt monatlich neue Features ein.

Boxy SVG gibt es als lokale Offline-Lösung in der Form einer Chrome-Extension, als Web-App, sowie als App für macOS und Windows. Wenn du dir einen Überblick über die Funktionalität verschaffen willst, besuch die Website. Dort kannst du in der Demo ein paar vorgefertigte SVG-Dateien bearbeiten.

Neben den Formaten SVG und SVGZ, die Boxy SVG sowohl im-, als auch exportieren kann, unterstützt die App JPG, WebP, GIF und PNG. Wer auf reines SVG Wert legt, sollte sich Boxy auf jeden Fall mal ansehen. Vor allem, da die Rendering-Engine auf Chromium basiert. So ist sichergestellt, dass die Ansicht in Boxy auch die Ansicht im Browser deines Seitenbesuchers sein wird.

Die Preisgestaltung finde ich indes sehr gewagt, vor allem im Vergleich zu anderen Lösungen unserer Übersicht.

  • Website: Boxy SVG
  • Preis: Plattform-Apps jeweils um die 10 Euro, Web-App kostet 9 USD pro Monat
  • Anwendungsbereich: Web- und App-Design
  • Kompatibilität: Chrome-Extension, Web-App, native Apps für macOS und Windows

SVG-Edit

SVG-Edit (Screenshot: D. Petereit)

SVG-Edit ist eine Lösung auf der Basis von HTML, CSS und JavaScript, die sich hauptsächlich an Nutzer wendet, die ihre SVG-Grafiken für das Web bearbeiten wollen. SVG-Edit verfügt über keinerlei serverseitige Funktionalität. Deshalb kannst du dir das Tool von Github herunterladen und in einem beliebigen, halbwegs modernen Browser lokal ausführen. Das Tool ist allerdings nichts für Personen, die keinerlei Kenntnisse in Webentwicklung haben.

  • Website: SVG-Edit Demo | Github
  • Preis: kostenlos
  • Anwendungsbereich: Web- und App-Design
  • Kompatibilität: Web-App, daher plattformübergreifend; läuft sogar im IE ab Version 9

Figma

Figma: Benutzeroberfläche (Screenshot: D. Petereit)

Figma ist ein recht neuer Vertreter im Markt der Online-Vektor-Editoren. Das Tool steht ausschließlich als Web-App zur Verfügung, native Apps zur Installation gibt es nicht. Figma propagiert sich selbst als das Werkzeug für den digitalen Design-Nomaden, der gern am Strand arbeitet. Inwieweit du Strand und Interface-Design in Einklang bringen kannst, musst du mal für dich selbst klären. Ich kann es nicht.

Auch wenn Figma sich breit aufstellt und sich selbst als tauglich für Grafikdesigner erklärt, solltest du die Vollmundigkeit des Herstellers insgesamt mit einer großen Prise Salz nehmen. In meinem Test stellte Figma sich sehr schnell als zäh in der Bearbeitung heraus. Sowohl die Ladegeschwindigkeit, wie auch die Bearbeitungsgeschwindigkeit ließ mit steigender Zahl der Einzelelemente rasant nach. Schlussendlich ruckelte Figma nur noch vor sich hin. Vernünftiges Arbeiten war nicht mehr möglich.

Dabei ist der Ansatz der App nicht schlecht. Figma stellt auch den kollaborativen Aspekt der Arbeit in den Vordergrund. Gepaart mit professionellen Vektor- und Zeichenwerkzeugen erstellst du recht schnell und mit einer ziemlich flachen Lernkurve deine Interfacedesigns. Dabei eignet sich Figma nicht nur für das Prototyping. Auch produktionsfertige Assets exportierst du aus dem System.

Der Einstieg in Figma wird dir versüßt durch die Tatsache, dass du ein kleines Team mit zwei Bearbeitern und maximal drei Projekten vollkommen kostenlos betreiben kannst. So prüfst du die App risikolos auf Herz und Nieren. Und solltest du dich am Ende dafür entscheiden, mit allen Projekten auf Figma umzusteigern, dann bringen dich die 12 USD pro Monat, die dich das Tool dann kostet, sicherlich nicht um den Schlaf.

Wenn du bisher schon Sketch nutzt, kannst du deine Dateien einfach in Figma öffnen und dort weiter bearbeiten. So wird der Umstieg nochmal leichter.

  • Website: Figma
  • Preis: kostenlos für Kleinst-Teams mit zwei Bearbeitern und nicht mehr als drei Projekten, danach 12 USD pro Monat
  • Anwendungsbereich: Web- und App-Design. Figma behauptet zwar, auch für Grafikdesign geeignet zu sein. Das allerdings konnte ich im Test so nicht bestätigen.
  • Kompatibilität: Web-App für alle Betriebssysteme geeignet

Illustrator-Alternativen für Mac und Windows

Affinity Designer

Affinity Designer (Screenshot: Serif)

Affinity Designer aus dem Hause Serif ist eine kommerzielle Alternative zu Adobe Illustrator. Zunächst nur als App für macOS gestartet, gibt es Affinity Designer inzwischen auch für die Windows-Fraktion. Die beiden Varianten sind identisch im Featureset.

Mit der aktuellen Version 1.6.4 bedient Designer auch die Zielgruppe der Interface- und Webdesigner. So bietet das Tool ein umfangreiches Symbol- und Asset-Management. Pixelgenaue Features wie Einrasten oder das Erzwingen einer definierten Ausrichtung erleichtern Webdesignern die Arbeit.

Auch in Sachen Typografie leistet Designer mehr, als wir für eine Standard-Website brauchen würden. Das Benutzerinterface erinnert erstaunlich deutlich an Adobes Platzhirschen, verfolgt dabei aber durchaus einige nützliche eigene Ansätze.

So gibt es im Designer die sogenannten Personas. Dabei handelt es sich um komplette Toolumgebungen aka Arbeitsbereiche für bestimmte Zwecke. Über die Export-Persona steuerst du etwa den kompletten Export deiner Werke in vielerlei Formate und Auflösungen. Um die Benennung und Sicherung in unterschiedliche Ordner kümmert sich die App auf Wunsch selber.

Affinity Designer ist in deutscher Sprache erhältlich und bildet die leistungsstärkste Alternative zu Adobe in dieser Übersicht. An den Funktionsumfang kommen nur noch Sketch und CorelDRAW heran. Sketch gibt es allerdings nicht für Windows, CorelDRAW nicht für macOS. Und beide sind teurer.

  • Website: Affinity Designer
  • Preis: einmalig 54,99 Euro
  • Anwendungsbereich: Web- und App-Design, Grafikdesign und Illustration
  • Kompatibilität: native App für Windows und macOS
  • Review: Affinity Designer, das perfekte Werkzeug für UI- und UX-Design | Dr. Web

Adobe XD

Adobe XD: Benutzeroberfläche (Screenshot: Adobe)

Adobe XD ist ein schneller Helfer, wenn es um Wireframes geht. Genauso lassen sich mit der Software aber auch interaktive Prototypen, Screen-Designs und sogar produktionsreife Assets herstellen. Adobe XD unterstützt den gesamten Designprozess. Den Grad der Detaillierung bestimmst du selbst. Dabei kannst du dich vom Drahtmodell bis zum fertigen Produkt durch XD unterstützen lassen, indem du schlicht, je nach Status des Kundenfeedbacks, die Komplexität deines Designs mehr und mehr erhöhst.

Von daher hat XD durchaus berechtigt seinen Platz in unserer Übersicht mit Illustrator-Alternativen gefunden. Auf den ersten Blick handelt es sich um ein relativ kleines Tool. Befasst du dich intensiver damit, stellst du allerdings schnell fest, dass er dich im gesamten Produktionsprozess, auch und vor allem bei der Erstellung von Vektorzeichnungen im Webdesign helfen kann.

Bist du indes Grafikdesigner(in) oder Illustrator(in) ist XD nicht das richtige Werkzeug für dich.

  • Website: Adobe XD in der Creative Cloud
  • Preis: enthalten im Creative-Cloud-Abo, separat buchbar für monatlich 11,89 EUR, oder kostenlos für einen einzelnen Prototypen
  • Anwendungsbereich: Web- und App-Design
  • Kompatibilität: Native Apps für macOS und Windows
  • Review: Design: Adobe Xd ist dein Tool fürs Prototyping | Dr. Web

Illustrator-Alternativen für Windows

Erstaunlicherweise gibt es nur eine einzige dedizierte Windows-Alternative zu Adobes Illustrator. Da sieht es auf der Mac-Plattform, wie du noch sehen wirst, deutlich bunter aus. Dafür ist die folgende Alternative aber auch eine wirklich gute…

CorelDRAW Graphics Suite 2018

CorelDRAW Graphics Suite 2018 (Screenshot: Corel)

CorelDRAW ist ebenfalls ein Urgestein im Vektordesign. Anfang der Nullerjahre war CorelDRAW noch wesentlich weiter verbreitet als heutzutage. Verschwunden ist das Grafikpaket indes nie ganz. Funktional lässt das Tool, nicht zuletzt aufgrund seines hohen Reifegrades und seiner langen Marktpräsenz, kaum etwas zu wünschen übrig.

CorelDRAW zählt preislich durchaus zur Adobe-Liga, und auch im Übrigen hat sich der Anbieter inspirieren lassen. So könnt ihr das Produkt zwar per Einmalbetrag kaufen, möglich ist aber ebenso der Abschluss eines Abos für knappe 20 Euro monatlich.

Damit wir hier nicht Äpfel mit Birnen vergleichen, solltet ihr bedenken, dass CorelDRAW zu dem Preis als Suite vertrieben wird. Ebenfalls enthalten ist die Photoshop-Alternative Photo-Paint, ein Font-Manager, ein Vektorisierungsprogramm namens PowerTrace, Capture als Screenshot-App und der RAW-Editor AfterShot HDR, sowie Tausende freier Inhalte, wie Cliparts, Bilder, Schriften, Vorlagen, Füllungen, Rahmen und Muster.

  • Website: CorelDRAW Graphics Suite 2018
  • Preis: einmalig 699,- Euro oder monatlich 19,95 Euro im Abo
  • Anwendungsbereich: Web- und App-Design, Grafikdesign und Illustration
  • Kompatibilität: native App für Windows

Illustrator-Alternativen für den Mac

Wenn du mit dem Mac arbeitest, erfreust du dich einer stetig wachsenden Zahl von Alternativen zu Illustrator. Die ältesten heißen Affinity Designer und Sketch. In jüngerer Zeit gesellen sich hier noch Invision Studio und Framer hinzu.

Sowohl für Framer, wie auch für Studio sind Versionen für Windows in Arbeit.

Sketch

Sketch (Screenshot: Bohemian Coding)

Sketch ist moderat bepreist. In Deutschland zahlst du die gleichen 99 USD, die überall auf der Welt fällig werden. Hinzu kommt hierzulande noch die gesetzliche Umsatzsteuer von derzeit 19 Prozent. Ich habe zu Jahresbeginn etwas über 100 Euro insgesamt bezahlt, aber das hängt natürlich immer vom aktuellen Wechselkurs ab.

Der Preis enthält Updates für zwölf Monate ab Kaufdatum. Nach Ablauf der zwölf Monate nutzt du dann Sketch weiter auf dem letzten Updatestand oder bezahlst erneut für weitere zwölf Update-Monate. Inzwischen verlangt Bohemian Coding für die Erneuerung der Lizenz nur noch einen reduzierten Betrag von 69 USD.

Ähnlich wie Illustrator kann auch Sketch quasi omnipotent gemacht werden. Es bedarf dafür entsprechender Plugins, die aufgrund der offenen API theoretisch von jedermann entwickelt werden können. Sketch-Nutzer schwärmen geradezu von der einfachen, fast schon intuitiven Bedienbarkeit der App.

In Rekordzeit hat sich eine unglaublich aktive Community rund um Sketch gebildet, die Templates, Tutorials, Plugins und vieles mehr beisteuert. Wenn ihr ausschließlich am Mac arbeitet, könnte Sketch mit Fug und Recht eure erste Wahl sein.

  • Website: Sketch
  • Preis: 99 USD Euro für das erste Jahr, 69 USD pro Jahr für alle weiteren Jahre, wenn Updates gewünscht sind
  • Anwendungsbereich: Web- und App-Design, eingeschränkt auch für Grafikdesign und Illustration zu gebrauchen
  • Kompatibilität: native App für macOS

Graphic für Mac

Graphic: Verschiedene Versionen für verschiedene Plattformen (Screenshot: D. Petereit)

Graphic werden einige ältere Mac-Nutzer noch unter dem Namen iDraw kennen. Tatsächlich wurde iDraw vor Jahren von Autodesk übernommen und firmierte seither unter dem Namen Autodesk Graphic. Mittlerweile ist die Lage etwas unübersichtlich geworden. So findest du Graphic auf der Website und im Mac App-Store teils unter Autodesk, teils unter Picta Inc. und teils unter Indeeo.

Graphic ist eine Software für die schnelle Vektorgrafik zwischendurch. Die aktuelle Version für den Mac hört auf die Nummer 3.1 und stammt aus Januar 2018. Dabei handelt es sich um das erste Update seit Oktober 2015.

Der Hersteller konzentriert sich mehr auf die Varianten für iOS, genauer für das iPad Pro, das iPad und sogar das iPhone. Speziell die Verwender des iPad Pro sind zufrieden mit dem Vektor-Tool, für das sie keine 10 Euro zahlen müssen. Unter iOS updatet der Hersteller das Tool deutlich häufiger.

Auf dem Mac unterstützt Graphics den Im- und Export der Formate SVG, PDF und Photoshops PSD. Unter Verwendung der iCloud können Grafiken sowohl auf dem Mac wie auch den verschiedenen iOS-Geräten bearbeitet und synchron gehalten werden. Wenn du also zu jenen gehörst, die am liebsten draußen am See gestalten, könnte Graphics doch das Tool deiner Wahl sein.

  • Website: Graphic
  • Preis: einmalig 32,99 Euro
  • Anwendungsbereich: Web- und App-Design, Grafikdesign und Illustration
  • Kompatibilität: native App für macOS (und iOS: separat zu erwerben)

Invision Studio

Invision Studio: Benutzeroberfläche mit Beispiel-Projekt. (Screenshot: D. Petereit)

Invision Studio positioniert sich klar als kostenlose Alternative zu Sketch. Der Umstieg für Sketch-Nutzer ist dementsprechend sehr einfach. Eine Lernkurve existiert praktisch nicht. Du öffnest einfach dein Sketch-File mit Studio und arbeitest unter einer ähnlichen UI weiter.

Hinsichtlich des Featureset, aber auch hinsichtlich der optischen Anmutung orientiert Studio sich ganz eindeutig am Vorbild aus dem Hause Bohemian Coding. Ein Punkt, an dem Studio das Vorbild überholt, ist das Thema Animation. Hier brauchst du unter Sketch weitere Lösungen, Studio bringt eine Animations-Bearbeitung direkt mit. Nicht zuletzt deswegen, eignet sich Studio als vollständige Prototyping-Lösung im Stile von Adobe XD.

Invision bringt Studio natürlich nicht aus rein karitativen Gründen. Vielmehr soll hier eine engere Bindung der Kunden an das eigene Kollaborationssystem gefördert werden, das natürlich perfekt mit Studio zusammenarbeitet. Insofern ist es durchaus denkbar, dass ein kostenpflichtiger Invision-Account irgendwann zur Nutzungsvoraussetzung wird. Zunächst wird das nicht der Fall sein. Das Tool ist kostenlos.

Momentan befindet sich Studio im Beta-Status. Du kannst die Software frei herunterladen und ausprobieren. Dazu gibst du auf der Landing Page Vor- und Nachnamen, sowie deine E-Mail-Adresse an. Nachdem du das kleine Formular abgeschickt hast, beginnt ohne Umschweife der Download, der runde 70 MB schwer ist. Benutzen kannst du das Programm dann allerdings erst, wenn du dir einen kostenfreien Invision-Account eingerichtet hast.

Der Einstieg wird dir mit etlichen Tutorials und Beispielprojekten recht einfach gemacht.

  • Website: Invision Studio
  • Preis: kostenlos
  • Anwendungsbereich: Web- und App-Design
  • Kompatibilität: native App für macOS, Windows-Version ist in Arbeit

Framer

Framer: Benutzeroberfläche (Screenshot: Framer)

Framer ist eine weitere Software mit einem Kollaborationsansatz. Insofern ähnelt sie Invisions Studio recht deutlich, kommt aber von der anderen Seite her. Während es bei Invision zunächst die Kollaborationsplattform gab und sehr viel später erst an die Entwicklung von Studio gegangen wurde, ist bei Framer die Desktop-Software der Ausgangspunkt der Entwicklung.

Genau wie Studio oder auch Adobe XD ist Framer eine vollständige Prototyping-Software. Ebenso wie die Mitbewerber bringt sie einen Vektor-Editor mit, der für alle Bedarfe rund um Web- und App-Design, egal für welche Plattform, geeignet und ausreichend ist. Framers Vektor-Editor arbeitet nativ mit SVG.

Auch Framer schielt auf die Nutzer der Sketch-App. So steht für Framer ein Sketch-Plugin zur Verfügung, mit dem du deine Arbeiten aus Sketch direkt nach Framer exportieren kannst, um dann dort weiter daran zu arbeiten. Ebenso wie Studio bringt Framer Werkzeuge für die Erstellung von Animationen direkt mit.

Framer kannst du 15 Tage lang kostenfrei testen, danach musst du dich für eine Lizenz entscheiden. Dabei ist die Einzellizenz noch erschwinglich, während Framer bei Teams gewaltig zulangt.

  • Website: Framer
  • Preis: 12 USD pro Monat für die Einzellizenz, Teamlizenzen ab 250 USD monatlich
  • Anwendungsbereich: Web- und App-Design
  • Kompatibilität: native App für macOS, Windows-Version ist in Arbeit, kostenlose Apps für iOS und Android zum Testen der Prototypen vorhanden

(Bildnachweis Artikelbild: Depositphotos)

Dieter Petereit

ist seit 1994 im Netz unterwegs, aber bereits seit über 30 Jahren in der IT daheim. Seit Anfang des neuen Jahrtausends schreibt er für diverse Medien, hauptsächlich zu den Themenfeldern Technik und Design. Man findet ihn auch auf Twitter und Google+.

Ein Kommentar

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.