Jump to content
Die besten Typografie-Links bequem per E-Mail erhalten.

Material Icon Font im InDesign

Empfohlene Beiträge

Martin Schulz

Hallo zusammen, 

 

ich bin ja ein großer Freund des cleveren Iconfonts Ligature Symbols von Kazuyuki Motoyama, weil sich der mit der Ligaturfunktion so wunderbar im InDesign verwenden lässt. 

Begriff tippen --> Icon kriegen. Fein.

 

Deshalb habe ich mich gefreut, als ich gelesen habe, dass der neue Material Icon Font von Google auch so verwendet werden kann. Das funktioniert auch ganz prächtig im Photoshop – leider stellt InDesign* die Zeichen, aus denen die Ligatur zusammengestellt wird, mit kleinen Outline-Rechtecken dar.

 

Weiß jemand, warum das so ist?

 

Ich habe die .ttf über die Schriftensammlung aktiviert.

*MacOS 10.11.1 / Adobe CC 2015

 

bfonk1.png

 

Gespannt grüßt

Martin

Link zu diesem Kommentar
Jens Kutilek

Ich vermute, das liegt daran, daß dem Font das Leerzeichen fehlt. InDesign ersetzt bei einer Ligatur die weggefallenen Glyphen durch Leerzeichen, das in diesem Font, weil es nicht enthalten ist, durch das "notdef"-Kästchen dargestellt wird.

Link zu diesem Kommentar
Martin Schulz

Vermutlich sehr naive Frage an den Profi: Kann man das Leerzeichen denn unproblematisch mit Fontographer oder Glyphs in den Zeichensatz "randengeln"?

Link zu diesem Kommentar
Þorsten

Ich vermute, das liegt daran, daß dem Font das Leerzeichen fehlt. InDesign ersetzt bei einer Ligatur die weggefallenen Glyphen durch Leerzeichen, das in diesem Font, weil es nicht enthalten ist, durch das "notdef"-Kästchen dargestellt wird.

Das hatte ich auch erst vermutet, die Vermutung dann aber wieder verworfen, weil .notdef in diesem Font ganz andere Proportionen hat als im Screenshot. Und was das ID-Verhalten angeht, verstehe ich nicht, wie das im Normalfall funktioniert. Entstünden keine Lücken im Text, wenn wegfallende Glyphen durch das normale Leerzeichen (U+0020) ersetzt würden? Oder meinst du etwa das nullbreite »Leerzeichen« (U+2008)? Das bringt aber lange nicht jeder Font mit, sodass dieses Problem wohl öfter auftreten sollte? :-?

 

Kann man das Leerzeichen denn unproblematisch mit Fontographer oder Glyphs in den Zeichensatz "randengeln"?

Solange die Lizenz das erlaubt (hier ja), ja. :rockon:

Link zu diesem Kommentar
Martin Schulz

Danke Euch beiden für das Feedback. Ich werde mich mit meinen beiden linken Händen mal an das offene Herz wagen – in der Hoffnung, dass der Patient diesen Eingriff überlebt. Trotz der inzwischen an einigen Stellen in Netz geäußerten Kritik an der grafischen Konsistenz der Icons, finde ich die doch sehr gelungen und die Ligaturfunktion äußerst praktisch.

 

Beste Grüße

Martin

Link zu diesem Kommentar
  • 8 Monate später...
johahannes

Ist zwar etwas spät, aber ich stand gerade vor dem selben Problem und habe einen relativ simplen Workaround gefunden, dass die Icons zumindest korrekt in InDesign verarbeitet werden können – nur leider ohne die praktische Ligaturfunktion, sondern anhand der Glyphen-Palette.

 

Man kann die Icons in Illustrator "schreiben" und dann per Copy & Paste bei InDesign in den gewünschten Textkasten einfügen. Das Icon wird in InDesign weiterhin als Text behandelt und man kann es in wie gewünscht be- und verarbeiten. Keine Ahnung warum es so funktioniert, aber es funktioniert, wenn auch etwas umständlich! 

  • Gefällt 1
Link zu diesem Kommentar
Martin Schulz

Hallo johahannes,

 

der Workaround hat beim mir leider nicht funktioniert – ich habe aber gerade durch Zufall die Lösung für das Problem gefunden:

 

Die rätselhaften Kästchen verschwinden, sobald die Option Globaler Ein-Zeilen-Setzer bzw. Globaler Adobe-Absatzsetzer (über die Absatzformatvorlagen unter "Abstände" oder direkt im Kontextmenü der Absatz-Palette) aktiviert wird.

mat-icons-absatzsetzer.jpg

  • Gefällt 1
Link zu diesem Kommentar
  • 2 Wochen später...
Gast Arno Enslin

@ Martin

 

Die Rechtecke könnten sich überlagende .notdef-Zeichen sein.

 

