コーヒーに関わる時間ごと、 デザインする
日常のひとときを少し特別な時間に変える「パス」をコンセプトに、スペシャルティコーヒーのD2Cオンラインストアを運営。商品企画からデザイン制作、パッケージのシルクスクリーン印刷まで手がけています。Shopifyで構築し、ECやブランドづくりの実験の場として位置づけています。
Visit Website →Tech Stack
Background
PASS COFFEEは「日常の中にあるひとときを少し特別な時間に変えるパス」がコンセプト。Chill・Relax・Focusという3つのモードで、コーヒーを通じた日常の切り替えを提案しています。
焙煎からパッケージまで一貫して手がけるD2Cブランドとして、EC構築・ブランディング・コンテンツ制作を実験的に運営。クライアントワークに活きる知見を蓄積する場でもあります。
Solution 01
Solution 02
Shopify標準のコレクションフィルター（?filter.v.option.color=red 形式）はクエリ文字列に依存しており、Googleにインデックスされにくい。絞り込んだページが検索に乗りにくい課題があります。
PASS COFFEEではカスタムのコレクションナビゲーションを構築し、フィルター条件ごとにクロール可能なURLパスを持たせつつ、UIとしてはページの読み込み/遷移が発生しないフィルター体験を維持。SEO流入とユーザビリティを両立させました。詳しい設計意図はブログ「Shopifyコレクションフィルター/ナビゲーションでSEOとUIを両立する」で解説しています。
Solution 03
テイスティングチャートは酸味・甘み・香りの3種類に絞り、ライト層でも直感的に「自分に合うコーヒー」を選べるUIを設計。あえて種類を増やさず、分かりやすさを優先しました。
同じ産地でも精製方法・焙煎度で商品パターンが複数あるため、豆の特徴はメタオブジェクトで構造化管理。商品メタフィールドから参照することで、同じ豆情報を複数商品で再利用しています。
メタフィールドを使った「豆が選べる飲み比べセット」では、候補リストからお客さんが好きな組み合わせを選んで1商品として購入できる仕組みを実装。バリアント単位のGoogle Merchant Centerメタフィールドで検索流入も強化しています。
Solution 04
Impact
PASS COFFEEはBowortieにとって、Shopifyの構築・運用・マーケティングを実践で学ぶ場でもあります。制作だけでは見えない商品企画から撮影、コンテンツ制作、広告運用まで回すことで「つくったあとの話」ができる。この経験が、クライアントのEC支援にそのまま活きています。
Related Articles
ShopifyのストアとJevのあいだに、何を置いて何を決めたか。PASS COFFEEのコーヒー診断で、商品説明を材料に一杯を選んでもらうようにした経験から書きます。
Read →おすすめ診断のような仕掛けは、置く場所で役割が変わります。外に置けば単体で配れて、中に作ればカートにつながる。拡散する入口を手放して、買うところまでつながるほうを取りました。
Read →設計を固めて作っても、運用に入れば変更と見落としが必ず出ます。それを誰がどう拾うか。納品が終点の仕事と、納品が起点の仕事を分けているのは、そこでした。
Read →Webやデジタルまわりの課題整理から制作・運用まで対応しています。お見積もりもお気軽にご相談ください