NOMU BREWERY

外部ページURL

線画の沖縄地図の上を商品が流れる
コザ発クラフト酒の通販サイト

NOMU BREWERYは、沖縄市のコザを拠点にクラフト酒を造る醸造所の公式オンラインストアです。線画で描いた沖縄の地図の上を商品が流れていくファーストビューや、白と黒を土台に水色の模様を添えた配色によって、土地の空気とお酒の個性を一度に伝えるデザインに仕上がっています。

本記事では、トップページの画面をもとに、ファーストビューの構成や色使い、写真の見せ方、シリーズごとに商品を探せる導線などを順に分析します。飲料や食品を扱うECサイトを企画している方はもちろん、沖縄の地酒や日本酒を通販で探している方にとっても、サイトの見どころをつかむ手がかりになるはずです。

NOMU BREWERYの成り立ちとトップページの全体像

まずは、サイトの背景にある醸造所の成り立ちと、トップページがどのようなブロックで組み立てられているかを整理します。サイト内ではNOMU BREWERYのほかに、NOMU醸造所という日本語の名前も使われています。

沖縄市コザを拠点にクラフト酒を造る小さな醸造所

サイト内の紹介ページによると、NOMU醸造所の出発点は、沖縄本島から日本酒の蔵が姿を消したことにあります。新たに日本酒の製造免許を得るのは難しく、そこで選んだのが沖縄の米や果物を生かしたクラフト酒という道だったと説明されています。

拠点としているのは、基地とともに歩み、多様な文化が混ざり合ってきた沖縄市のコザです。原料の米や果物にはなるべく沖縄で育ったものを使う方針で、沖縄から世界へ新しい酒文化を広げることを目標に掲げています。

特定商取引法に基づく表記では、販売業者として那覇市久米に所在する株式会社TABELUが記載されており、代表取締役は玉城 幸太様です。紹介ページでは玉城 幸太様が醸造所の代表として登場し、製造責任者や蔵人といったつくり手の方々とともに酒造りへの思いを語っています。

物語から商品へと進むトップページの構成

トップページには、ヘッダーとファーストビューに続いて、醸造所の思いを伝える紹介ブロック、シリーズを並べたLINE UP、商品カードを並べたPICK UP、ニュースレターの登録欄、写真を敷いたフッターといったブロックが縦に積み重なっています。前半で土地や酒造りの背景を伝え、下へ進むほど具体的な商品へ近づく流れになっている点が特徴です。

プライバシーポリシーにはShopifyを利用してストアを運営していることが明記されており、ヘッダーの右端には検索、アカウント、カートといったオンラインストアに欠かせない機能がまとまっています。独自のイラストや写真で個性を出しながら、買い物の操作は一般的なストアと同じ感覚で進められる作りです。

ファーストビューは地図と商品で沖縄のお酒を印象づける

ファーストビューは、このサイトの世界観がもっとも凝縮された場所です。地図のイラスト、流れていく商品写真、二つのコピーが一枚の画面に重なり、どこで造られたどんなお酒なのかを一目で伝えています。

線画の沖縄地図に地名とモチーフを描き込む

画面の中央から右寄りには、沖縄本島の輪郭を黒い線でかたどり、内側を細かなドットで埋めた地図のイラストが大きく置かれています。地図の周りにはシーサーやヤシの木、城の建物、鳥などが同じ線画のタッチで描かれ、写真だけでは出しにくい親しみやすさを加えています。

地名はYambaru national parkやNAGO cityのように英字で添えられ、そのなかでKOZAの文字だけが太く大きく組まれています。醸造所の拠点を地図上でひと目で示すと同時に、海外の人にも読める表記にしている点が、世界へ届けたいというブランドの方向性と重なります。

ボトルやパウチの商品写真が地図の上を横へ流れる

地図の手前には、ボトルやパウチに入った商品の写真が一列に並び、時間とともに横方向へゆっくり流れていきます。止まった一枚絵ではなく商品が次々に入れ替わって見えるため、画面を眺めているだけで取り扱うお酒の幅広さが自然と伝わります。

商品の背後には水色のかすれた模様が敷かれ、白っぽいボトルが白い背景に埋もれないよう輪郭を支えています。緑の瓶や色とりどりのラベルが黒い線の地図と重なることで、モノクロのイラストに動きと彩りが加わっています。

横組みの見出しと縦書きのコピーで視線を運ぶ