Ich vermute, dass das Problem nicht entstünde, wenn die Zeichen a–z und underscore die Breite Null hätten. Sie haben aber eine Breite von 512 Einheiten. Wenn du „lightbulb_underscore“ eingibst, versucht Indesign, das „Wort“ wahrscheinlich zu trennen, bevor das OpenType-Ligatur-Feature greift, denn 20 Zeichen mit einer Breite von 512 Einheiten passen bei einem großen Schriftgrad nicht unbedingt in eine Zeile.

 

Keine Ahnung, warum die Rechtecke bei dir in Indesign auch unter das Glühbirnen-Icon gezogen werden. Hast du da eventuell am Zeichenabstand (Lauweite/Kerning) rumgespielt und außer dem Code für das Glühbirnen-Icon noch weitere Zeichen eingegeben? Wie auch immer. Das Problem müsste sich leicht beheben lassen:

 

Du könntest den Font mit TTX dekompilieren und die Breite der Zeichen a–z und Underscore auf den Wert 0 setzen. Ebenso den Wert für lsb (left side bearing). TTX ist kostenlos und im AFDKO (Adobe Font Development Kit for OpenType) enthalten.

 

<hmtx>
    <mtx name=".notdef" width="512" lsb="17"/>
    <mtx name="a" width="512" lsb="0"/>
    <mtx name="b" width="512" lsb="0"/>

u. s. w.

 

Mal abgesehen davon würde es Sinn machen, die Zeichen, die das Ligatur-Feature ersetzen soll, mit einer Outline zu versehen. Sonst weiß man ja gar nicht, welche und wie viele Zeichen man eingetippt hat. Wenigstens ein Bullet als Dummy, damit man weiß, wie viele Zeichen man eingegeben hat, bevor das Ligatur-Feature greift. Oder z. B. mittig platzierte Buchstaben mit geringer Breite (150 bis 200 Einheiten).

Link zu diesem Kommentar
Gast Arno Enslin

@ Martin

 

1. Die Rechtecke sind sich überlappende .notdef-Zeichen.

2. Sie werden angezeigt, weil Indesign offenbar ein Space/Leerzeichen im Font braucht. Ich habe es hinzugefügt. Siehe Anhang.

 

Vermutung: Die Zeichenfolgen, die das Liga-Feature durch ein einziges anderes Zeichen ersetzen soll, werden von Indesign nicht nur durch dieses eine Zeichen ersetzt, sondern außerdem durch eine Folge von Leerzeichen, wobei Indesign die Breite des Leerzeichens zu verändern scheint und sie „unter“ das ersetzte Zeichen zieht. Ist im Font kein Leerzeichen vorhanden, ersetzt Indesign die Folge der Leerzeichen durch eine Folge von .notdef-Zeichen.

 

 

MaterialIcons-Regular.ttf

Link zu diesem Kommentar
catfonts

Ich hab ja auch schon Schriften nach diesem Schema gebaut, z.B. die Tyskland45. Und bei derartigen Symbol über Superligatur-Schriften kommt immer zumindest der Zeichensatz, der auch für die Code-Eingabe nötig ist aus irgend einem meiner Textfonts dort hinein. Zum einen spart man sich solche Sideeffekte, weil so nicht schon bei der Code-Eingabe das .notfef - Zeichen kommen kann, man aber auch sieht, was man da als Code eingibt.

 

Das werde ich auch so beibehalten.

Link zu diesem Kommentar
Gast Arno Enslin
vor 13 Stunden schrieb catfonts:

Und bei derartigen Symbol über Superligatur-Schriften kommt immer zumindest der Zeichensatz, der auch für die Code-Eingabe nötig ist aus irgend einem meiner Textfonts dort hinein.

Gibt es eigentlich einen Opensource-Font, dessen Lizenz es erlaubt, einige seiner Zeichen in einen anderen Font zu übertragen? Der Name des Fonts, aus dem die übertragenen Zeichen stammen, kann in dem Fall ja nicht beibehalten werden.

 

Übrigens hat der Material Icon Font die ungewöhnlich geringe UPM-Größe 512. Allzu komplex dürften die Formen eines Dummy-Alphabets in dem Font nicht sein, wenn man die Größe der Outlines im Vergleich zu den Icons auf die Hälfte oder weniger reduziert, oder? Ich glaube, ich würde für den Zweck auf einen Pixel-Font (Begriff?) zurückgreifen.

Link zu diesem Kommentar
catfonts
vor 20 Minuten schrieb Arno Enslin:

Ich würde für den Zweck auf einen Pixel-Font (Begriff?) zurückgreifen.

Ich nicht! Pixelfonts sind hier denkbar ungeeignet, da sich diese überhaupt nicht mit Vektorfonts mixen lassen, denn die funktionieren Technisch gänzlich anders, und ein vektorisierter Pixelfont hätte grade bei den niedrigen UPM-Werten seine Probleme, da die Konturen dieses Fonts dann mit Garantie in verschiedener Darstellungsgröße auf halbe Bildschirmpixel landen würden.

 

