プロジェクトの相談を申し込む プロジェクト紹介にスキップ
ホワイトペーパーの上から指先に傾いた赤ワイングラス。真ん中は濃いルビーで、ワインが薄くなる上端は紫色です。

EASYWINE · CASE STUDY EASYWINEWebサイトリニューアル提案は
ホワイトペーパーの上でワイングラスを傾ける仕事で始まりました

TILT TESTグラスを傾けると、中央はルビー、
ワインが薄くなるエッジは見てに見えます

20 SAMPLES中央から端まで
20点の色を選択しました

TWO DIRECTIONS両方の提案は、このバンドの両端から
それぞれの色を選びました

EASYWINEWEBSITE RENEWAL PROPOSAL

中央のルビー、 一番上の見て

EASYWINEWebサイトリニューアル提案
Ruby in Motion · Easy Pour、2つの方向

BLUECANVASA · BPRODUCT OF SEOUL

ケースを読む
01 / OVERVIEWプロジェクト概要

世界のワインを
簡単に均等に助ける輸入会社

EASYWINEは2012年に発足したワイン輸入会社です。チリ、アメリカ、フランス、イタリア、スペインの7つのブランドから選んだワイン25種を国内に紹介し、祝日と記念日に合わせたギフトセットも飾ります。会社紹介に書かれた経営方針は「良質のワインをリーズナブルな価格で提供する」です。

今のホームページは2015年と2016年に掲載した資料で構成されています。 BlueCanvasはこの資料をもう一度読んで、最初にワインを選ぶ人も会社の物語やブランド、ワインを簡単に閲覧できるようにメインページを新たに設計しました。そして、Ruby in MotionとEasy Pourという2つの方向を提案しました。

CLIENT
EASYWINE(株)
2012年に発足したワイン輸入会社
SECTOR
ワイン輸入・流通
ギフトセット
OUR ROLE
リサーチ、ブランド解析、情報構造、
UIデザイン、モーショングラフィック、スクロールフィルム
DELIVERABLE
メイン提案2種、モバイル画面、
スクロールフィルム、カラー・書体ガイド
  • 2012 開始 世界産地のワインを取り入れて紹介し始めた年
  • 5 か国 ワイン産地 チリ、アメリカ、フランス、イタリア、スペイン
  • 7 個 ワインブランド バルディヴィエソからピンクのエレファントまで
  • 25 種 紹介するワイン 赤16種、白6種、スパークリング・ロゼ3種
02 / CHALLENGE出発点

今ホームページの最初の画面構成
  1. 1メニューは、会社、ブランド、ギフトセット、ワイン、プレス、ギャラリーの6つです。
  2. 2最初の画面では、ワイン12本のボトルの写真が市松模様のように配置されます。ボトルを押すと製品の説明に進みます。
  3. 3会社紹介と7ブランドの紹介は、文字が入った絵一枚ずつです。

TEXT IN A PICTURE

絵の中の文字は拡大するとぼやけます

会社概要 最初の行を今のように横650pxの絵に入れた文字と、Web文字で書いた文字を並べて置きました。バーを右にドラッグして拡大してみてください。

今・絵の中の文字 検索✕・翻訳✕・画面を読む✕
経験は‘羊’ではなく、‘質’です。
提案・ウェブ文字 検索○・翻訳○・画面を読む○

FOUR QUESTIONS

リニューアルは
4つの質問で始まりました

今ホームページはワインの写真を素早く見せる仕組みです。初めて来る人が何に基づいて選ぶべきか、会社がどんな所なのかは絵の中の文字を読まなければ分かりません。

  1. Q1
    ワインをよく知らない人も最初の画面で選べますか?

    今はボトルの写真と名前だけが見えます。両提案はレッド・ホワイト・スパークリングのような簡単な基準と食品、産地でワインを探すようにしました。

  2. Q2
    絵の中に閉じ込められた会社の物語を書き出すことができますか?

    会社紹介とブランド紹介の両方を書き直し、検索、翻訳され、携帯電話でも鮮明に読まれるようにしました。

  3. Q3
    7つのブランドと5つの国を一目で見ることができますか?

    どちらの提案も地球上に産地を表示し、国を選ぶとその国のブランドと話が出るようにしました。

  4. Q4
    贈り物や配達を探している人はどこに行くべきですか?

    B案はギフトセットと業場納品、行事協賛を別に案内し、A案はギフト相談を問い合わせ窓口とまさにありました。

