Works
Case Study

ニッポンのこころを、家族の“ワクワク”に。

アソビュー!とカテエネ(中部電力)のタイアップで、日本の伝統文化・ものづくり体験を「再発見」するキャンペーンLP。陶芸・とんぼ玉・水墨画・生け花。各地の体験を、テーマとエリアの2つの切り口で探せる、和のトーンの縦長ページとしてデザインしました。担当は、このLPのUI/ビジュアルデザインです。

Role構成設計(ワイヤーフレーム)・UIデザイン・ビジュアルデザイン(LP)
Year2024
DomainタイアップキャンペーンLP
Clientアソビュー! × カテエネ(中部電力)
SurfacePC / SP(レスポンシブ)
ToolsFigma
注目ポイント

無形の「こころ」を、どうやって見えるかたちにしたか。虫めがねのモチーフを見出しまで一貫させることで、ページに芯を通しています。

キャンペーンLPのキービジュアル。虫めがねのモチーフに「家族でワクワク!ニッポンのこころ再発見旅」の見出しと、アソビュー!×カテエネのロゴ。陶芸・書道・ガラス細工などの体験写真を和柄のコラージュで配置
ファーストビュー(PC)— 虫めがね=「再発見」を象徴に

実際に公開されたキャンペーンサイトです。担当したのは LP の構成(ワイヤーフレーム)〜UI/ビジュアルデザインで、企画・コピー・実装は別の担当によるもの。ブランド名・写真・イラスト等は各権利者に帰属します。

01 / Overview

伝統文化を、“再発見”する旅。

体験予約サービス「アソビュー!」と、中部電力のWEB会員サービス「カテエネ」のタイアップによるキャンペーンLPです。陶芸・とんぼ玉・ガラス細工・水墨画・生け花・提灯絵付け。日本の伝統文化にふれる体験を集め、「家族でワクワク!ニッポンのこころ再発見旅」というテーマで届けます。

わたしが担当したのは、このLPの 構成(ワイヤーフレーム)から、UI/ビジュアルデザインまで。決まった企画・原稿・写真素材を受け取り、ワイヤーフレームで構成を組み立て、「伝統」というテーマを家族が楽しめる明るい1枚として設計する役割です。

02 / Challenge

“伝統”を、堅くせずに伝える。

「伝統文化」は、ともすると堅く、少し縁遠く見えてしまうテーマです。それを、家族が「やってみたい」と思える“ワクワク”に翻訳すること。そして、数多くの体験を、迷わず探せるように整理すること。

この2つを、和の世界観のなかで両立させるのが、このLPのデザインで向き合った課題でした。

03 / Design decisions

考えたこと、決めたこと。

堅いテーマを、明るく・探しやすく届けるための3つの判断です。

01Tone

和のモチーフで、“こころ”を視覚化。

和柄・富士山・雲・鶴をあしらい、赤と金と生成りの和カラーで全体を構成。伝統を古めかしくせず、家族で楽しめる明るく親しみやすいトーンに整えました。

02Motif

「再発見」を、虫めがねに込める。

キャンペーンの核である“再発見”を、虫めがねのモチーフに。キービジュアルだけでなく、各テーマの見出し(「世」「五」などの一文字を虫めがねに収める)まで一貫させ、ページに芯を通しました。

03Two axes

テーマでも、エリアでも探せる。

同じ体験を「テーマ(世代を結ぶ匠の技/五感で触れる伝統のこころ…)」と「エリア(中部5県)」の2つの切り口で提示。共通の体験カードに揃え、どちらの入り口からでも目的の体験にたどり着けるようにしました。

導入セクション:「体験しよう!ニッポンの素敵な文化!」の見出しと、富士山・雲・鶴の和イラスト、「“ニッポンのこころ”に触れる旅への出発です」という文章
Tone — 富士山や雲をあしらった、和の導入
04 / Two entrances

2つの入り口から、体験へ。

テーマ別のセクションでは、「世代を結ぶ匠の技」のように切り口を立て、関連する体験をまとめて紹介。さらに「エリアから探す」では、中部5県(愛知・三重・岐阜・長野・静岡)から地域で選べるように。同じ体験を、2つの入り口からたどれる構成にしました。

テーマ別セクション「世代を結ぶ匠の技」:虫めがねに「世」の一文字を収めた見出し、匠の技の紹介文と陶芸の写真、陶芸・とんぼ玉・ガラス細工・美濃焼絵付けなどの体験カード
テーマから探す — 「世代を結ぶ匠の技」
エリア別セクション「エリアから探す」:愛知・三重・岐阜・長野・静岡の5県タブと、テーマのハッシュタグ付きの体験カードが並ぶ一覧
エリアから探す — 中部5県から選べる
05 / Responsive

PCとSP、それぞれに。

情報量の多いLPは、モバイルでの見え方がとりわけ重要です。PC(1440px)で横に組んだ体験カードやテーマの見せ方を、SP(375px)では縦1列に積み直し、和のモチーフやエリアタブもモバイルで扱える形に設計。PC・SPの2種類を用意しました。

キャンペーンLPの全体像(PC)。ファーストビューから導入・テーマ別セクション・エリアから探す・規約・フッターまでの縦長1枚
PC — 全体(枠内をスクロール)
キャンペーンLPの全体像(SP)。PC版の内容を縦1列に積み直したモバイル向けレイアウト
SP — 全体(枠内をスクロール)
06 / My role

自分が担当したこと。

このプロジェクトでのわたしの役割は、決まった企画・原稿・写真素材を受け取り、それを1枚のLPとして成立させる構成(ワイヤーフレーム)からのUI/ビジュアルデザインでした。ワイヤーフレームでの構成、和の世界観づくり、全体のトーン設計、テーマ・エリア・体験カードといった各コンポーネントの設計、そしてPC・SPそれぞれへの展開までを担当しています。(企画・コピーライティング・コーディングは、別の担当によるものです。)

担当した範囲
ワイヤーフレーム ビジュアルデザイン UIデザイン 世界観・トーン設計(和) レイアウト設計 コンポーネント設計 PC+SP対応 Figma
07 / Reflection

無形の“こころ”を、かたちに。

手にとれない「伝統」や「こころ」を、写真とモチーフと色で、ふれてみたくなるかたちに翻訳する。堅くなりがちなテーマを、家族の“ワクワク”まで連れていく。そのための和のトーンと、探しやすい2軸の設計が、この仕事のデザインでした。

扱うテーマが抽象的なほど、どんな見た目で“入り口”をつくるかが効いてきます。cotozuが掲げる「まだ見えない価値を、かたちにする」に、まっすぐ通じる一枚です。

Contact

感想やご連絡は、気軽にどうぞ。

Contact

ほかの制作を見る(Works)