Hello, I am branding engineer :)
I am 31 years old and a web developer from Nara/Japan @ Condé Nast. After a music university, I changed my career from a musician / sound engineer to a web developer when I was 25 years old.
I'm good at building high-performance SPA / SSG sites in Nuxt / Next x TypeScript, developed components that reflect design systems, luxury visuals in WebGL, and UI / UX considerations for interpreting business and brand stories.
Winner: FWA FOTD / ACC TOKYO CREATIVITY AWARDS Branded category Finalist
I love cat and engineering and music.
--
Thanks.
clip blog_ webmanab
_Works
WIRED.jp
WIRED is a media about how technology will shape our future. To speed up the old site by quitting WordPress, I implemented the SSG architecture in Nuxt. After the renewal, the load time was reduced to 1/2, and the transition time to 1/5. I build an Atomic Design-based design system and achieve robust component management with Storybook.
VOGUE JAPAN 20th Anniversary 1999~2019
This is a site that digests the culmination of 20 years of VOGUE JAPAN and introduces the archive with various contents. The luxurious and modest brand image was expressed with WebGL distortion and glitch noise. The subtleties of beauty are controlled by the smoothness and sharpness of the interactions.
WIRED vol.39
The World in 2021
Since this page contains many articles, we implemented a fluid interaction as if a large amount of information were flowing into the magazine. We also used a simple but directional parallax expression to express the feeling of the magazine shaking.
_About
skill set
- Design
- Figma / design system / design tokens / accessibility (WCAG) / UX writing / prototyping
- HTML
- semantic markup / WAI-ARIA / SEO / structured data
- CSS
- Sass / custom properties / container queries / cascade layers / fluid typography / Tailwind CSS / CSS architecture
- JavaScript
- TypeScript / Vue / Nuxt / React / Next / Astro / Vite / Node.js / WebGL / Three.js / gsap
- Quality
- Storybook / Playwright / Vitest / visual regression testing / axe / Lighthouse / ESLint / Stylelint
- AI
- Claude Code / Codex / MCP / agent skills / LLM-driven development
- Sound
- Pro Tools / Logic
- Other
- macOS / Git / GitHub Actions / Docker / Cloudflare / pnpm
social
fav
J. R. R. Tolkien / shuntaro tanikawa / shigesato itoi / manabu mizuno / Kenya Hara / hikaru ijyuin / bakery / coffee / wine / americanfootball / hikaru utada / the band apart / Spangle call lilli line / radio
_Other
woodwork
photograph
music
