Verwendung

Ein praktischer Workflow für Textumrisse, SVG-Fontaufbau, Quellfontbearbeitung, Subsets, Konvertierung und Webpakete.

1. Fonts importieren

• Ziehe eine Fontdatei in das Hauptfenster.
• Oder verwende Datei → Fontdatei importieren.
• Für die Glyphenansicht werden ttf, woff und woff2 unterstützt.
• Jeder neue Import ersetzt die Sitzungsdaten; mehrere Fonts werden nicht in einer Sitzung zusammengeführt.

2. Glyphen durchsuchen und filtern

• Filtere in der linken Seitenleiste nach Unicode-Blöcken wie Basic Latin, CJK oder Emoji.
• Suche nach Glyphennamen oder Unicode-Text.
• Tastaturkürzel:
  • Command + Klick: nicht zusammenhängende Mehrfachauswahl
  • Shift + Klick: Bereich auswählen
  • Command + A: alle auswählen
  • Delete: ausgewählte Glyphen aus dem aktuellen Datensatz entfernen
  • Leertaste: ausgewählte Glyphe in der Vorschau anzeigen

3. Metadaten prüfen

Der Inspektor rechts enthält drei Tabs:

• Font: Metadaten sowie Zusammenfassung von OpenType-Layout, Skripten und Features; Erkennung variabler Fonts.
• Auswahl: Glyphendaten wie Unicode, HTML-Entity, CSS-/Swift-Notation, UTF-Kodierungen und Metriken.
• Export: Glyphenexport, Text zu SVG, Subset-Erstellung und Webpaket-Workflow.

4. Text in SVG-Umrisse umwandeln

Öffne nach dem Laden eines Fonts im Export-Tab Text zu SVG.

• Gib Wörter, Sätze oder mehrzeiligen Text ein.
• Passe Schriftgröße, variable Stärke, Laufweite, Zeilenhöhe, Umbruchbreite, Ausrichtung, Innenabstand und Füllfarbe an.
• Deaktiviere Fallbacks, wenn die SVG-Ausgabe dem geladenen Font treu bleiben soll.
• Kopiere das SVG in die Zwischenablage oder speichere es als eigenständige .svg-Datei.
• Die Ausgabe enthält Umrisse; der Font muss am Einsatzort nicht installiert sein.

5. Fonts aus SVG-Grafiken erstellen

Öffne Font Builder über das App-Menü.

• Ziehe umrandete SVG-Dateien hinein, um einen neuen Font zu erstellen.
• Weise Glyphennamen und Unicode-Werte zu.
• Importiere einen statischen TrueType-Quellfont, wenn du Glyphen hinzufügen oder ersetzen möchtest.
• Wähle mit „Glyphen durchsuchen“ Ersetzungsziele aus.
• Lade vor dem Zeichnen eine SVG-Vorlage mit Grundlinien- und Begrenzungshilfen herunter.
• Führe vor dem Export den Preflight Check aus.
• Exportiere TTF, WOFF, WOFF2, CSS, Demo-HTML, Metadaten oder ein vollständiges Webpaket.

Font Builder erwartet statische SVG-Grafiken mit Umrissen. Wandle Text vor dem Import in Umrisse um. Live-SVG-Text, Rasterbilder, Masken, Filter, Clipping, Skripte, Animationen und externe Ressourcen werden abgelehnt.

6. Font-Builder-Projekte speichern und öffnen

Verwende .webfontproject, wenn du später an einem Projekt weiterarbeiten möchtest.

• Projektdateien speichern Glyphen, Build-Einstellungen, Ausgabeoptionen, Ersetzungsziele und gegebenenfalls eingebettete Quelldaten.
• Beim Öffnen werden Glyphensatz und Quelldaten aus dem Paket wiederhergestellt.
• Konfigurierte Ersetzungsziele werden anhand der gespeicherten Quelldaten wiederhergestellt.

7. Glyphen-Assets exportieren (SVG / PNG / PDF)

• Einzelauswahl und Stapel-Export mehrerer Glyphen werden unterstützt.
• Im Exportdialog lassen sich Größe und Farbe bestimmen.
• Dateinamen basieren auf Glyphennamen und einem Größenanhang.

8. Subset-Fonts erzeugen

Quellmodus

• Aktuelle Auswahl: ausgewählte Glyphen direkt verwenden.
• Texteingabe: Text einfügen oder TXT importieren und verfügbare Zeichen im geladenen Font abgleichen.

Ausgabeformate

Wähle beliebige Kombinationen aus WOFF2, WOFF und TTF.

OpenType-Steuerung

• Layout vollständig erhalten
• nur wesentliche Positionierung behalten
• alle Layouttabellen entfernen
• nur ausgewählte Feature-Tags behalten oder bestimmte Tags entfernen

Validierung und Vorschau

Die Subset-Vorschau zeigt Glyphenanzahl, geschätzte Dateigröße und fehlende Zeichen. Vor dem Schreiben werden Dekodierung, erforderliche Tabellen, cmap-Abdeckung und verwandte Warnungen geprüft.

9. Webpaket erstellen

„Webpaket erstellen“ erzeugt:

• fonts/ mit WOFF2 und WOFF
• eine CSS-Datei mit @font-face und unicode-range
• demo.html für Vorschau und Zeichenzuordnung

Font Builder bietet außerdem einen eigenen Webpaket-Export für Icon-Font-Pakete mit CSS, Demo-HTML, Metadaten, Glyphenvorschauen und HTML-Snippets.

10. Fontformate konvertieren

• Einzelne Fontkonvertierung: eine Datei konvertieren.
• Stapelkonvertierung: eine Warteschlange verwenden.
• Eingaben: ttf, otf, woff und woff2.
• Ziele: WOFF, WOFF2 oder TTF/OTF automatisch.

11. Aktuelle Einschränkungen

• Subsets unterstützen jeweils einen Quellfont.
• Subset-Ausgaben unterstützen derzeit nur TrueType-Umrissfonts.
• Die Quellfontbearbeitung von Font Builder unterstützt statische TrueType-Fonts.
• SVG-Eingaben für Font Builder müssen statische Grafiken mit Umrissen sein.
• Text zu SVG kann eine variable Stärkenachse für die Umrissausgabe verwenden, wenn der geladene Font sie anbietet.