DatoCMS
Design Lead · 2023 – presente · SaaS / Headless CMS

User Research, IA e Strategic Design per un SaaS globale

Information ArchitectureDesign SystemUX ResearchDark Mode
€6.5M ARR
3.5B API calls/mese
65% EBIT margin
Mockup dell'interfaccia DatoCMS con Dark Mode attivo

Sfida

DatoCMS è cresciuta da startup a SaaS globale con clienti in tutto il mondo, ma fino al 2023 non ha avuto una figura interna dedicata alla ricerca e al design. Come risultato l'interfaccia aveva accumulato inconsistenze strutturali: una navigazione ambigua con diverse voci "Settings" in conflitto, un sistema cromatico non conforme alle specifiche di accessibilità WCAG, un marketplace plugin completamente esterno al prodotto, con conseguenti problemi di discoverability.

Deliverable

  • Ridisegno navigazione globale (IA a due livelli)
  • Dark Mode + palette WCAG AA generata in OKLCH
  • Plugin discovery in-CMS con installazione diretta

Approccio

Ho assunto il ruolo di Design Lead part-time, embedded nel team, senza strati di management. Lavoriamo su cicli Shape Up di 6 settimane: tempo fisso, scope variabile, ogni ciclo produce feature in produzione, non documentazione. Nel 2023 ho ridisegnato l'architettura informativa e la navigazione globale, introducendo una navigazione a 2 livelli (progetto → environments) rimuovendo ambiguità lessicali e riorganizzando i contenuti. Nel 2024 ho ridisegnato la plugin discovery, portando il marketplace dentro il CMS. Nel 2025, informato dalle attività di ricerca, ho indirizzato le attività di integrazione dell'AI. Nel 2026 ho definito il substrato teorico (sia HLS che OKLCH) alla base della generazione automatica della palette colori che consente il light/dark mode.

Come ci siamo arrivati

  1. IA e navigazione globale

    L'interfaccia aveva diverse voci "Settings" nella toolbar: una per il progetto, una per l'environment, una per il profilo utente, e poi altre ancora — stessa etichetta, contesti diversi, confusione garantita. Ho ridisegnato la navigazione con un sistema a due livelli separati: Project Toolbar (brand, environment switcher, impostazioni globali) ed Environment Toolbar (Content, Media, Schema, Configuration, Playground). La separazione ha eliminato l'ambiguità strutturale e reso il CMS navigabile da editor non tecnici senza dover capire l'architettura multi-ambiente. Il labelling è stato cambiato dopo aver verificato con user testing le migliori opzioni in ogni contesto.

    Ridisegno della navigazione globale: Project e Environment Toolbar
  2. Sistema cromatico

    La palette è generata algoritmicamente in OKLCH — uno spazio colore perceptually uniform dove la lightness percepita cresce in modo lineare, eliminando i salti visivi tipici di HSL. Per ogni valore di Hue, un algoritmo di binary search trova il chroma massimo che garantisce WCAG AA (4.5:1) su sfondo bianco e nero — senza approssimazioni manuali. Light e Dark Mode — la feature più richiesta — emergono dalla stessa scala: due sottoset di step, scelti per ruolo semantico, non ridefiniti da zero.

    Dark Mode e sistema token a tre livelli in DatoCMS
  3. Plugin discovery in-CMS

    Il marketplace plugin era un sito esterno: gli utenti non scoprivano le estensioni disponibili, e l'installazione richiedeva un cambio di contesto completo. Ho ridisegnato l'esperienza come modal in-CMS con sidebar di navigazione per categoria, ricerca, schede plugin con badge di popolarità e stato installazione, e dettaglio inline con README dal repository GitHub. Il marketplace è ora dentro il prodotto: zero redirect, installazione in un click.

    Plugin discovery modal in-CMS con navigazione per categoria

Risultati

La nuova navigazione è in produzione dal 2023 senza modifiche strutturali. Il prodotto è cresciuto da €5M a €6.5M ARR con un team passato da 9 a 13 persone e un EBIT margin del 65% — top 5% nel SaaS globale. Le API call mensili hanno raggiunto 3.5 miliardi, confermando la solidità del sistema.

Hai un progetto in mente?

Sono disponibile per progetti, retainer e sessioni di advisory. Di solito rispondo entro 24 ore.

Parliamo del tuo progetto
Prototype Production