Adamarant
HomeServiziTeamBlogContatti
Torna ai lavori
2026CloudeProduct design and engineering, end to end

Cloude: un prodotto cloud consumer, dal brand alla sicurezza

Un prodotto cloud consumer che abbiamo costruito end to end. Una sola codebase Next.js, un solo design system, un solo team su web, desktop e React Native. L'MVP è andato live in due settimane. Siamo rimasti e abbiamo costruito sopra il prodotto consumer finale, sulla stessa fondazione, con crittografia end-to-end e chiavi protette dall'hardware al centro dell'architettura.

Consumer cloudWeb + mobileEnd-to-end encryption
Cloude: un prodotto cloud consumer, dal brand alla sicurezza

Abbiamo costruito Cloude end to end. L'MVP è andato live in due settimane. Il team che ci abbiamo messo sopra è rimasto oltre il lancio e ha costruito il prodotto consumer finale sulla stessa fondazione. Un solo ingaggio, una sola codebase Next.js, un solo design system, un solo team su web, desktop e React Native.

Cosa abbiamo consegnato

  • 2Settimane all'MVPBrief firmato alla live demo
  • 1CodebaseWeb, desktop, React Native, un solo design system
  • End to endScopeBrand, product, engineering, architettura di sicurezza
Cloude marketing homepage hero. Header with brand mark, Product, Security, Press nav, theme toggle, Sign in link and Open Cloude button. Centred headline All your stuff, in one beautiful place over organic pink and orange blob art. Subline about a drive that finally feels yours. Open Cloude button below. Top edge of the in-app Files preview peeks under the fold.
Quello su cui il visitatore atterra. Voce del brand in alto, prova del prodotto sotto la fold.

Una codebase, due superfici

La prima decisione è stata strutturale. Un prodotto cloud consumer di solito spedisce sito di marketing e piattaforma da repo diversi, con team diversi e uno strato di traduzione fra i due. Abbiamo argomentato per una sola codebase Next.js, un solo design system, un solo team. Il founder ha comprato l'argomento.

Il trade-off è onesto. Una codebase unica significa che il team di marketing non spedisce copy senza coordinarsi col deploy di engineering, e il team di prodotto deve pensare alla SEO quando refattorizza un componente. Abbiamo accettato quei costi perché il vantaggio era piú grande. Il sito di marketing incastona il componente Files in produzione invece di un mockup: quello che il visitatore vede sulla landing è quello che riceve quando si registra. Il trimestre di lancio è andato live in un solo evento di calendario, non tre.

Cloude marketing homepage product showcase. Same header. Below the hero, the live Cloude Files dashboard is rendered full-width on a soft pink-to-peach gradient. Sidebar with Upload button, primary destinations and pinned folders. Folder grid for Design, Product, Finance, Photos, Archive. Recent files list visible.
Il componente Files incastonato nella pagina di marketing è lo stesso componente React che gira in produzione sulla piattaforma. Abbiamo refattorizzato entrambi per condividere lo stesso adapter dati, cosí il workspace di demo e il database di produzione parlano la stessa forma.
Cloude marketing Files section. Top of frame fades from the orange-pink gradient into white. Section overline FILES, headline Every file, exactly where you remember it. Three checkmark bullets about grid-list toggle, hover-to-preview and drop targets. Right side shows a desktop-frame screenshot of the Cloude Files page.
Abbiamo scritto i bullet per ultimi, dopo che la piattaforma era alla pari con la promessa di marketing. Ogni check punta a un'interazione che l'app in produzione consegna davvero.

Ingegnerizzato per la scala prima che gli utenti esistessero

L'MVP partiva con una piccola coorte di early-access. Il deck della seed proiettava un ordine di grandezza in più entro fine anno. Abbiamo ingegnerizzato per la proiezione, non per il carico corrente.

La lista della libreria è virtualizzata con un cap di righe fisso indipendentemente dalla dimensione del dataset, cosí il costo di render resta piatto al crescere dei file. I file recenti vengono da una singola query server-side indicizzata su (owner_id, accessed_at desc), e il piano della query resta costante per ogni richiesta. Cartelle e viste recenti pescano da una cache locale-first IndexedDB tenuta in sync col server tramite un motore di sync differenziale: viaggiano sul cavo solo i byte cambiati. Un portatile in galleria continua a funzionare. Una riconnessione recupera in un singolo round.

Cloude desktop Files page in light mode. Sidebar with Files, Shared, Recent, Starred, Trash, Account, plus pinned folders Design, Product, Photos and tag chips Work, Personal, Family, Travel. Top row of folder cards: Design, Product hovered, Finance, Photos, Archive. Recent files list with type badges, sizes and timestamps. Storage meter at the bottom of the sidebar.
La home del prodotto. Sidebar, griglia di cartelle, file recenti, indicatore di storage. La griglia di cartelle è virtualizzata, cosí il costo di render resta piatto indipendentemente da quante cartelle ha l'account.
Cloude desktop Recent page in light mode. Tab strip with All, Images, Documents, Videos, Audio, Archives. Files grouped by Today, Yesterday, Earlier this week, Older. Each row shows type icon, filename, format badge, size and relative time. Same sidebar as the Files page.
Recent raggruppa per Oggi, Ieri, In settimana, Prima. Query server unica, indicizzata su (owner_id, accessed_at desc), cosí il piano resta costante che l'account abbia decine o migliaia di file.

