DESIGN NOTES
冒頭に企業の考え方を置き、その周囲からニュース、商品、レシピ、FAQ、環境関連の情報へ展開する。通販の商品一覧より、ブランドを理解するメディアに近い情報順だ。商品だけでなく活動も同じ画面へ載せ、カテゴリーのラベルで情報の種類を区別している。
薄い方眼の外側と黒い罫線、少し不揃いな文字の表情が、紙の掲示物のような雰囲気を作る。カードは一律の高さではなく、縦長の映像と横長の画像が混在する。整った外枠の中でサイズを変えるため、自由さがありながら各項目の境界は追いやすい。
見えたカードには商品だけでなく、工場のような場面、企画の画像、人物が含まれている。商品写真を繰り返す代わりに、活動と情報の種類ごとに素材を変える構成と読める。個々のカードには見出しとカテゴリが付き、画像だけで内容を推測する負担を減らしている。
上部で商品・読み物・ニュース・環境・健康の入口を分け、各カードを個別の情報への入口にする。下部には追加表示の操作もある。購入を一つのボタンへ集約するページではなく、関心を持ったテーマから探索させる設計。Cookie案内は拒否して本文を確認した。
食品や生活用品のブランドが商品以外の活動も継続して発信する場合に向く。商品、使い方、取り組み、質問を同じカード規則で扱えば、小さな記事から更新できる。一方、来店や購入が最優先の事業では、探索する楽しさとは別に商品・店舗の近道を用意したい。
APPLY TO YOUR PROJECT
商品だけでなく、使い方や活動も一つのカード体系へ載せる。カードの大小で注目度を変えつつ、カテゴリラベルを揃えて情報の種類を区別する。
編集型のトップページは記事の鮮度と本数が必要になる。環境・健康の主張を雰囲気で借用せず、各記事の根拠を示し、商品を探す人の経路を埋もれさせない。
海外食品・生活用品 / エディトリアル
情報の順序
食品・生活用品 / エディトリアル
木の棚に並ぶ調味料から商品一覧、製法の背景、料理例へ進み、専門的な味を家庭で使う理由まで説明するEC。
キャンペーンの大きな写真の下に商品一覧を置き、続いてブランドの成り立ちや自然・製法の説明、レシピ、ニュース、ギフト商品、FAQへ進む。専門的な背景を読む前にも商品を選べる一方、用途が分からない人には後半で料理例を渡す二段構えになっている。
詳しい解説を読む →公式サイトを見る ↗
海外食品・生活用品 / エディトリアル
情報の順序
食品・生活用品 / エディトリアル
食卓の静物写真と季節ごとの商品編集を軸に、調味料を自宅用から贈答用まで選び分けられるEC。
ヒーローの季節提案から媒体名の帯、季節の商品一覧へ進み、その後に限定商品、カテゴリ、セット作成、創業者の背景を配置している。全商品を最初から均等に並べず、いま選ぶ理由を一つ作ってから全体へ広げる編集型の売場と読むことができる。
詳しい解説を読む →公式サイトを見る ↗
海外情報の順序
食品・生活用品 / ポップ
淡い黄色のUIと学校生活を思わせる商品映像を合わせ、味の説明より先にブランドの気分を伝えるスナックサイト。
上部の販売店案内に続き、季節企画の商品映像、全商品への入口、映像コンテンツ、メール登録が並ぶ。商品の機能を長文で積み上げるより、ブランドと接触する場面を先に作る構成。販売店を探す入口もあり、サイト内購入だけに行き先を限定していない。
詳しい解説を読む →公式サイトを見る ↗