Maffice

ブランドムービー・ブランドサイト
プランニング・アートディレクション・構成・デザイン・撮影・コピーライティング・コーディング・動画作成

“働き方も子育ても、もっと自由でいい。”というコンセプトのもと、東京・横浜を中心に展開するママと家族のシェアオフィス「Maffice – マフィス」のブランドムービーとブランドサイトを制作しました。保育園とワークスペースを隣接させた新しいタイプのオフィスです。

保育とオフィスが併設されているのがMafficeの大きな特徴であることから「オフィス」「保育」ふたつの大きな入口を設け、ワイヤーフレーム策定段階から分かりやすい動線設計を行いました。リニューアル前は働くママをペルソナとしていたため、サイトのメインカラーは女性らしい薄いピンクを使用していました。新規デザインではユニセックス向けへとシフトしていきたいというご要望をいただき、メインカラーにはビビッドなイエローでサブカラーにはお落ち着きのあるライトグレーを採用。ファーストビューには「マフィスで過ごす1日」の動画を設置し、施設の利用を検討する方へよりイメージしやすい訴求ポイントにしました。
ボリュームのある主な下層ページには、訪問者の離脱を防ぐためにパララックスというスクロール時の視差効果を採用。これによりスクロールした際に、複数のレイヤーが異なるスピードで動くなどの視覚的効果を生み、見る人が飽きることを防ぎながらMafficeの魅力をデザインで余すことなく表現しています。また、CTA(行動喚起)を意識した設計をしており、SPでは画面下部に追従ボタンを設置しています。

オフィスの紹介ページでは、最も重要である設備仕様やサービスの内容はアイコン表示とし、直感的に情報が伝わる設計にしています。特徴的なコンテンツ「私たちが大切にしていること、選ばれる7つの理由」は動きのあるレイアウトを取り入れ、メリハリのついたページ構成を目指しました。
保育の紹介ページでは、保育のフィロソフィーをページ冒頭でしっかりと謳い、入園を検討している人へ魅力を伝えています。「私たちが大切にしていること」、「レジリエンス保育」、「味覚を育てる給食」、「子育ての大変を和らげる取り組み」、「サービス」とページにボリュームがあるためモーダルウインドウを採用。ページボリュームに干渉することなく、コンパクトにまとめることに成功しました。じっくりと読ませるコンテンツには、優しい彩度のアイボリーの背景を敷きコンテンツごとに差別化を図っています。

Other cases