左上には、コザを起点に新たなお酒の文化を広げていくという宣言が、太いゴシック体で二行に分けて置かれています。その下には英文の添え書きが続き、日本語と英語の両方でブランドの立ち位置を示しています。

右側には大きなロゴを掲げ、その下に沖縄初となるクラフト酒の醸造所であることを縦書きで示すコピーを組んでいます。横組みの見出しと縦組みのコピーを左右に振り分けたことで、視線が左上の見出しから地図を通って右側のロゴへと抜ける流れが生まれています。

白と黒の土台に水色を差した配色とトーン&マナー

配色は白と黒を基本に、水色と商品ラベルの色をアクセントとして使う構成です。使う色を絞りつつ要所に差し色を置くことで、落ち着いた印象と親しみやすさを両立させています。

黒いロゴと白い背景がつくる引き締まった印象

ヘッダーの左端には、白い文字でnomuと描いた黒い正方形のロゴが置かれ、ページの最上部で強い存在感を放っています。背景は全体を通して白が中心で、ボタンも両端を丸くした黒い形にそろえているため、画面全体が引き締まって見えます。

見出しや本文の文字も黒や濃いグレーが中心で、文字そのものに鮮やかな色はほとんど使われていません。色の役割を写真やイラストに任せているので、情報を読む部分と雰囲気を伝える部分の区別がはっきりしています。

かすれた水色の模様が涼しげなリズムを生む

ファーストビューや紹介ブロックには、クレヨンでなぞったような質感を持つ水色の模様が繰り返し登場します。波や雲を思わせる丸みのある形が写真やイラストの縁に重なり、白い余白に涼しげなリズムを生み出しています。

水色は沖縄の海や空を連想させる色でありながら、ここでは面積を抑えた装飾として使われています。南国らしさを前面に押し出しすぎず、さりげなく土地の空気を伝えるバランスに仕上がっています。

商品ラベルの色がそのまま差し色になる

LINE UPやPICK UPでは、商品写真の背景を明るいグレーでそろえています。そのため、紫や赤、緑、パステル調のラベルといった商品自体の色が際立ち、ページを彩る差し色の役割を果たしています。

一部の商品カードには「店舗限定」と書かれた赤いラベルが重なり、白とグレーが中心の一覧の中で自然と目に留まります。色数を抑えた土台があるからこそ、小さな赤いラベルでも十分に目立つ設計になっています。

写真の切り抜き方と重ね方で温かみを伝える

写真は四角く並べるだけでなく、切り抜く形や重ね方に工夫が見られます。醸造所の風景や人の姿を柔らかな形で見せることで、商品を買う場所でありながら、つくり手の体温を感じさせる画面になっています。

不定形に切り抜いた写真でやわらかさを出す

ファーストビューの下に続く紹介ブロックでは、田んぼと緑の丘、海を眺める二人の後ろ姿、銀色のタンクが並ぶ醸造の現場といった写真が、角のない不定形の輪郭で切り抜かれています。写真の縁には水色の模様が重なり、文章の左右を囲むように配置されています。

大見出しでは、島で育った米がいつか海を越えて世界中へ届く日を思い描く気持ちが大きな文字で表現され、その下に沖縄の言葉のあいさつから始まる短い文章が続きます。文章では、醸造所の名前が「飲む」という言葉に由来し、日々の暮らしに少しでも彩りを添えたいという思いが込められていると紹介されています。

PICK UPの商品写真も同じ考え方で、ボトルやパウチを一枚ずつ形の異なる丸みのある輪郭で切り抜いています。整然と並んだグリッドの中に有機的な形が混ざることで、商品一覧にありがちな硬さがやわらいでいます。

フッターの集合写真で人の存在を感じさせる

ページの最後には、タンクが見えるガラス張りの建物を背に、ロゴ入りの黒いTシャツを着た人たちが商品を手に並ぶ写真が横幅いっぱいに敷かれています。写真の上端は白い背景からなめらかにつながり、中央には半透明の大きなロゴが重ねられています。

写真の下部は暗いトーンに沈み、その上に各種ポリシーへのリンクが小さな明るい文字で並びます。買い物の締めくくりに人の姿が見えることで、ブランドの背後にいる人の存在が記憶に残る構成になっています。

日本語と英字を使い分けた文字の設計

