株式会社AGRSのウェブサイトリニューアル – これからの会社のあり方を示す制作進行

株式会社AGRSのウェブサイトリニューアル – これからの会社のあり方を示す制作進行

株式会社AGRS

『銀魂』坂田銀時役や『涼宮ハルヒの憂鬱』キョン役などを務める、声優・杉田智和氏を中心とした個人事務所『株式会社AGRS(以下、AGRS)』。そのウェブサイトのリニューアルにあたり、弊社でディレクションからデザイン、実装まで担当しました。

セクション分割

課題背景

声優・杉田智和氏の個人事務所であるAGRS。

弊社では、2020年、杉田氏の独立のタイミングに伴ってAGRSが設立された当初にもウェブサイト制作のご依頼をいただきました。2020年に公開され、その後もサイト運用に携わってまいりました。

設立から約3年が経ち、アップデートされていった会社の方針とウェブサイトの構成や表現方法には、少しづつずれが生じていました。今後の会社経営を見据えて双方をしっかりと連携させるべく、ウェブサイトのリニューアルプロジェクトが立ち上がりました。

AGRS 2020

1. 「4つの個性が集う会社」から「杉田智和の会社」へのイメージチェンジ

AGRSは、杉田氏含め計4名人のメンバーが所属する会社です。2020年当初のコンセプトのひとつに、「多様なキャリアを持った4名からなる組織体であることをアピールする」方針がありました。そのため、旧ウェブサイトではトップページでも4名の写真をメインビジュアルに据え、あくまで4名の会社であることを訴求していました。

しかし3年の期間を経て、改めて杉田氏の意向を中心に据えてプロジェクト運営を行う会社方針へと辿りつきました。そのため今回のリニューアルでは、変化した会社のスタンスをあらためて整理し、それらを明確に示すことを最重要要件としました。

2. こだわりを実現しつつ、効率よく進めるためのファシリテーション

自らもクリエイターである杉田氏だからこそのこだわりを実現しつつ、忙しいスケジュールの間を縫って効率的に方向性をまとめてプロジェクトを進めていくために、杉田氏のビジョンを理解した的確な仕切りとファシリテーションを求めていたAGRS。メンバー4人の意見をとりまとめる機会もなかなか設定することが難しい中で、第三者による進行面のコントロールにも期待をされていました。

そのため、今回のリニューアルに合わせて、ワークショップによって事業領域の見直しを行い、対外的な見せ方の調整をすることも要件として盛り込みました。

セクション分割

プロセス

2023年4月に立ち上がった本プロジェクトでは、約半年間かけて制作を行い、2023年12月にリニューアル公開となりました。

会社設立時から3年以上のお付き合いはあるものの、会社の転換点でのウェブサイトリニューアルとして成果を出すためには、AGRSの現在の状況、そして今後のビジョンについてしっかりと目線を合わせることが肝となります。プロジェクトはまずワークショップからはじまり、大きく3つのステップを経て進行していきました。

1. ワークショップで現状を洗い出し、リニューアルの方向性をクリアに

まずは全員で事務所に集合。リニューアルにあたって検討すべきさまざまなテーマに対する意見を付箋に書き出し、ディスカッションを行いました。

議論の中で特に大きなポイントとなったのは、「どんな人がウェブサイトを見る?」「どんな人に見てほしい?」という表と裏のようなふたつのテーマです。

前提として、AGRSのウェブサイトは杉田氏の著名性の効果により、大きな閲覧数を獲得しています。しかし、アナリティクスから閲覧行動を分析して推測される「ウェブサイトを見に来ている人」のすべてが「ウェブサイトを見てほしい人」かというと、一概にそうとはいえない状況でした。この状況を踏まえ、ワークショップでは「見てほしい人」に関する考えを持ち寄り、それがどんな人なのかのイメージを具体化してすり合わせるなど、各テーマにおける共通認識の醸成も行いました。

ワークショップ終了後はあがったさまざまな意見を取りまとめ、ウェブサイト全体の要件定義へと落とし込みました。

2. 会社の方向性を体現できるメインビジュアルをつくる

ワークショップでイメージが固まりきらなかったもののひとつが、トップページのメインビジュアルです。「事業を行う会社として、ある程度堅実な表現にしたい」という要望はありつつも、声優である杉田氏の会社として見せるべき必要もあり、どのようなビジュアルで表現すべきか、弊社の提案に委ねられていました。

今回メインビジュアルを考えるにあたって大切にしたのは、「普遍的なウェブサイトでありながら、個性的に見せる」ことです。「プロフェッショナル」「3次元と2次元」の2つをキーワードとし、現行の表現へと落とし込みました。