03 / BRANDロゴをもう一度読む

ロゴが見てである
ワイン会社

新しいシンボルを作る前に、今の名前とロゴ、会社紹介に書かれた文章をもう一度読みました。ワイン会社のロゴなら赤いようですが、EASYWINEのロゴは最初から見えました。その紫がどこから来たのかを追ってみました。

01 · EASY + WINE

名前はすぐに約束です

EASY WINEという名前には、ワインを簡単に作るという約束が含まれています。会社紹介には「良質のワインをリーズナブルな価格で提供する」という経営方針も書かれています。両方の提案は、この約束を最初の画面の文章に移動することから始まりました。

02 · THREE VIOLETS

ロゴの3つの見方

ロゴのEの後ろには、半透明の図形3つが重なっています。色を抜いてみるとラベンダー、蘭色、しばしばです。ワイン会社のロゴなのに赤色が一点もないという点が今回のリニューアルの最初の質問となりました。

03 · RIM

グラスの端で見つけたボラ

若い赤ワインを白い紙の上で傾けると、ワインが薄くなる端から紫がかかります。日が経つにつれて、この光はルビーからザクロとレンガ色に変わります。私たちはEASYWINEロゴの紫をこのエッジの色で読みました。

04 · QUALITY

「羊」ではなく「質」

2015年に書いた会社紹介は「経験は「羊」ではなく「質」です」という文章から始まります。原稿で「羊」は金色、「質」は赤色で塗られていました。たくさん並べるよりよく選んで見せるホームページがこの文に合うと見ました。

05 · TWO OPENINGS

両方の提案の最初の文

A案Ruby in Motionは「A little wine, a lot of life.」で、B案Easy Pourは「Easy to Understand・Approach・Drink」で初画面を開きます。一方はガラスの中央から、もう一方はガラスの端から出発した提案です。

04 / WORDSラベルの見知らぬ言葉

ラベルの見知らぬ単語を
食卓の言葉として

ワインを難しくするのは味よりも名前です。 EASYWINEのワイン25種の名前には、Single Vineyard, Riservaのようにラベルからそのまま移した言葉が多いです。リニューアルを準備し、このような単語を一文の韓国語で解いてみました。製品詳細画面に貼り付けられる小さな辞書です。

  1. Single Vineyard

    シングルビンヤード

    あるブドウ畑からのブドウのみ

    いろんな畑のブドウを混ぜずに、ブドウ畑一箇所で私はブドウにだけ作ったという意味です。その畑の土と日光が味にそのまま残ります。

    バルディビエソシングルビンヤードカベルネフランボトル
    バルディビエソシングルビンヤードカベルネフラン
  2. Riserva

    リジェルバ

    ベースワインよりも長く熟成

    同じ名前のベースワインよりも長く熟成したという意味です。イタリアは山地ごとにリジェルヴァが守る必要がある最低熟成期間を定めておきます。

    ベキアトーレサリスサレンティーノリジェルバボトル
    ベキアトーレサリスサレンティーノリジェルバ
  3. Solera

    ソレラ

    先に作ったワインに新しいワインを加えて

    新しく作ったワインを先に作ったワインに少しずつ加えていき、数年の味を一瓶につなげる熟成方式です。

    カバロロッコボトル
    カバロロッコ
  4. Crémant · Brut

    クレマン・ブルー

    シャンパンのように作られた甘いスパークリング

    クレマンはシャンパンの外のフランス産地でシャンパンと同じように、瓶の中でもう一度発酵して泡立てたスパークリングです。ブルーは甘くないという意味です。

    グランクベ1531本
    グランベ1531
  5. Old Vine

    オールドバイン

    古いブドウの木から

    数十年以上生えたブドウの木です。果実は少なくなりますが、一粒一粒の味が濃くなります。

    バルタサル・ガルナチャー・ヒーローボトル
    バルタサル・ガルナチャー・ヒーロー
  6. Moscato

    モスカト

    香りが華やかな青ぶどう

    花や果物の香りが華やかな青布も品種です。甘くて軽いスパークリングワインを作るときにたくさん書いてください。

    バルディビエソスパークリングモスカートボトル
    バルディビエソスパークリングモスカト
  7. Zinfandel

    ジンパンデル

    カリフォルニアを代表する赤ぶどう

    カリフォルニアを代表する赤砲も品種です。イタリア南部でプレミティボと呼ぶブドウのような品種です。

    キャロウェイジンパンデルボトル
    キャロウェイジンパンデル
