Taisei Dofuku

Born 1997, based in Tokyo. Previously at monopo, a global creative agency. Now freelance, handling the full scope of web production — from EC development and system architecture to infrastructure.

t.dofuku@monesynth.io

Tokyo, Kichijoji

2025

AISTON

Client
AISTON Inc.
Category
Corporate Site
Role
Website Architecture, Engineering & Operations

Brief

  • Built a scroll-linked homepage animation that combines video with an SVG vector mask.
  • Extended the brand’s tone into detailed interface patterns, from the footer menu to per-artist layouts.
  • Designed for long-term operation with microCMS updates, static delivery, and a managed contact flow.
01

ANIMATION

AISTON is a talent management agency representing actor Junichi Okada alongside Shohei Ueki and Suika Yamazaki — artists active across film, television, and stage. I handled technical direction and full-stack development for their corporate website.

The opening sequence on the homepage features the “A” logo expanding to fill the screen before dissolving into a background video, with the footage clipped through SVG vector paths. Achieving smooth, consistent masking across browsers while managing render cost made this one of the more demanding implementations on the project. The motion system was built on top of semantic HTML, so the site could keep a crawlable structure while still carrying the visual direction.

02

FOOTER

The footer is designed not as a secondary list of links, but as a navigation layer that gives the page a deliberate ending. Inspired by a screen or stage curtain, panels move in from the top and bottom; once they meet, the menu links appear. It keeps the navigation functional while giving the final interaction the same restraint and tension as the rest of the site.

03

ARTIST PAGE

Each artist has a distinct presence on the site. Built on a shared module system, artist pages are individually configurable in layout, allowing different visual treatments without duplicating templates. The works and appearances sections were structured as a browsable credit database, with the CMS model set up to support detailed data entry over time.

04

PERFORMANCE

With video at the center of the experience, Mux was chosen for adaptive streaming — ensuring stable, high-quality playback regardless of network conditions. Lazy loading and asset optimization keep the site fast even as the content library grows.

05

OPERATIONS

The site runs on a headless architecture. Content is managed in microCMS, fetched at build time, and served as a fully static site over a CDN. Whenever content changes, a webhook triggers CI to rebuild and redeploy the site, so editors can manage routine updates from the CMS without touching the codebase.

Diagram of AISTON's headless architecture: build pipeline and runtime
Diagram of AISTON's headless architecture: build pipeline and runtime
Headless setup: content fetched from microCMS at build time, statically generated and served

The design considered not just visuals and motion, but how the site would be operated after handover. Static delivery keeps the runtime simple and reduces the attack surface, while non-technical staff can handle routine updates through the CMS. For contact handling, I chose a Japanese form service that fit the client’s workflow and kept form maintenance and spam protection with a dedicated provider.

When a visitor submits an audition or contact form, an auto-reply confirms receipt while a notification is sent to the staff in charge. Routing submissions through a form service with spam filtering and a management dashboard helps the team notice incoming inquiries and respond reliably.

Diagram of AISTON's contact flow, from form submission to staff response
Diagram of AISTON's contact flow, from form submission to staff response
Inquiry flow: from form submission through auto-reply and staff notification to response

Credits

  • Producer Taisei Dofuku
  • Technical Director / Developer Taisei Dofuku
  • Art Director / Designer Jin Okuma