株式会社ミミクリデザインと株式会社インテージによるイノベーション支援サービス「Re-Frame」のWebサイト開発を通したサービスブランディングをDONGURIが担当しました。

「Re-Frame」は、株式会社ミミクリデザインと株式会社インテージによる「『ありたい姿』を問い直す」組織のイノベーション支援サービスです。
このサービスは、ワークショップを中心としたボトムアップ型のアプローチを得意とするミミクリデザインと、生活者の“サイン”（声にならない声）をデータやファクトをつなぎ合わせてカタチにすることを強みとするインテージの「デ・サインリサーチ」チームの専門性が結びついて誕生したものです。リサーチデータとワークショップを活用し、作り手として企業の“ありたい姿”を問い直し、イノベーティブな組織づくりの開発支援を行うことを特徴としています。

要件のヒアリング・情報設計

初めに、本サービスが生まれた背景や特徴をヒアリング。サービス名やコンセプト、提供されるサービスの内容に基づき、Webサイトの情報設計を行いました。
ヒアリングの結果、本サービス全体のコンセプト訴求と合わせ、3種類のサービスパッケージの違いを伝えるコミュニケーションも重要であると導き出されました。

「Re-Frame」では、以下3つのサービスパッケージを提供しています。
-「Re-Frame Logue」リサーチデータを読み解き、企業の“ありたい姿”を問い直すことで新たな方針を策定する。
-「Re-Frame Party」多様な業界の参加者が集う場を設定しコラボレーションの種を発見する。
-「Re-Frame Market」市場などの定義を問い直し、企業の成長に結びつく新たなゴールを創造する。

これらのサービスはいずれも無形で抽象的であるため、サービス内容が具体的にイメージできるイラストを中心としたコミュニケーションを設計しました。
キービジュアルでは3種類のサービスを象徴するイラストを用いた上で、スクロールした下段にはコンセプトを伝える「ABOUT」を、続いてサービスのフローを「STEP」で視覚化し、解決できる課題をサンプルストーリーとして併記することで、「Re-Frame」がどのような課題を持つ組織に有効なソリューションであるのかを訴求する設計となりました。

イラストディレクション

各サービスの特徴をイラストで視覚化するにあたり、メタファーとなる描写を検討。各サービスを象徴する表現を改めて「問い直す」アプローチでブレインストーミングを行いました。
結果として「Re-Frame Logue」は「積み木で何かを作る」、「Re-Frame Party」は「パズルのピースを持って集まる」、「Re-Frame Market」は「ゴールの位置を変える」というように、それぞれのサービスでの行動を適切に表現するシチュエーションを設定しました。

イラストの制作にあたっては、コンセプトに沿うスタイルやタッチのリサーチを実施。具象性の高いものから抽象性の高いものまで、3パターンのイラストスタイルをWebサイトデザインのトーンと合わせて提案しました。この段階で、2社のコーポレートカラーを用いたミニマルで抽象的なイラストの方向性が定まりました。

すべてのイラストは「問い直し」がコンセプトである本サービスを象徴するものになるよう、ユーザーの思考を刺激する仕掛けを凝らしました。サービス全体を説明する「ABOUT」に用いるカットでは「鏡に映る多様な自分に出会う」、「STEP」の「Planning」では「スタート地点を表す看板を手にする」など、それぞれのイラストに「問い直し」を意味付ける演出を施しています。イラストはすべて同一のトーンでありながら、視点の異なるアングルで変化をつけることで、それぞれのシチュエーションを印象付けるとともに、視覚的な奥行きをもたらすディレクションを行いました。

サービスサイト開発

イラストの制作と並行して、Webデザインにも着手。情報とビジュアルに余白を多く設けることで、ミニマルでありながら創造性を刺激するバランスを目指しました。

キービジュアルでは、3つのサービスを象徴するイラストが切り替わるインタラクションを設計。スクロール時には背景にある矩形の角度が変わることで、サービス名の由来でもある「リフレーミング（問い直し）」を想起させる演出を施しました。インタラクションやスクロール時のモーションはどのデバイスで閲覧した時にも同じ印象を与えられるよう実装を行なっています。

ビジュアルとモーションに様々な仕掛けを凝らすことで、訪れるユーザーの創造性と好奇心を刺激し、「『ありたい姿』を問い直す」という本サービスのコンセプトを訴求するブランディングを行いました。