• Accademia
  • Partners
  • Piratevent
  • ContattI
  • Policy

Pirati Grafici | Community

Pirati Grafici | Community

Navighiamo nel mondo della grafica, della comunicazione e della creatività!

PiratiGrafici | Blog & Community
Per mari e oceani del mondo.

Apri in Google Maps
  • AHRRR
    • Grafica
      • Graphic Design
      • Adobe
      • Logo Design
      • Digital Art
      • Grafica 3D
      • Illustrazione
      • Creatività
      • Inspirational
      • Calligrafia
      • Risorse Free
    • Pubblicità
      • ADV
      • Fotografia
      • Guerrilla & ambient mkt
      • Spot Tv
      • Creative ADV
      • Autori
    • Stampa
      • Prestampa
      • Tipografia
    • Web
      • Social media marketing
      • UI e UX
      • App
      • Seo e web marketing
    • Rubriche
      • La settimana grafica
      • Essere Freelance
      • Ok il prezzo è giusto
      • Interviste
      • Libri
      • Video
      • Pappe e Pixel
      • Bug Adobe Creative Cloud
      • Pimp my parrot
      • Delete TV
    • Novità sulla nave
      • Tutte le news
      • Eventi
      • PIRATEVENT
      • Contest
      • Curiosità dal mondo
      • Trends
  • We Are Pirates
    • Tutto su di noi
    • Lo Staff dei Pirati
    • Gallery
    • Newsletter
    • Contatti
    • Policy
  • Progetti
    • yourbestbdv
    • #drawyourpride – invia il tuo contributo
    • Portfolio
    • Comunicato Stampa
    • PIRATEVENT
    • Proponi un progetto
  • Blog & Stories
    • Blog
    • Novità sulla nave
    • Come hanno hackerato i Pirati Grafici
    • Accademia del Covo
    • Social Wall
  • Partners
    • Partners dei Pirati
    • Fiscozen
    • Flyeralarm
    • Freepik
    • Juice Radio Italia
    • Diventa Partner
  • Segnalazioni
Betav. 3.1
Esempio variable font
Giorgio Casarico
martedì, 03 Aprile 2018 / Pubblicato il Novità

Dal piombo al responsive design, la nuova frontiera dei font

Caro font ti scrivo

Tutto ebbe inizio con Gutenberg, fu il primo a trasformare i testi manoscritti in composizioni di caratteri mobili di piombo o legno eliminando gli errori di trascrizione e ampliandone la diffusione.
Questi ultimi, per via della loro formazione, diedero il nome font (da fount, termine francese che indica la fusione) ai set di caratteri con il medesimo stile grafico.
I macchinari da stampa evolsero introducendo la composizione tipografica automatica, fino alla smaterializzazione di oggi dove il termine font viene usato per indicarne il file elettronico presente sui nostri device elettronici.
Caratteri mobili prima dei variable font e Opentype 1.8
Opentype file prima dei variable font e Opentype 1.8
Come già scritto ampiamente qui: nell’uso informatico è impiegato l’anglismo font, usato prevalentemente al maschile mentre in tipografia si ha più familiarità con il francesismo fonte, per il quale si preferisce il genere femminile.
Di seguito per comodità useremo il termine derivato dall’inglese al maschile.

Evoluti sotto i nostri polpastrelli

I font sono la voce del linguaggio scritto e, nell’era digitale, questo l’hanno capito bene i pilastri della tecnologia e della comunicazione – Adobe, Apple e Microsoft – che fin da subito se ne sono contesi il primato.
Inizialmente erano costituiti da semplici bitmap finché non venne sviluppato da Adobe il Type 1 basato su PostScript (lo stesso dei PDF) e adottato da Apple.
Successivamente viene sviluppato il linguaggio TrueType e adottato sia da Apple (solo durante l’output di stampa) che da Windows (anche visibile a monitor). Questo linguaggio era però incompatibile tra un sistema e l’altro, ma viene ancora usato senza problemi per alcuni font di sistema.
Adobe corse ai ripari creando l’estensione Atm al Type 1 che permise anche ad Apple di mostrare i font a video.
In quel periodo Microsoft rimase svantaggiato per via della difficoltà di comunicazione con le stampanti, risolto grazie ad Adobe con l’avvento del linguaggio OpenType, adottato anche da Apple dal 2002 fino ad oggi.
Quest’ultimo diviene così il primo linguaggio multipiattaforma, con codifica Unicode che associa un codice univoco ai glifi e la presenza di glifi alternativi, legature grazie alla disponibilità di ben 65.536 glifi differenti.
L’OpenType è cresciuto fino ad esser in grado di supportare, grazie al linguaggio vettoriale Svg, i colori gradienti all’interno delle font (come le Emoji e le icone di Font Awesome qui).
Opentype svg prima dei variable font e Opentype 1.8

Pericolo inondazione

Più di 25 anni fa grazie al TrueType GX e al Multiple Master, formati speciali che consentivano di variare il font originale tramite interpolazione per ottenere infinite varianti, alcuni type designer tra cui Tom Rickner avevano avviato i primi esperimenti di fluidificazione.
Ma è il 14 settembre 2016 la data che segna la vera svolta: Apple, Microsoft, Adobe e il “neoassunto” Google insieme hanno annunciato l’avvento dell’OpenType 1.8.

