ホーム Webサイト制作 Webアプリ開発 業務自動化 AI導入 お問い合わせ

株式会社Grand Line様 コーポレートサイト

Project Data

Role
企画 デザイン 実装
Released

Overview

■ プロジェクト概要
セールスプロモーション事業および人材ソリューション事業を展開する「株式会社Grand Line」様のコーポレートサイトリニューアルを担当いたしました。
「全てを挑戦の渦へ」という力強いコーポレートメッセージと、これから共に新しい航海へ挑むパートナー(協業企業・採用候補者)を惹きつける、エモーショナルかつ洗練されたブランド体験の構築を目指しました。

■ デザインコンセプト
洗練された雑誌の誌面のような「エディトリアルデザイン」を採用。鮮烈なクラインブルーをブランドカラーの基調とし、大胆なタイポグラフィと計算された余白によって、知的でありながら内に秘めた熱量を感じさせるUI/UXを設計しています。
各セクションのビジュアルには、AI技術を駆使して生成した「実写クオリティの超リアルなイメージ」を採用し、既存のストックフォトにはない、独自の世界観とスケール感を表現しました。

■ 実装・演出のポイント
GSAP(ScrollTrigger)を活用し、ユーザーのスクロールに連動するシネマティックなアニメーションを実装。
ファーストビューでの「船長の部屋から大海原へ抜け出す」ドラマチックなズーム演出をはじめ、パララックス(視差効果)やテキストの出現アニメーションなど、ブラウザ上で一編の映画や雑誌をめくるような没入感のあるリッチなユーザー体験(WebGLライクな表現)を実現しています。

■ 担当領域
・アートディレクション / UI・UXデザイン
・フロントエンド実装(HTML / CSS / JavaScript / GSAP)
・バックエンド実装(PHP / お問い合わせフォーム構築)
・AI画像生成・プロンプトエンジニアリング