UX/UI Design

Dr. Schar - FoodService

Dr. Schar - FoodService

Dr. Schar - FoodService

Overview

Overview

Overview

Tipo di progetto:

Sito web (prototipo) - Progetto di tirocinio e tesi


Data:

Febbraio 2023


Ruolo:

Creatrice & Co-creatrice


Servizi:

Web Design, UX Research, UX Design, UI Design

Presentazione

Presentazione

Presentazione

Schär - FoodService è un portale del marchio Schär dedicato ai diversi settori della gastronomia, tra cui hotel, B&B, ristoranti, pizzerie, mense, catering, bar, gastronomia da viaggio, ristorazione veloce e distributori automatici. Il servizio offre un vasto assortimento di prodotti appartenenti a molteplici categorie, oltre che ricette, consigli, collaborazioni e formazione sul mondo senza glutine per tutti i professionisti della gastronomia.

Approccio

Approccio

Approccio

UX Strategy iniziale


Contesto


Dr. Schär è una società altoatesina a conduzione familiare dal 1922, con portata globale avendo 18 sedi in 11 Paesi. Tra i marchi dell’azienda, oltre a Flavis , Kanso e SIMBIOS, abbiamo Schär, che si occupa di produzione e vendita di alimenti privi di glutine per i consumatori affetti da celiachia e per coloro che sono sensibili al glutine. In particolare, il marchio Schär ha deciso di aprire un servizio indirizzato direttamente a tutti i settori della gastronomia - tra cui hotel e B&B, ristoranti e pizzerie, mense e catering, bar e gastronomia da viaggio, ristorazione veloce e distributori automatici - fornendo un assortimento completo di prodotti, ma anche ricette, consigli e formazione sul mondo del gluten-free per tutti i professionisti del settore gastronomico, dando vita alla soluzione Schär - Foodservice.


Problema e soluzione


Dr. Schär è una società che pone al centro del suo lavoro il cliente con lo scopo fornire ottimi e genuini prodotti privi di glutine per tutti i gusti ed esigenze, così da incrementare l’inclusività a tavola, permettendo a coloro che hanno intolleranze di godere di un pasto al pari degli altri. Con Schär - Foodservice l’obiettivo si amplia, permettendo a tutti i commensali - celiaci e non - di poter frequentare e/o disporre dei diversi settori della gastronomia senza temere la mancata presenza di prodotti o pasti adatti alle loro esigenze.


Strategia - Personas


In questo caso, sono stati sviluppati due profili rivisitando quelli realizzati in tirocinio:

  • Hannah rappresenta coloro che gestiscono attività culinarie, affrontando sfide come la scelta dei prodotti, la gestione dei fornitori e la creazione di piatti. Le sue motivazioni principali sono quindi di soddisfare i nuovi ospiti, apprendendo quanto più possibile di questa realtà. In questo caso, Hannah è un consumatore di tipo B: Chernev ha infatti individuato tre varianti di consumatori sulla base della strategia di decisione da loro adottata. Il consumatore B è colui che deve affrontare il processo decisionale, ma per farlo ha già chiari i criteri per scegliere e la loro importanza. La sfida di Hannah è di trovare un partner a lungo termine con un’ampia gamma di prodotti, garantendo così alternative gluten-free dei piatti classici, e di trovare prodotti confezionati utili per la prima colazione.

  • Andrea è un grossista. La sua attività si basa sulla scoperta di prodotti di alta qualità e sulla soddisfazione dei clienti. Tra le sue motivazioni principali vi è una crescita a livello di prestigio e fama. In questo caso Andrea è un consumatore di tipo A: non necessita di fare una scelta, perché è leale ad una già presa. Infatti, Andrea sa già cosa ordinare per i suoi clienti; deve solo trovare ciò che sta cercando. La sfida di Andrea, dunque, è di trovare un produttore di alimenti senza glutine per diversi settori gastronomici che sia affidabile, puntuale e di qualità. L’obiettivo è di dar vita a una partnership che risulti vantaggiosa per entrambe le parti.

  • Persona 1 - Hannah Plattner

  • Persona 2 - Andrea Menegiri

Persona 1 - Hannah Plattner

Persona 2 - Andrea Menegiri

  • Persona 1 - Hannah Plattner

  • Persona 2 - Andrea Menegiri

Scopo - Benchmark


Tra i competitors, la maggior parte si concentra maggiormente sull’acquisto dei prodotti in sé e la presentazione degli stessi, piuttosto che a un ampliamento dell’offerta verso i diversi settori gastronomici, offrendo servizi come un ricettario o fidelizzando gli utenti mediante la newsletter.