05 / CELLAR25本を分ける基準

25本のボトルを
4種類に分けて

今ホームページはワインをブランド一つの基準に分けています。ブランド名を知っている人には速い道ですが、初めて来る人にはもう一つの見知らぬ言葉です。 EASYWINEの25種をブランド、種類、産地、食べ物という4つの基準で改めて立ててみました。

今ホームページの「WINE」メニューはブランド七箇所にワインを分けます。バルディビエソ一箇所に10本の瓶が詰まっています。

  • カバロロッコカバロロッコ
  • バルディビエソシングルビンヤードカベルネフランバルディビエソシングルビンヤードカベルネフラン
  • バルディビエソシングルビンヤードメルローバルディビエソシングルビンヤードメルロー
  • バルディビエソシングルビンヤードカベルネソヴィニヨンバルディビエソシングルビンヤードカベルネソヴィニヨン
  • バルディビエソ・グランリジェルヴァ・カベルネ・ソーヴィニヨンバルディビエソ・グランリジェルヴァ・カベルネ・ソーヴィニヨン
  • バルディビエソ・グランリジェルヴァ・シラバルディビエソ・グランリジェルヴァ・シラ
  • バルディヴィエソ グランリジェルヴァ シャドネバルディヴィエソ グランリジェルヴァ シャドネ
  • バルディビエソ・カベルネ・ソーヴィニヨンバルディビエソ・カベルネ・ソーヴィニヨン
  • バルディビエソ・メルローバルディビエソ・メルロー
  • バルディビエソ・シャルドネバルディビエソ・シャルドネ
  • バルディビエソスパークリングモスカトバルディビエソスパークリングモスカト
  • キャロウェイジンパンデルキャロウェイジンパンデル
  • キャロウェイカベルネソヴィニヨンキャロウェイカベルネソヴィニヨン
  • キャロウェイ・メルローキャロウェイ・メルロー
  • キャロウェイ シャルドネキャロウェイ シャルドネ
  • キャロウェイソーヴィニヨンブランキャロウェイソーヴィニヨンブラン
  • ベキアトーレサリスサレンティーノリジェルバベキアトーレサリスサレンティーノリジェルバ
  • ベキアトーレサリスサレンティーノロッソベキアトーレサリスサレンティーノロッソ
  • ベキアトレシャドネベキアトレシャドネ
  • ミッションサードカベルネシラミッションサードカベルネシラ
  • ミッションサード・シャルドネミッションサード・シャルドネ
  • バルタサル・ガルナチャー・ヒーローバルタサル・ガルナチャー・ヒーロー
  • バルタサル・ガルナチャーバルタサル・ガルナチャー
  • グランベ1531グランベ1531
  • ピンクエレファントスパークリングロゼピンクエレファントスパークリングロゼ
06 / STRUCTURE訪問者とシーンの順序

EASYWINEホームページを開く
五種類の人々

ワイン輸入会社のホームページには、今日飲むワインを選ぶ人とプレゼントを探す人、業場に持ち込むワインを探す購入担当者が一緒に訪れます。探す情報がそれぞれ違うので、それぞれが到着する場面を先に決めました。

  • 01今日飲むワインを選ぶ人

    種類と味、似合う食べ物を見て一本を選びます。

    ワイン・ペアリング
  • 02贈り物を選ぶ人

    祝日と記念日に合った1本入・2本入構成を探します。

    ギフトセット
  • 03ホテル・レストラン購入担当者

    店舗のメニューと価格帯に合ったワインと供給方法を確認してください。

    ブランド・配達お問い合わせ
  • 04店舗・流通バイヤー

    ブランドの物語や商品情報を確認し、入店を相談します。

    ブランド・ワイン詳細
  • 05企業ギフト・イベント担当者

    数量と予算に合わせた贈り物やイベント用のワインをお問い合わせください。

    企業ギフト・お問い合わせ

