This site is a working product, so it keeps release notes: every meaningful push, what changed, and why. I build it in the open with an AI pair; the taste and the final calls are mine.
The PDF behind the Download button was still carrying the old domain and email. Rebuilt clean: one page, plain parseable text for applicant tracking systems, allenkang.com and the current contact on top. Same story, current coordinates.
WhyThe resume PDF is the copy recruiters actually keep. It should never be the stalest thing on the site.
Every contact point on the site now says allen@allenkang.com, matching the new domain. Mail to the old allen@mooque.xyz still arrives, nothing sent to it is ever lost, but the address you see is the address that belongs here.
WhyA domain move is finished when the email agrees with it.
This site now lives at allenkang.com. Nothing else changed: mooque.xyz stays alive forever as an alias, and every old link redirects here permanently, along with www and the original deployment URL. The canonical address, the sitemap, and the metadata all point at the new home.
WhyCorporate email filters and web proxies sometimes block cheap domain endings outright, and a portfolio you can't open is a portfolio that doesn't exist. A name-dot-com opens everywhere, including the places that decide whether to interview you.
Every project cover is now a composed 3:2 canvas: the artifact shown whole on its own ground color, consistent padding, soft shadow. Before this, the card's crop was quietly eating the work, some covers lost a third of their width, including two flagships. A small cover-factory script builds them, so the next case study gets the same treatment by running one command. Live experiments were re-captured at the new ratio; ARND's two-phone canvas was recomposed; the confidential flagship keeps its blur, now over a properly built substrate.
WhyA cover should present the work, not sample it. Authoring every cover to the frame, instead of letting the frame crop the cover, is the difference between a gallery and a contact sheet.
The home page now features nine: the five professional studies, two experiments, and two personal projects. Toronto Yuwol earned its spot with the full story it always had: not just a schedule tracker but a suite, with a bilingual script reader used daily and a ticketing platform that sold real seats for a ten-month run. The blockchain year gained the section it was missing, what designing for wallets, gas, and smart contracts taught me about hiding complexity without breaking trust. ARND's study now mentions the unglamorous App Store readiness work, and the Automation numbers were tightened to the ones I can defend in a room: 30% adoption across 355 organizations, part of a 13% ARR increase.
WhyA portfolio should show range without diluting the lead. Nine is the shelf where the professional case holds and the breadth finally shows.
Schematic's card now shows its actual site: the wine-dark hero with the wireframe form. Personal Color Analysis shows its landing (Find your perfect color season) and finally carries its live link, so all six experiments now open to the real thing. Every card on the experiments shelf is a screenshot of running software.
WhyThe shelf's whole argument is 'these exist.' The last two illustrations were the only cards still saying 'trust me' instead of 'look.'
On Work and on the home page, the Experiments section now sits directly under Professional Work, with the archive closing the page instead of splitting the middle. ARND, live and current, is the second thing you meet; the oldest material is the last. The filter pills follow the same order.
WhyReading order is an argument. The professional work makes the case, the live experiments show the range, and the archive is the epilogue, not the second chapter.
The ARND case study now shows the whole arc, not just the app. Three more screens cover the loop (the show page, proof-by-check-in, the performer's side), the arnd.app front door and per-event cover art show the brand carrying through, and a new Run in the open section shows the public changelog (a hundred-plus updates, each with its why) and the governed design system page. Screens sit in a compact row now instead of stacking full-width.
WhyDesigning an app is the visible half. Running one, with a brand, a changelog culture, and rules that outlive the author, is the half a portfolio rarely gets to show.
Portrait app screenshots in case studies used to stretch to the full reading column, which made a single phone screen taller than the whole viewport, two and a half screens of scrolling for one image. Tall captures now render at phone size: centered, rounded like a device, with a soft shadow and a centered caption. Applied to ARND's three screens and the tall captures on the automation and Orchid studies.
WhyA phone screen shown at phone size reads as a product. The same screen blown up to fill the column reads as an obstacle.
The Experiments section on Work is a denser three-up shelf now: cover, category, and the app's name, nothing else. And the covers stopped being abstract stand-ins. ARND's card is two real screens from the app (the feed and the live Toronto map) on its own bellflower blue; Mooze, Vesta Press, and Toronto Yuwol show their actual landing pages, captured from the live deployments. Schematic keeps its schema-tile grid and Color Analysis its four-season palette, since those are the product.
WhyFour of these six are live software. A shelf of real screenshots says 'these exist and you can open them' in a way no illustration can. It also fixed a quiet embarrassment: ARND's old cover was orange, and ARND has never been orange.
Three subtractions. The dual clock (Toronto and Seoul) left the header, where it was decoration on every page, and moved to About, where it's biography. The guide now lives on the home page only: a smaller, calmer card with a plain link instead of a button, and if you close it, it stays closed for the rest of your visit. And the site's small uppercase labels, which had drifted into nineteen slightly different sizes and letterspacings, now share one spec.
WhyMinimal isn't a look, it's a discipline: every element either earns its place on every page it appears on, or it moves to the one page where it means something.
ARND's case study stopped calling it a thought experiment, because it stopped being one. The rewrite tells the current story: a working app running on live curated Toronto listings, in beta at arnd.app, with real screens from the app itself (the map on live data, the feed, a hosted listening night). It now leads a self-built Experiments section on the home page, under the professional flagships, and its live link points at the real domain.
WhyThe judges who shaped the flagship shelf read the old write-up and fairly called it a concept piece. It isn't one anymore, and the portfolio should say what's true now.
The motion library was loading on every page, roughly 128KB of JavaScript, even though the home page used it only for a hover lift and an icon swap. Those are plain CSS now, the magnetic card effect is a few lines of hand-rolled motion, and the floating guide loads lazily after the page is interactive. The home page no longer downloads the animation engine at all; it now loads only where it earns its place, on the Work grid and the gateway. The animations look the same.
WhyThe fastest code is the code you don't send. A portfolio should open instantly, especially for someone skimming on a phone between meetings.
The home page used to feature nearly every project, which meant it featured nothing. It now leads with four: the transaction-workflow redesign, the Orchid design system, the Aplos and Keela integration, and the fee opt-in experiment, the pieces that best show senior product work. Two more sit behind them for range. Every other case study is still here, one click away under Work; they just no longer crowd the front door.
WhyA portfolio that features everything is a list, not a point of view. Choosing what leads is one of the more honest things the home page can do.
The Work and Writing pages got an editorial masthead: the title on the left, the one-line description on the right, so the header fills the width instead of hugging one corner. Every project cover now carries a consistent hairline frame, so a bright product screenshot, a color field, and the blurred confidential card all read as the same kind of object. The guide card is fully opaque now, so a decorative sticker can no longer show through it on the About page. And the Résumé page finally spells its own name with the accents the nav already used.
WhyThese were small distances between things that were supposed to match. A portfolio that pays attention to its own edges is most of the argument.
Three things under the hood. If a page ever throws, you now land on a branded recovery screen instead of a raw error, on any route, and even if the whole layout fails. The three heaviest case-study images were re-encoded from PNG to JPEG, cutting about 2.8MB off those pages with no visible change. And the content pipeline, the rate limiter, and the two write endpoints now have a test suite, so the parts that quietly matter can't break unnoticed.
WhyNone of this shows on a good day. It is what keeps a bad day from turning into a broken one.
New case study: Schematic, a 2016 design-research project on the 18 maladaptive schemas from schema therapy, rebuilt in 2026 as a navigable archive with a private browser-only self-check. ARND now links to its live alpha, and Wayfind came off the shelf. Mooze, Vesta Press, and Toronto Yuwol keep their live links.
WhySchematic is real design research, not a weekend build, so it earns a place. And the work should show what's live and current, not what's stale.
Audited contrast, motion, and reading comfort. The paper grain moved behind all content so it textures the page without ever sitting on top of the words. Reduced motion is now honored everywhere: framer-motion animations disable for anyone who asks (one setting at the root), plus a CSS reset for transitions and smooth scroll. The ambient dual-clock in the header is hidden from screen readers, since it is decoration, not information.
WhyThe audit found the fundamentals already sound (every text color passes AA, the reading measure is a comfortable 68 characters), so this was about the edges: texture that respects the text, and motion that respects the person.
Orchid, Aplos x Keela, and Forkable all ended on the same construction: 'the thing I'm proudest of isn't X, it's Y.' Once a reader notices a template, it stops reading as reflection. Rewrote each closer to land the same real point in its own words.
WhyRepetition across strong case studies reads as formula, and it undercuts writing that's otherwise specific and earned.
Mooze, Vesta Press, Wayfind, and Color Analysis read like feature lists with a tech stack attached, which for a design portfolio quietly says 'I prompted an AI to build this.' Rewrote each to lead with one real decision: Mooze designs for the return not the save, Vesta refuses to summarize, Wayfind is built for one hand on one trip, Color Analysis is tactile instead of a verdict. Cut the feature bullets and the stack sections; the tools already sit in each case study's meta.
WhyA side project should still show taste and judgment. The point of these was never the stack, it was the call I made and why.
The Claude-built experiments that are actually deployed now carry a 'Visit the live app' link on their case study, so you can open the real thing instead of only reading about it: Mooze, Vesta Press, Toronto Yuwol, and Wayfind. Only verified-and-public deployments got linked.
WhyA case study says I built it; a live link lets you use it. For self-shipped software, the proof is that it runs.
Same-day edit: Vault left the header nav and now lives in the home page's right rail, under Now, where the wandering begins anyway. Also cut the repetition that had crept in: the vault feed no longer mirrors now-snapshots, and the hero links dropped About and Resume, which the fixed header already offers a glance away.
WhyThe header is for the hiring path; the vault is for wanderers. And saying something twice on one screen is not emphasis, it is noise.
New direction made structural: /vault is a living record that weaves notes, moments, frames, and artifacts with the essays and now-snapshots the site already had. /now keeps every dated snapshot instead of overwriting, so it shows the path, not just the position. An importer stands ready to bring curated posts over from a decade of Instagram, original dates intact. Vault joins the nav.
WhyA portfolio shows what Allen made; the vault records who he was while making it. Provenance over polish: timestamps, reversals, and things in progress are the point, not a liability.
Added a faint paper grain: fine grayscale noise, overlay-blended so it adds tooth without dulling the page, tuned to a whisper. One texture covers both themes. Warmed the dark background from a cool near-black to a warm ink so both modes feel like the same paper.
WhyOrganic grain reads as material, not the geometric pattern that made the dot grid feel like a glitch. This is the tactile half of paper; the ivory tint was the color half.
Shifted the light background from a cool near-white to a warm ivory. Pure color, no pattern, so it reads as paper stock instead of a screen. A nice side effect: the stickers' white die-cut borders pop a little more against it.
WhyThe honest way to add paper warmth is the material itself, not a texture laid on top. This is what the dot grid was reaching for and failing to be.
Removed two decorations in one pass: the trailing ring-and-dot cursor and the background dot grid. The grid got three tries (too faint, then distracting, then crisp but still competing), and the cursor's ring read as a glitch over it. Native pointer, bare cream canvas.
WhyWhen a decoration keeps fighting you, it isn't earning its place. The work, the writing, and the stickers carry the personality; the background should recede so they can breathe.
Audited the About stickers at their real size. The paintbrush read as a lipstick, the clarinet as a chess pawn, and the guitar as a gourd. Swapped the brush for a paint palette with color dabs, angled the clarinet so the keys and mouthpiece show, gave the guitar a proper figure-eight waist and round sound hole, and tightened the trumpet bell and capybara.
WhyA sticker that needs a caption has failed. If it can't be read in a glance at margin size, it is noise, not personality.
Gave the site a single signature color, drawn from the 묵 seal: highlight any text and it glows seal red, and focus rings switched from a generic blue to the same. Stickers now peel up on hover so they read as grabbable. Under the hood, deleted an entire orphaned layout-switching system (six components) that nothing rendered anymore.
WhyThe palette had one off-brand color left, the blue focus ring, in an otherwise ink-and-cream site. One accent used sparingly is identity; used everywhere it is wallpaper. And dead code is a tax every future change pays.
Four more for the About scrapbook: a film camera, a loaded paintbrush, a red seal carved with 묵, and a capybara with an orange on its head. Each is placed beside the paragraph that explains it; the seal sits next to On the name, since Mook is a homophone for ink.
WhyThe best sticker is one that makes you ask why it is there, and the page answers. The capybara is the retired site mascot, enjoying its afterlife where it can no longer interrupt anyone.
Nine hand-pixeled, die-cut stickers scattered scrapbook-style down the About margins: a running shoe, the Korean and Canadian flags, Jacob Collier, Hiromi, and a clarinet, trumpet, guitar, and piano. They drag, and your arrangement is saved locally. Drawn pixel by pixel with a render-and-review loop; the runner figure took three attempts and lost to the shoe.
WhyThe About page told the story in words only. Stickers are the margin-doodle layer: the things I love, drawn the way I loved drawing as a kid.
Re-audited the whole site from recruiter, designer, and engineer seats. The flagship card on the work grid now leads with its 75% to 92% result instead of an unlabeled blur, the guide stays closed on browsing pages, ESLint went from seven problems to zero, and dependencies got patched.
WhyAn audit only counts if you run it again after the fixes. The second pass caught a label that had been invisible all along: white text on a cream blur.
Replaced hydration-gated reveal animations with pure CSS so pages paint immediately. Un-blurred the Fee Opt-In results infographic, drew five cover marks to replace near-black screenshot thumbnails, and gave the wide-screen home a small Now rail.
WhyFirst visits started with two seconds of blank screen, and the best case study was hiding its own outcome. Aggregate results are not confidential; product screens are. The blur now knows the difference.
Removed the green Open to roles indicator from the home hero.
WhyThe work should make the case before the status does. The About page still says it in full sentences.
Added a sitemap and robots file, then caught my own duplicate: a second generated share image was fighting the hand-made one, so the generators went and the branded card stayed.
WhyLinks to this site get pasted into Slack and LinkedIn by people deciding whether to talk to me. The preview is the first impression before the first impression.
Published Earned Black, an essay on rank, ink, and what depth you cannot shortcut. Retitled two essays and two case studies away from formula. Removed all eighty em-dashes from the site, each replaced by the punctuation the sentence actually wanted.
WhyTitles that read like content marketing undercut writing that is personal. And the dashes were a tell: machine cadence in what should be a human voice.
Shipped a streaming AI chat grounded on the portfolio, lived with it for an evening, and removed it the same day. The curated guide took its place and became a real navigator: per-page notes, next-step links, quick nav.
WhyThe chat felt off. An open prompt invites anyone to test the edges; a curated voice says exactly what I want said. Killing your own feature quickly is a feature.
The home page now leads with the Fee Opt-In study as a feature card: the 75% to 92% result over the redacted cover, with a confidential chip. Contact moved to allen@mooque.xyz, and the gateway forms got rate limiting, honest error states, and proper tap targets.
WhyThe strongest evidence was buried in a list. If the work is confidential, lead with the outcome and say why the pixels are blurred.
Retired the animated mascot era: a pixel avatar, Clippy, the Windows XP dog, and a custom capybara all had their day. What remains is a small text guide that knows which page you are on.
WhyFour mascots taught me the personality belongs in the words, not the sprite. Charm that interrupts reading is not charm.
Resized and re-encoded every case-study image, fixed uppercase filenames that broke on case-sensitive servers, and pruned dead mascot code and assets.
WhyCase studies were shipping raw design-file exports. And macOS forgives filename casing; Linux does not.
Added the Experiments section: Wayfind, ARND, Vesta Press, Mooze, Toronto Yuwol, and Personal Color Analysis, alongside the full personal-project arc from illustration to design systems.
WhyThe range is the point. Side projects show judgment with no one else in the room.
Hand-set the ak favicon and share card in the wordmark style, added a theme color that follows light and dark mode, and gave the 404 page the site's typography.
WhyThe details nobody asks for are the ones designers check first.
Older than this, the history lives in git. The format takes after teams that publish their work as it happens; if a change was worth shipping, it is worth explaining.