Lavora con noi: WordPress Developer

Stiamo cercando un/una WordPress Developer!

Che caratteristiche deve avere?

  • In primis, conoscenza approfondita dell’universo WordPress e della creazione di temi per WordPress.
  • Conoscenza dei plugin WordPress Advanced Custom Field e WPML
  • Conoscenza approfondita di PHP, Javascript e CSS.
  • Capacità di trasformare preview grafiche in progetti web dinamici.
  • Conoscenza intermedia di Google Tag Manager e capacità di implementare sistemi di tracking.
  • Capacità di relazionarsi con i clienti in maniera adeguata, sia via mail che in call.
  • Conoscenza della lingua inglese almeno al livello B1.

Punti bonus per chi:

  • ha esperienza con Gutenberg React
  • ha esperienza con i plugin Gravity FormsLiteSpeed CacheFacet WP Complianz
  • ha esperienza di customizzazione di Woocommerce
  • ha competenze sistemistiche nella gestione di server
  • ha un titolo di studio in informatica

Attenzione: non siamo alla ricerca di figure con esperienza nella customizzazione di temi commerciali o di sviluppo di siti WordPress basati su visual builder (Elementor etc).

Noiza è un ambiente di lavoro inclusivo, rispettoso e professionale, pur mantenendo un’identità informale.

Offriamo una RAL commisurata all’esperienza del candidato, oltre ad altri benefit come: un programma di welfare aziendale, gli strumenti necessari a svolgere il lavoro, e un piano di formazione continua che si articola in workshop di formazione interna ai quali si affianca un budget individuale che può essere usato in autonomia per acquistare corsi, libri e accesso a eventi formativi e conferenze.

Stiamo cercando una persona che entri a far parte del nostro team che ha sede a Trieste: per chi è residente in regione FVG, il lavoro potrà essere svolto in maniera ibrida, in parte in presenza e in parte in smart working (50% o 40% a seconda della provincia di residenza). Valutiamo candidature anche di non residenti, sempre con la formula del lavoro ibrido, ma con pesi da discutere in fase di colloquio.

Per candidarti, compila il form che trovi al link di seguito:

https://bit.ly/wordpress_developer_2024

Non accettiamo candidature pervenute direttamente via mail.

Il sistema di donazioni per UNHCR: come lo abbiamo ripensato

La propensione all’acquisto online è in fortissima crescita. Le abitudini degli utenti si sono modificate in fretta grazie a numerosi fattori: semplificazione dei processi di pagamento, digital wallet per tutti i gusti, transazioni sempre più agevoli e rapide. Insomma, fare acquisti e pagamenti online è diventata un’abitudine comune per molti.

Questa abitudine a inviare denaro e pagamenti online si sta riflettendo in maniera significativa anche su un altro ambito: quello delle donazioni online, anch’esso in forte aumento.

Le organizzazioni non profit che lavorano nell’ambito della solidarietà sono consapevoli di questa enorme opportunità e nel corso degli ultimi anni si è visto un notevole impegno nel design, o redesign, di form di donazione con una particolare attenzione all’esperienza e al percorso dell’utente.

Il modulo di donazione originale, punto di partenza per il redesign.

Nell’ambito della nostra collaborazione con UNHCR (l’Alto Commissariato delle Nazioni Unite per i Rifugiati) abbiamo lavorato al redesign del loro form di donazione.

Nel corso di più di un anno abbiamo affrontato temi di vario genere: aspetti tecnologici legati alle transazioni, l’esperienza dell’utente che vuole donare, l’esperienza dell’editor che deve impostare una campagna di acquisizione. Vediamone i principali.

Il modulo rivisto completamente. In grande evidenza i bottoni di scelta dell’importo. (Large preview)

Redesign grafico

La necessità primaria dal punto di vista di layout è stata di rendere più efficace la comunicazione degli ask ovvero gli importi di donazione richiesti agli utenti. Associare un importo a un impegno ben preciso ha un effetto importante sul donatore che può rendersi conto del beneficio reale che la sua donazione potrà avere. Ad esempio 160 euro di donazione singola possono assicurare dell’acqua potabile a 20 bambini rifugiati.

Abbiamo implementato un sistema di icone ufficiali delle Nazioni Unite per le attività umanitarie di recente pubblicazione. Questo rende coerente l’esperienza sul sito con tutta la comunicazione ufficiale UNHCR.

Dettaglio dei bottoni di scelta. La maggior urgenza viene veicolata tramite un’etichetta dedicata.

