{"id":11591,"date":"2023-10-19T14:00:08","date_gmt":"2023-10-19T12:00:08","guid":{"rendered":"https:\/\/vielzutun.ch\/wordpress\/?p=11591"},"modified":"2023-11-15T17:50:09","modified_gmt":"2023-11-15T16:50:09","slug":"ducati-font-erweiterung","status":"publish","type":"post","link":"https:\/\/vielzutun.ch\/wordpress\/?p=11591","title":{"rendered":"DUCATI Giugiaro Font Erweiterung"},"content":{"rendered":"\n

F\u00fcr ein kleines privates Projekt, welches u.a. den Druck des Wortes «DESMO» auf wetterfeste und transparente Klebefolie umfasst, ben\u00f6tigt der von mir ins Auge gefasste Dienstleister als Druckvorlage den gew\u00fcnschten Schriftzug als Vektorgrafik<\/a>.<\/p>\n\n\n\n

\"\"<\/a>
Der zwischen 1977-1985<\/a> verwendete DUCATI Schriftzug von Giugiaro<\/figcaption><\/figure>\n\n\n\n

<\/p>\n\n\n\n

Dabei soll das Wort «DESMO» den oben abgebildeten Font des Schriftzugs «DUCATI» verwenden. Das stellte mich gleich vor zwei Probleme: <\/p>\n\n\n\n

    \n
  1. Ist das Wort «DESMO» meines Wissens nach nie von Ducati selbst in dieser Schriftart verwendet worden. Zwar gibt es diverse «Nachbauten», die mich aber allesamt nicht \u00fcberzeugen konnten weil die \u00fcber die im Wort «DUCATI» hinausgehenden Buchstaben «E», «S», «M» mehr oder weniger deutlich als Fremdk\u00f6rper erkennbar waren – das wirkte einfach nicht wie aus einem Guss.<\/li>\n\n\n\n
  2. Liegen selbst die im Internet auffindbaren Abbildungen des Schriftzugs «DUCATI» jeweils nur als Rastergrafik<\/a> (Bitmap) vor.<\/li>\n<\/ol>\n\n\n\n

    Was also tun? Ich entschied mich f\u00fcrs selber machen. \ud83d\ude0e<\/p>\n\n\n\n

    Mein Vorgehen war dabei wie immer: den bestehenden Ducati-Font analysieren, die verwendeten Regeln aufdecken bzw. mir bewusst machen, um dann diese Regeln bei der Konstruktion weiterer Buchstaben m\u00f6glichst stringent anzuwenden.<\/p>\n\n\n\n

    Analyse<\/strong><\/p>\n\n\n\n

    Ich habe mir also im Internet die h\u00f6chst-aufgel\u00f6ste Abbildung des eingangs verwendeten Schriftzugs herausgesucht die ich auf die Schnelle finden konnte, diese in Gimp Kontrast-maximiert um Kantensch\u00e4rfe zu erhalten, und habe diese Grafikdatei dann seitenf\u00fcllend ausgedruckt und mit dem Geodreieck daran herumgespielt.<\/p>\n\n\n\n

    Wenn man sich einen einzelnen Buchstaben genau anschaut, erkennt man ein 3×3 Raster aus gleich grossen, quadratischen Zellen:<\/p>\n\n\n\n

    \"Einzelbuchstaben<\/a>
    Giugiaro Ducati Font: Regelm\u00e4ssige Struktur entlang der Kanten eines quadratischen 3×3 Rasters<\/figcaption><\/figure>\n\n\n\n

    <\/p>\n\n\n\n

    Wenn man noch ein bischen genauer hinschaut, erkennt man sogar ein 9×9 Raster aus gleich grossen, quadratischen Zellen:<\/p>\n\n\n\n

    \"Einzelbuchstaben<\/a>
    Giugiaro Ducati Font: Regelm\u00e4ssige Struktur entlang der Kanten eines quadratischen 9×9 Rasters<\/figcaption><\/figure>\n\n\n\n

    <\/p>\n\n\n\n

    Das \u00fcberlagerte 9er-Raster macht schliesslich die konstruktiven Details des im Ducati Schriftzug verwendeten Fonts offenkundig:<\/p>\n\n\n\n

      \n
    1. Alle Buchstaben (mit Ausnahme des «I») weisen ein gleich grosses, quadratisches umh\u00fcllendes Rechteck<\/strong> auf.<\/li>\n\n\n\n
    2. die Konturen (je)des Buchstabens setzen sich ausschliesslich aus horizontalen und vertikalen Geradenst\u00fccken<\/strong>, sowie abschnittweise konzentrischen Viertelkreisb\u00f6gen<\/strong> zusammen.<\/li>\n\n\n\n
    3. Alle Streckenl\u00e4ngen<\/strong> und Radien<\/strong> sind ausschliesslich ganzzahlige Vielfache der Rasterweite «z»<\/strong>.<\/li>\n\n\n\n
    4. Start- und Endpunkte<\/strong> von Linien, sowie Mittelpunkte, Start- und Endpunkte<\/strong> von Kreisb\u00f6gen liegen ausschliesslich auf Rasterschnittpunkten<\/strong>.<\/li>\n\n\n\n
    5. Wenn man nun wieder einen Schritt zur\u00fcck tritt, l\u00e4sst sich festhalten, dass auch der Abstand<\/strong> zwischen zwei aufeinander folgenden Buchstaben exakt gleich der Rasterweite «z» ist:<\/li>\n<\/ol>\n\n\n\n

      <\/p>\n\n\n\n

      \"Ducati<\/a>
      Giugiaro Font: Abst\u00e4nde zwischen Einzelbuchstaben gleich Rasterweite<\/figcaption><\/figure>\n\n\n\n

      <\/p>\n\n\n\n

      Als «Bonus» kommt speziell bei der Abfolge der Buchstaben «D», «U», «C» und (mit kleinen Modifikationen:) «A» hinzu, dass sie alle die gleiche Grundform verwenden und diese lediglich um 0\u00b0, 90\u00b0, 180\u00b0 bzw. 270\u00b0 im Uhrzeigersinn verdreht gezeichnet wird. Dieser Umstand f\u00e4llt aber eher unter die Rubrik «innere Werte», und d\u00fcrfte beim Konstruieren weiterer Buchstaben wenig hilfreich sein.<\/p>\n\n\n\n

      Insgesamt finde ich es verbl\u00fcffend, wie extrem regelm\u00e4ssig diese Schriftart aufgebaut ist, und wie ausdrucksstark dieser sehr «technisch» anmutende Font vermutlich wegen seiner minimalistischen Nutzung unterschiedlicher Grafikelemente (nur horizontale bzw. vertikale Geraden, Viertelkreisb\u00f6gen) ausgefallen ist. Ihr Sch\u00f6pfer<\/a>, der Industriedesigner Giorgio Giugiaro<\/a>, wird von vielen seiner Kollegen f\u00fcr den einflussreichsten Automobil(!)designer des 20. Jahrhunderts gehalten.<\/p>\n\n\n\n

      Mit ein wenig Maschinenbau-geschulter Phantasie kann man sogar jeden Buchstaben als Kulissenf\u00fchrung<\/a> ansehen, in der ein zylindrischer Kulissenstein mit Durchmesser «Rasterweite» auf der weissen Bahn zwischen zwei \u00e4usseren, roten Begrenzungen zwangsgef\u00fchrt wird – \u00e4hnlich dem Finger einer Schaltgabel in einer Bahn der Schaltwalze eines Motorradgetriebes. Auch hier handelt es sich um eine Zwangsf\u00fchrung, welche den Wesenskern von Desmodromik ber\u00fchrt. Aber ich schweife ab …<\/p>\n\n\n\n

      Synthese<\/strong><\/p>\n\n\n\n

      Als Vektorformat w\u00e4hlte ich svg<\/a>, weil es standardisiert ist, lizenzfrei genutzt und von den g\u00e4ngigen Browsern interpretiert werden kann und f\u00fcr jemanden mit einschl\u00e4giger Erfahrung in 2D-Computergrafik leicht erlernbar ist. F\u00fcr meine ersten Gehversuche verwendete ich das Tutorial von w3schools<\/a>, wo einfache, \u00fcbersichtliche und lauff\u00e4hige Code-Schnipsel angeboten werden. Diese kann man in einer Sandbox («Try it Yourself \u00bb») leicht manipulieren, um sich interaktiv die Ergebnisse der eigenen \u00c4nderungen anzeigen zu lassen.<\/p>\n\n\n\n

      Mit der Erkenntnis der f\u00fcnf obigen Regeln aus der Analyse-Phase machte ich mich an die Konstruktion der Buchstaben «D», «E», «S», «M» und «O». War das «D» im urspr\u00fcnglichen 9er-Raster (s.o.) schnell implementiert, stellten mich die Buchstaben «E», «S»und «M» insofern vor eine Herausforderung, als sie auf halber H\u00f6he («E» und «S») bzw. halber Breite («M») eine zus\u00e4tzliche Linie ben\u00f6tigen. F\u00fcr diese war im 9er-Raster einfach kein freier Platz f\u00fcr das Dreigestirn aus Linie\u2011Leerraum\u2011Linie \u00fcbrig, welcher die mittlere (3-fach)-Linie als eigenst\u00e4ndiges Element des Buchstaben erkennbar gemacht h\u00e4tte.<\/p>\n\n\n\n

      Da ich keine der obigen f\u00fcnf Regeln verletzen wollte, entschied ich mich, ein 11er-Raster<\/strong> aus gleich grossen, quadratischen Zellen zu verwenden. So sieht nun das Ergebnis aus:<\/p>\n\n\n\n

      \"Erweiterter<\/a>
      Erweiterter Ducati Giugiaro Font (Logo): Schriftzug «DESMO» im 11er-Raster<\/figcaption><\/figure>\n\n\n\n

      <\/p>\n\n\n\n

      Zu behaupten, ich h\u00e4tte keine Regel verletzt, wenn ich sie bewusst garnicht erst formuliert habe, ist nat\u00fcrlich unfair. Ich h\u00e4tte als Regel 6 hinzuf\u00fcgen k\u00f6nnen, dass ein 9er Raster zu verwenden ist. Dann h\u00e4tte ich mir mit dem Wechsel auf ein 11er Raster selbstverst\u00e4ndlich einen Regelverstoss eingefangen. Andererseits k\u00f6nnte man als Regel 7 formulieren, dass jeder «Stroke» dreispurig auszuf\u00fchren ist, mit Farbe-Leerraum-Farbe. Dann h\u00e4tte selbst Maestro Giugiaro sich beim Querstrich des «A» seine k\u00fcnstlerische Freiheit geg\u00f6nnt: <\/p>\n\n\n\n

      \"Originaler<\/a>
      Original Giugiaro Font: der Schriftzug DUCATI im 9er Raster<\/figcaption><\/figure>\n\n\n\n

      <\/p>\n\n\n\n

      Im direkten Vergleich zwischen einem 11er Raster und einem 9er Raster f\u00e4llt auf, dass der Font im 11er Raster «luftiger» wirkt. Und er wirkt nicht nur so, sondern ist es auch z\u00e4hlbar: Das umh\u00fcllende Quadrat des Buchstaben «D» z.B. weist im 11er Raster rund 59% seiner Fl\u00e4che als Leerraum auf, w\u00e4hrend der gleiche Buchstabe im 9er Raster nur rund 53% Leerraum aufweist. Was man sch\u00f6ner findet, ist vermutlich Geschmackssache. Ich pers\u00f6nlich tendiere zum «wuchtigeren» Original.<\/p>\n\n\n\n

      Zum Vergleich habe ich den Text «DESMO» trotz der oben erw\u00e4hnten Platznot bei den Buchstaben «E», «S» und «M» doch auch einmal im 9er Raster implementiert, musste dabei nat\u00fcrlich Kompromisse an anderer Stelle eingehen:<\/p>\n\n\n\n

      \"Erweiterter<\/a>
      Erweiterter Ducati Giugiaro Font (Logo): Schriftzug «DESMO» im 9er-Raster<\/figcaption><\/figure>\n\n\n\n

      <\/p>\n\n\n\n

      Bei den Buchstaben «E» und (um 90\u00b0 gedreht als) «M» verwende ich den vom Maestro schon beim «A» angewandten Platzspar-Trick, wenn auch hier gezwungenermassen. Mit dem «S» im 9er Raster hadere ich allerdings noch ein wenig. Zumal hier – wem ist’s aufgefallen? – ein subtiler Verstoss gegen Regel 3 vorliegt: die Radien der Kreisb\u00f6gen sind hier nicht, wie gefordert, ganzzahlige Vielfache der Rasterweite z, also 1.0*z, 2.0*z und 3.0*z, sondern liegen mit 0.5*z, 1.5*z und 2.5*z systematisch jeweils um eine halbe Rasterweite unterhalb der Vorgabe. Damit ist auch Regel 4 verletzt.<\/p>\n\n\n\n

      Ich f\u00fcrchte, einen<\/em><\/strong> Tod muss man hier sterben. Ich weiss nur noch nicht, welche Todesart ich bevorzugen werde.<\/p>\n\n\n\n

      Anbei die im Browser lauff\u00e4hige html-Datei mit eingebettetem svg-Code, welcher den oben gezeigten, roten Schriftzug «DESMO» im 11er-Raster<\/strong> zeigt. Die Umsetzung im 9er Raster \u00fcberlasse ich dem geneigten Leser :p<\/p>\n\n\n\n

      \n\n\n\n
      DESMO_11<\/a>Herunterladen<\/a><\/div>\n","protected":false},"excerpt":{"rendered":"

      F\u00fcr ein kleines privates Projekt, welches u.a. den Druck des Wortes «DESMO» auf wetterfeste und transparente Klebefolie umfasst, ben\u00f6tigt der von mir ins Auge gefasste Dienstleister als Druckvorlage den gew\u00fcnschten Schriftzug als Vektorgrafik. Dabei soll das Wort «DESMO» den oben abgebildeten Font des Schriftzugs «DUCATI» verwenden. Das stellte mich gleich vor zwei Probleme: Was also … “DUCATI Giugiaro Font Erweiterung” <\/span>weiterlesen<\/a><\/p>\n","protected":false},"author":3,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_stc_notifier_status":"","_stc_notifier_sent_time":"","_stc_notifier_request":false,"_stc_notifier_prevent":false,"_stc_subscriber_keywords":"","_stc_subscriber_search_areas":"","footnotes":""},"categories":[184,3,211],"tags":[148,262,261,13,263,254,260,256,258,255,259,257],"class_list":["post-11591","post","type-post","status-publish","format-standard","hentry","category-computergrafik","category-ducati","category-engineering","tag-desmo","tag-doppelschrift","tag-download","tag-ducati","tag-erweiterung","tag-font","tag-giugiaro","tag-logo","tag-rastergrafik","tag-schriftzug","tag-svg","tag-vektorgrafik"],"_links":{"self":[{"href":"https:\/\/vielzutun.ch\/wordpress\/index.php?rest_route=\/wp\/v2\/posts\/11591","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/vielzutun.ch\/wordpress\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/vielzutun.ch\/wordpress\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/vielzutun.ch\/wordpress\/index.php?rest_route=\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/vielzutun.ch\/wordpress\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=11591"}],"version-history":[{"count":139,"href":"https:\/\/vielzutun.ch\/wordpress\/index.php?rest_route=\/wp\/v2\/posts\/11591\/revisions"}],"predecessor-version":[{"id":12067,"href":"https:\/\/vielzutun.ch\/wordpress\/index.php?rest_route=\/wp\/v2\/posts\/11591\/revisions\/12067"}],"wp:attachment":[{"href":"https:\/\/vielzutun.ch\/wordpress\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=11591"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/vielzutun.ch\/wordpress\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=11591"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/vielzutun.ch\/wordpress\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=11591"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}