Mauro, titolare della Confort, aveva tra le mani una macchina rodata.
Ma è sufficiente che un sito sia solo funzionale? Ovviamente no, altrimenti non avrebbe chiamato Fornace.

I siti di prenotazioni voli tendono ad assomigliarsi tutti, mancano di carattere. Noi abbiamo puntato su un impatto chiaro, pulito e coinvolgente. Volevamo comunicare un senso di leggerezza (viaggiamo tra le nuvole), semplicità (prenotare con noi non è complicato) e trasparenza (niente asterischi nascosti, il cliente si può fidare).

Anche l’architettura della home page è stata semplificata: il form di registrazione è il fulcro del sito; poi si aggiungono alcune caratteristiche distintive (business travel e prezzi chiari). Sotto il form abbiamo aggiunto un breve profilo dell’agenzia: se devi inserire il numero della carta di credito sei felice di sapere che esistiamo da più di 30 anni e abbiamo una sede, no?.

Ci mancava però un elemento caratterizzante per la pagina.
Voli, cortesia, rapporto personale, semplicità, servizio puntuale; chi meglio di una hostess potrebbe rappresentare tutto ciò? Meglio se disegnata con un tocco vintage e un tratto pulito e slanciato.
Perché quando prenoti con Confort viaggi non hai a che fare solo con macchine.
Ci sono delle persone pronte ad assisterti.

Suscitare un’emozione è il primo passo per farsi ricordare. L’azzurro, il font pulito, la hostess: benvenuti nel mondo di confort. Non è solo un form per trovare i voli. Non è solo un potente motore di ricerca.

Il design deve suscitare emozioni, dare un carattere, creare un legame e quindi un ricordo.
La funzionalità e l’usabilità sono alla base di un sito, ma, salendo nella piramide di Maslow, sappiamo che dopo i bisogni primari incontriamo quella che lo psicologo americano definì “la realizzazione di sé”. Noi la traduciamo in termini di design come esperienza emozionante, bella, coinvolgente, in una parola: piacevole.

Non temete, molto presto inseriremo nel nostro catalogo di offerte una app che semplificherà la vita a molte aziende e vedrete in giro molti più rappresentanti sorridenti.

Catalogo permette di portare i cataloghi su iPad e iPhone in modo semplice, veloce ed economico.

Vuoi vincere un abbonamento a Catalogo per la tua azienda?

@brad_frost ha scritto un ottimo articolo in cui analizza le soluzioni finora adottate per rendere i menu di navigazione responsive. Lo stato dell’arte è tutt’ora un lavoro in corso, e solo il tempo definirà dei veri e propri standard.

A me piacciono in particolare i menu “toggle”, quelli a scomparsa. Brad li cita nell’articolo, ma li penalizza perché richiederebbero necessariamente Javascript. Secondo me invece no, e ho le prove

Ho creato un semplice esempio di menu responsive. Si trasforma ridimensionando la pagina, si mostra e nasconde con un clic, non usa una riga di javascript

Il codice html

[html]
ShowHide

• Pimpa
• Winnie The Pooh
• Ukulele

​
[/html]

Notare l’input con la sua label. Il menu è sullo stesso livello.

Il css

[css]

body {font-family: georgia; margin:0 }
ul { list-style-type: none; padding: 0; margin:0 }
ul li { display: inline-block; background: #dedede; padding: 2px 4px; }
ul li:hover { background: #d4d4d4; }
ul li a { color: #666; text-decoration: none; }
input[type=checkbox] { display:none; position: absolute; }
[for="menu-control"] {display: none }

@media screen and (max-width: 400px) {
ul {padding-top:20px}
ul li { width: 100%; }
[for="menu-control"] {display: block; position: absolute; top:0; width:100%; background: #888;color:#fff;height:20px }
input[type=checkbox] ~ ul { display: none }

input[type=checkbox]:checked ~ ul { display: block; }
[for="menu-control"] span:nth-of-type(2) { display: none; visibility: hidden; }
input[type=checkbox]:checked ~ [for="menu-control"] span:nth-of-type(2) { display: block; visibility: visible; }
input[type=checkbox]:checked ~ [for="menu-control"] span:nth-of-type(1) {
display: none;
visibility: hidden; }

}​
[/css]

Tre semplici magie per ottenere l’effetto:

• La scritta visibile è la label del checkbox, mentre questo se ne resta nascosto.
• Usando il selettore “sibling” posso usare il checkbox nascosto per mostrare e nascondere il menu, usando il selettore :checked.
• Cliccando le label si ottiene lo stesso risultato che si otterrebbe cliccando sul checkbox.

Il resto della magia è nelle media queries.

Demo su jsfiddle

Domande o commenti? Non aspetto altro

Novembre 2011, Fornace va in trasferta verso lo “ioS 5 Tech Talk World Tour“, appuntamento imperdibile per i developer Apple. Ne sono previsti solo 10 al mondo, di cui 3 in Europa.

Mentre scendiamo lungo l’Autostrada del Sole, il passatempo “cerca la frequenza radio” ci stufa decisamente presto.E’ tutto un fruscio, stazioni che cambiano in ogni città, mazurke e notiziari di paese. Arriviamo a Roma con le orecchie stremate e brancoliamo ancora nel buio dell’Fm.

Domanda: “Ma non c’è una app che ti indica le frequenze radio di ogni città in cui arrivi?”
Risposta: “no!”

La nostra autoradio “veronese” è praticamente inservibile mentre siamo imbottigliati sul Grande raccordo anulare. Stress.

Già prima di sentire una sola parola del “Tech Talk” abbiamo un’idea da mettere in cantiere appena tornati a casa: ”Frequenze radio“. Per tutti quelli che amano viaggiare, amano ascoltare (anche) la radio Fm e vogliono sentirsi “in sintonia” con ogni nuova città che incontrano.

Poi, se in questa nuova città c’è molto traffico, è la app che vi salverà la vita. Smadonnare cercando una stazione radio mentre si è imbottigliati nel traffico può causare nell’ordine:

a) Travaso di bile e arrossamento
b) Irascibilità e dilatazione delle pupille
c) Manovre azzardate e incidenti
d) Costatazioni (più o meno) amichevoli

Abbiamo lanciato Frequenze radio tre giorni fa e per una settimana sarà in download gratuito (quasi un atto di responsabilità sociale, visti i sopra citati rischi che corre chi non la possiede).

Probabilmente non eravamo gli unici viaggiatori a sentire il bisogno di un app che indichi le frequenze radio Fm:

6000 download in 3 giorni, 58esimo posto nella classifica free  dell’App store e direttamente in top-10 per la categoria utilities.

Per Fornace è solo all’inizio.

Stay tuned