La frequenza delle donazioni è stato un altro tema delicato: la divisione tra donazioni singole e regolari e l’ulteriore distinzione tra regolari mensili e regolari annuali è stato il risultato di un ragionamento approfondito rispetto alla semplificazione, eliminando concetti come trimestrale, semestrale che potrebbero risultare di non immediata comprensione. Particolare cura è stata data alla chiarezza espositiva, evitando così eventuali dark patterns – cioè interazioni progettate per indurre in errore gli utenti per fargli compiere un’azione che non vogliono fare – o formulazioni poco chiare che potessero interferire con la volontà di donazione dell’utente.

Animazione che evidenzia le differenti modalità di frequenza della donazione, ognuna con importi dedicati.

Particolare importanza ha avuto la possibilità di definire, per ogni tipo di donazione, quella ritenuta più urgente. Chi gestisce il sito ha così modo di “spingere” gli utenti in maniera più marcata verso una donazione di uno specifico importo.

Ogni campagna è una Landing Page

Nel ripensare la pagina della singola campagna abbiamo adottato una logica di landing page modulare. Con landing page intendiamo una pagina web costruita attorno all’obiettivo della conversione: la riduzione dei punti di uscita dell’utente dalla pagina, una call to action chiara ed evidente e un percorso semplificato sono funzionali al raggiungimento dell’obiettivo. In questo modo viene ridotta la frizione e vengono favorite le conversioni.

Nel caso di UNHCR abbiamo voluto dare la possibilità agli autori dei testi di essere autonomi: la procedura per la creazione delle landing page è modulare e permette di assemblare secondo le esigenze del caso la pagina stessa.

Esempi di layout delle pagine di donazione
Diversi layout di pagine di donazione, totalmente in controllo dell’autore dei contenuti.

In quest’ottica, oltre agli aspetti relativi all’esperienza utente abbiamo lavorato anche per semplificare il lavoro di chi si occupa della creazione della pagina, che in gergo si definisce editor. Abbiamo scelto di dare all’autore del testo della campagna una notevole flessibilità editoriale, con la possibilità di scegliere tra numerosi layout distinti per quanto riguarda la testata, comprensivi di video in background o immagini full screen. Inoltre può scegliere tra numerosi blocchi di layout all’interno del corpo del testo principale.

Testate video
L’editor ha una grande flessibilità editoriale: in questa immagine abbiamo due tipologie di testata che possono essere utilizzate per mettere in risalto un video.

Sviluppo tecnologico

Sono stati numerosi anche gli interventi che abbiamo effettuato a livello tecnologico: il sistema di donazione si interfaccia direttamente con un CRM terzo che permette la gestione avanzata di tutti gli aspetti relazionali. La tokenizzazione delle carte di credito permette il pagamento degli importi regolari mantenendo la totale sicurezza degli account utente.

L’approccio modulare, l’utilizzo di software open source e la definizione di un design system portano a due risultati. Il primo immediato: l’esperienza utente è più piacevole e le conversioni aumentano. Il secondo è di garantire la possibilità di evoluzioni e integrazioni future, con un orizzonte temporale più ampio.

Approfondimenti

Collaboriamo con UNHCR dal 2017.

Oltre al sistema di donazioni, nel 2017 in occasione della Giornata del donatore, abbiamo sviluppato il sito withrefugees.unhcr.it dedicato all’evento (leggi l’articolo sul nostro blog).

Nel 2019 invece UNHCR ci ha incaricati di sviluppare il concept per la creazione di un regalo digitale dedicato ai donatori regolari nel giorno del loro compleanno (leggi l’articolo sul nostro blog).

Non siete il vostro pubblico: homepage, obiettivi aziendali, bisogni dei consumatori

Diagramma di Venn: Le cose presenti sulla homepage del sito di un'università e le cose che cercano le persone che visitano quel sito
Fonte: xkcd.com

La vignetta è volutamente esagerata ma il concetto è chiaro: nella homepage di una generica università, se non è stato fatto un buon lavoro strategico a monte, è molto probabile che l’unica cosa presente di effettivo interesse per il visitatore tipo sia il nome completo dell’università.

Ma cosa si intende precisamente con “Non siete il vostro pubblico”, reso meglio inglese con “You are not the user”? L’idea di fondo è che per le persone direttamente coinvolte in un progetto, servizio o azienda è molto difficile effettuare un salto cognitivo e mettersi nei panni dell’utente tipo per capire effettivamente di cosa ha bisogno. La diretta conseguenza è che spesso i siti, e in special modo le homepage, vengono disegnate avendo come riferimento principale la visione che l’azienda ha di se stessa.

