Personal tools

web

Aug 03, 2015

ubiGreen: la mappa dei progetti finanziati da Fondazione Cariplo

http://ubigreen.fondazionecariplo.it/

ubiGreen: la mappa dei progetti finanziati da Fondazione Cariplo

Filed Under:

Il nuovo portale è realizzato in Plone ed è dedicato alla georeferenziazione e alla consultazione di tutti i progetti finanziati dalla Fondazione in ambito naturalistico.

Fondazione Cariplo è un soggetto filantropico che concede contributi a fondo perduto alle organizzazioni del Terzo Settore per la realizzazione di progetti di utilità sociale.

Una fondazione bancaria premiata a novembre 2014 come “Investitore Sostenibile dell’anno” che ha al centro delle proprie attività filantropiche la sostenibilità e l’attenzione ai temi sociali e ambientali.

In questa direzione si pone anche la realizzazione di ubiGreen, nato dall’esigenza espressa da più enti pubblici e organizzazioni non profit di visualizzare la distribuzione sul territorio dei propri progetti di carattere ambientale finanziati dalla Fondazione.

read more

Jun 15, 2015

I 10 migliori esempi di menu di navigazione originali e creativi

Navigation design

I 10 migliori esempi di menu di navigazione originali e creativi

Filed Under:

Vuoi rendere la vita più facile ai visitatori del tuo sito web, ma con un pizzico di fantasia? Fallo con un design di navigazione efficace e funzionale!

Riuscite a immaginare un sito web senza la navigazione? Sarebbe come viaggiare su strade senza indicazioni o cartelli.

Gli utenti spesso abbandonano i siti che non possono navigare, mentre se possono trovare senza problemi ciò che stanno cercando sono più propensi a rimanere. Una navigazione efficace può garantire la fruibilità del sito e migliorare la user experience degli utenti.

Altrettanto fondamentale è il design di navigazione, che deve essere accattivante. Il menu di navigazione deve invogliare l’utente a navigare il sito, deve stuzzicare la sua curiosità.

La navigazione può essere realizzata in diversi modi: posizionata nell'intestazione o a pié di pagina, su fasce laterali, può essere fissa oppure scorrere insieme all’utente, nascondersi e poi riapparire, comprimersi ed espandersi.

In questo post ho selezionato 10 diversi menu di navigazione di siti web i cui realizzatori hanno speso tempo e fatica per far si che la loro navigazione diventasse qualcosa di speciale. Vedrete molti stili e approcci diversi, alcuni fuori dagli schemi e non certo convenzionali.

 

Rally Interactive

Possiamo navigare questo sito in due modi: il primo tramite il frecce al centro della pagina, che fanno scorrere la pagine orizzontalmente, il secondo tramite il menu a scomparsa in alto a destra. La grafica completa l'opera perché rende tutti gli elementi omogenei tra loro e armonizza l'apertura del menu. L'effetto è veramente interattivo come indica il nome stesso del sito.

Rally Interactive2.pngRally Interactive1.png

read more

Jan 28, 2015

Il Comune di Modena inaugura il 2015 con la nuova Mo-Net

Do it better! Do it Agile!

Il Comune di Modena inaugura il 2015 con la nuova Mo-Net

Filed Under:

Metodologia agile e collaborazione con il cliente applicate al restyling del sito del Comune di Modena. Buone pratiche per buoni risultati in tempi veloci

Gli ultimi 3 mesi del 2014 ci hanno visti impegnati in modalità task-force sullo sviluppo del nuovo sito del Comune di Modena. Non si è trattato di un semplice lifting ma di una ristrutturazione profonda che parte dalle radici (Plone), si estende alla struttura (il layout) e arriva fino alle foglie (l’organizzazione e la presentazione dei contenuti).

"In linea con il piano Modena Smart City e con l’obiettivo di costruire una piattaforma sempre più efficace per erogare servizi, l’amministrazione comunale ha sviluppato una nuova interfaccia che diviene centrale per la comunicazione con i cittadini e le imprese.” (24/12/2014 - Cittadini di Twitter)

Era settembre quando Claudio Forghieri, responsabile di Mo-Net dal 1995, ci illustrava il piano di rinnovamento: "In generale abbiamo esigenza di rifare in tempi rapidi, ovvero entro fine anno, la home page e i primi livelli di Mo-Net, introducendo innovazioni grafiche e di architettura delle informazioni e della navigazione."

read more

Nov 12, 2014

Scraping cheap airline tickets

It all started with a bet long time ago. One of my friends couldn't believe that it is actually possible nowadays to travel around the world with low-cost airlines.

Because the term low-cost airline is difficult to define we have agreed that we should bet on something easy to check - like the ticket price per kilometer. After some rough checks the bet was on: travel around the world, flying always in one direction (west or east) for less than €0.03 (3 euro cents) per kilometer (imagine Bologna-New York trip for less than €180).

TL;DR

I think I won. With some python help and many hours of coding I was able to find all the necessary tickets and stay below the price criterion. I have learnt a lot about airlines sales strategy... and something about ant colony optimization algorithm. The trip starts on November 15th, maybe you will meet me in the following months ;-)

Problem

Now the long story. Searching for cheap plane ticket is relatively easy task if you have strict dates and simple route (one or two stops). It starts to be more complicated if you want to stop in 3 places. But what if you have 6 stops or more? None of the existing online tools allows you to make such a query (if you know one - let me know). Things get more fuzzy if you don't have specific dates and just want to travel cheap. Searching manually is not an option: ticket price is likely to change daily and number of possible queries is quite big, I mean really big. Imagine you want to take 5 stops and search with margin of ± 10 days. It gives you 9765625 queries (5^10). Grabbing that data directly from airline database is also not doable. There is no standard approach, most of the small companies have their own system - others use providers that are much too expensive for a single user.

Sooner or later you will start to write a script.

read more

Sep 03, 2014

Responsive web design... ma non dimentichiamoci del logo!

Responsive logo design

Responsive web design... ma non dimentichiamoci del logo!

Filed Under:

Sfruttiamo davvero tutto il potenziale del responsive web design per i loghi? Come risulterebbero quelli dei brand più famosi, se fossero responsive?

Nei siti web responsive l’aspetto dell’header, del menu di navigazione o dei contenuti cambia in base alle dimensioni dello schermo. Tuttavia, si tende a non modificare i loghi: semplicemente si riducono o si espandono per adattarsi allo schermo.

A volte manca uno studio vero e proprio sull’aspetto responsive del logo, che definisca come debba essere il logo in base alle diverse dimensioni del dispositivo. Eppure il logo è il simbolo più potente del marchio di un brand.

Come dicevo, semplicemente ridurre o ampliare un logo secondo il suo contesto non è sempre la soluzione migliore.

Potrebbe essere necessario aggiungere dettagli nel logo man mano che la capacità del dispositivo aumenta o, al contrario, rendere minimale il suo aspetto se le dimensioni della finestra diminuiscono.  

Un ottimo esempio ci viene fornito da un progetto di studio di Joe Harrison sulla creazione di loghi responsive per i grandi marchi.

Questo progetto mostra come loghi delle marche più popolari possono essere efficacemente riprodotti in maniera responsive. Se aprite la pagina e ridimensionate il browser vedrete i loghi che si aggiornano dinamicamente in base alle dimensioni dello schermo. Via via che le dimensioni del browser si riducono, ognuno di questi loghi passa attraverso una sequenza di breakpoint e, ad ogni breakpoint, il logo viene modificato, rimanendo però fedele al marchio originario.

Loghi - FullscreenLoghi - TabletLoghi - Mobile

read more