短く味わう7つのシーン、
長く選ぶ12シーン

どちらの提案も、最初のシーンでEASYWINEを一文で紹介し、ワインや産地、プレゼントを過ぎてお問い合わせに届きます。 A案は7シーンで雰囲気を素早く伝え、B案は会社の履歴とセラー、ペアリング、配達案内にシーンを一つずつ与えて12シーンに長く均等にしました。色点は各シーンが引き受けたことです。

  • ファーストスクリーン
  • 会社の物語
  • ワインを選ぶ
  • 産地・ブランド
  • ギフト
  • 配達・協力
  • 瞬間・報道
  • お問い合わせ

A · Ruby in Motion7シーン

  1. 01A little wine, a lot of life.グラスを包むルビーの映像と最初の文章
  2. 02Our philosophy一杯のより広い世界、2012 · 5 · 7
  3. 03The collection6本のボトルを横に並べて種類に分けるコレクション
  4. 04Rooted in the world地区と五国の産地
  5. 05Wine & lifeキャンドルの下に2杯の夕食のダイニングテーブル
  6. 06Giftingギフトボックスとギフトカウンセリング
  7. 07Let’s talk wine電話・メール・地図とお問い合わせウィンドウ

B · Easy Pour12シーン

  1. 01Easy to … スクロールでグラスにワインが冷える最初の画面
  2. 02Manifesto経験は「羊」ではなく「質」です
  3. 03Record2012年から積み上げてきた履歴と数字
  4. 04Journey地球上の5つの国と7つのブランド
  5. 05Brands7ブランドのロゴ
  6. 06Cellarセラーから取り出した8本のボトル
  7. 07Lineup25種類のリストと種類のフィルタ
  8. 08Pairing食べ物を選ぶと合うワイン
  9. 09Gift1本入・2本入・ゴルフセット・企業ギフト
  10. 10Partnersホテル・レストラン、流通、イベント
  11. 11Moments同じ瞬間とプレス
  12. 12Contact配達とギフトのお問い合わせ
07 / COLORカラーチャート

ガラスの中央と
最も近いの間

最初の画面の写真から、ガラスの中央から端まで同じ間隔で20点の色を選びました。ワインが深い中は黒に近いルビーで、薄くなるほど赤い帯を通って紫に薄くなります。 A案はこの帯の中央側から、B案はエッジ側から画面の色を選びました。

EASYWINEロゴシンボル:E文字の後ろにラベンダー、蘭、紫の半透明の図形の3つが重なっています。
  • Eの後ろの大きな図形
  • 右図形
  • EASY WINEが書かれた下図形
今ロゴの3つの見方 Bの中では、ロゴをそのまま書いて、ラベンダーを少し明らかにした#BBA4F5をボタンと強調色で書きました。 A案は提案のロゴ席に文字ワードマークEASYWINEを置き、紫の代わりにグラスの中のルビーをブランド色にした。

ルビーの材料と
紫の材料

A案は午後日光のかかるクリーム色の食卓を思い出しました。オックスブラッドベルベットとルビー色のワイン、トラバーチン、チェリーとコルクを上げました。

B案はろうそく1つだけつけた夕食の食卓を思い出しました。色とりどりのリネンの上にブドウとラベンダーシルク、紫色のガラス、紫色のワインマークが残った紙を置きました。真ん中の線を左右にドラッグすると、両方の材料に耐えることができます。

AアンRuby in Motionの材料ボード:クリーム色の紙の上のオックスブラッドベルベット、ルビー色のワイングラス、トラバーチン、チェリー、コルク、バーガンディリボン、乾燥バラ
B眼Easy Pourのマテリアルボード:色とりどりのリネンの上のブドウ、ラベンダーシルク、紫色のガラス、紫色のワインマークが残った紙、ラベンダーの花輪

