Welche Überlegungen gibt es beim Entwerfen von Pixelschriftarten?


14

Ich entwerfe Monospace-Pixel-Fonts für ein Spiel und konnte bisher nur mit extrem kleinen Formaten arbeiten (das größte, das ich bisher geschafft habe, ist 5x9), da diese am einfachsten zu versuchen sind, Fehler zu machen. Oft sind die Ergebnisse, die ich für Größen bis 7x13 erzielt habe, alle blockhaft und unattraktiv.

Ich habe einige andere Pixel-Schriftarten analysiert und die meisten der grafisch ansprechenden machen viele alternative Überlegungen, an die ich nie gedacht hätte, wie das Erstellen ganzer Abschnitte, die nur diagonal verbunden sind.

Gibt es spezielle Blockgrößen, die für das Entwerfen von Pixelschriftarten "optimal" sind? Gibt es spezielle Pixel-Platzierungen, die ich beachten muss? Denn manchmal, wenn ich eine Linie zeichne, die nur 11 Pixel lang ist (oder Dinge in so kleinen Größen schneiden lässt), sieht sie wie etwas anderes aus, wenn sie herausgezoomt ist.

Antworten:


11

Pixel-Schriften unterscheiden sich nicht wesentlich von winzigen Print-Schriften *. Die einzige große Ausnahme ist, dass Sie wissen, was das Medium mit Pixelschriftarten macht - ein sehr großer Vorteil.

Es gibt an sich kein ideales Pixelraster. Offensichtlich bietet ein größeres Raster mehr Platz zum Arbeiten. Die kleinsten Typen, die ich erfolgreich gesehen habe, sind 7px-Designs. Mit den MiniFont-Designs von Joe Gillespie können Sie das Entwerfen an der Lesbarkeitsschwelle besser verstehen. Eine weitere Frage befasste sich hier mit diesen Mikrodesigns und kann Ihnen weitere Hinweise geben.

Wo soll man anfangen

Jedes Designproblem beginnt mit einer Einschränkung. Mit einer guten Schriftart ist es [normalerweise] die beabsichtigte Verwendung. Wo muss Ihre Pixelschrift passen? Würde Ihr Spiel von leicht lesbarem Text profitieren oder muss der Text aus dem Weg gehen und nur bei Bedarf zum "Entschlüsseln" zur Verfügung stehen?

Sie müssen klären, ob Sie Kleinbuchstaben wünschen. Aufgrund der relativ einfachen Formen und des Fehlens von Extendern (unterhalb der Grundlinie und oberhalb der Kappenhöhe) kann eine Schrift in Großbuchstaben in ein kleineres Raster passen. Aber Kleinbuchstaben können auch recht klein werden: Gillespies Minx bietet einen hervorragenden Bezugspunkt für das, was ich für das kleinste vernünftige Kleinbuchstaben-Alphabet halte.

Minx ist ungefähr so ​​klein wie Kleinbuchstaben

Die Details

Selbst in den besten Pixelschriften werden Sie etwas bemerken: Sie sehen schrecklich aus, wenn Sie näher kommen und versuchen, sie herauszufinden. Sie sollen "wahrgenommen" werden, dh die Lücken im Design werden vom Gehirn ausgefüllt. So werden aus zwei auf 45 ° ausgerichteten Quadraten eine Diagonale. Manchmal ist ein Loch im Raster die "dünne" Linie zwischen zwei dicken Strichen.

Design aus der Ferne hautnah : Das ist die Herausforderung des Pixel-Font-Designers. Mit anderen Worten, Sie erstellen und ändern Ihre Formen in lächerlich kurzen Abständen, während Sie berücksichtigen, wie sie bei normaler Größe aussehen werden.

Der Computer ist unser Freund in dieser verwirrenden Situation: Lassen Sie einfach ein zweites Fenster mit einer 100% -igen Ansicht geöffnet, damit Sie sehen können, wie Ihr Design wirklich aussieht. Ein zweiter Monitor für diese "Reality-Ansicht" erleichtert die Arbeit erheblich.

Unterbringung der Kleinbuchstaben

Da Sie die Notwendigkeit für Kleinbuchstaben bei 6 x 12 erwähnt haben ...

Hier ist ein kurzes Beispiel, das ich zusammengestellt habe, um die spezifischen Überlegungen zu dieser Anforderung zu veranschaulichen.

Verzeih mir, es ist eine grobe Illustration