Questo porta a design e scelte di organizzazione dei contenuti inefficienti.
Il conflitto è palese: da un lato c’è chi è profondamente coinvolto, conosce nel dettaglio i propri servizi/prodotti e i contenuti del proprio siti. Dall’altro c’è l’utente: l’atteggiamento, gli obiettivi, il tempo a disposizione e la soglia di attenzione sono ben diversi.

The User Is Always Right: un bel fumetto esplicativo
Fonte: Steve Mulder, “The User Is Always Right: A Practical Guide to Creating and Using Personas for the Web”

Per evitare che ciò accada è necessario un processo a più fasi ma che fondamentalmente preveda di conoscere i propri utenti, coinvolgerli nel design process e interagire con loro.

Perché non siete il vostro pubblico

Innanzitutto già l’essere coinvolti nella realizzazione di un sito web, a qualsiasi livello, vi rende atipici per definizione. Jakob Nielsen, uno dei padri fondatori dell’usabilità sul web, sostiene che è necessario pensare alla user experience nei confronti degli outsider e non degli insider (chi richiede lo sviluppo del sito o chi lo realizza concretamente). L’antidoto a questa conversazione tra due soggetti ugualmente coinvolti ma decisamente troppo dentro al progetto è coinvolgere gli utenti finali nel processo di design. A volte però il budget non è sufficiente. Il requisito minimo però è verificare che le proprie ipotesi sull’organizzazione e la presentazione dei contenuti siano poi corroborate da utenti reali, alle prese con necessità reali.

Un altro elemento molto rilevante è relativo all’alfabetizzazione digitale. Probabilmente anche tu che stai leggendo questo articolo hai delle competenze nell’uso del computer fuori dalla media. E di conseguenza abbiamo difficoltà a interpretare i processi di utilizzo di una pagina web da chi non solo non ha idea di come il web funzioni, ma vuole esclusivamente risolvere il suo problema e tornare a guardare il proprio feed di Instagram. O di TikTok.

Un esempio illuminante è quello di Google Buzz. Google che? Appunto. Prima di riprovarci con Google Plus, the Big G tentò nel 2010 di produrre una sorta di social network per contrastare l’avanzata di Facebook. Prima del lancio la piattaforma fu testata su ben 20mila utenti. Ma fu un fallimento. Come mai? Presto detto: i 20mila utenti erano tutti impiegati di Google.

Il problema della homepage

Durante la realizzazione di un nuovo sito web o di un redesign, una delle fasi maggiormente critiche è proprio il design della homepage. Se da un lato si può spingere sul fatto che l’homepage ormai non è più il punto di accesso principale, è anche vero che non è pensabile derubricare questa pagina a qualcosa di secondaria importanza, semplicemente svolge una funzione diversa rispetto al passato.

La ragione principale per questo approccio è che l’homepage non è che uno step nel percorso dell’utente e non la sua destinazione finale. Una metafora interessante, proposta dal team di Adobe XD, è quella dell’atrio di un hotel: ne è una parte essenziale, ci passano tutti gli ospiti. Ma nessun ospite viene in un albergo per stare nell’atrio. Allo stesso modo nessun visitatore di un sito web, se è alla ricerca di informazioni approfondite o di un prodotto specifico, ha come obiettivo quello di passare del tempo sulla homepage.

Esistono ovviamente situazioni particolari in cui questo non accade, ma nella maggior parte dei casi le esigenze di un’azienda in relazione alla propria homepage rientrano in questa visione non homepage-centrica.

Qualche proposta operativa

Chi sono i nostri visitatori?

Un primo passaggio è sicuramente quello di capire chi sono i nostri potenziali visitatori. Questo può essere fatto attraverso l’analisi di dati statistici di accesso, per esempio utilizzando Google Analytics nel caso di siti web già esistenti, o dall’analisi di mercato dei propri concorrenti nel caso di nuove realizzazioni. L’interpretazione dei dati grezzi non è banale e per questo molto spesso attraverso l’analisi di freddi valori si giunge all’identificazione di personas. Termine che proviene dal concetto di maschera del teatro greco antico, nell’ambito del marketing le personas sono delle figure inventate utili a rappresentare diverse categorie di utenti/visitatori/clienti.