A · Ruby in Motion

カップの中央
  • 暗いシーンの背景・24%最初の画面と産地シーンの背景です。黒の代わりに、瓶の中のように赤いギガを回す暗闇を書いた。

  • 明るいシーンの文字・暗い面・17%クリーム色のシーンの上に書く文字色で、暗いシーンの2番目の面です。グラスの中の最も濃い色に近い。

  • ハイライト・1%未満イタリック英文とフィルターボタン、進行バーの色です。画面の1%にもなりませんが、目は最初にこの色になります。

  • 光・1%未満グラスを包むワインの明るい部分と同じ色です。

  • 最後のシーン・15%お問い合わせシーン「Shall we open a bottle?」の元です。

  • 明るいシーンの背景・43%ストーリーとコレクション、ギフトシーンの背景です。白いテーブルクロスの色を思い出しました。

B · Easy Pour

グラスの端
  • 最も深い背景・12%最初の画面やお問い合わせのシーンのように、最も暗くなければならない場所の色です。紫色の回る夜です。

  • シーンベース・42%ほとんどのシーンがこの色の上に置かれます。最初の画面のフィルムがページ全体につながるように、Nightより1つのステップだけを明らかにしました。

  • カード・綿・30%カードと入力ウィンドウ、メニューの背景です。

  • ワイン・13%セラーシーンの底とフッター文字に冷やすワインの色です。

  • ハイライト・1%未満ボタンとハイライトの色。ロゴのラベンダーを少し明かし、暗い背景で読めるようにしました。

  • 文字・1%未満本文の色です。白に紫を一滴混ぜました。

色見本を押すと、HEX値がコピーされます。見本の中の数字はその上に上がる文字色との明度対比であり、比率は両提案の場面キャプチャで各色に近い画素を数えた値です。

08 / TYPOGRAPHY書体

2つの提案が選ばれた
同じセリフ

どちらの提案も別々に作成しましたが、どちらも英語のタイトルにCormorantファミリーを選びました。ワインラベルによく使われる古典的なセリフの結びを画面に移した選択です。

A案はCormorantの細いストロークとイタリックを大きく育てた文章をポスターのように見せ、ハングルはすべてPretendardで書いた。 B案はハングルのタイトルにNoto Serif KRを書いて、英文とハングルが同じセリフの結で読まれるようにしました。

Cormorant 400 · Aの最初の画面 A little wine,

A little wine,
a lot of life.

セラーから取り出した8本のボトル

Noto Serif JP 600 · Bアンセラーシーン ハングルタイトル
Pretendard · Aの韓国語 500 / 1.65

ワインを難しくないように、日常をもう少し特別に。

Find your kind of wine.

Noto Serif JP・B案宣言文600

経験は‘羊’ではなく
‘質’です。

今日のメニューに合ったワインを探す

Cormorant Garamond · Bのワイン名 Italic 400

Callaway Zinfandel

色
濃い赤
香り
ブラックベリー、ブラックチェリー、ほのかなチョコレート
味
繊細なタンニンとエキゾチックな風味
09 / MOTIONモーション原則

フォロー、停止、
ゆっくりと移動

Aの中の動きは残りのワインがゆっくり回る速度を、Bの中の動きはボトルからワインに続く速度に従います。どちらもスクロールが動きを引き起こし、オペレーティングシステムでモーションを減らすと、ビデオと固定シーンを停止し、最後の画面のみを表示します。下の4枚のカードは実際にスクロールに沿って移動します。

A中初画面映像のフレーム:ルビー色ワインがクリスタルグラスを包みながら流れる
01 · SCROLL TO UNCORK · A

停止して巻き戻すビデオ

A内の最初の画面の6秒映像は自分で再生されますが、スクロールを開始すると停止し、スクロール方向に前後に移動します。このカードを通る間、その映像のフレーム48枚が同じように進みます。

Bの最初の画面のフレーム:ボトルからグラスで赤ワインに続くシーン
02 · POUR · B

スクロールに続くワイン

