19 Jul

Ausgestanzte Titel und Objekte mit inkscape

Dass sich das Open Source – Vektorgrafikprogramm Inkscape gut für das Erstellen von Webseitenlayouts eignet, sollte sich herumgesprochen haben. Hier nun eine einfach umzusetzende Anregung für nette Ausstanzefekte mit Schriften und anderen Elementen.

*

Gerade mal 5 Schritte braucht es, um
den Effekt mit dem (scheinbar ausgestanzten) Text zu generieren.

  • *Erst wird ein dunkles Rechteck mit einem Verlauf oder Muster erstellt.
  • Danach einen Text mit einer einer etwas dickeren Schrift und hellen Farbe erstellt.
  • Nun wird das Textobjekt zwei mal dupliziert (Strg+D). Die beiden Duplikate sollten außerhalb der Hintergrundes leicht versetzt angeordnet werden. (siehe Bild)
  • *Die beiden Kopien werden nun markiert und mit dem Pfadwerkzeug „Differenz“ (Strg+-) die Überlappung weggeschnitten. Übrig bleibt ein Fragment des Textes.
  • Dieses Fragment wird schwarz gefärbt, über das „Füllung und Kontur“-Werkzeug (Shift-Strg+F) unscharf gemacht und die Transparenz erhöht. (siehe Bild) Schiebt man nun den Schatten über den ursprünglichen Titeltext, sieht man den Effekt.

Hinweis: Natürlich lässt sich der Effekt vielfältig einsetzen. Mit einer zweiten Kante kann man z.B. weißen Text aus einem weißen Hintergrund ausstanzen. Wenn man als Hintergrund ein Bitmapmuster oder Foto verwendet und die Transparenz des Titeltextes reduziert sind ebenfalls nette Effekte möglich.

.

Damit das Beschriebene nachvollzogen werden kann, steht die SVG-Datei für diesen Artikel zum Download bereit. Darin sind auch noch 2 Beispielvariationen enthalten. 

Download: stanzeffekt.svg (179 KB)

Anmerkung: Inkscape hat im „Effekte“-Menü unter „Pfad modifizieren“ einen Effekt namens „Kante 3D“. Der macht im Prinzip etwas ähnliches. Leider ist das Ergebnis nur schwer vorhersehbar und die Resultate wirken unrealistisch.

* 

Inwieweit man überhaupt 3D-Schrifteffekte (die eher in den 90ern en vouge waren) einsetzen will, ist natürlich Geschmacksfrage. Ich mag bunte „indian style“-Webseiten mit vielen Effekten.

*