Creare arte ASCII animata per il terminale e un README GitHub

L’arte ASCII — disegni fatti solo di caratteri — sta vivendo un ritorno grazie alle interfacce a riga di comando e ai README curati su GitHub. In questo tutorial vediamo come generare arte ASCII, animarla in un terminale e poi integrarla in modo pulito in un README.

Generare arte ASCII

Il modo più rapido per trasformare del testo in grandi lettere ASCII è lo strumento figlet, disponibile su Linux, macOS e Windows (tramite WSL). Puoi scegliere un font e aggiungere colore con lolcat.

# Testo in grandi lettere ASCII
figlet "Itamde"

# Con un font e i colori
figlet -f slant "Itamde" | lolcat

Per partire da un’immagine invece che dal testo, ascii-image-converter trasforma un logo o una foto in caratteri, a colori se serve.

ascii-image-converter logo.png -C

Animarla nel terminale

Un’animazione è una serie di fotogrammi mostrati rapidamente. In un terminale si pulisce lo schermo tra un fotogramma e l’altro e si riproducono in sequenza. Ecco un piccolo ciclo che scorre alcuni fotogrammi ASCII.

#!/bin/bash
frames=("(o_o)" "(o_-)" "(-_o)")
while true; do
  for f in "${frames[@]}"; do
    clear
    echo "$f"
    sleep 0.3
  done
done

Per risultati più ricchi, strumenti come chafa mostrano immagini e GIF direttamente nel terminale, mentre asciinema registra un’intera sessione da riprodurre o pubblicare.

Integrarla in un README di GitHub

Un README non può eseguire un terminale, quindi si integra una versione « riproducibile » dell’animazione. Il metodo più pulito è registrare la sessione con asciinema e convertirla in un SVG animato con svg-term. L’SVG resta leggero, nitido a ogni dimensione e leggibile su GitHub.

asciinema rec demo.cast
svg-term --in demo.cast --out demo.svg --window

Non resta che fare il commit del file e mostrarlo nel README in Markdown:

![Demo in arte ASCII](demo.svg)

Per un semplice banner animato (il tuo nome, il titolo del progetto), servizi come readme-typing-svg generano un’immagine SVG di un testo che si scrive da solo, senza installare nulla.

Qualche buona pratica

Ricorda di inserire un testo alternativo per l’accessibilità, mantieni i file leggeri per non appesantire la pagina ed evita animazioni che lampeggiano troppo in fretta. Una buona arte ASCII cattura l’occhio senza disturbare la lettura del resto del README.

Se ti interessano i caratteri speciali, la nostra tabella dei codici ASCII, ISO e HTML completa bene l’argomento. E per approfondire, esplora i nostri corsi online.

Sul fronte dei libri, ottimi testi sulla riga di comando e il terminale Linux aiutano a padroneggiare questi strumenti.