B内の最初の画面は、ボトルからグラスにワインを注ぐフレーム151枚をスクロール位置に合わせて描きます。ワインが冷えている間、Understand、Approach、Drinkが順番に変わります。このカードではそのうち60枚を超えていきます。

03 · FILL THE WORD · B

文字に冷たいワイン

Bの最後のシーンでは、EASY WINEの文字の中にワインが波打つ。このカードの文字も通り過ぎる間、同じように記入されます。

04 · ONE BY ONE · A

一本ずつ渡すコレクション

Aのコレクションは、垂直スクロールを水平移動に変えて6本のボトルを順番に示しています。カードごとにボトルの後ろに行く楕円を置き、レッド・ホワイト・スパークリングボタンですぐに掛けることができます。

A案案・ガラスの中

Ruby in MotionA little wine, a lot of life.

ワイングラスを包みながら流れるルビー色のワインで始まる方向です。最初の画面の6秒映像は自分で再生されますが、スクロールを開始すると停止し、スクロールに沿って前後に移動します。暗いルビーシーンとクリーム色のシーンを交互に置き、ボトルの中の闇と白いテーブルクロスを行き来するリズムを作りました。

  • グラスを包むルビー色映像と「A little wine, a lot of life.」
  • 赤・白・スパークリングでろ過する水平コレクションとワイン詳細ウィンドウ
  • 5つの国のうちの1つを選ぶと帰る地球
  • ギフトカウンセリングとお問い合わせをメールアプリに直接接続するお問い合わせウィンドウ
Cormorant · Pretendard
DIRECTION NOTES

提案Aのシーンの中で演出にボールを入れた瞬間を選びました。写真をタップすると、シーン別画面を大きく見ることができます。

  1. A little wine, a lot of life.

    ルビー色のワインがクリスタルのグラスを包み、左の闇に最初の文章を大きく書いた。

  2. Just one sip.

    スクロールを下げると映像が止まり、最初の文が退いた席に「Just one sip。 A whole new world.」が真ん中に浮かび上がります。

  3. 一杯のより広い世界

    クリーム色のシーンに進み、2012、5 countries、7 brandsを数字で表示します。

  4. Find your kind of wine.

    ワイン6本を水平に渡すコレクションです。カードごとに国と種類を書きました。

  5. 1本ずつ渡すカード

    垂直スクロールが水平移動に変わり、下のバーが今何番目のボトルかを知らせます。

  6. From a place. With a story.

    五つの国を選ぶリストの下にできたぶどう畑が広く広がり、「一本を開けると、その地の物語も一緒に開きます」が置かれます。

  7. Good wine. Better together.

    ろうそくの下に2杯の夕食のテーブルでワインがある瞬間を示しています。

  8. Some gifts say more.

    バーガンディギフトボックスの隣にギフトカウンセリングと企業ギフトカウンセリングを並べました。

RUBY IN MOTIONカップの中央を空に

EASY POUR一番上の紫をたどる

B案案・グラスの端

Easy PourEasy to Understand · Approach · Drink

ボトルからグラスへのワインに続くシーンから始まる方向です。スクロールするだけでワインがグラスに冷やし、これまでUnderstand、Approach、Drinkの3単語が順番に変わります。ロゴのラベンダーをハイライトして、会社の話やブランド、ワイン、プレゼント、配達案内を1ページに順番に盛り込みました。

  • スクロールでワインに従う最初の画面と3つの簡単
  • 地球上の5つの国と7つのブランドを結ぶ旅
  • ボトルが変わるたびに床のワイン色が変わるセラーの8本ボトル
  • 食べ物を選ぶと合うワインを教えてくれるペアリング
Cormorant Garamond · Noto Serif KR · Pretendard
DIRECTION NOTES