このメインビジュアル制作を行うにあたっては、AGRSと長年の付き合いがあるメンバーだけではAGRSの固定概念的なイメージから脱却できないと判断し、社内の別のデザイナーをメインの担当に据えて進行しました。担当を関係値の低いデザイナーに一任し、あらためてビジュアルのリサーチから提案まで行ったことで、これまでのAGRSのイメージに縛られない新鮮なアイディアが生まれました。

メインビジュアルの提案資料

3. ウェブサイトの全体設計、実装へ

メインビジュアルの方向性が固まると、それに合わせてウェブサイト全体の方向性も明確になっていきました。それは、少ない要素を最大限効果的に見せること。各ページごとにイメージ画像を用意するような、いかにもコーポレートサイトと感じるオーソドックスな構成は避け、12分割のグリッドシステムで管理したり、細かな演出に時間を割くことでことで、テキストの読みやすさを担保しつつ脱普遍性が検討された設計となりました。

このグリッドシステムを用いつつも、意図的なずらしによるひっかかりを演出しています。「堅実な印象」「伝わりやすい構成」という要件を満たしつつ個性を持たせることで、全体としてAGRSらしいデザインへと仕上げていきました。

グリッドによるテキスト配置の設計

セクション分割

アウトプット

1. 杉田氏のこだわりとビジネスとを両立するデザイン

著名人の個人事務所だからといって、浮わついたイメージを与えるものにはしたくなかったという杉田氏。会社として経営する以上、ウェブサイトにも適度な堅実さを求めていました。

その想いは会社立ち上げ時点から持っていたもので、旧ウェブサイトでも考慮していたポイントでしたが、今回のリニューアルではさらに一歩踏み込んで「チャレンジングな会社」から「声優事業を行う会社」へと表現を発展させました。当初より使用していたAGRSのブランドカラーである紫色をぐっと押さえてブラックを際立たせることで、ビジネスを感じさせる締まった印象へとアップデートしました。

ウェブサイトのカラーリングはブラックを中心に設計

2. 声優事業にフォーカスするための、キャラクターの再定義

旧ウェブサイトでは事業を「よろず屋」「声優・芸能マネジメント」「キャラクターマネジメント」の3本柱としていましたが、それらを解体して杉田氏の声優事業を主軸とし、そこに紐づく情報やプロジェクトをたっぷりと見せる構成に組み直しました。

合わせて、これまで杉田氏の「分身」という建て付けで運用されているキャラクター「アジルス」についても、かつてのウェブサイトではうまく存在意義を伝えられていなかったことが問題点となっていたことをふまえ、「杉田氏の分身 = 会社のマスコットキャラクター」という立ち位置へと明確化を行い、メインビジュアルの表現へとつなげました。

3. 新しい一面を見せるオリジナルの記事コンテンツ

リニューアル後の新しい要素として、「アジルスが聞く」というコンテンツページを新設しました。これは、「デザインが変わっただけではなく、何かひとつ挑戦を混ぜたい」というAGRSの想いから始まった企画。リニューアル時点では、杉田氏が『銀魂』の初代監督を務めたアニメ監督・高松信司さんにインタビューを行う記事コンテンツを掲載しています。

この「アジルスが聞く」では、クリエイターのおもしろい話を聞き出すという杉田氏の新しい一面を伝えることをひとつの目的としています。インタビュアーとしての能力を形にして発信していくための土台づくりを行いました。弊社は、コンテンツの演出・構成に携わりました。

セクション分割

成果

リニューアルを終えて

ウェブサイトは「かっこいい見た目にすればPV数が伸びる」というものではありません。多くの人に見ていただくためには、クライアントの方々がしっかり運用し、機能を維持してくれることが何より重要だと考えています。かっこいい見た目をとことん追及したり、現状を緻密に分析する以上に、クライアントが「もっと見てもらいたい!」とつい行動してしまうようなものをつくること。「ニュースをSNSでシェアしよう」「もっとコンテンツをつくろう」などの想いと行動を喚起するものをつくることこそが、最終的には大きな閲覧数の獲得に繋がるのだと思います。

実は今回のリニューアル後、15分に渡って新しいウェブサイトを隅から隅まで紹介する動画を、杉田氏が自身のYouTubeチャンネルにアップしてくださいました。広く紹介しようと思えるものをつくれたこと、そしてその紹介を通じて多くのファンの方に見ていただけたことは、大変嬉しい成果となりました。

セクション分割

チーム

  • Client
    株式会社AGRS
  • Art Direction
    村上 由朗(DSCL Inc.)
  • Design
    谷津 吉宣(DSCL Inc.)
  • Motion Design
    谷津 吉宣(DSCL Inc.)
  • Front-end Development
    村上 由朗(DSCL Inc.)
  • Photograph
    Liberal Creators