Mobile è React Native, non un'app web travestita

La scorciatoia sarebbe stata una PWA dentro una WebView. Abbiamo costruito nativo. Il client React Native consuma gli stessi design token del web tramite un package condiviso, cosí un bump dei token si propaga a ogni superficie in un solo commit. Il bundle è ingegnerizzato per restare sotto la soglia di hot-fetch dello Store dopo il tree-shaking: gli aggiornamenti vengono scaricati in silenzio. Il trasporto è HTTP/3 su QUIC. Il primo frame interattivo su un Android di fascia bassa ha lo stesso costo fisso indipendentemente dalla dimensione del dataset: liste virtualizzate e query indicizzate fanno il lavoro pesante sul server, non sul dispositivo.

Cloude mobile navigation drawer open over the Account screen. Drawer shows the brand mark, an Upload button, primary destinations Files, Shared, Recent, Starred, Trash, Account, pinned folders Design, Product, Photos with file counts, and tag chips Work, Personal, Family, Travel. Storage meter and Earn free storage card at the bottom.
Il drawer è l'intera superficie di navigazione su mobile. Destinazioni, cartelle pinnate, chip dei tag, indicatore di storage, tutto in un singolo scroll. Su mobile non abbiamo mai messo la navigazione in un sub-menu.

Crittografia senza la tassa sulle latenze

È stata la decisione di engineering più dura. La crittografia end-to-end di solito si presenta allo sportello del fisco: round trip extra, cold start piú lunghi, file che si aprono piú piano. Abbiamo rifiutato di spedire quello.

Lo storage è cifrato a riposo con AES-256-GCM. Le chiavi per account sono derivate via Argon2id dalla passphrase utente e non vengono mai salvate sul server. I file condivisi viaggiano cifrati end-to-end con scambio X25519. Le chiavi private vivono dentro il Secure Enclave di iOS e lo StrongBox di Android, protette dall'hardware e resistenti all'estrazione anche su dispositivo rooted. L'architettura è zero-knowledge: il server tiene blob opachi e non vede mai una chiave non incartata.

Penetration test indipendenti girano con cadenza ricorrente affidati a uno studio di sicurezza terzo. Un programma di vulnerability disclosure pubblico con bounty per i ricercatori è vivo dal lancio.

Cloude marketing Account section. Header active state on Security with floating peach and pink blob accents. Section overline ACCOUNT, headline Your drive, all in one screen. Three checkmark bullets about storage breakdown, two-factor on by default and active sessions. Right side shows a desktop-frame screenshot of the Cloude Account page.
Sul sito di marketing, la sicurezza è una sezione su tre. Niente copy allarmistico, niente icone lucchetto. Tre check e uno screenshot della pagina account in produzione.
Cloude desktop Account page in light mode. Profile header for Alex Morgan with avatar and member-since date. Plan card with Cloude Pro, 200 GB tier and Upgrade button. Storage breakdown by type with coloured legend for Videos, Images, Design, Documents, Archives, Audio. Security section with two-factor toggle on, password row, notifications row. Devices list with current Chrome session and Safari iOS sign-out option.
La stessa superficie nel prodotto. Piano, ripartizione storage per tipo, toggle 2FA, lista device completa con sign-out a un tap per ognuno. Abbiamo rifiutato di spargere la sicurezza su piú pagine di impostazioni.

Il design system che alimenta Cloude è stato costruito da zero per questo ingaggio e oggi vive su web, desktop e React Native. Lo manteniamo ancora noi. Il team è rimasto piccolo per tutta la durata, integrato dalla governance ad agenti dello studio: nessuna proliferazione di contractor, nessun handoff a vendor. Il programma di vulnerability disclosure ereditato dal lavoro di sicurezza è ancora attivo. I design token che abbiamo spedito il primo giorno sono gli stessi che girano in produzione oggi.

Stack

  • Next.js16
  • React19
  • TypeScript5
  • React Native
  • Postgres16
  • Supabase
  • Cloudflare R2
  • Vercel Edge
  • Sentry
  • Meilisearch

“Due settimane dal brief alla live MVP. Lo studio è andato avanti e ha consegnato il prodotto finale sopra alla stessa fondazione. L'infrastruttura che hanno tirato su il primo giorno ha tenuto. Crittografia attiva di default, latenza sotto il secondo da qualunque edge. Non abbiamo mai rinegoziato lo scope.”

Founder, CloudeDopo il trimestre di lancio

Operativo, oggi

  • End to endScopeDal brand all'architettura di sicurezza, un solo team
  • 1CodebaseWeb, desktop, React Native, un solo set di design token
  • Day oneTokenI token che abbiamo spedito al lancio girano ancora in produzione

Stai costruendo qualcosa che deve durare oltre la seed?

Lavoriamo con founder e team che hanno target di engineering misurabili e devono centrarli prima del round successivo. End to end, un solo team. Scrivici.

Avvia un progetto
Vedi altro lavoro Prodotti consumer