B案のシーンの中で演出にボールを入れた瞬間を選びました。写真をタップすると、シーン別画面を大きく見ることができます。

  1. Easy to Understand

    暗いバーの上にボトルが傾き、グラスにワインが落ち始めます。最初の単語はUnderstandです。

  2. Easy to Drink

    ワインがグラスでいっぱいになると、単語がDrinkに変わり、次のシーンでワインが画面を覆い渡ります。

  3. 経験は「羊」ではなく「質」です

    今会社紹介の最初の文章をそのまま持ってきて一画面に大きく立てました。

  4. 五国のぶどう畑で

    地球が回り、山地からソウルまで道を進み、右側のカードにブランドストーリーを浮かべます。

  5. セラーから取り出した8本のボトル

    ボトルが変わるたびに、床のワインの色と後ろの大きな文字が一緒に変わります。

  6. 今日のメニューに合ったワインを探す

    食べ物8つのうちの1つを選ぶと、合う病気と理由がすぐに変わります。

  7. 心を伝えやすいワイン

    1本入と2本入、ゴルフワインセット、企業カスタムプレゼントを一場面に集めました。

  8. 一緒に働く方法

    ホテル・レストラン、流通、イベントカードが順番に重なります。

10 / PROCESS静止シーンからフィルムまで

一枚のシーンから
スクロールフィルムまで

A案初画面の映像は、ルビー色のワインがグラスを包む静止シーン一枚から出発しました。ブラウザのWebGLでカメラをゆっくり動かし、ワインの屈折と光を流すようにしたフレーム144枚を計算した後、6秒映像で結びました。左は最初のシーンで、右はそのシーンが動き始めた姿です。

動き始めたシーン:6秒映像後半の1フレーム
最初のシーン:ルビーライトワインがクリスタルグラスを包む静止画
  • A中山地シーン画像
    山地夕暮れ時の丘に沿って続くブドウ畑。 「From a place. With a story.」 シーンの背景です。
  • Aの夕食のダイニングテーブルのシーン画像
    夕食用ダイニングテーブルキャンドルの下に2杯のぶら下がっているダイニングテーブル。顔なしで手だけを見せました。
  • Aのギフトボックスシーン画像
    ギフトボックスバーガンディボックスとシャンパンリボン。ラベルが目に見えないように病気になった。

シーン二十果実
フィルム2編

Bの中には、食べ物8枚と産地6枚、プレゼントと業場シーンを合わせて20枚のシーンイメージが入ります。最初の画面と産地の旅には、最初のシーンを先に描いた後、10秒の映像につながり、画面の割合(16:9、4:3、9:16)ごとにフレームを別々に引いてスクロールに合わせて描きました。

Bの最初のシーンの最初の写真:暗いバーの上の空のワイングラスと傾いたボトル
01最初のシーン
02ワインに続くフィルム
03フレーム151枚×アスペクト比3つ

8 DISHES · 8 BOTTLES

  • B眼ペアリングシーン:ステーキステーキカバロロッコ
  • B眼ペアリングシーン:牡蠣・シーフード牡蠣・シーフードグランベ1531
  • B眼ペアリングシーン:サーモン会サーモン会バルディビエソ・シャルドネ
  • B眼ペアリングシーン:パスタ・ピザパスタ・ピザミッションサードカベルネシラ
  • B眼ペアリングシーン:チーズチーズキャロウェイジンパンデル
  • B眼ペアリングシーン:バーベキュー・焼きバーベキュー・焼きバルタサル・ガルナチャー・ヒーロー
  • B内ペアリングシーン:フルーツサラダフルーツサラダピンクエレファントスパークリングロゼ
  • B眼ペアリングシーン:ケーキケーキバルディビエソスパークリングモスカト
B・イージーポール・16:9・産地旅

ぶどう畑の上にカメラが浮かぶフィルムです。提案では、このフィルムをスクロールに合わせて渡し、地球につながる「五国のぶどう畑で」シーンを開きます。

A · Ruby in Motion · 16:9 · WebGL

静止シーン一枚にカメラの動きとワインの屈折、流れる光を加えた映像です。

11 / MOBILEモバイル

携帯電話でも
一本ずつゆっくり

プレゼントするワインや店舗情報は携帯電話で探すことが多いです。 A案は、モバイルで水平コレクションを指でめくるリストと矢印ボタンに置​​き換えました。 B案は、最初の画面の続くシーンを縦画面専用フレームとして別々にしました。