Scheletro - Value Proposition Canvas


Quanto presentato permette di constatare che la soluzione soddisfa gran parte delle necessità dei personaggi; in particolare, quelle legate alla ricerca e selezione della merce e al dominio informativo sulla realtà senza glutine, piuttosto che in aspetti legati alla costruzione e/o miglioramento della posizione sociale. Fama e prestigio, infatti, sono elementi secondari e conseguenti al fornirsi da un produttore come Dr. Schär - leader di alimenti gluten free a livello europeo -, ma non specifici della proposta di valore di per sé.

  • VPC - Hannah Plattner

  • VPC - Andrea Menegiri

  • VPC - Hannah Plattner

  • VPC - Andrea Menegiri

VPC - Hannah Plattner

VPC - Andrea Menegiri

Struttura


La progettazione dell'interfaccia riveste un ruolo cruciale poiché in essa convergono tutti gli elementi studiati fin dall'inizio del processo. È fondamentale massimizzare l'utilità e minimizzare i costi, fornendo una buona fluenza cognitiva e massimizzando l'accessibilità alle informazioni riducendo la complessità.


Il sito è diviso in due parti principali, evidenziate nel menu. La top bar offre l’accesso a sezioni extra come news, eventi e l'"Academy". La nav bar si focalizza invece sul Foodservice con voci come "Prodotti", "Branche", “Ricette”, “Preparazione”, “Perché scegliere Dr. Schär” e contatti. L'architettura del sito è progettata per soddisfare le necessità delle personas. La categorizzazione dei prodotti e dei settori gastronomici agevola le decisioni e la ricerca, specialmente per consumatori di tipo B. Mentre la presenza dei cataloghi scaricabili e della lista completa dei prodotti è coerente con il principio del "more is better" associato al consumatore A. Dopodiché, le anteprime delle classi consentono di valutare i prodotti senza accedere alle schede singole, ottenendo un’ottima fluenza presentando informazioni chiave e icone intuitive. Selezionando una categoria si accede a una lista di cards prodotto, filtrabile e ordinabile. Il menu a tabs sopra le descrizioni migliora la fluidità della navigazione, permettendo di cambiare rapidamente la visualizzazione senza tornare indietro. Infine, selezionando un prodotto si accede alla pagina oggetto, la quale mostra attributi e informazioni specifiche utili sia per Hannah che per Andrea e la possibilità di navigare ed esplorare informazioni e prodotti correlati in modo semplice, diretto e veloce.



Giungiamo poi alla sezione delle ricette. Nella pagina indice le ricette sono categorizzate tramite hashtag e facilmente filtrate per pasto, settore, ingredienti, difficoltà e allergeni. Importante è la presenza del banner di ricerca che consente di cercare ricette per nome o ingredienti, utile per Hannah, così da trovare rapidamente ricette in base agli alimenti a disposizione. Accedendo alla pagina di dettaglio della ricetta si trovano le informazioni complete, come tempo di preparazione, porzioni e ingredienti, con collegamento diretto alle pagine dei prodotti Schär, preparazione e uno slider di ricette simili per fornire idee e opzioni di esplorazione.



Superficie


L’aspetto visuale della proposta di valore si concentra sugli elementi della brand identity, ossia come l'azienda desidera che il marchio sia percepito. Per esempio, il naming e il logo sono studiati per chiarire facilmente l'ambito dell'azienda, con la decisione di adottare due colori primari per dare risalto al prodotto sullo scaffale e attrarre l’attenzione. La scelta dei colori del sito, pertanto, è consistente con il logo, con l'aggiunta di tonalità neutre che ricordano il grano ed enfatizzano le immagini sullo sfondo chiaro, giocando di contrasto. Le immagini, infatti, sono un ottimo strumento di comunicazione non verbale e permettono di raggiungere il significato ancor prima di leggere un eventuale testo esplicativo. Per questa ragione il sito si avvale di diverse immagini, oltre a quelle necessarie per la presentazione dei prodotti. Queste ultime, invece, si differenziano rispetto alle altre scure, in quanto presentano uno sfondo bianco – quindi chiaro – sul quale è posta l’immagine dell’alimento. Lo stesso contrasto si ritrova nella tipografia e i suoi due font con caratteri serif e sans-serif. Il risultato è un tone of voice visivo semplice, ordinato, elegante e naturale, deducibile anche dalle semplici e minimali iconografie, utilizzate soprattutto per gli allergeni, e la coerenza tra i diversi materiali “below the line”.


© 2023 Valentina D'Alpaos