Design + engineering for consumer cloud founders
One Next.js codebase across web, desktop, and React Native. A zero-knowledge architecture with hardware-backed keys. A library list that stays flat at any dataset size, because the engineering was sized for the projection, not for the current load.
The problems we hear most
A marketing site in Webflow, a product in another repo, and a translation layer between two teams
The visitor sees a polished mockup, signs up, and lands in a different product than the one the landing promised. The launch quarter ships in two events that never quite line up.
An MVP engineered for last week's users, not next year's
The library list re-renders the whole DOM on every keystroke. The recent-files query scans the table. The day the seed round closes, the product slows down before the press release goes out.
A PWA wrapped in a WebView, sold as a native app
The install prompt looks grey. The push notifications drop. The store reviewer flags it on the third submission, and the launch slips while the team rewrites in React Native.
A privacy story that nobody believes
Marketing says encrypted, engineering says best-effort, the security audit says client keys live on the server. The product loses the customers who actually came for privacy.
Cloude · a consumer cloud built whole
A consumer cloud product across web, desktop, and React Native. One Next.js codebase, one design system, hardware-backed keys at the core, and a sync engine that survives an underground tunnel.
Inside the Cloude build
We built Cloude across web, desktop, and React Native. One Next.js codebase, one design system, one team. The MVP shipped, and the team that put it on the runway stayed past launch and built the final consumer product on top of the same foundation. One engagement, one codebase, no second build.
One codebase, two surfaces
The first call we made was structural. A consumer cloud product usually ships its marketing site and its product platform from different repos, with different teams and a translation layer between the two. We argued for one Next.js codebase, one design system, one team. The founder bought the argument.
The trade-off is honest. A unified codebase means the marketing team cannot ship copy without coordinating with the engineering deploy, and the product team has to think about SEO when they refactor a component. We took those costs because the upside was bigger. The marketing site embeds the live Files component instead of a mockup, so what the visitor previews on the landing is what they get when they sign up. The launch quarter shipped in one calendar event, not a marketing launch followed by a product launch that no one syncs.
Engineering for scale before the users existed
The MVP had a small early-access cohort when we started. The seed deck projected an order-of-magnitude increase by year one. We engineered for the projection, not the current load.
The library list is virtualised with a fixed row cap regardless of dataset size, so render cost stays flat as the library grows. Recent files come from a single server query indexed on (owner_id, accessed_at desc), so the query plan stays constant per request. Folder pages and recent views read from a local-first IndexedDB cache, kept in sync with the server through a differential sync engine that only ships changed bytes. A laptop in a tunnel keeps working. A reconnection catches up in one round.
Mobile is React Native, not a thinned web app
The shortcut would have been a PWA wrapped in a WebView. We built native instead. The React Native client consumes the same design tokens as the web through a shared package, so a token bump propagates to every surface in one commit. The bundle is engineered to stay under the iOS App Store hot-fetch threshold after tree-shaking, so updates download silently. Transport is HTTP/3 over QUIC, with connection migration that survives a Wi-Fi to LTE switch. The first interactive frame on a low-end Android budget is the same fixed cost regardless of dataset size, because virtualised lists and indexed queries do the heavy lifting on the server, not on the device.
Encryption without the latency tax
This was the hardest engineering call. Client-side encryption usually shows up at the tax window, with extra round trips, longer cold starts, files that open slower. We refused to ship that.
Storage is encrypted at rest with AES-256-GCM. Per-account keys are derived via Argon2id from the user passphrase and never stored on the server. Shared files travel encrypted with X25519 key exchange. Private keys live inside the iOS Secure Enclave and the Android StrongBox, hardware-backed and resistant to extraction even on a rooted device. The architecture is zero-knowledge, the server holds opaque blobs, and the server never sees an unwrapped key.
Independent penetration testing runs on a recurring cadence with a third-party security firm. A public vulnerability disclosure programme inherits from that work and is still active. Customers verify the claim instead of taking our word for it.
Why this shape matters for a consumer founder
A consumer cloud product is not a slick landing page plus a generic file sync. It is the launch quarter where marketing and product ship together, the cold-start when the user opens the app on the train and the library renders before the network responds, the moment a researcher reads the architecture and recognises that the encryption is real, and the day the seed round closes and the user count doubles without the product getting slower. Cloude is the shape of work that closes that whole loop under one codebase and one design system, not three repos that each see a slice of the user.
The same codebase keeps paying off long after launch. Adding a new platform target, a new file type, a new sharing model, or a new privacy report is a change in one repo, not a coordination across three teams. The design system is the contract, and the contract holds.
What the work delivered
One Next.js codebase across web, desktop, and React Native. Hardware-backed keys on both iOS and Android. A zero-knowledge architecture verified by third-party penetration testing. A virtualised library list with a constant render cost at any dataset size. A differential sync engine that catches up in one round after a reconnection.
What we deliver for this vertical
One codebase, three surfaces
Marketing site, web product, and React Native client all live in one Next.js repo with one design system. The marketing landing embeds the live product component, so what the visitor previews is what they get on signup.
Zero-knowledge architecture
The server holds opaque blobs and never sees an unwrapped key. Per-account keys are derived from the user passphrase via Argon2id and never leave the device.
Hardware-backed encryption keys
Private keys live inside iOS Secure Enclave and Android StrongBox. Resistant to extraction even on a rooted device.
Encrypted file sharing
Shared files travel encrypted with X25519 key exchange between recipients. AES-256-GCM at rest, no plaintext on any wire.
Differential sync engine
Only changed bytes travel the wire. A laptop in a tunnel keeps working; a reconnection catches up in one round.
Local-first IndexedDB cache
Folder pages and recent views read from local storage and reconcile to the server in the background. First paint is instant, staleness is bounded.
Virtualised library list
Render cost stays flat regardless of dataset size. One thousand files and one million files render the same number of rows.
Indexed query plan for hot paths
Recent files come from a single server query indexed on (owner_id, accessed_at desc). The query plan stays constant per request, no full-table scans at scale.
React Native client with shared tokens
The mobile client consumes the same design tokens as the web through a shared package. A token bump propagates to every surface in one commit.
HTTP/3 transport over QUIC
Connection migration survives a Wi-Fi to LTE switch without a fresh handshake. First interactive frame on Android stays fixed regardless of dataset size.
Store-ready bundle below hot-fetch
The React Native bundle stays under the iOS App Store hot-fetch threshold after tree-shaking, so updates download silently in the background.
Penetration testing programme
Third-party security firm on a recurring cadence. The report from each engagement is filed and the findings are tracked through to remediation.
Public vulnerability disclosure
A documented disclosure programme with response timelines. Researchers know where to send a finding and what to expect.
Recovery flow for a lost passphrase
Optional sharded recovery keys, with a clear UI flow that does not give the customer false hope when no recovery has been set up.
A stack that does not tax the user for being private
Every layer here exists to pay for itself twice. Once when you are shipping the first version of the product, once when you survive a security review or a press cycle on privacy and the architecture is the answer. We pick the stack that holds up in that second moment.
Next.js App Router as the single runtime. Marketing site, web product, and the API surface for the React Native client all live in one repo. The marketing pages render statically and the product pages render dynamically, but the design tokens, the typography, and the components are the same across both. The marketing team and the engineering team work in the same codebase, which costs coordination on a copy change and saves a translation layer on a redesign.
React Native for the mobile client, sharing the same design tokens through a single package. A token bump in the design system propagates to web, desktop, and mobile in one commit. The bundle stays under the iOS App Store hot-fetch threshold after tree-shaking, so updates download silently. The Android client links to StrongBox, the iOS client to the Secure Enclave; hardware-backed keys with no extraction path even on a rooted device.
Zero-knowledge data architecture. Files are encrypted client-side with AES-256-GCM, with per-account keys derived from the user passphrase via Argon2id and never stored server-side. Shared files travel encrypted with X25519 key exchange between recipients. The server holds opaque blobs, signed-URL access only, and never sees an unwrapped key. The penetration test report and the public vulnerability disclosure programme give the customer something to verify rather than something to trust.
Local-first cache with a differential sync engine. Folder pages and recent views read from IndexedDB first and reconcile to the server in the background. Only changed bytes travel the wire. A laptop in a tunnel keeps working, and a reconnection catches up in one round. The library list is virtualised with a fixed row cap, so render cost stays flat at any dataset size; recent files come from a single server query indexed on (owner_id, accessed_at desc), so the query plan stays constant per request.
HTTP/3 over QUIC for transport. Connection migration survives a Wi-Fi to LTE switch without a fresh handshake. The first interactive frame on a low-end Android budget is the same fixed cost whether the library has one thousand files or one million, because the virtualised list and the indexed query do the heavy lifting on the right side of the wire.
TypeScript strict from device to server. Renames stay safe, schema migrations stay verifiable, the bus factor stays at zero. When the engineer who built the sync engine leaves the team, the next engineer reads the type signatures and ships.
Questions founders ask
How do you guarantee you cannot read user data?
Per-account keys are derived from the user passphrase via Argon2id and never leave the device. Files are encrypted client-side with AES-256-GCM before they hit the wire. The server holds opaque blobs, signed-URL access only. The penetration test report and the public vulnerability disclosure programme are how the customer verifies the claim, instead of taking our word for it.
Why React Native instead of a PWA in a WebView?
A WebView misses Secure Enclave and StrongBox. Hardware-backed keys are not negotiable on a privacy product, so the mobile client has to run native. The React Native client also reuses the design tokens from the web package, so the cost of going native is paid once at the design system level and not at every surface.
How do you keep encryption from slowing the product down?
No extra round trips on the read path. Decryption happens client-side after the bytes land. Shared keys are exchanged via X25519, which is fast enough that the cold-start opening of a shared file does not feel different from an unshared one. The latency cost most products pay for client-side encryption is mostly architectural, not cryptographic.
What about lost-passphrase recovery?
Optional sharded recovery keys are offered at signup, with a UI that makes clear that without them, a lost passphrase means lost data. We refuse to ship a backdoor recovery path that pretends to be private and is not.
How do you scale before the users arrive?
The library list is virtualised, so render cost stays flat at any dataset size. Recent files come from a single indexed query, so the query plan stays constant per request. Folder and recent views read from a local IndexedDB cache, so the first paint is instant regardless of network. We engineer for the projection, not the current load.
What about the app store review process?
We have shipped iOS and Android through the Apple and Google review pipelines for a privacy product, so we know the questions about cryptography, account deletion, and data export the reviewer will ask. The bundle stays under the iOS hot-fetch threshold, so silent updates work.
Do you handle the penetration testing?
No. We work alongside the security firm you bring in, or recommend partners we have shipped against. The engagement results are filed in the customer's compliance archive, and the findings flow into our issue tracker for remediation.
What happens when the user goes offline?
The local-first cache keeps every read working. Writes queue in IndexedDB and replay when the link comes back. The differential sync engine only ships changed bytes on reconnection, so a long offline window does not turn into a long sync.
Tell us about your consumer product
A scoping call, a concrete number in the first reply, no agency theatre and no pitch deck of similar-looking case studies.