Il 10 Dicembre è partita una nuova newsletter stagionale dedicata al design dei magazine online. Si chiama Colophon, avrà una cadenza settimanale (arriva il sabato) e sarà composta di cinque numeri: si conclude il 7 Gennaio 2023.
È possibile consultare l’archivio online.
La newsletter Colophon
Per ricevere Dispenser.Design via email iscriviti qui.
Un sito web è un insieme di pagine web collegate tra di loro. Pagine web raggiungibili con un indirizzo web (URL), attraverso un browser. E fin qui ci siamo, quasi. Per un po’ di tempo, dopo la messa online del primo sito web1, la definizione era abbastanza precisa. Poi le attività che si potevano svolgere in un sito web sono aumentate. I siti web sono diventati “servizi” e “prodotti”.
Gmail, Figma, la Repubblica, Amazon o Facebook sono tutti siti web, sono tutti fatti di HTML-CSS (e JS)2, ma si usano, si progettano e si realizzano in maniera diversa.
Volendo provare a suddividere i siti web per tipologia me ne vengono in mente quattro: i siti di comunicazione/informazione, i siti e-commerce, le piattaforme digitali, i prodotti/servizi digitali.
I siti di comunicazione/informazione sono quei siti che perlopiù si leggono. Possono essere i siti di giornali e riviste, o i blog. Ma anche i siti-brochure, quelli che parlano di un’azienda, di una persona o di un prodotto. Sono i siti personali, di uno studio o un’agenzia. In questa tipologia potremmo inserire guide o libri come quello di Jeremy Keith, Resilient Web Design, o quello di Frank Chimero, Shape of design. Potremmo ancora aggiungere progetti come quello di Nicholas Rougeaux, che ha raccolto, organizzato e messo online le 2.242 illustrazioni di un libro del 1800 sui minerali in Gran Bretagna.
I siti di e-commerce sono dei cataloghi di prodotti. Ogni prodotto ha la propria pagina-scheda, con info e descrizioni, acquistabile con pochi click. A parte il più famoso di tutti, ce ne sono tanti, che vendono prodotti fisici o digitali.
Lo so, sto scrivendo delle cose scontate, ma a volte ripeterle aiuta a metterle a fuoco meglio. Nel momento in cui scrivo queste prime descrizioni, mi accorgo che i confini sono meno netti di quanto sto provando a fare. Un sito di comunicazione/informazione può essere anche un e-commerce, o meglio potrebbe avere un modulo e-commerce. Il sito di Repubblica, come quello di tanti altri giornali, vende l’accesso ai suoi contenuti. Dal sito-libro di Frank Chimero posso acquistare la versione cartacea.
Le piattaforme sono quei siti dove si accede con un account ed è possibile condividere dei contenuti. A seconda del tipo di piattaforma, questi contenuti possono essere visti da tutti o solo dai membri. Più passa il tempo più le piattaforme tendono a somigliarsi. Facebook è una piattaforma di quelle social, del tipo di social basato sulle relazioni (social network). È una piattaforma anche Wordpress.com, che con il tempo ha inglobato alcune delle dinamiche social, il follow o il like, ma un tipo di social basato sui contenuti, più social media. In mezzo a questi due possibili estremi ci sono cose come Twitter, YouTube, Instagram (che ormai funziona anche sul web).
Ci sono poi i prodotti digitali. Assieme alle piattaforme, sono i siti dove passiamo la maggior parte del nostro tempo. In più di qualche numero abbiamo affrontato la questione relativa al digital product design. Poco sopra ho citato Figma, ma se vi occupate di design conoscete di sicuro anche Miro o Mural. Probabilmente usate cose tipo Mailchimp o Google Docs. Sono siti web, ma sono soprattutto dei software.
Anche se spesso troviamo tutti sotto lo stesso dominio, raggiungibili attraverso un browser, stiamo visitando cose diverse. Google Docs è un prodotto, che ha un sito-brochure che ne descrive le caratteristiche e le funzionalità.
Anche qui i confini non sono così netti, le piattaforme sono in parte anche dei prodotti digitali. Tutte hanno funzioni per gestire il testo, manipolare le immagini o modificare una sequenza video.
Il punto di questa suddivisone di siti web (sicuramente imprecisa) è quella di definire la destinazione d’uso del proprio design, per progettare in maniera più consapevole.
Il sito-brochure di Google Docs si progetta in maniera diversa da Google Docs prodotto. Hanno sicuramente dei punti in comune, ma si parte da considerazioni diverse. Nel primo caso l’obiettivo è organizzare dei contenuti, per renderli comprensibili e accattivanti. Nel secondo caso quello di organizzare un flusso di azioni e interazioni che permettano all’utente di scrivere un testo, editarlo e condividerlo.
Se si lavora a un prodotto digitale è molto probabile che si lavorerà a quasi tutte le tipologie. Di sicuro ci sarà un sito che presenta il prodotto, le funzioni e le applicazioni d’uso. Ci sarà una guida all’uso di quel prodotto, un blog. Potrebbero esserci una sezione con dinamiche social (vedi Figma Community), potrebbe esserci un’e-commerce di prodotti (fisici o digitali).
Aver chiaro la destinazione d’uso del proprio design, aiuta a progettare in maniera più consapevole e aiuta anche a organizzare il lavoro e le fasi.
Un altro esempio di sito di comunicazione/informazione è questa guida introduttiva al mestiere di progettista digitale, realizzata dal blog collettivo UXDesign.cc, con le illustrazioni di Michela Picchi.
Il primo numero della rivista letteraria di Dan Crowe e Matt Willey (Pentagram, ex NY Times Magazine). Il primo dei dieci previsti, con cadenza annuale.
Presenti in questo primo numero: Margaret Atwood, Max Porter, Joyce Carol Oates, Ocean Vuong, Tom Waits, Ben Lerner.
Una raccolta, open source, di principi e metodi di progettazione.
La consueta raccolta del New York Times con le illustrazioni più interessati apparse sul loro giornale (cartaceo e online).
Sul blog della casa editrice Unit Editions, le letture in corso di Matt Lamont (che tra le altre cose gestisce Design Reviewed).
Nel primo numero del 2021 si parla di immagini. Poi a seguire le solite rubriche relative a magazine, link e font.
L’importanza delle immagini invece la diamo per scontata. Continuiamo a dire «l’immagine vale più di mille parole», senza pensarci troppo. Un’immagine da sola non basta a essere «significante». Il suo significato — come succede per i colori e anche per i font — cambia a seconda dal contesto sociale e dal luogo in cui quell’immagine è posizionata. Cambia in base all’uso che se ne fa e dall’idea che noi abbiamo di quell’immagine. «Il nostro modo di vedere le cose è influenzato da ciò che sappiamo o crediamo».
Continua a leggere il numero #057
L’immagine di accompagmaneto a un articolo del «New York Times»
Nel numero #055 si parla si parla di sistemi di design, che siano manuali d’uso del marchio o linee guide per comporre interfacce.
Un sistema di design è un’insieme di cose. È prima di tutto la definizione di linguaggio visuale comune, che permette a chi si occupa di una campagna o di un’app di rendere sempre riconoscibile IBM. È poi una cassetta degli attrezzi, che permette a chi si occupa dell’app di renderla coerente non solo con il marchio, ma anche con le altre app. Funziona su almeno due livelli, quello generale, relativo all’identità visuale e quello che si applica uno specifico prodotto o uno specifico artefatto.
Continua a leggere il numero #055
Un esempio di illustrazione “micro”, secondo le linee guida del linguaggio di desing di IBM.
Nel numero #051 abbiamo parlato del flusso operativo di un nuovo progetto, dando per acquisite tutte le informazioni sul tipo di prodotto da realizzare e delle sue caratteristiche. In questo numero proviamo ad analizzare la fase ancora precedente.
Premessa. Come l’altra volta non si parla di software nello specifico, né di tecniche. Le tecniche sono necessarie, ma se non si sa come e quando usarle sono inutili. Ricordo ancora un episodio di oltre quindici anni fa ormai, dopo un breve corso su Flash (qualcuno di voi dovrebbe sapere cos’è), quando uno studente mi disse: «Ok, ho capito Flash e ora lo so pure usare, ma che ci faccio?»
L’intento più che dire cosa fare e come farla è quello di dare uno sguardo sul tipo di atteggiamento da avere.
Mirko Santangelo è originario di un piccolo paese della Sicilia, ma residente da un po’ di anni nei dintorni di New York. Senior Designer di Paper Tiger è tra i fondatori — assieme a Francesco Paradiso — e membro attivo della comunità di Figma in Italia.
Il 14, 15 e 16 Dicembre Handoff ha organizzato un workshop, incentrato proprio su Figma. Il relatore è Mirko Santangelo, a cui abbiamo fatto una piccola intervista.
Continua a leggere il numero #054
Un’immagine delle note del sociologo tedesco Niklas Luhmann (1927-1998). Il suo sistema di raccolta di note, collegate tra loro, è spiegato nel libro “How to take smart notes”.
Ognuno ha una sua idea di design. Succede in tutti i campi, ed è una cosa normale. Ci sono più idee di design, come ci sono più idee di arte, di cinema, di letteratura, di fotografia, di musica, di giornalismo, di moda, e sono tutte giuste, o forse tutte sbagliate. E va bene così.
Ognuno di noi ha una predisposizione verso qualcosa, chi più verso il marketing, chi più verso la composizione tipografica e l’armonia visiva, chi più verso il contenuto. Ognuno potrebbe dire che quel qualcosa è determinante, ma non è così. Sono tutte importanti, perché solo dando la giusta attenzione a tutto si otterrà un’esperienza positiva.
Nella prima fase della newsletter c’era un’intervista in ogni numero. Nel numero #053 torniamo a quella fase intervistando Carlo Frinolli, co-fondatore di NOIS3, experience design agency romana che, tra le altre cose, organizza ogni anno l’edizione italiana del il WUD, il World Usability Day, la Giornata Mondiale dell’Usabilità. Ogni anno il WUDRome approfondisce tematiche relative a usabilità, user experience, Human-Centered design e molti altri argomenti legati al design dei servizi.
Causa Covid-19, l’edizione di quest’anno sarà online, dall’11 al 13 Novembre. Il tema principale sarà lo Human-Centered AI.
Sotto la mela di Enzo Mari, dalla serie della natura, realizzata nel 1961 per Danese. Enzo Mari è morto il 19 Ottobre. Vi segnalo tre articoli, su Artribune, Il Sole 24 Ore e Studio, che lo ricordano.
Continua a leggere il numero #053
Per Enzo Mari il Design (di qualsiasi tipo) è tale soltanto se comunica anche conoscenza.