AISTON

俳優・岡田准一をはじめ、植木祥平、山﨑翠佳らが所属するタレントマネジメント会社AISTONのコーポレートサイトを制作しました。テクニカルディレクションから実装・運用まで一貫して担当しています。

トップページでは「A」のロゴが画面いっぱいに広がりながら映像へと溶け込むオープニングアニメーションを実装しました。SVGベクターパスで映像をマスク・切り抜く手法はブラウザ間の挙動差や描画コストとの戦いで、技術的に最も難度の高い実装のひとつでした。視覚的なインパクトを最大化しながら、SEOの観点からHTMLセマンティクスをきちんと保ちつつ立体感のある動きを両立させています。

フッターは、単なる補助的なリンク集ではなく、サイト全体を締めくくるメニューとして設計しました。スクリーンをイメージした幕が上下から閉じるように動き、アニメーションが完了するとメニューリンクが現れます。機能として必要な導線を、美しい余白と動きのあるレイアウトとして見せることで、最後までAISTONらしい緊張感のある体験につなげています。

所属アーティストによって見せ方が異なるため、アーティストページは共通のモジュール構成をベースに、個別にレイアウトをカスタマイズできる設計にしています。出演作品はファンがデータベースとして活用できるよう、網羅性を意識したUIと丁寧なデータ入稿を行いました。

映像を多用したサイトのため、動画配信にはMuxを採用し、アダプティブストリーミングによる安定した再生品質を確保しています。コンテンツ量が増えても表示速度が落ちないよう、遅延読み込みやアセット最適化を組み合わせて対応しました。

サイトはヘッドレス構成で構築しています。コンテンツはmicroCMSで管理し、ビルド時に取得して静的サイトとして生成・CDN配信する仕組みです。コンテンツが更新されるとwebhookでCIが起動し、自動的にビルドからデプロイまで完了するため、編集者は管理画面の操作だけで安全にサイトを更新できます。

見た目や演出だけでなく、納品後に「誰がどう運用していくか」を含めて設計することを重視しました。静的配信により表示が速く攻撃面も小さいうえ、技術に詳しくない担当者でも日々の更新を完結できる構成です。問い合わせ対応には、日本のクライアントになじみやすい国産のコンタクトフォームサービスを採用し、フォームの保守やスパム対策を専門サービスに委ねることで、クライアントが運用の負担を抱え込まずに、長く安心して使い続けられる構成にしています。

問い合わせ動線は、ユーザーがオーディションやお問い合わせのフォームを送信すると、自動返信でユーザーへ受付を知らせると同時に、担当者へ通知が届く設計です。スパムフィルタや管理画面を備えたフォームサービスを介すことで、担当者が必要な問い合わせにすぐ気づき、確実に対応へ移れる導線を整えています。