Le personas sono elementi ricorrenti nel recente libro del nostro Enrico Marchetto assieme a Alessandra Farabegoli perché molto utili per definire le strategie di marketing in generale e, nel nostro caso, di marketing digitale.

Quindi, anche nella definizione della homepage, identificare i potenziali utilizzatori del nostro sito web diventa molto importante: ci mette in condizione di dare subito delle risposte alle domande o di facilitare i percorsi cognitivi, risolvendo con semplicità e immediatezza le richieste degli utenti.

In certi casi è molto semplice identificare rapidamente alcune categorie di utenti: nell’esempio iniziale dell’università possiamo immaginare due grandi categorie di utenti: studenti e insegnanti/staff. Poi, volendo approfondire, sarà possibile segmentare ulteriormente in sottocategorie o cluster più specifici. Ma già porsi la domanda: “cosa cercano gli studenti” e “cosa cercano gli insegnanti o i dipendenti” nella homepage dell’università è un primo passo nella direzione giusta che ci permette di identificare i comportamenti chiave dei nostri visitatori.

Quali sono i comportamenti chiave dei nostri visitatori?

Capire chi sono le nostre personas e definire i loro bisogni a livello macro, ci permette di ipotizzare dei percorsi utente o User Journey con cui modellare la nostra homepage.

Continuando con gli esempi a tema “educativo” molto interessante è il caso di TED Ed, side-project di TED.

La homepage di TedEd

L’homepage è semplicissima: si apre con una grande immagine e due call to action che identificano a loro volta due diversi percorsi da compiere a seconda delle proprie esigenze:

  1. Sei uno studente? Clicca qui e scopri tutte le nostre lezioni.
  2. Sei un insegnante? Clicca qui e scopri come creare delle lezioni o come portare TED Ed nella tua scuola.

Un approccio sicuramente minimale, probabilmente non applicabile in molte altre situazioni, ma di certo efficace e incentrato su target specifici (studenti / insegnanti) e sui loro relativi percorsi (imparare / insegnare).

Definire una gerarchia, sempre

Il vostro sito potrebbe avere diverse personas interessate. In TED Ed, l’abbiamo già detto, sono gli studenti e gli insegnanti.

Consideriamo ora Airbnb. Qui, in maniera piuttosto evidente, siamo anche in presenza di due target distinti: turisti interessati a un alloggio per vacanze o affittuari di breve periodo da un lato, proprietari di appartamenti/case/ville che vogliono affittare.

La homepage di Airbnb

Tuttavia però aprendo l’homepage notiamo subito una cosa: il design è interamente incentrato sull’affittuario/turista. Un rimando al Journey dell’host è presente, ma è secondario, relegato a una piccola voce di menù.

Due i fattori in ballo in questo caso. In primis sicuramente lo sbilanciamento tra utenti “guest” rispetto a utenti “host”: 150milioni di guests contro meno di un milione di hosts.

Secondariamente la motivazione: il turista/affittuario è un utente “distratto”: se non trova subito quello che cerca passerà a un altro sistema di booking. Se non viene ammaliato dall’interfaccia allora probabilmente non si fiderà.

L’host è invece un utente “interessato”: per lui il sito è una possibilità concreta di guadagno o uno strumento di lavoro. Non lascerà mai il sito prima di aver portato a termine il suo compito.

Conclusioni

Abbiamo visto alcuni esempi di strategia, definizione di personas e identificazione di user journey. La combinazione di questi elementi ci porta a rivalutare gli obiettivi della homepage di un sito e a stabilire un processo orientato ai risultati.

In questo senso, assieme alle definizione degli obiettivi di una homepage, è necessario stabilire le metriche con cui verranno poi analizzati i comportamenti degli utenti stessi: qualsiasi attività venga svolta in fase di progettazione è sostanzialmente una serie di ipotesi. Queste ipotesi devono poi venire valutate alla luce dei dati reali di utilizzo. Ogni pubblico è particolare e non possiamo avere la presunzione di aver capito tutto a priori ma l’umiltà di rivedere le ipotesi e, se necessario, cambiare quello che non funziona.


Hero Image – credit: icons8.com

Perché gli slideshow non funzionano

La scena è un classico: un cliente chiede il redesign del sito. Si affronta il tema dell’homepage e dei tanti contenuti che deve veicolare. Puntualmente viene pronunciata la parola magica: slideshow!

