Lightweight color wash behind the page. Content does not depend on this animation.

Skip to content
← Back to work

web

o0oi1i.io

Aug 31, 2026Next.js · Supastarter · Content Collections · Vercel
showcasenextjs

Problem

o0oi1i.io has to do two jobs at once. It is a portfolio for a full-stack product developer, and it is the first artifact of that work. Visitors should see selected work, notes, and — later — real habit and task data, not a forked SaaS landing page that still talks about workspaces and refunds.

The site also has to exist in Chinese and English without pretending one language is a fallback for the other. English copy starts as an AI draft. It does not go live until a person says that locale may publish.

Process

The product baseline was frozen first: showcase plus owner public data as the first release; registration and paid access as the second. Visual language follows Academind at a distance — dark base, purple accent, glass cards — with self-hosted Rubik and Nunito.

Implementation walked the visitor path: tokens and type, logo, theme, motion with a lite default, homepage order, then first-class /work, /data, and /pricing. Changelog and legal pages were rewritten for this site. GitHub, X, and YouTube are the only official social links.

Content sits in Content Collections. Blog and work share a slug/locale file convention and a draft | review | published status. Public lists, detail routes, and the sitemap only include published. A draft in one language does not inherit a live translation in the other.

Approach

  • o0oi1i.io is the marketing app; app.o0oi1i.io will be the signed-in product. They share packages, not a Headless CMS.
  • MDX can embed code, YouTube, audio, glass cards, and a registered React demo.
  • Still images live under public/images/ and go through next/image with column-aware sizes. Video, audio, and other large files are URLs only.
  • Motion defaults to a lite wash. Full WebGL is opt-in. prefers-reduced-motion and a failed canvas fall back without hiding the page.

This write-up is that pipeline applied to itself: English and Chinese are separate files, each published after its own human pass.

Outcome

The showcase already has the primary pages, bilingual legal copy, and a content schema that can refuse to publish a locale. This case is the first real work entry. English is on /work; Chinese is on /zh/work.

What is still later: wiring owner public data, replacing leftover starter blog posts, and opening registration.

Review

The risk is shipping the starter’s voice as if it were the product. Keep template posts out of the story. Do not publish Chinese only because English is ready, or the reverse.