The Webbetter Framework
0 likes189 views
Il documento presenta 'The Web Better', un framework per marketer e creativi, mirato a migliorare il design dei prodotti digitali attraverso una visione umanocentrica e strategica. Si evidenziano nove 'pillar' essenziali per la progettazione digitale, che includono l'importanza di avere uno scopo definito, la centralità dell'utente e la valorizzazione della comunicazione e collaborazione nel team. In un contesto competitivo accentuato dalla pandemia, il framework offre un approccio integrato per creare interfacce efficaci e coinvolgenti.
The Webbetter Framework
- 1. the web better Un framework per marketer e creativi per affrontare con successo il progetto digitale
- 2. Silvia Podestà Design & Content Strategist | ATC – All Things Communicate designer strategico con un articolato background in comunicazione e marketing per i media digitali. Nel corso degli anni ha collaborato con aziende e agenzie in settori diversi, sviluppando competenze tecniche e strategiche in ambito di brand positioning. All’attività progettuale affianca la ricerca e lo studio dei pattern comportamentali dei consumatori, con particolare riferimento alle interfacce web. Agenda Introduzione. verso una nuova cultura del progetto digitale The web better. un framework per creare interfacce e prodotti di valore per il business 9 ingredienti: i “pillar” della formula Webbetter
- 3. Un framework per il progetto digitale Introduzione
- 4. Vaste e diversificate competenze richieste dal progetto digitale, scarso allineamento tra stakeholder con diverso know how Utenti sempre più skillati—- si alza l’asticella per aziende e brand 1 2 Progettare digitale oggi 3 La pandemia ha accelerato la corsa al digitale >> competizione più accanita
- 5. La progettazione digitale in molti ambiti risente della complessità del compito che viene richiesto. Specialmente in aziende o agenzie creative nate con una vocazione non-digitale. In particolare ciò è dovuto a un fattore culturale: troppo spesso trascuriamo la doppia natura del prodotto digitale.
- 6. Che differenza c’è? 1. CAMPAGNA AFFISSIONI 2. SITO CORPORATE
- 7. Ma con punti di vista diversi e complementari! ENTRAMBI CREATIVI Due Possibili Pubblicitario DON DRAPER Designer IAN SPALTER Punti di vista
- 8. Supporta Le attività che l’utente online ha bisogno di compiere! AD ESEMPIO EFFETTUARE TRANSAZIONI | INTERAGIRE | MONITORARE DATI | CREARE QUALCOSA | DIVERTIRSI |SOCIALIZZARE | IMPARARE UN PRODOTTO DIGITALE E’ UNO STRUMENTO
- 9. Spesso nei team creativi alle prese con un progetto web o digital si tende a privilegiare un approccio a scapito dell’altro, e di conseguenza il sito o l’app: 1. Appaiono slegati dalla strategia di business complessiva= inutilità lato brand 2. Risolvono male o non risolvono le necessità dell’utente = irrilevanza lato utente 3. Non sfruttano appieno le potenzialità comunicative dell’interfaccia digitale= scarsa creatività, standardizzazione, opportunità di marketing sprecate
- 10. Per ovviare a ciò occorre: 1. ripensare al prodotto digitale come un sistema prodotto-servizio- comunicazione 2. Ridefinire la dicotomia design/comunicazione, e valorizzarne invece il rapporto sinergico
- 12. ew b b e et t r WHY EMPATHY BUSINESS VALUE BUILDING BLOCKS ERGONOMICS THRILL TEAM EMOTION REACH design with a purpose design to make your company thrive design with humans in mind Start from content and architecture Create usable interfaces Create engaging interfaces Enhance Collaboration Persuade users to action Let users find your product
- 13. Webbetter perché 1. Aiuta a guardare alla big picture del progetto digitale 2. Tiene in uguale considerazione le esigenze del design e le necessità di comunicazione 3. Aiuta a comprendere la complessità e la diversità delle varie competenze che vanno coinvolte nella progettazione digitale
- 15. “What’s really making us stand out is that we’ve always had a very distinctive purpose as a product: creating a safe space for users to express themselves in a positive and creative way”. RICHARD WATERWORTH, TIKTOK UK & EUROPE • Avere un obiettivo è cruciale per qualsiasi attività strategica • È essenziale che team creativi e top executives vengano incoraggiati a stabilire uno scopo, un purpose che guidi l’intero processo di design. • Il purpose aiuta a: 1.Pensare in termini di bigger picture 2. Definire una forte e coerente value proposition PROGETTARE CON UNO SCOPO
- 16. Definire gli obiettivi specifici di un prodotto digitale all’interno di una strategia di brand complessiva e relativamente alle diverse fasi del funnel di acquisizione (awareness, considerazione, conversione, nurturing…) KEY TAKEAWAY 💥
- 18. • Lo Human centred design è un aspetto imprescindibile della progettazione digitale oggi • Comprendere gli utenti: focus su tecniche di ricerca/analisi più usate: personas, interviste qualitative, focus group, scenario building PROGETTARE HUMAN-CENTERED
- 19. Effettuare sempre ricerche di contesto per comprendere le reali necessità, aspettative, desideri degli utenti. Progettare di conseguenza è la chiave per il successo di lungo termine dei prodotti digitali. KEY TAKEAWAY 💥
- 20. 3 Web Better Progettare per la Unique Selling Proposition BUSINESS VALUE 3 Pillars Design per la USP BUSINESS VALUE
- 21. PROGETTARE PER LA USP • Domanda d’obbligo prima di iniziare il design: come il nostro prodotto digitale può differenziarsi dai competitor? • Innovazione, creatività e applicazione di modelli mentali alternativi per creare prodotti digitali unici. Qualche esempio: Uber, Tinder.
- 22. Assicurarsi sempre che il prodotto digitale che abbiamo in mente fornisca reale valore aggiunto agli utenti e all’azienda e non sia la ripetizione di qualcosa di già esistente con cui è difficile competere. KEY TAKEAWAY 💥
- 23. 4 Web Better Contenuti e architettura informativa BUILDING BLOCKS2 Pillars Progettare “Human-centered” EMPATHY
- 24. I FONDAMENTALI: UI, CONTENUTI E ARCHITETTURA INFORMATIVA • Come iniziare il design: inventario dei contenuti del sito o della app, determinazione ranking di priorità e creazione di una gerarchia dei contenuti • Dalla gerarchia all’architettura informativa • Visualizzare per presentare al team o al cliente: wireframe a bassa o alta fedeltà
- 25. A partire da una visione di globale di quante (e della tipologia di) informazioni e contenuti il nostro sito dovrà ospitare, progettiamo in modo flessibile e modulare, nell’ottica di cambiamenti incrementali dei contenuti nel tempo. KEY TAKEAWAY 💥
- 27. DESIGN PER L’USABILITA’ • Cosa significa User Experience? Efficacia, efficienza e soddisfazione dell’utente. • Gli elementi da progettare con cura: navigazione, responsiveness, contenuti multimediali e accessibilità.
- 28. Assicuriamoci che il nostro prodotto digitale sia efficace, efficiente e soddisfacente per l’utente prestando attenzione a: navigazione, accessibilità, responsiveness e adattabilità a differenti devices. KEY TAKEAWAY 💥
- 30. DESIGN PER L’ENGAGEMENT • Oggi gli utenti si aspettano interazioni fluide con i prodotti digitali, ma anche esperienze sorprendenti, divertenti, emozionanti. • Attraverso un concept creativo originale e ad un’art direction ben costruita, l’interfaccia digitale diventa un mezzo di comunicazione efficacissimo. • Focus on>> elementi di art direction per il web: tipografia, colori, elementi dinamici, interattività, con alcuni esempi.
- 31. Per diventare uno strumento di comunicazione e di marketing efficace, includiamo nel nostro prodotto digitale un concept creativo unico e elementi di art direction differenzianti. KEY TAKEAWAY 💥
- 32. 7 Pillars Migliorare la collaborazione nel progetto digitale TEAM
- 33. MIGLIORARE LA COLLABORAZIONE • Ogni impresa creativa necessita di lavoro di squadra. Il progetto digitale necessita della coordinazione di molte squadre! • Pensare Agile: quando è bene, quando meno • Come facilitare la comunicazione tra developer, designer, marketer, clienti in un contesto variabile e soggetto a cambiamento continuo?
- 34. L’approccio agile consente di rispondere in maniera più duttile a contesti e presupposti in continuo cambiamento, ma necessita di grande collaborazione tra i team coinvolti e tra fornitore e cliente. KEY TAKEAWAY 💥
- 35. 8 Pillars Design per la persuasione online EMOTION
- 36. DESIGN PER LA PERSUASIONE • Psicologia degli utenti sul web • Focus on>>Strumenti di persuasione • Attenzione ai fattori culturali • Persuadere, ma in modo etico: evitare i dark pattern
- 37. Il design delle nostre interfacce web può renderle un mezzo persuasivo potente per il marketing ,ma ricordiamoci del punto di vista etico della nostra professione per evitare un effetto “boomerang”. KEY TAKEAWAY 💥
- 38. 9 Pillars Farsi trovare dalla nostra audience REACH
- 39. FARSI TROVARE DALLA NOSTRA AUDIENCE • Evitare le cattedrali nel deserto • SEO tips per posizionare un website • E/O Advertising per promuovere una piattaforma, un sito o una app
- 40. Nessun prodotto digitale ha senso o valore se gli utenti non lo utilizzano o lo navigano. L’ottimizzazione per i motori di ricerca e la promozione del sito o della app attraverso l’advertising sono aspetti cruciali all’interno del progetto digitale. KEY TAKEAWAY 💥
- 41. COMING SOON… A POCKET GUIDE TO BUILD BETTER AND BUSINESS VALUABLE DIGITAL PRODUCTS #THEWEBBETTER