[{"data":1,"prerenderedAt":98},["ShallowReactive",2],{"project-samuel-portfolio":3},{"slug":4,"title":5,"category":6,"summary":7,"tags":8,"role":15,"period":16,"metrics":18,"relatedCapabilities":28,"featured":30,"createdAt":31,"published":32,"sections":33},"samuel-portfolio","ch3n.dev personal site","design","A personal brand site designed and built from 0, with a W-shaped narrative and a focus on rhythm.",[9,10,11,12,13,14],"Nuxt 4","GSAP","Lenis","TypeScript","Personal brand","Information architecture","Design + full stack",{"start":17},"2026-08",[19,22,25],{"label":20,"value":21},"Pages","6",{"label":23,"value":24},"Stack","Nuxt 4 + GSAP",{"label":26,"value":27},"Goal","60s clarity",[6,29],"product",false,"2026-08-03",true,[34,45,75,88],{"id":35,"index":36,"title":37,"tagline":38,"body":39},"thesis","01","The thesis","A personal site is a vessel, not a brochure. It should let a stranger see how you think, in 60 seconds.",[40,43],{"type":41,"text":42},"p","I have been writing scattered pieces on blogs, WeChat, and Xiaohongshu for years, but I never strung them into a line. This site has one job: let any HR \u002F interviewer \u002F partner see, in 60 seconds, what kind of W-shaped mind I am.",{"type":41,"text":44},"I am treating it as a long-term, extensible vessel — a place for my work, my thinking, my translations, and the evidence behind every claim I make. The site grows with the work, not the other way around.",{"id":46,"index":47,"title":48,"tagline":49,"modules":50},"architecture","02","The architecture","Each W-shaped dimension gets its own room. Each page has an explicit handoff to the next.",[51,55,59,63,67,71],{"name":52,"role":53,"description":54},"Home","The trailer","One-line positioning, the W-shape visual, the data wall, capability overview, featured work, latest writing, and a single contact CTA. 60 seconds, top to bottom.",{"name":56,"role":57,"description":58},"About","The full story","A long-form bio, then the timeline — each job, each era, each fold of the W. Handoff to capabilities and to the work.",{"name":60,"role":61,"description":62},"Capabilities","Five rooms, each delivered","Product, Design, Marketing, Language, Sales — five anchor sections, each one walked to the point of solo delivery. Handoff to the work that proves each one.",{"name":64,"role":65,"description":66},"Work","The evidence","Six projects. Two flagship ecosystems with full 6-chapter case studies. The other four upgraded to case studies here. Filter by category. Click into a case study, see the modules, see the metrics.",{"name":68,"role":69,"description":70},"Writing","Long-form thinking","Blog posts — multi-paragraph, with side TOC and reading progress. Where a thought that has survived multiple sittings ends up.",{"name":72,"role":73,"description":74},"Now","Short, frequent thinking","A stream of short notes — the seeds, the half-formed ideas, the field observations. Lower the bar for showing what I am currently chewing on.",{"id":76,"index":77,"title":78,"tagline":79,"body":80},"motion","03","The motion","Refinement comes from rhythm, not decoration.",[81,83,85],{"type":41,"text":82},"Lenis for smooth scroll, GSAP + ScrollTrigger for scroll-in reveals, magnetic buttons for the primary CTAs, and a five-bar W-shape that subtly skews on cursor move. No parallax overload. No flashing. Just rhythm.",{"type":41,"text":84},"The design system lives in CSS variables. If the visual direction needs to shift, I change tokens, not components.",{"type":86,"text":87},"quote","Whitespace first. Every screen has to answer: can a first-time visitor understand the value in 5 seconds and find the entry point in 10?",{"id":89,"index":90,"title":91,"tagline":92,"body":93},"outcome","04","The outcome","A vessel that grows with the work.",[94,96],{"type":41,"text":95},"The site is currently shipped as a statically generated Nuxt 4 build, deployed to Cloudflare Pages. It is backend-ready — flipping a single flag in `useApi` switches all pages from mock data to a real API without touching the business code.",{"type":41,"text":97},"What is on the site right now is the v1. Each new piece of work, each new thought, each new system I run, drops in as a new section, a new post, a new now-entry. The vessel is the point. The work is what fills it.",1785988759162]