From the Front: Frontend in Wonderland 2015

Il 17 e il 18 settembre si è tenuto l’evento Frontend in Wonderland a Bologna. TSW non ha mancato l’opportunità di calarsi insieme ad altri centinaia di professionisti del coding e del marketing digitale nella “tana del coniglio” per due giorni di conferenze e riflessioni sul web del presente e del domani.

Gli argomenti degli speech sono stati vari come gli incontri di Alice nel paese delle Meraviglie: colorati spunti di riflessione sono sbocciati attorno alle dinamiche del codice, del design responsivo, della documentazione grafica, della criptografia e delle tecniche di gestione del team da remoto.

In questo articolo riassumerò i dettagli salienti delle due giornate a Bologna.

Come superare gli ostacoli nel web design: Tim Kadlec

Il primo speech è stato condotto da Tim Kadlec, web tecnology advocate,  con una spiccata sensibilità al web rapido e responsivo;  proprio quest’ultimo argomento è stato il tema conduttore della case study “RadioFreeEurope RadioLiberty”, in cui si sono dovute affrontare problematiche legate al mondo mobile molto distanti dalla nostra realtà. In alcuni paesi in via di sviluppo l’accesso ad internet è complesso, la rete 3G non supera lo 0,1% di copertura e i device sono obsoleti e poco performanti.

Tim ha illustrato come superare gli ostacoli attraverso un lavoro iterativo che ponga come priorità la performance e i limiti territoriali: attraverso scelte di design consapevoli,  grazie all’uso di progressive JPEGs,  di minify JS, rimuovendo il codice CSS non utilizzato e attraverso un monitoraggio costante delle performance del sito tramite stress test, è possibile rendere il web un universo accessibile effettivamente a tutti.  Al grido di “The web is as fast as we choose to make it” si è concluso un intervento che ha sensibilizzato le menti di progettisti,  designer e developer verso barriere non sempre considerate.

Qui sotto la presentazione integrale di Tim Kadlec:

Sally Jeckinson e gli Open Data

Sally Jeckinson, technical consultant & solutions architect, ci ha parlato di Open Data:

• evidenziandone i benefits: la generazione di valore, la trasparenza, la co-partecipazione e la responsabilizzazione nel divulgarli
• offrendoci degli esempi su come poterli utilizzare per migliorare l’efficacia, l’efficienza e impattare sulle scelte degli utenti attraverso l’analisi, l’interpretazione e il design dei dati raccolti.
  Un esempio per comprenderne la potenza è http://property.mapumental.com/, un sito interamente costruito grazie alla rielaborazione delle informazioni open source.

Open Data: Open Your Mind from Sally Jenkinson

Razan Sadeq di Spotify e la User Research

La user researcher di Spotify, Razan Sadeq, ha condiviso la sua esperienza di ricercatrice ispirata dalle pratiche investigative di Sherlock Holmes, suo personalissimo mèntore.  Come l’investigazione, la User Research non è una ricerca casuale di indizi ma si tratta di un processo strutturato, coerente e sistematico volto al problem solver.
Come evitare ipotesi sbagliate ed errori di interpretazione? Razan ce lo spiega in 5 punti:

1. Evitare “L’ipotesi prematura”
   Per una migliore comprensione del problema,  per avere la possibilità di testare la correttezza dell’ipotesi, per ridurre la generazione di costi irrecuperabili, non si deve correre a conclusioni affrettate prima di aver raccolto tutti i dati a disposizione
2. L’opportunità mancata
   Porre sempre attenzione ai dettagli, sfruttare le capacità intellettive e  vedere oltre le apparenze renderà lo user researcher  un vero e proprio investigatore
3. Il curioso incidente (del cane nel cuore della notte)
   Focalizzarsi sugli utenti,  creare empatia con le loro storie e percepire tutti i tipi di informazioni trasmesse,  non solo quelle verbali, ma anche quelle comportamentali e dell’ambiente circostante: non sottostimare l’importanza delle informazioni “celate”
4. L’attenzione divisa:
   Evitare il più possibile il multi tasking perché genera un livello di attenzione sempre più degradante, e cercare di focalizzarsi su un obiettivo alla volta grazie all’organizzazione e alla meditazione.
5. Il ricercatore ossessivo
   Distaccarsi dai problemi e permettere al pensiero laterale di lavorare per noi.

Anna Debenham e lo sviluppo di style guides

Anna Debenham, autrice del libro Front End Style Guides, ha analizzato come le diverse tipologie di style guides possano, in alcuni casi, orientare l’iter processuale verso il dialogo con il cliente, ed in altri, siano la memoria storica utile al mantenimento nel tempo della comunicazione globale di un progetto.
Per ottimizzare il processo creativo, ridurre i tempi di progettazione e creare un dialogo costruttivo con il cliente, Anna propone l’approccio utilizzato da Samantha Warren: attraverso dei formati visivi come la moodboard e la style tile, i designer e i progettisti possono presentare la proposta e i concept ad essa correlata agilmente, esplicitamente e sinteticamente.
Una volta definito il concept iniziale si procede con la definizione dei template attraverso tre metodi:

• la prototipazione (http://sparkbox.github.io/style-prototype/ )
• l’approccio a collage (http://codeforamerica.clearleft.com/)
• utilizzando una libreria di pattern, ossia isolando i singoli componenti dai template  per generare una libreria di oggetti (http://patternprimer.adactio.com/ ).

Molti sono i tool a disposizione di project, visual e graphic designer da utilizzare per creare guide di stile complete ed efficaci. Di seguito una selezione:

• http://patternlab.io/
• https://frontify.com/styleguide
• http://primercss.io/
• http://styleguides.io/examples.html
• http://warpspire.com/kss/styleguides/:
• https://www.lightningdesignsystem.com/design/motion.
• http://rizzo.lonelyplanet.com/styleguide/design-elements/colours

Zoe Gillenwater e Flexbox

Zoe Gillenwater, web specialist con oltre 14 anni di esperienza, ha infiammato la platea parlando di Flexbox, mostrandone esempi concreti, paragoni rispetto al codice “classico” e soluzioni cross-device.
Alla domanda che frontendisti e designer si pongono quotidianamente “How big do I make this thing?” Zoe ha saputo rispondere appieno, celebrando le proprietà flessibili e agilmente gestibili della classe Flexbox e avvalorandone l’importanza per la creazione di un sito “more responsive”.

Conclusioni

Questi sono stati solo alcuni degli attori coinvolti nelle due giornate al FTF15, una menzione particolare va al Talk sui talks di Zach Holman, preparatissimo speaker che ha saputo intrattenere il pubblico grazie ai suggerimenti per creare un talk efficace basandosi sulla regola del tre: Planning (pianificazione), Building (Costruzione) e  Delivering  (Presentazione).

Un grazie speciale va agli organizzatori, abili costruttori di un evento poliedrico, tecnico e filosofico, che hanno saputo avvalersi di speaker come Davide Casali, Petro Salema e Cathy Wang.