Gli slideshow (o slider, o carousel etc) sono dappertutto. Molto spesso l’azienda li vuole perché ritiene di risolvere due problemi: come iniziare una homepage con un po’ di movimento e come presentare più contenuti in uno spazio ritenuto molto importante. Inoltre c’è un aspetto psicologico importante: “lo fa il mio concorrente”, “lo fa il brand di riferimento del settore”.

Purtroppo però la realtà è più complessa e in questo caso anche controintuitiva. Di conseguenza da qualche tempo qui a Noiza tendiamo a sconsigliare gli slideshow. E lo facciamo con una consistente letteratura a supporto.

Vediamo nel dettaglio quali sono i problemi principali che toccano la questione slideshow.

Blindspot / Banner blindness
Numerosi test effettuati con sistemi di eye tracking mostrano che gli slideshow in generale ricevono poca attenzione da parte degli utenti. L’attenzione tende a spostarsi sul fatto che c’è uno slider e non sul contenuto effettivo. Inoltre gli utenti percepiscono gli slider come fossero dei banner pubblicitari e quindi tendono a considerarli come privi di contenuti reale ma solo dei veicoli promozionali.

Apatia o distrazione
A livello psicologico e biologico il movimento stesso produce uno stimolo nell’utente che distrae dal contenuto. È una questione legata alla parte cerebrale più antica (quella che condividiamo con i rettili) in cui un movimento improvviso poteva significare una questione di sopravvivenza. Sembrerà strano ma questo impatta anche sui nostri slider.

Mancanza di controllo
Molto spesso gli slideshow sono automatici. In qualche caso no. Ci sono gli slider che si fermano nel caso in cui ci si fermi sopra col mouse. I controlli (precedente/successivo) sono posizionati sempre in maniera diversa. Possono esserci diverse combinazioni di navigazione.
Questa grande differenza tra possibili soluzioni e la mancanza di uno standard costringono l’utente a operare uno sforzo cognitivo per capire come interagire (o anche se è possibile) interagire con lo slideshow.

Attenzione divisa
Il passaggio da una slide all’altra costringe l’utente a rifocalizzare l’attenzione, magari subito dopo aver cercato di capire cosa c’era sulla slide precedente.
Finora le considerazioni sono di carattere psicologico, magari interessanti ma non per forza deal breaker. Vediamo un po’ di dati rilevanti per chiunque abbia a cuore il proprio business, sia esso informativo o di vendita.

Conversioni molto basse
A seconda degli studi presi in esame i dati cambiano leggermente. Ma sono tragici: in buona sostanza se ci sono dei click (ed è un grosso se) saranno tutti concentrati sulla prima slide. Le statistiche dicono che siamo sotto all’1% di click. Studi di A/B test sostengono che la presenza di uno slideshow riduce le conversioni, perlopiù in quanto inducono frustrazione nell’utente.

User Experience e SEO danneggiate
Le prestazioni di un sito possono peggiorare nel caso in cui, ad esempio, uno slideshow di 5 immagini full screen viene preferito a un’immagine sola. L’aumento dei tempi di caricamento va a danneggiare l’esperienza utente ma anche le performance nelle ricerche su Google.

In buona sostanza ci sono soluzioni migliori del vecchio caro slider per aprire una homepage di un sito e proporre i propri servizi o prodotti. Vediamone alcune.

Soluzioni alternative allo slideshow

Landing pages
Anche in considerazione del fatto che l’ingresso dalla homepage non è più così rilevante come un tempo, una buona soluzione possono essere delle landing pages dedicate ai differenti segmenti del proprio pubblico. In questo modo è possibile fare quello che in gergo si definisce un reframe della propria offerta in base alle differenti personas (per approfondire sul concetto di personas ti consigliamo questo articolo).

Homepage con singola “hero image” e opportuno calendario editoriale
Probabilmente la soluzione più semplice ed efficace: creare una sezione di apertura del sito che sia accattivante e che abbia un focus specifico e calendarizzare una variazione della sezione su base settimanale/mensile. Tecnicamente semplice da realizzare, cosa che permette di ridurre i costi, e priva di tutti gli aspetti negativi dello slider.

Eliminare la “hero section” e partire direttamente con i contenuti
Un’altra soluzione, più drastica ma non per questo meno efficace, consiste nel tagliare proprio la sezione di apertura e di aprire la pagina con i contenuti che normalmente starebbero sotto.

Un po di link per approfondire

shouldiuseacarousel.com
Conciso ed efficace.

yoast.com/opinion-on-sliders
La posizione di uno dei leader di mercato per quanto riguarda all things SEO.

