Mit variablen farbigen Schriften gestaltet Arthur Reinders Folmer charmante bewegte Typoillustrationen. Hier zeigt er Step by Step, wie man einen Variable Color Font in Glyphs anlegt und dann animiert.
Zwischen Tage mit der Arbeit an kommerziellen Buch-, Plakat-, Ausstellungs- oder Webdesignprojekten quetscht Arthur Reinders Folmer immer wieder einen mit seinen Typoexperimenten. Weil es ihn in den Fingern juckt und weil diese »Font-Abenteuer«, die die Grenzen zwischen Typedesign und Illustration verschwimmen lassen, Inspiration fürs Tagesgeschäft liefern. In Glyphs gestaltet der niederländische Designer Variable Color Fonts, in denen die Buchstaben gerne mal die Form von Eisbergen, Einhörnern oder Edelsteinen annehmen und – in Websites eingebettet – in Bewegung geraten.
»Grundsätzlich sind Fonts nichts anderes als Vektorzeichnungen, die jeweils Unicodes zugeordnet sind, sodass sie sich über die Tastatur eingeben lassen sagt Arthur Reinders Folmer. »Natürlich enthält ein Font auch andere Informationen wie Spacing oder Kerning, aber spannend werden sie durch die Vektoren. Dank ihnen sind sie skalierbar, und man kann zeichnen, was man will – eben auch Illus.« Farbig werden diese durch die Fähigkeit von Color Fonts, verschiedene Farblayer in einer Schriftdatei zu vereinigen. Das Variable-Fonts-Format ermöglicht schließlich die fließende Interpolation zwischen zwei Bildern.
Vorteil: Animierte Variable Color Fonts statt GIF
In eine WOFF2-Datei konvertiert und mit wenigen Zeilen Code versehen, lassen sich die Typoillus in animierter Form als charmante Eyecatcher in Websites verwenden. Dabei kann man die Animation vorgeben – wie hier das Schmelzen des M – oder sie durch äußere Faktoren steuern lassen. Ein Vorteil der animierten Variable Color Fonts gegenüber einem GIF: Sie lassen sich mit Sensoren koppeln, sodass sie zum Beispiel auf Tageszeit oder Bewegungen reagieren können. Außerdem sind sie hinsichtlich der Darstellungsqualität und kompakteren Dateigröße überlegen.