Io sono
DI FRANCESCO Nolan
Attualmente sono al terzo anno del BUT MMI a Grenoble, in alternanza presso Youtips, dove mi occupo di comunicazione, gestione dei social media e creazione di contenuti. Specializzato in strategia di comunicazione e design dell’esperienza, adoro imparare, sperimentare nuove idee ed esplorare tutto ciò che il digitale può offrire. Non esitare a scoprire i miei migliori progetti !
Studente in alternanza presso Youtips, creatore di contenuti (e anche di caffè)
Portfolio
Un’anteprima dei miei lavori
THE BEAR: Risveglia il tuo istinto selvaggio – UI Design & Prototipazione
Servizi
Design
Collaborazione
Yoan Toran -Nolan DI FRANCESCO
Anno
Dicembre 2025
THE BEAR: Risveglia il tuo istinto selvaggioUI Design & Prototipazione Figma
Come trasformare una forte identità visiva in un'esperienza web fluida?
THE BEAR è un marchio fittizio di birre artigianali radicato nella natura. In questo progetto collaborativo, i ruoli erano ben definiti: l'identità grafica e le illustrazioni sono state realizzate dal mio partner Yoan Toran, mentre io mi sono occupato di tradurre questo universo in un'interfaccia digitale (UI) su Figma.
Ho strutturato il percorso utente per presentare le tre gamme (Brown, Polar, Grizzly), creato il design system web adatto e realizzato la prototipazione ad alta fedeltà per garantire una navigazione immersiva e funzionale. .content a { width: 100%; width: 470px; } .content { display: flex; gap : 10px; justify-content: center; align-items: center; } .btn-epic { display: flex; position: relative; margin: auto; width: 100%; max-width: 475px; height: 52px; background: #fff; border-color: black; transform: translate3d(0px, 0%, 0px); text-decoration: none; font-weight: 600; font-size: 18px; letter-spacing: .05em; transition-delay: .6s; overflow: hidden; } .btn-epic:before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #8BB4B1; border-radius: 50% 50% 0 0; transform: translateY(100%) scaleY(.5); transition: all .6s ease; } .btn-epic:after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: white; border-radius: 0; transform: translateY(0) scaleY(1); transition: all .6s ease; } .btn-epic div { position: relative; width: 50%; height: 26px; text-transform: uppercase; } .btn-epic span { position: absolute; z-index: 1; top: 0; width: 100%; text-align: center; transition: transform .5s ease; } .btn-epic span:first-child { color: white; transform: translateY(100%); } .btn-epic span:last-child { color: black; transform: translateY(0); } .btn-epic:hover { background: #d9d9d9; transition: background .2s linear; transition-delay: .6s; } .btn-epic:hover:after { border-radius: 0 0 50% 50%; transform: translateY(-100%) scaleY(.5); transition-delay: 0; } .btn-epic:hover:before { border-radius: 0; transform: translateY(0) scaleY(1); transition-delay: 0; } .btn-epic:hover span:first-child { transform: translateY(0); } .btn-epic:hover span:last-child { transform: translateY(-50px); } @media (max-width: 768px) { .btn-epic { max-width: 200px; height: 42px; font-size: 16px; } } @media (max-width: 480px) { .btn-epic { max-width: 160px; height: 36px; font-size: 14px; } }
KeyTrip – Apri le porte del mondo
Servizi
Comunicazione -
Design
Collaborazione
FLOCARD R. - FRAGNOUD N.
- DI FRANCESCO N.
Anno
Dicembre 2025
Quand’è stata l’ultima volta che hai prenotato un viaggio… senza passare ore a confrontare prezzi, esitare, e aprire dieci schede diverse?È proprio da questa frustrazione che è nato KeyTrip. Abbiamo reinventato l’esperienza di viaggio per renderla più semplice, più intuitiva e più umana. Abbiamo realizzato un dossier di concept e un prototipo completo su Figma (wireframe + mockup ad alta fedeltà) per dare vita a una piattaforma tutto-in-uno che centralizza voli, hotel e attività—aggiungendo un tocco unico: la box immersiva, che fa iniziare il viaggio ancora prima della partenza.
Un concept premium pensato per zero stress, 100% emozione. KeyTrip è il viaggio, reinventato.
KeyTrip – Apri le porte del mondo. .content-sae301 a { width: 100%; width: 470px; } .content-sae301 { display: flex; gap : 10px; justify-content: center; align-items: center; } .btn-epic { display: flex; position: relative; margin: auto; width: 100%; max-width: 475px; height: 52px; background: #fff; border-color: black; transform: translate3d(0px, 0%, 0px); text-decoration: none; font-weight: 600; font-size: 18px; letter-spacing: .05em; transition-delay: .6s; overflow: hidden; } .btn-epic:before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #8BB4B1; border-radius: 50% 50% 0 0; transform: translateY(100%) scaleY(.5); transition: all .6s ease; } .btn-epic:after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: white; border-radius: 0; transform: translateY(0) scaleY(1); transition: all .6s ease; } .btn-epic div { position: relative; width: 50%; height: 26px; text-transform: uppercase; } .btn-epic span { position: absolute; z-index: 1; top: 0; width: 100%; text-align: center; transition: transform .5s ease; } .btn-epic span:first-child { color: white; transform: translateY(100%); } .btn-epic span:last-child { color: black; transform: translateY(0); } .btn-epic:hover { background: #d9d9d9; transition: background .2s linear; transition-delay: .6s; } .btn-epic:hover:after { border-radius: 0 0 50% 50%; transform: translateY(-100%) scaleY(.5); transition-delay: 0; } .btn-epic:hover:before { border-radius: 0; transform: translateY(0) scaleY(1); transition-delay: 0; } .btn-epic:hover span:first-child { transform: translateY(0); } .btn-epic:hover span:last-child { transform: translateY(-50px); } @media (max-width: 768px) { .btn-epic { max-width: 200px; height: 42px; font-size: 16px; } } @media (max-width: 480px) { .btn-epic { max-width: 160px; height: 36px; font-size: 14px; } }
Multimédi’Alpes – Comunicazione dell’evento
Servizi
Comunicazione - Design- Audiovisivo
Collaborazione
In un team di 4 persone
Anno
April 2024
In un gruppo di quattro persone, abbiamo realizzato il dossier di comunicazione del festival Multimédi’Alpes 2024, un evento che valorizza i progetti creativi degli studenti MMI.Il nostro compito era progettare e coordinare l’intera comunicazione dell’evento, dalla strategia alla produzione dei contenuti. Abbiamo condotto interviste a studenti e professori per integrarle nel trailer e nel teaser ufficiale, e sviluppato una campagna digitale con storie e post su Instagram.
Abbiamo inoltre creato la carta grafica per il sito web del festival e un dossier di coordinamento e produzione con le fasi e i bisogni del progetto.
Personalmente, mi sono occupato della gestione dei social media e della redazione dei dossier (comunicazione, coordinamento e produzione). .content-sae301 a { width: 100%; width: 470px; } .content-sae301 { display: flex; gap : 10px; justify-content: center; align-items: center; } .btn-epic { display: flex; position: relative; margin: auto; width: 100%; max-width: 475px; height: 52px; background: #fff; border-color: black; transform: translate3d(0px, 0%, 0px); text-decoration: none; font-weight: 600; font-size: 18px; letter-spacing: .05em; transition-delay: .6s; overflow: hidden; } .btn-epic:before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #8BB4B1; border-radius: 50% 50% 0 0; transform: translateY(100%) scaleY(.5); transition: all .6s ease; } .btn-epic:after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: white; border-radius: 0; transform: translateY(0) scaleY(1); transition: all .6s ease; } .btn-epic div { position: relative; width: 50%; height: 26px; text-transform: uppercase; } .btn-epic span { position: absolute; z-index: 1; top: 0; width: 100%; text-align: center; transition: transform .5s ease; } .btn-epic span:first-child { color: white; transform: translateY(100%); } .btn-epic span:last-child { color: black; transform: translateY(0); } .btn-epic:hover { background: #d9d9d9; transition: background .2s linear; transition-delay: .6s; } .btn-epic:hover:after { border-radius: 0 0 50% 50%; transform: translateY(-100%) scaleY(.5); transition-delay: 0; } .btn-epic:hover:before { border-radius: 0; transform: translateY(0) scaleY(1); transition-delay: 0; } .btn-epic:hover span:first-child { transform: translateY(0); } .btn-epic:hover span:last-child { transform: translateY(-50px); } @media (max-width: 768px) { .btn-epic { max-width: 200px; height: 42px; font-size: 16px; } } @media (max-width: 480px) { .btn-epic { max-width: 160px; height: 36px; font-size: 14px; } }
Poster web
Servizi
Design
Collaborazione
Individuale
Anno
2023 - 2024
Nell’ambito dello sviluppo delle mie competenze in design web, ho creato diversi poster sui miei interessi, in particolare moda e sneaker, utilizzando Photoshop, Illustrator e Canva.Scopri qui le mie migliori realizzazioni !
🎵 VinylVerse – Progetto fittizio di negozio e-commerce
Servizi
Comunicazione - Design
Collaborazione
FLOCARD R. - FRAGNOUD N.- DI FRANCESCO N.
Anno
Giugno 2025
Per questo progetto, realizzato in un team di tre persone, abbiamo creato VinylVerse, un marchio fittizio dedicato ai dischi in vinile, costruito da zero. Il nostro obiettivo era progettare un’esperienza e-commerce immersiva, combinando la vendita di vinili classici, la personalizzazione di oggetti unici e abbonamenti mensili con contenuti esclusivi.Abbiamo iniziato dal brief del cliente, definito tre personas, condotto un’analisi dei competitor e sviluppato un design system completo (tipografia, colori, componenti e architettura del sito).
Il progetto è poi stato realizzato tramite wireframe e un mockup ad alta fedeltà su Figma, con un design moderno e d’impatto pensato per coinvolgere un pubblico curioso, creativo e attento all’estetica. L’esperienza è progettata per fare in modo che ogni vinile non sia solo un prodotto, ma anche una porta d’accesso a un universo musicale e sensoriale.
Sebbene il sito sia stato sviluppato su PrestaShop, non è più accessibile online; il progetto è presentato attraverso i nostri mockup e prototipi Figma, che dimostrano il nostro approccio UX/UI e la capacità di trasformare un’idea in un’esperienza utente coerente e attraente.
⚠️ I collegamenti tra le pagine nel mockup non sono attivi. È possibile premere → o scorrere (su mobile) per navigare tra le pagine. .content-sae301 a { width: 100%; width: 470px; } .content-sae301 { display: flex; gap : 10px; justify-content: center; align-items: center; } .btn-epic { display: flex; position: relative; margin: auto; width: 100%; max-width: 475px; height: 52px; background: #fff; border-color: black; transform: translate3d(0px, 0%, 0px); text-decoration: none; font-weight: 600; font-size: 18px; letter-spacing: .05em; transition-delay: .6s; overflow: hidden; } .btn-epic:before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #8BB4B1; border-radius: 50% 50% 0 0; transform: translateY(100%) scaleY(.5); transition: all .6s ease; } .btn-epic:after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: white; border-radius: 0; transform: translateY(0) scaleY(1); transition: all .6s ease; } .btn-epic div { position: relative; width: 50%; height: 26px; text-transform: uppercase; } .btn-epic span { position: absolute; z-index: 1; top: 0; width: 100%; text-align: center; transition: transform .5s ease; } .btn-epic span:first-child { color: white; transform: translateY(100%); } .btn-epic span:last-child { color: black; transform: translateY(0); } .btn-epic:hover { background: #d9d9d9; transition: background .2s linear; transition-delay: .6s; } .btn-epic:hover:after { border-radius: 0 0 50% 50%; transform: translateY(-100%) scaleY(.5); transition-delay: 0; } .btn-epic:hover:before { border-radius: 0; transform: translateY(0) scaleY(1); transition-delay: 0; } .btn-epic:hover span:first-child { transform: translateY(0); } .btn-epic:hover span:last-child { transform: translateY(-50px); } @media (max-width: 768px) { .btn-epic { max-width: 200px; height: 42px; font-size: 16px; } } @media (max-width: 480px) { .btn-epic { max-width: 160px; height: 36px; font-size: 14px; } }
Chi sono
Dopo il liceo, ho scelto di specializzarmi nel campo della comunicazione digitale iscrivendomi al BUT MMI (Professioni del Multimedia e Internet) a Grenoble. Questa esperienza mi ha offerto un’opportunità preziosa per sviluppare le mie competenze e immergermi in diversi settori, come marketing, sviluppo web, design e audiovisivo.
Durante il corso, ho avuto l’opportunità di lavorare su numerosi progetti entusiasmanti che mi hanno permesso di affinare le competenze tecniche, imparando al contempo a collaborare in team e affrontare nuove sfide.
Sono riconosciuto per la mia serietà e determinazione, cercando sempre di dare il meglio di me stesso. Appassionato di lavoro di squadra, amo collaborare e sono sempre pronto a condividere idee per arricchire i progetti a cui partecipo. Dopo quest’anno, desidero proseguire gli studi con un Master in alternanza per approfondire le competenze e acquisire un’esperienza professionale ancora più solida.
Appassionato di moda e sport, il mio obiettivo è entrare in una grande azienda dove poter contribuire a progetti creativi e stimolanti. Grazie alla mia conoscenza dell’inglese, sto valutando anche la possibilità di completare parte del percorso all’estero, per ampliare la mia visione e sviluppare un approccio più internazionale.
Durante il corso, ho avuto l’opportunità di lavorare su numerosi progetti entusiasmanti che mi hanno permesso di affinare le competenze tecniche, imparando al contempo a collaborare in team e affrontare nuove sfide.
Sono riconosciuto per la mia serietà e determinazione, cercando sempre di dare il meglio di me stesso. Appassionato di lavoro di squadra, amo collaborare e sono sempre pronto a condividere idee per arricchire i progetti a cui partecipo. Dopo quest’anno, desidero proseguire gli studi con un Master in alternanza per approfondire le competenze e acquisire un’esperienza professionale ancora più solida.
Appassionato di moda e sport, il mio obiettivo è entrare in una grande azienda dove poter contribuire a progetti creativi e stimolanti. Grazie alla mia conoscenza dell’inglese, sto valutando anche la possibilità di completare parte del percorso all’estero, per ampliare la mia visione e sviluppare un approccio più internazionale.
Esperienza
Alternanza – Comunicazione & Creatore di contenuti – Youtips (Grenoble, 38000) – 1 anno
Settembre 2025 – Agosto 2026
Stage – Creatore di contenuti – Youtips (Grenoble, 38000) – 13 settimane
27 Gennaio – 25 Aprile 2025
Volontario – Trail du Lac de Paladru (38850) – 2 giorni
Allestimento e smontaggio materiali, cronometraggio, segnalazione e supporto al buon svolgimento dell’evento | 19–20 Aprile 2025
Responsabile cassa – Piscina di La Rochette (Municipio, 73110) – 2 mesi
Gestione cassa | Agosto 2024 e Luglio 2025
Assistente logistica – Elezioni dipartimentali di Grenoble – Dipartimento di Isère (38000) – 1 settimana
Giugno 2022
Stage elettricista – ENR Energy (38530) – 6 settimane
2019 – 2020
Stage scuola media – Dipartimento di Isère (38000) – 1 settimana
Assistente d’ufficio | 2019
Educazione
IUT 1 - Grenoble
2023 - 2026
BUT MMI, specializzazione in Strategia di Comunicazione – Scuola di comunicazione digitale (strategia di comunicazione, audiovisivo, design e sviluppo web)
LPO Monge - Chambéry
2020 - 2023
Diploma STI2D, specializzazione ITEC (Innovazione Tecnologica e Eco-Progettazione)
Le mie competenze
Social media
Figma
Analytics
Canva
WordPress
Capcut
Adobe Creative Suit
I miei interessi
Musica
Sport
Viaggi
La musica occupa un ruolo importante nella mia vita: suscita emozioni, mi aiuta a rilassarmi e mi accompagna quotidianamente. Amo esplorare una grande varietà di stili e condividere le mie scoperte con chi mi circonda, sia in viaggio che durante momenti conviviali. Questa passione ha trovato eco anche durante la mia esperienza in alternanza presso Youtips, una realtà specializzata nella formazione dei musicisti. Sebbene il mio ruolo fosse centrato sulla comunicazione digitale, ho avuto l’opportunità di incontrare molti artisti e scambiare idee con loro, arricchendo la mia visione creativa e rafforzando il legame con l’universo musicale.
Tra i miei molti interessi, lo sport occupa un posto speciale nella mia vita! Le mie discipline preferite sono sci e nuoto. In passato ho partecipato a gare di judo, vincendo anche alcuni titoli. Attualmente frequento regolarmente la palestra e sono appassionato anche di calcio.
Esplorare diversi paesi mi ha permesso di scoprire culture affascinanti. Ogni viaggio mi ha aperto gli occhi su nuove tradizioni, sapori e stili di vita. È un’esperienza arricchente che mi aiuta ad apprezzare la diversità del mondo e a crescere come persona. Ho già visitato molti paesi europei, oltre a Madagascar, Thailandia, India e Maghreb. Prossime destinazioni: Stati Uniti e Giappone.- Passione - Creatività - Energia - Lavoro di squadra - Comunicazione - Collaborazione - Polivalenza
- Autonomia - Onestà - Determinazione - Responsabilità - Curiosità - Fiducia - Rispetto - Pazienza - Perseveranza
No matter how difficult or impossible it may seem, never lose sight of your goal.
Monkey D. Luffy
Contattami |
Che sia per lavorare insieme, fare una domanda o condividere una battuta, puoi contattarmi qui.