Interessante demo del Lab DJR font variabile dell’intraprendente David Jonathan Ross

Il file permetterà di incorporare più font di una stessa famiglia che diventeranno ufficialmente variabili in peso (dall’Extra condensed thin all’Ultra Black più Black del Black), postura, proporzione orizzontale, proporzione verticale e molto altre.
I punti dei tracciati dei caratteri saranno inoltre modificabili lungo 64.000 assi interpolati tra loro e gestibili manualmente (e non solo) tramite slider.
Tenendo a mente l’obbiettivo di avvicinarsi al target, la creatività per tutti i designer del mondo non avrà più limiti tipografici, anche online, dove anche i font saranno in grado di adattarsi responsivamente al contenuto, all’orientamento del dispositivo, alla luminosità e allo zoom…

Come, dove, quando?

O-r-a!
È una tecnologia in fase di sviluppo e per questo non è ancora affidabile ma sarebbe bene provarla progressivamente per capirne le potenzialità.

MacOS

Libro Font è in grado di installare anche le variable font, ma non di mostrarle in maniera fluida, fortunatamente per questo c’è FontView creato da Google tramite l’utilizzo di librerie open-source.

Online

Disponibili grazie all’introduzione nel linguaggio CSS4 dei font variation setting, ma visibili solo con i browser supportati come Safari 11 (su MacOS 10.13+ e iOS11), parzialmente Chrome 65, Firefox in versione beta spuntando gli opportuni flag e, come da poco annunciato nell’imminente release di Edge, versione 17.

Sito riportato qui sopra: v-fonts (raccolta); altri siti: letterror (esempi) e axis-praxis (raccolta e non solo)

Adobe Creative Cloud

Anche Adobe “di nascosto” li ha introdotti già dagli aggiornamenti di ottobre 2017 di Illustrator e Photoshop: permettono facilmente di scoprirli, dapprima includendo Acumin, Minion, Myriad, Source Code e successivamente Source Sans e Source Serif.

Variable font e Opentype 1.8 in Illustrator CC

Pannello carattere in Illustrator CC 2018 con aggiunta slider

Create

I primi software per type designer ad essersi aggiornati per la creazione di font variabili sono Font Lab Studio 6 e Gliphs. Online sono scaricabili molti altri tool programmati in Python come FontMake, SuperPolator3 e Robofont.

Missing font

Che questa sia l’occasione giusta per riscoprire, come ci dimostrano anche le aziende leader che commissionano “font su misura” (ultimo ma non ultimo Netflix), l’importanza delle font e dei valori tipografici?
Sarà necessario inoltre studiare nuove regole sul copyright e al loro tipo di vendita, qualcuno ipotizza in base al numero di assi attivi.
L’importante è evitare che questa novità in mano ai meno esperti crei “nuovi mostri” perché, come dice Bruno Munari, complicare è facile, semplificare è difficile!

Gif creata da Bernd Volmer, creatore dell’immagine coordinata insieme a Olli Meier del TYPO Labs conference del 2018 a Berlino

Giorgio
SalvaSalva
SalvaSalva
SalvaSalva
SalvaSalva
SalvaSalva
SalvaSalvaSalvaSalva
SalvaSalva
SalvaSalva
SalvaSalva
SalvaSalvaSalvaSalva
SalvaSalva
SalvaSalva
SalvaSalva

Taggato in: adobe, Adobe Creative Cloud, font, grafica, graphic design, Gutemberg, OpenType, TrueType

Articoli recenti

  • L’importanza dei colori nel Brand Design

  • maluma-takete---patrizia-anna-coccia

    La percezione delle forme: alla scoperta delle linee con maluma e takete

  • La percezione delle forme nel brand design

  • Cromostereopsi, l’illusione visiva

  • viva magenta - pirati grafici

    Esploriamo Viva Magenta, il colore Pantone 2023

Categorie disponibili

Tag

3D adobe advertising calligrafia calligrafo colori Contest creative pro show creatività design ernesto casciato exaprint facebook featured font fotografia fotolia free freelance grafica gratis illustrator illustrazione indesign intervista logo Logo design pantone pennelli photoshop pirati pirati grafici primi passi pubblicità rebranding recensione redesign social media social network spot storia torino tutorial twitter video

© 2019 PiratiGrafici – Tutti i diritti riservati. Piratigrafici.it è un blog multi-autore dedicato a Grafici, Web designer e Fotografi (all’arrembaggio)!
Da un’idea di Patrizia Anna Coccia CF: CCCPRZ83P70E435S / P.I. 02491570699 – Contatti: Facebook Community Page.  Site by Artlandis

Tutte le immagini presenti sul sito sono tratte da Freepik, concessi per l’uso ai Pirati Grafici, unica Community italiana in partnership esclusiva con Freepik Company

  • Accademia del Covo
  • Social Wall
  • Partners
  • Novità sulla nave
  • Progetti
  • Segnalazioni
  • Blog & Stories
  • We Are Pirates
  • Privacy Policy
  • SOCIAL
Pirati Grafici | Community
TORNA SU