Progettazione web · Il mio primo sito
Questo è il primo sito che ho realizzato, per l’esame di Progettazione web. Ho scelto il tema dell’esplorazione di Marte e della missione di Perseverance: un argomento che mi permetteva di organizzare testi, fotografie, contenuti multimediali e qualche interazione in un sito semplice.
La navigazione separa la missione, il viaggio dalla Terra a Marte, il quiz e la presentazione personale. Ho usato un fondo nero e immagini grandi, con un colore diverso per ogni sezione. È un primo tentativo di dare continuità grafica a più pagine, mentre imparavo a costruirne la struttura.
Il marchio MARS torna nella navigazione con accenti diversi. Le varianti fanno parte dello stesso sistema cromatico delle pagine.
Il nome MARS è affiancato dal simbolo del rover in un cerchio ocra. La scritta chiara emerge sul fondo nero della navigazione.
La variante blu accompagna la sezione sul viaggio e sulla tecnologia, mantenendo la stessa forma del marchio.
La variante rosa-viola riprende l’accento della pagina del quiz. Cambia il colore, mentre il riferimento visivo resta riconoscibile.
Quattro accenti distinguono le pagine e tornano nella navigazione.
Missione Pianeta Rosso
Dalla Terra a Marte
Orbitron richiama il tema spaziale con forme geometriche; DM Sans accompagna i testi e i collegamenti.
La pagina della missione alterna la fotografia di Marte, il rover, gli obiettivi e contenuti dedicati a Ingenuity. La sezione sul viaggio raccoglie sviluppo, componenti e fasi dell’atterraggio. Dividere i materiali in argomenti è stato uno dei primi lavori di progettazione del sito.
Ho affiancato alle pagine informative un quiz con domande, avanzamento e risultato, oltre a sequenze di immagini e contenuti audio e video. Sono esercizi semplici con cui ho iniziato a collegare i comandi dell’utente a un cambiamento nella pagina.
Oggi farei diverse scelte grafiche in modo diverso. Conservo questo sito perché documenta l’inizio: passare da contenuti raccolti a pagine collegate, e da una pagina statica alle prime funzioni in JavaScript.
Un progetto piccolo, utile per imparare a organizzare un sito completo e a far dialogare HTML, CSS e JavaScript. Nel portfolio rappresenta il primo passo del mio percorso sul web.