webmasters.googleblog.com/2012/01/page-layout-algorithm-improvement
Google sulla questione “above the fold” in un pezzo del 2012.

mediacurrent.com/blog/how-convince-your-client-slideshows-are-bad
Come convincere i clienti che gli slider non funzionano, lo spunto principale alla base di questo articolo.

uxmovement.com/navigation/big-usability-mistakes-designers-make-on-carousels
Se proprio vuoi uno slideshow almeno evita questi errori.

uxplanet.org/rethinking-the-slideshow-be-the-hero-of-your-next-web-design-project
Un altro pezzo valido sulla questione, con una lista concisa dei motivi per cui vengono ancora usati.

bradfrost.com/blog/post/carousels
La posizione di Brad Frost, ideatore del concetto di Atomic Design, molto stimato nella scena dello sviluppo Front End.

uxplanet.org/6-design-alternatives-to-avoid-evil-slideshows-9d442cf680d3
Carie Fisher illustra ben sei alternative per resistere alla tentazione di “uccidere” un sito con uno slideshow.

 

Cos’è il Web Design Responsivo? Alcuni esempi pratici.

La definizione più nota del Web Design Responsivo risale al 2010 quando quando Ethan Marcotte ha definito su A List Apart gli aspetti principali di questa tecnica nello sviluppo di pagine web.

L’elemento rilevante del design responsivo va al di là delle pure questioni tecniche e riguarda il suo obiettivo fondamentale: risolvere la grande frammentazione di dispositivi con cui le pagine web vengono poi effettivamente utilizzate.

Invece di realizzare design su misura per ciascuno degli innumerevoli strumenti con cui navigare possiamo considerare ciascuno di essi una sfaccettatura della stessa esperienza. Possiamo realizzare design in grado di adattarsi ai media che li distribuiscono.”

Cos’è un sito responsivo?

In senso stretto un sito web responsivo utilizza questi tre strumenti:

Media Queries

Una media query permette al webdesigner di definire delle condizioni da verificare per modificare la presentazione del contenuto in base alle proprietà dello strumento che usa l’utente, ad esempio uno smartphone, un tablet o uno schermo grande. Ma possono essere usate anche per controllare la resa su stampa o altri casi d’uso particolari.

Griglie fluide

L’utilizzo di griglie permette la creazione di design fluidi le cui colonne si adattano proporzionalmente al device. In questo modo il designer si assicura che l’esperienza d’uso sia coerente a prescindere dal modo in cui viene utilizzato il sito.

Design flessibili

L’enorme quantità di device presenti al mondo, quasi 10 miliardi, constringe a ripensare il design e lo sviluppo di un sito web in una direzione più organica e strutturata, in grado di prevenire usi inconsapevolmente distruttivi del design stesso durante la vita del sito. Ad esempio prevenire che file media evoluti (filmati di youtube, embed di twitter etc) siano di dimensioni maggiori degli spazi in cui vengono caricati.

L’utilizzo di queste tre tecniche è solo l’inizio di un processo che riguarda prima la fase progettuale rispetto alla pura esecuzione: invece di creare un design specifico per ogni esperienza immaginabile, è auspicabile che la transizione tra contesti di fruizione diversi venga gestita in maniera progressiva.
Per sviluppare soluzioni responsive funzionali è quindi necessario mettere al centro del processo di sviluppo l’utente finale e la sua esperienza d’uso.

3 esempi  di design responsivo

Beltrami

beltrami.it su desktop
beltrami.it su desktop
riorganizzazione degli elementi nella versione mobile della hompage di beltrami grazie al design responsivo
beltrami.it su mobile

Per il sito corporate di Beltrami, azienda che realizza biancheria per alberghi e ristoranti di lusso, l’esigenza era quella di proporre dei contenuti in modalità slide con una visualizzazione full screen per le varie aree di focus, forzando lo scroll della pagina in modo tale da simulare una vera e propria presentazione. Con il passaggio a mobile però, sia per la differenza di fruizione che per la mancanza di spazio che fa perdere elementi di controllo, abbiamo deciso di ripristinare lo scroll normale: le singole slide continuano ad adattarsi alla dimensione dello schermo ma la navigazione non è più forzata.

Smartrooms

smartrooms.it - transizione da desktop a mobile del design responsivo
smartrooms.it – transizione da desktop a mobile