文字の扱いでは、日本語の見出しで思いを伝え、英字でサイトの骨格を示すという使い分けが見られます。二つの言語を役割ごとに整理しているため、イラストや写真の情報量が多くても読みにくさを感じにくい構成です。

思いを伝える見出しは太いゴシック体で力強く

ファーストビューの見出しや紹介ブロックの大見出しには、線の太いゴシック体が使われています。かすれた模様や柔らかく切り抜いた写真の中に太い文字を置くことで、メッセージがぼやけずに届く組み合わせになっています。

ファーストビュー右側のコピーは縦書きで組まれ、酒瓶のラベルを思わせる和の雰囲気を添えています。幾何学的な形の英字ロゴと縦書きの日本語が並ぶことで、昔ながらの酒造りと新しいスタイルの両方を感じさせる表情が生まれています。

英字のセクション名とナビでページの骨格をそろえる

グローバルナビの項目や、LINE UP、PICK UP、News letterといったセクション名は英字で統一されています。LINE UPとPICK UPは太字の大文字で左端にそろえ、News letterは中央に大きく置くなど、ブロックの性格に合わせて見出しの配置を変えています。

ナビの項目もHow about NOMUやCRAFT SAKEといった英語表記で、ロゴに添えられたSAKE BREWERYの文字と調子がそろっています。紹介ページで海外の方にも届けたいと語られている方針が、文字の選び方にも表れています。

目的の商品へ迷わずたどり着ける情報設計と導線

ECサイトとして見ると、NOMU BREWERYのトップページは入口の数を絞りながら、同じ目的地へ複数の経路を用意している点が特徴です。ここではナビゲーション、シリーズの一覧、商品カード、ページ下部の要素に分けて導線を確認します。

項目を絞ったグローバルナビとCRAFT SAKEのドロップダウン

ヘッダーのナビは、How about NOMU、CRAFT SAKE、ALL ITEMS、How to order?の四項目に絞られています。右端には検索、アカウント、カートのアイコンが細い線で描かれて並び、買い物に必要な操作をすぐに見つけられます。

CRAFT SAKEの横には小さな矢印が付いており、選ぶとShishi Kamu、甘酒 OFFZAKE、NOMU、TABERUの四つのシリーズ名が縦に並ぶメニューが開きます。開いている間は項目名に赤い下線が引かれるため、どのメニューを操作しているのかが分かりやすくなっています。

LINE UPのバナーをシリーズ別の入口にする

LINE UPでは、横長のバナーが二列二段に並びます。どのバナーも、左側にシリーズのロゴを載せたイメージ写真、右側に明るいグレーの背景で撮ったボトル写真を組み合わせた同じ構成で統一されています。

TABERUには稲穂、NOMUには青々とした柑橘と葉、Shishi Kamuには暗い背景で赤身をのせた握り、OFFZAKEには鍋の中の白い液体を木べらですくう様子と、シリーズごとに写真の題材が変えられています。各バナーはそれぞれのシリーズの商品一覧へつながっており、写真で味の方向性を想像してから商品を選べる導線です。

バナーの下には黒いALL ITEMSボタンが中央に置かれ、シリーズを決めていない人も全商品の一覧へ進めます。シリーズで絞り込む入口と全体を見渡す入口が同じ場所にそろっている点が、使いやすさにつながっています。

PICK UPの商品カードで具体的な商品を見せる

PICK UPでは、商品カードが横に五つずつ、二段にわたって並びます。写真の下に商品名を置いたシンプルなカードで、クラフト酒のボトルや甘酒のパウチに加え、ロゴ入りのオリジナルTシャツも同じ形式で紹介されています。

商品名にはシークヮーサーやアセロラ、パイナップルといった味の名前が英語表記とともに添えられ、同じシリーズの中でも違いを見分けやすくなっています。一覧の下にはすべてを表示するボタンが置かれ、LINE UPと同じ黒いボタンの形で統一されています。

ニュースレターの登録欄とフッターのリンクで締めくくる

PICK UPの先には、News letterという見出しと短い案内文、メールアドレスの入力欄が中央にまとめて置かれています。入力欄の右端には矢印のアイコンだけを配置し、送信ボタンの文言を省いたすっきりとした見た目にしています。

新しい商品の情報を受け取りたい人を、商品を見終えた流れのまま登録へ誘う位置取りです。その下のフッターには特定商取引法に基づく表記や各種ポリシーへのリンクがまとめられ、購入前に確かめたい情報にもたどり着けます。