A案・ファーストスクリーンモバイル画面
A・第一画面
B案・ファーストスクリーンモバイル画面
B・第一画面
A案・コレクションモバイル画面
A・コレクション
B案・産地旅行モバイル画面
B・産地旅行
A案・産地モバイル画面
A・産地
B案・セラーモバイル画面
B・セラー
A案・ギフトモバイル画面
A・ギフト
B案・ペアリングモバイル画面
B・ペアリング
COMPARE2つの方向はどう違いますか?

同じガラスの
中央と端

両提案は同じワイン25種と同じ会社の話を盛り込んでいますが、最初の画面で先に渡す言葉が異なります。 A案はルビー光映像と短い銅線で雰囲気を素早く伝え、B案はワインに続くシーンから始め、セラーとペアリング、配達案内まで選ぶ道を広く広げます。 EASYWINEが最初の画面で一番最初に伝えたいシーンに合わせて選べるように違いをまとめました。

区分A · Ruby in MotionB · Easy Pour
初画面のルビー色ワインがグラスを包む6秒映像、スクロールすると止まり、前後に動きボトルからグラスでワインに従うフレーム151枚、スクロールで冷やす
カラーナイトルビー・クリーム・ワインレッド(グラスの中)紫色の夜・ラベンダー・ワイン(グラスの端)
書体Cormorant · PretendardCormorant Garamond · Noto Serif JP · Pretendard
ロゴスポット文字ワードマークEASYWINE今の紫のロゴ
ワインを選ぶ方法水平コレクションと種類 フィルター、ワイン詳細ウィンドウ セラーの8本、25種リストとフィルター、食品別ペアリング
産地地区と5つの国のリスト 地球上の旅程と7ブランドのロゴ
ギフト・納品ギフト相談とお問い合わせ窓 ギフトセット、業場・流通・イベント案内、お問い合わせフォーム
重い場所 雰囲気と短い動線 情報量と均等な楽しみ
12 / CREDITSBLUECANVAS · WORKS 2026

BACK LABEL・ハングル表示事項

真ん中のルビー、一番の座の紫

EASYWINEWebサイトリニューアル提案・Ruby in Motion・Easy Pour

製品名
EASYWINEWebサイトリニューアル提案
顧客
EASYWINE(株) EASYWINE
タイプ
メイン提案2種・モバイル画面・スクロールフィルム
ヴィンテージ
2026年10月
リサーチ
ワイン25種・七ブランド・五国、2015~2016年原稿
ブランドの解釈
紫のロゴとグラスの端、「羊」ではなく「質」
構造
訪問者5種類、25本を分ける4つの基準
A · Ruby in Motion
UIデザイン、6秒WebGL映像、水平コレクション
B · Easy Pour
UIデザイン、フォロースクロールフィルム、セラー・ペアリング
書体
Cormorant · Cormorant Garamond · Noto Serif KR · Pretendard
推奨画面
PC・タブレット・モバイル
原産地・製作
韓国ソウル・BlueCanvas
YOUR NEXT GLASS

難しく感じる商品を
簡単に均等にしたいなら

見知らぬ名前と多くの選択肢をどのような順番で見せるかからまとめます。

その他のプロジェクト

    Contact

    まだ漠然としたアイデアでも構いません。
    プロジェクトを一緒に 整理しましょう

    現在の状況と目標をお聞かせください。 実現可能な範囲、進め方、概算費用をご案内します。

    質問4つ・約2分

    ご依頼内容

    どのような作業をご一緒しましょうか。

    複数選べます。まだ決まっていない場合は「その他」を選んでください。

    ご予算

    お考えのご予算はどのくらいですか。

    おおよその範囲でも、ご提案づくりに大いに役立ちます。

    プロジェクト説明

    今の状況をお聞かせください。

    整っていなくても大丈夫です。下の項目を押すと入力の枠が入ります。

    0

    RFPや参考資料を2点までアップロードできます。対応形式:PDF、PPT、Word、Excel、JPG、PNG、ZIP

    ご連絡先

    どちらへご返信しましょうか。

    作業範囲・予算・プロジェクト内容・連絡先をご入力ください。