Per Smartrooms, sito di camere low cost per turisti e studenti a Trieste, era necessario privilegiare l’accesso rapido alle sezioni Prenota e dove siamo da mobile. Il menu di navigazione standard si riduce a queste due voci, sempre presenti, mentre le altre sono nel classico hamburger menu. Importante anche il tap to call: con un semplice touch sull’icona del telefono da mobile parte la telefonata. Infine lo switch di lingua da desktop è esteso, da mobile si visualizza la lingua attiva, con un touch si accede alle altre opzioni.

Aurora Viaggi

auroraviaggi.com, alcune proposte su desktop
auroraviaggi.com, alcune proposte su desktop
auroraviaggi.com, grazie al web design responsivo la visualizzazione su mobile cambia in questa modo
auroraviaggi.com, le stesse proposte su mobile

Per AuroraViaggi, agenzia di viaggi di Trieste attiva da 60 anni, abbiamo affrontato il problema di come proporre un contenuto fortemente strutturato e generalmente proposto sotto forma di tabella che fosse fruibile anche da cellulare. In questo caso la soluzione è stata di mantenere la struttura tabellare su schermi di dimensioni sufficienti per visualizzare correttamente e completamente le informazioni. Appena la dimensione del device con cui si fruisce il contenuto diventa insufficiente per avere una visione chiara la struttura viene alterata e ogni proposta diventa individuale, con gli elementi identificativi ripetuti. In questo modo, dando anche maggior risalto all’immagine, si concilia un’esperienza di navigazione maggiormente emotiva e fotografica tipica dei dispositivi mobili.

Abbiamo appena visto tre esempi di soluzioni per un design responsivo applicabili allo sviluppo di un sito web in base al tipo di device utilizzato che utilizzano come unico riferimento la dimensione dello schermo del device stesso. In questo modo ci assicuriamo di essere future proof a prescindere da quali nuovi formati, proporzioni o strumenti di fruizione dovessero diffondersi in futuri.

Sei interessato a una soluzione di questo tipo anche per le tue necessità? Contattaci!

UNHCR – World Refugee Day

Da sedici anni il 20 giugno è la Giornata Internazionale del Rifugiato, evento globale indetto dalle Nazioni Unite per aumentare la consapevolezza sul delicato tema dei rifugiati.

UNHCR, Ufficio dell’Alto Commissario delle Nazioni Unite per i Rifugiati, dedica particolare attenzione a questa data, organizzando e dando visibilità ad eventi realizzati al fine di favorire l’integrazione e il riconoscimento dei rifugiati, celebrandone la forza, il coraggio e la perseveranza.

Nel 2017 UNHCR Italia ha deciso di affidare a Noiza lo sviluppo di un sito dedicato all’evento, withrefugees.unhcr.it, con il fine di promuovere gli eventi sul territorio nazionale e di favorire la firma di una petizione diretta ai governi di tutto il mondo. La petizione chiede ai governi di garantire che ogni bambino rifugiato abbia un’istruzione, che ogni famiglia rifugiata abbia un posto sicuro in cui vivere e che ogni rifugiato possa lavorare o acquisire nuove competenze per dare il suo contributo alla comunità.

Insieme a UNHCR abbiamo quindi realizzato un sito web con due aree principali: la sezione in cui gli utenti potessero firmare la petizione e “agire” sui social per dare visibilità alla petizione stessa e la sezione relativa agli eventi sul territorio nazionale.

Il sito è stato pensato e realizzato per essere fruibile con semplicità e immediatezza da qualsiasi dispositivo, con particolare attenzione all’esperienza da mobile in funzione del percorso esperienziale SocialSitoFirma petizioneCondivisione sui social.

Nella giornata del rifugiato e nei giorni precedenti si sono svolti più di 300 eventi di tutti i tipi e generi: tavole rotonde, dibattiti, spettacoli, incontri, mercatini. Attraverso l’uso della mappa è stato possibile individuare con facilità gli eventi per zona di interesse. Strumenti di ricerca più puntuali hanno permesso di filtrare per data, categoria o distanza da una particolare località.

L’accesso alle informazioni specifiche di ogni evento è stato pensato attraverso un duplice percorso: direttamente dalla mappa, tramite il popup informativo, o nella lista di eventi sottostanti la mappa stessa.

A completare il sito sono presenti una corposa sezione “Storie”, pensata per trasmettere il percorso personale di numerosi rifugiati. Percorso pieno di umanità, spesso drammatico, ma con una prospettiva positiva e di integrazione.

Approfondimenti

Collaboriamo con UNHCR dal 2017.