バナーと商品説明から読み取れるクラフトサケの個性

LINE UPのバナーで写真の題材が変えられているのは、シリーズごとにお酒の性格がはっきり異なるためと考えられます。商品ページの説明とあわせて見ると、クラフトサケを通販で選ぶ人に向けて、味の違いを視覚的に伝えようとしている意図が読み取れます。

  • TABERU -タベル-:米の味わいを存分に楽しめるよう、あえて濾さずに仕上げた濃厚な濁り酒です。沖縄県産米と自家製造の白麹の粒を残したどぶろくで、使う米麹の違いによってホワイトとブラックの二種類が用意されています。
  • NOMU -ノム-:果物などの副原料の風味を引き立てるため、濾して澄んだ状態に仕上げたタイプです。酸味と炭酸が重なる軽快な飲み口で、日本酒でありながらカクテルのような感覚で楽しめると紹介されています。
  • Shishi Kamu -シシカム-:名前は沖縄の言葉に由来し、「シシ」が肉、「カム」が食べることを意味します。肉料理と合わせることを前提に造られたお酒で、乳酸の酸味を生かした甘酸っぱいうす濁りに、控えめなアルコール度数を組み合わせています。
  • 甘酒 OFFZAKE-オフザケ-:アセロラやシークヮーサー、パイナップルといった果物の名前が付いた商品などがそろう甘酒のシリーズです。

紹介ページでは、白麹が生むさわやかな酸味を沖縄の暑い気候になじむ持ち味として挙げており、NOMUのシークヮーサーの商品ページには原料米に西表島産のひとめぼれを使っていることも記載されています。沖縄の地酒らしさを原料から確かめたい方は、各商品ページの原材料の欄にも目を通してみてください。

沖縄のお酒を通販やお土産で選ぶときに確かめたいこと

沖縄の地酒を通販で取り寄せる場合や、沖縄のお酒をお土産や贈り物として選ぶ場合は、味の好みに加えて保存方法や購入時の条件も確認しておくと安心です。ここでは一般的な選び方の目安と、NOMU BREWERYのサイトで確かめられる情報を整理します。

澄んだタイプか濁りのあるタイプかで好みを絞る

クラフトサケは、日本酒の造り方をもとにしながら、果物などの副原料を加えたり、濾さずに仕上げたりと、自由な発想で造られるお酒を指して使われることの多い言葉です。同じ米のお酒でも、澄んだタイプと濁りのあるタイプでは口当たりが大きく変わるため、まずはどちらが好みかを考えると選びやすくなります。

保存方法と年齢確認の案内を事前に確かめる

持ち運びを伴うお土産や、離れた相手への贈り物にする場合は、保存方法の確認が欠かせません。TABERUやShishi Kamuの商品ページには要冷蔵と記載されているため、受け取ってから飲むまでの扱い方を考えたうえで選ぶと安心です。

特定商取引法に基づく表記には、20歳未満の方には酒類を販売しないことや、購入時に年齢の確認をお願いする場合があることも明記されています。贈る相手や受け取る方の状況にも配慮しながら、各商品ページの情報を確かめて選ぶことをおすすめします。

まとめ|NOMU BREWERYのサイトに学べるデザインの工夫

NOMU BREWERYのトップページは、線画の沖縄地図と横へ流れる商品写真で土地とお酒を同時に見せ、白と黒の土台に水色の模様と商品ラベルの色を差すことで、にぎやかさと落ち着きを両立させています。不定形に切り抜いた写真や集合写真が、オンラインストアでありながら人の気配を感じさせる点も印象に残ります。

導線の面では、ナビのドロップダウンとLINE UPのバナーの両方からシリーズ別の一覧へ進め、全商品を見渡すための入口も複数用意されています。地域の物語を大切にしながら商品を選びやすくしたい飲料ブランドや、食品を扱うECサイトのデザインを考えている方にとって、参考にしやすい見本といえます。

沖縄の地酒や日本酒を通販で探している方や、コザで生まれたクラフトサケの世界観に触れてみたい方は、地図の上を流れる商品やシリーズごとのバナーを実際のサイトで確かめてみてください。

沖縄のお酒をお土産に選ぶなら公式サイトで商品を見てみる

URL
https://nomu.okinawa/
業種
食品・飲料
サイトタイプ
ECサイト