Für den Anfang habe ich einen Pixel von deiner Größe entfernt. Wenn Sie mit so kleinen Größen arbeiten, werden Sie feststellen, dass die Lesbarkeit von einem breiteren Charakterkörper profitiert. Die Kappen müssen nur geringfügig höher als die Kleinbuchstaben sein. Schauen Sie sich 9px Verdana an, um zu sehen, wie ein breiter Körper die Lesbarkeit verbessern kann.

Kleinbuchstaben mit prominenten Aufsteigern können oft besser gelesen werden, wenn sie etwas über die Höhe der Kappe hinausragen (wie bin meinem Beispiel). Mein Beispiel schafft es immer noch, auf einem 11px großen Körper zu bleiben. Dies wird durch die Tatsache unterstützt, dass die Lesbarkeit von langen Dezendern weniger beeinflusst wird: Nur ein paar Pixel reichen aus.

Sogar auf diesem restriktiven Raster können Sie sehen, welche kleinen Stilelemente Sie hinzufügen können, ohne die Lesbarkeit völlig zu beeinträchtigen.

In der Vergrößerung kann man sehen, wie seltsam die Dinge werden

Mit der x-Höhe und Körper als Referenz hervorgehoben:

Bildbeschreibung hier eingeben

Bei der vergrößerten MDarstellung ist das eine bemerkenswerte Überlegung. Mit einem geraden Zahlenraster haben Sie keinen einzigen Mittelpunkt, auf dem ein Pixel landen kann. Dies ist nicht unbedingt eine schlechte Sache, Sie müssen lediglich einige Entscheidungen treffen, die beim Vergrößern seltsam erscheinen. Die zweite Msieht beispielsweise beim Vergrößern ziemlich umständlich aus, ist jedoch eine Verbesserung der Bildschirmgröße. Diese impliziten Linien sind eine wichtige Komponente der meisten Pixelschriftarten.

Natürlich müssen Sie auch den zusätzlichen Platz berücksichtigen, der für den Buchstabenabstand erforderlich ist. Sie haben dort sicher nicht viel Platz zum Spielen, aber es ist ein wichtiger Teil der Lesbarkeit.

Schau auf die Meister

Wie bei jeder Kunstform lernst du am meisten, wenn du versuchst, das zu tun, was die Meister tun. Die Beispiele, die ich oben verlinkt habe, bieten Ihnen eine Fülle von Informationen.

Eine klassische Fallstudie für herausragende Pixelschriftarten ist Unibody 8 von Underware . Die neuartige aufrechte "kursive" Schrift erzielt ihren Effekt, indem 45 ° -Ausrichtungen verwendet werden, um den Winkel einer kursiven Schrift anzugeben, ohne dabei die gesamte Schrift zu beeinträchtigen.

Emigre war neben Susan Kare auf dem frühen Mac OS eine weitere Pionierin .

* Randnotiz:
Retina ist ein fantastisches Beispiel dafür, wie eine Druckschrift bei winzigen Größen das Unerwartete ausmacht, wie ich es als Vorgänger von Bell Centennial bezeichnen würde .

Die Netzhaut von H & FJ


Ich möchte in der Tat einen Kleinbuchstaben. Ich möchte, dass die 6x12-Schriftart beispielsweise in einer Konsole verwendet werden kann.
Joe Z.

Aber ja, das ist eine sehr gute Antwort, mit vielen Ressourcen, auf die ich noch näher eingehen kann. Vielen Dank.
Joe Z.

1
Sehr kleiner Zusatz: "Nah und fern" wird in Photoshop leicht erreicht, indem ein neues Fenster erstellt wird (Fenstermenü> Anordnen> Neues Fenster für Dokumentname-1) und eines davon mit einer Zoomgröße von 100% zur Seite verschoben wird "Vorschau Kopie"
Horatio

1
Keine Sorge, Sie haben die Idee. Ich glaube nicht einmal, dass du die zusätzliche Höhe brauchst. Ich würde einfach das zusätzliche Pixel auf der Breite hinzufügen und die Höhe zwischen 10 und 12 belassen. Spielen Sie mit ein paar Zeichen herum und sehen Sie, wo Sie am Ende landen.
Zivil

1
Ein Standardtestwort, das die Grundformen des römischen Alphabets erklärt, ist übrigens Hamburgefonts . Viele Schriftdesigner beginnen mit H, nund obekommen ein Gefühl für die wesentlichen Eigenschaften.
Zivil
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.