Ich habe mir aber für weitere Projekte dieser Art einen speziellen Font gebaut und da tatsächlich auf halbe Höhe gesetzt. Das war ein Entwurf für eine Fibelschrift, der aber dann so viele Änderungen bekommen sollte, dass ich diesen Entwurf da nicht nutzen konnte. Der Font ist also wieder unter SIL OFL, und hat sogar ein ẞ

 

Smaa.zip

Link zu diesem Kommentar
Gast Arno Enslin

„Pixelfont“ war wohl der falsche Begriff. Ich meinte eher eine Schrift mit gleich bleibender Strichbreite mit möglichst einfachen Outlines. Die Smaa ist schon komplexer als das, was ich mir vorgestellt habe. Aber sie ist schön schmal.

 

Wenn ich die SIL OFL richtig verstehe, würde sie die Einbettung in den Material Icon Font verbieten, weil der unter einer anderen Lizenz (Apache License Version 2.0) steht. Der Material Icon Font dürfte nach der Einbettung der Smaa nur unter SIL OFL verbreitet werden, oder?

Link zu diesem Kommentar
catfonts

Dann mach ich 'ne Tripple-Lizenz draus, ist ja mein Font und meine Entscheidung. Also wahlweise GPL, OFL oder Apache, und speziell einen ausdrücklichen Freibrief für die Nutzung als Placeholder- und Dummi-Glyphen in anderen Fonts. denn dafür hab ich sie ja jetzt speziell gemacht

 

Smaa.zip

 

Hier die Datei mit erweiterter Lizenzangabe im Font, du brauchst die aber nicht unbedingt runter laden, wenn du dir die Glyphen schon aus der ersten geholt hast. das ist ist nur ordnungshalber für alle, die so etwas vor haben.

  • Gefällt 1
Link zu diesem Kommentar
catfonts

Und wer Smaa dann mal in Aktion sehen möchte, hier mein Anlaut-Quiz

Da habe ich aus meinem Anlaut-Font ein OpenType-Quiz gemacht: Man gibt einen deutschen Begriff ein, ist der im Font hinterlegt, erscheint statt dessen eine Grafik. jetzt heißt es, die korrekte englische Übersetzung zu finden, gibt man die ein, sollte das gleiche Bild kommen.

 

Die hinterlegten Begriffe sind

Ring ring         Apfel apple    Ball ball
Clown clown    Dose can     Eimer bucket
Fisch fish        Glas glass    Hammer hammer
Igel hedgehog    Jacke jacket     Kerze candle
Leuchtturm
 lighthouse    Maus mouse    Nadel needle
Ofen oven    Paket package    Qualle jellyfish
Schirm umbrella    Säge saw    Tasse cup
Uhr clock        Vogel bird    Würfel dice
Xylofon xylophone    Yacht boot    Zange pliers
Klammer clip    Anker anchor    Baum tree
Computer computer;    Dino dinosaur    Elefant elephant
Fernseher tv set    Gitarre guitar    Hut hat
Insel island    Joghurt yoghurt     Kanne jug
Leiter ladder    Messer knife    Nashorn rhino
 
Bus bus        Pilz mushroom    Quirl whorl
Radierer erazor    Sonne sun        Telefon telephone
Hose briefs    Vase vase    Waage scale
Jo Jo yoyo    Zebra zebra    Eichhörnchen squirrel
Hamburger burger    Äpfel apples    Schwein pig
Pfanne pan    Ölkanne oil can     Überholverbot no overtaking
Fuß feet        Ei egg        China china    
Ähre ear        Schere scissors    Pferd horse
Ölsardine sardine can     Sparschwein piggybank    Augen eyes
Auto Trabant car    Buch book    Stern star    
Eule owl        Faß barrel    Schaf sheep
Ziege oat    Eber boar    Sau sow
Ferkel piglet    Kuh cow cattle    Hengst stallion
Hahn rooster    Huhn chicken    Küken chicklet
Hase rabbit    Möwe seagull

 

Zusätzlich gibt der Font bei Zahleneingabe jeweuils für 2 Ziffern einen Dominostein aus.

 

AlfaQuiz.zip

 

 

Link zu diesem Kommentar

Erstelle ein Benutzerkonto oder melde dich an, um zu kommentieren

Du musst ein Benutzerkonto haben, um einen Kommentar verfassen zu können

Benutzerkonto erstellen

Neues Benutzerkonto für unsere Community erstellen. Es ist einfach!

Neues Benutzerkonto erstellen

Einloggen

Du hast bereits ein Benutzerkonto? Melde dich hier an.

Jetzt anmelden

Unsere Partner

FDI Type Foundry besuchen
Schriftlizenzierung, einfach gemacht.
Hier beginnt deine kreative Reise.
Curated Quality Fonts from I Love Typography
Great Design Assets Just Got Affordable
Mit über 130.000 Fonts der größte Schriften-Shop im Internet.
Unterstütze den Fortbestand der Community und sichere Dir Zugang zu einem ständig wachsenden Angebot an exklusiven Inhalten.
×
×
  • Neu erstellen...

🍪 Hinweis:

Wir benutzen funktionale Cookies.