U-Boot
Neue Standards für UI- & UX-Design und jede Menge Zusatzfeatures.

Affinity Designer – wir haben's getestet!

Lesedauer: ca. 4 Minuten

Imac mit Affinity Designer

Speziell Web­designerInnen unter Windows wurden in den letzten Jahren leider nicht gerade verwöhnt, was das Programmangebot für Ihre Anforderungen betrifft.

Jetzt endlich gibt’s Licht am Ende des Designer-Tunnels, denn Affinity Designer für Windows ist auf dem Markt. Aus Mangel an Alternativen haben wir in den letzten Jahren immer noch mit Adobe Fireworks gearbeitet. Eine etwas unglückliche Situation, denn das Programm wird schon länger nicht mehr weiter entwickelt und stürzte oft schneller ab, als man speichern konnte. Bislang brachte es aber immer noch mehr Webdesign-Funktionen mit, als Photoshop, Indesign und Illustrator zusammen.

Warum Affinity Designer eine echte Alternative für uns ist:

1. Es ist eine Mischung aus Vektor und Pixel-Programm.

Von der Bedienung her erinnert es sogar etwas an FreeHand. (Alle ehemaligen FreeHand-Fans werden Affinity lieben.)

 

2. Es bietet umfassende Funktionen für Webdesign.

  • Saubere Definition von Schrift- und Objektstilen
  • Umwandeln von Elementen zu Symbolen. So wird beispielsweise die Navigation ein mal gestaltet und dann im Design wieder verwendet. Die Änderungen betreffen dann immer alle platzierten Instanzen und müssen nicht mühsam auf allen Seiten reproduziert werden. Außerdem kommt Affinity mit einer brauchbaren vordefinierten Symbolbibliothek.
  • Umschalten zwischen Pixel- und Vektordarstellung (Wichtig, wenn man Vector-Icons gestaltet, die auch noch sehr klein funktionieren sollen.)
  • Grandiose Slice- und Export-Funktionen zur Aufbereitung von Bildern für die Programmierung
  • Präziser Umgang mit Vektoren.
Textstile

Saubere Definition von Schrift- und Objektstilen

Symbole Palette

Übersichtliche Handhabung der Symbole

Textstile

Artboards, Ebenen, Symbole und Gruppen werden alle gleich als aufklappbare Ordner dargestellt. Sehr übersichtlich.

3. Es hat zahlreiche brauchbare Zusatzfeatures.

  • Rechtschreibprüfung direkt im Entwurf
  • Artboards werden intuitiv auf der Arbeitsfläche plaziert oder skaliert
  • Das Arbeitsflächenformat ist schon bei der Erstellung eines neuen Dokuments wählbar (Optionen für diverse populäre Web- und Printauflösungen)
  • Buttons können beliebig skaliert werden, ohne dass sich die Rundungen verändern. Fireworks hatte hier echte Nachteile.
  • Während dem Verschieben eines Objekts werden die Pixelabstände zu umliegenden Objekten eingeblendet.
  • Mit der Ansicht als Drahtgitter lassen sich verloren geglaubte Elemente leichter wieder finden

Was funktioniert anders als bei der Adobe Creative Suite?

Leider agiert das Programm in vielen Kleinigkeiten anders, als wir es bisher gewohnt waren. Es nur mittels Learning by Doing zu durchschauen, ist uns nicht gelungen. Zum Glück gibt’s Video-Tutorials, in denen die Abläufe erklärt werden. Mit etwas Ausdauer kommt man damit gut zurecht.

Einsteiger-Kurs auf Video2Brain

 

Innovativ in Affinity Designer: Die „Personas“ (Anwendungsbereiche)

Die Software unterscheidet direkt in der Anwendung zwischen drei unterschiedlichen Bereichen und zeigt kontextbezogene Funktionen an. Es ist ein bisschen wie drei Programme in einem, zwischen denen man umschalten kann. Im folgenden beschreiben wir die 3 Anwendungsbereiche (Personas):

Draw Persona

Die Draw-Persona In dieser Ansicht kann gestaltet und konstruiert werden, alle Funktionen sind auf die Bearbeitung von Vektoren inkl. Text abgestimmt.

Pixel Persona

Die Pixel-Persona In dieser Ansicht können Bilder bearbeitet werden, ähnlich wie in Photoshop

Sice Persona

Die Export-Persona In dieser Ansicht geht es um den Export der Daten für die Verwendung in der Webseite. Die Funktionen sind speziell für den Export als Bilder oder SVGs vorgesehen.

Hat man diesen Unterschied erfasst, kann man relativ schnell alle weiteren Funktionen finden und ausprobieren. Die durchdachteste Funktion dieser drei ist für uns eindeutig die Export-Persona. Bei Websites mit 10 oder mehr Templates wird es sehr schnell unübersichtlich, wenn man beispielsweise einen Ablauf für eine Usergroup exportieren möchte. In Affinity-Designer hat man deshalb viele Möglichkeiten, veschiedene Views zu erzeugen.

Personas

Wir sind Fans der Export-Persona in Affinity

1. Export der gesamten Arbeitsfläche.

Hier werden alle Seiten auf einer Fläche exportiert und man kann sich einen Überblick verschaffen. Sollten einzelne Seiten nicht benötigt werden, einfach die Auswahl in der Export-Persona aufgehoben. Sie werden dann beim Export nicht berücksichtigt.

Export Optionen

Export der gesamten Arbeitsfläche.

2. Export der einzelnen Seiten.

Auch ganz einfach mit einem Klick machbar und auch gleich sauber benannt.

Export Dialogfenster

Export der einzelnen Seiten.

3. Export einzelner Bereiche innerhalb der Seiten (=Slices).

Mittels einer Auswahl mit dem Slice-Tool werden alle Ebenen des so markierten Bereichs exportiert. Alternativ kann eine Gruppe von Elementen ausgewählt und direkt exportiert werden. Dann wird alles, was davor oder dahinter liegt, nicht berücksichtigt.

Alle Slices werden außerdem separat abgespeichert und werden so auch im Nachhinein bequem aktualisiert, wenn sich am Design etwas ändern sollte.

Export Item

Export einzelner Bereiche innerhalb der Seiten (=Slices).

Und das Beste zum Schluss: Der Preis.

Im Moment kostet eine Lizenz (vergünstigt) für Windows € 39,90 statt € 49,90 und das einmalig! Affinity sagt Adobe (mit seinen mittlerweile für Firmen sehr teuren Abo-Optionen) somit ziemlich den Kampf an.

Wir hoffen, dass es so weitergeht, und dass wir mit dem neuen Programm noch viel Freude haben werden.

Julia Krennhuber Gomes
Veröffentlicht am 04.12.2016
Geschrieben von:
Julia Krennhuber Gomes

Weitere Beiträge

Euch will ich kennenlernen.