Du hast deinen AdBlocker an?

Es wäre ein Traum, wenn du ihn für t3n.de deaktivierst. Wir zeigen dir gerne, wie das geht. Und natürlich erklären wir dir auch, warum uns das so wichtig ist. Digitales High-five, deine t3n-Redaktion

Entwicklung & Design

Die Nase voll von Lorem Ipsum? Dieser geniale Font erspart dir nervige Platzhalter in deinen Wireframes

Der perfekte Font für Wireframes: Redacted. (Screenshot: t3n.de)

Dummy-Texte wie Lorem Ipsum sind sehr beliebt, wenn es beispielsweise um den Entwurf von Websites geht. Im Wireframing-Prozess ist das allerdings keine gute Lösung, da dort noch nicht auf Details wie Schriftart oder -größe geachtet werden sollte. Genau hier kommt der Font „Redacted“ ins Spiel.

Ihr kennt das vermutlich alle: In Tutorials oder auf Bildern von Wireframes sind oft statt richtigem Text nur Linien als Platzhalter. Solange das Wireframe auf dem Papier entsteht, ist das noch leicht – wollt ihr allerdings im Design-Tool eurer Wahl oder gleich im Browser ein Wireframe erstellen, werden aus Ermangelung an guten Alternativen häufig doch schon Schriften eingesetzt.

Manchmal geht ihr in Gedanken dann schon weiter ins Detail und beschäftigt euch unterbewusst mit der richtigen Schriftart und mehr. Als Alternative einfach mit vielen Rechtecken zu arbeiten, die eine Zeile Text symbolisieren, ist auch nicht gerade das Gelbe vom Ei. Der Font „Redacted“ setzt genau hier an.

Der Font Redacted im Einsatz. Hauptsächlich die Regular-Schriftart, oben auch die Script. (Screenshot: t3n.de)
Der Font Redacted im Einsatz. Hauptsächlich die Regular-Schriftart, oben auch die Script-Art. (Screenshot: t3n.de)

Wieso ist denn da kein Text? Redacted ist der perfekte Wireframe-Font

Mit Redacted gibt es auf GitHub einen Font, der extra für Wireframes gemacht ist. Es gibt zwei verschiedene Schriftarten – Redacted Regular und Redacted Script. Regular ist einfach ein schwarzer Balken, Script sieht aus wie eine absolut unleserliche Handschrift. Die Schriftart Redacted Script gibt es dazu noch in drei verschiedenen Schriftschnitten – neben dem normalen gibt es noch Bold und Light. Wenn ihr also das nächste Mal ein Wireframe erstellt und nicht zu Stift und Papier greift, ist der Redacted-Font das Mittel eurer Wahl, um Schrift anzudeuten.

Neben dem ttf-Format sind auch Webfont-Formate im GitHub-Projekt enthalten. Damit steht dem Bereitstellen von Wireframes im Web nichts im Wege, wenn ihr euch Feedback holen wollt und das Wireframe gleich mit HTML und CSS umgesetzt habt.

Vielleicht auch interessant: Keine Lust auf Lorem Ipsum? 15 schräge Blindtext-Alternativen

Bitte beachte unsere Community-Richtlinien

6 Reaktionen
Oha

So etwas gibt es schon länger

http://blokkfont.com

Antworten
Julian

Im Disclaimer auf Github der Redacted-Font steht, das die Inspiration davon von der BLOKK font stammt. Lg

Quelle:
https://github.com/christiannaths/Redacted-Font#disclaimer

Antworten
Christian Baer

Genialer Font, geniales Tool, geniale App!

Bei t3n ist jetzt alles genial oder was?

https://t3n.de/search?q=genial

Antworten
Florian Brinkmann

Danke für den Hinweis – Sieht so aus, als sollten wir mal wieder öfter einen Thesaurus nutzen ... ;)

Viele Grüße,
Flo

Antworten
Florian Blaschke

Bitte auch gleich Alternativen zu „praktisch“, „hilfreich“ und „mächtig“ raussuchen ... ^^

Enrico A.

Ist nunmal auch eine sehr geniale Seite ;-)

Antworten

Melde dich mit deinem t3n Account an oder fülle die unteren Felder aus.