Oltre al progetto World Refugee Day, nel 2019 abbiamo progettato dona.unhcr.it, il sito che gestisce l’intero sistema di donazioni di UNHCR Italia (scopri come lo abbiamo progettato).

Sempre nel 2019 UNHCR ci ha incaricati di sviluppare il concept per la creazione di un regalo digitale dedicato ai donatori regolari nel giorno del loro compleanno (leggi l’articolo sul nostro blog).

Turismo FVG: Social Wall

All’interno del padiglione Italia dell’Expo 2015 quest’anno c’era anche un piccolo pezzo di Noiza.

Per l’agenzia Turismo FVG abbiamo realizzato un Social Wall per aggregare in tempo reale i contenuti digitali provenienti dai diversi Social Network e uniti dall’uso dell’hashtag #Fvglive. Questo è stato esposto nel corso della settimana dedicata alla regione Friuli Venezia-Giulia, e ha dato visibilità alla grande quantità di contenuti social, soprattutto fotografici, prodotti dagli utenti della rete.

social-wall_mocku-up

Dal castello di Miramare alle montagne carniche, tramite il Social Wall i visitatori del padiglione Italia hanno avuto modo di fare un piccolo tour nella nostra splendida Regione.

Joseph.land: web e promozione della cultura del Carso

joseph carso trieste

Pietra bianca, terra rossa, la bianchera. La bora e il mare in lontananza.
Le suggestioni sensoriali offerte dal Carso sono assolutamente uniche.

Per capire appieno questo territorio, i suoi sapori e i suoi profumi è necessario conoscere anche le persone che qui vivono e lavorano.

Joseph.land nasce proprio da qui: dalla necessità di promuovere la cultura del Carso partendo dalle persone.

I servizi offerti da Joseph sono pratici e partecipati.

    • Organizzazione di eventi: visite di mezza giornata alle aziende agricole e artigianali, fatte di laboratori pratici, divertimento e degustazioni. Per capire l’essenza del Carso conoscendo le persone, i luoghi e i sapori giusti.

 

    • Offerta di terra agricola: per lavorarla in un contesto di orti sociali

 

  • Formazione: Percorsi formativi articolati su più mesi: corsi di apicoltura, adozioni di ulivi, adozioni di vigneti, sotto la supervisione di agricoltori e tecnici.

L’obiettivo del progetto è quello di sostenere le aziende agricole e artigianali di Trieste e del Carso con una forte vocazione ecologica e sociale.

Noi di Noiza abbiamo curato la realizzazione della graphic identity e il web design del sito Joseph.land.

Questi gli eventi in programma per l’estate 2014:

Un tuffo nella lavanda di Tanja Arandjelović

Sopra il golfo con i vini di Matej Lupinc

La grotta del formaggio di Dario Zidarič

Lavora con la pietra di Jernej Bortolato

Si tratta di percorsi formativi estremamente interessanti che ci sentiamo di consigliare davvero a tutti per venire a contatto con alcune delle principali eccellenze carsiche e scoprire una piccola parte di quanto ha da offrire il Carso triestino.

Laboratorio sui New Media a Cinemazero

Cinemazero è una delle realtà culturali più importanti e conosciute della regione Friuli Venezia Giulia.

Ogni anno, all’interno de Le voci dell’inchiesta, festival organizzato da Cinemazero con l’obiettivo di approfondire il linguaggio del giornalismo d’inchiesta, si svolge un laboratorio permanente dedicato a giornalismo online, new media e social media strategy, a cui partecipano studenti e giovani appassionati al mondo del cinema, del teatro, della fotografia, della radio, della televisione, della stampa, e dei nuovi media: il nostro Enrico è stato invitato a guidare questo workshop assieme a Elisa Grando.

L’appuntamento è per giovedì 11 aprile 2013 alle ore 11:30 presso il Cinemazero.

 

Aurora Viaggi: Webmarketing Turistico

Una delle più storiche attività commerciali di Trieste che nel 2013 ha festeggiato 50 anni di attività: Aurora Viaggi ha scelto Noiza e AdFormandum per un percorso di formazione di 30 ore legato al webmarketing turistico, declinato in social media strategy e scrittura online.

I primi risultati sono evidenti, con una gestione strategica della fan page che ha raggiunto in breve il migliaio di fan: https://www.facebook.com/AuroraViaggi

I prossimi risultati saranno ancora più evidenti, con la messa online del nuovo sito dell’Aurora Viaggi.