Web 网站 · Case Study

GOTCHA
日本官网

GOTCHA JP WEBSITE — Franchise First

为澳洲国际茶饮品牌 GOTCHA 设计的日本市场官网,以招募加盟商为核心目标。设计方向:克制、自信、长效,传递品牌在日本市场的系统力与审美判断力,完整覆盖桌面端与平板端双端响应式设计。

类型
Web 官网
市场
日本 · 招商加盟
角色
UX/UI Design Lead
Desktop + Tablet
🔗 查看线上网站 →

Project Overview

项目背景

GOTCHA 是一个发源于澳洲、以台湾梨山高山茶为核心原料的国际精品茶饮品牌。本项目为其日本市场官网的全新设计,核心目标是吸引并筛选优质加盟商(B2B 招商),同时兼顾年轻消费者对品牌世界观的认同感。设计气质关键词:Calm / Confident / Clean / Intentional。

🎯 核心目标
吸引日本加盟商
B2B 招商转化
🌿 品牌背景
澳洲起源
台湾梨山高山茶原料
🏪 实体参考
涩谷 1 号店
已验证的日本案例
📐 响应式
1440px 桌面端
744px 平板端
01
加盟商视角优先
日本加盟商理性保守,在意品牌系统力与长期稳定性。设计信息层级以 Franchise / System 为第一优先级,产品展示为辅。
02
国际品牌身份传达
通过克制的留白、高质量摄影和标准化排版,传递「已被多市场验证的专业品牌系统」,而非普通网红奶茶。
03
审美长效性设计
避免流行化视觉,所有设计决策以「5 年后不会尴尬」为标准,确保品牌视觉体系的长期有效性。

01 · Brand Positioning

OUR DIFFERENCE — 品牌差异化

Why GOTCHA?澳洲 × 台湾 × 日本

OUR DIFFERENCE 页面是官网的战略核心,向加盟商清晰传递 GOTCHA 不同于其他奶茶品牌的三大差异化优势。

  • 澳洲发展成熟的国际品牌背景,带来安全感与信任度
  • 台湾梨山高山茶原料,品质可追溯,供应链稳定锁定
  • 设计即护城河——克制的品牌审美不容易过时、不易被模仿
  • 中高端定价模型,稳定毛利,不依赖大促,长期可经营
品牌差异化 加盟招商 信息层级
Our Difference
OUR DIFFERENCE — 桌面端完整页面

💡 设计决策

整页使用大面积留白 + 高质量实拍照片,避免过度文字堆砌。关键数据(涩谷店成立时间、原料产地)以「静但坚定」的排版呈现,让加盟商在视觉层面就感受到品牌的专业度与稳定感。

02 · Brand Story

OUR STORY — 品牌故事

品牌故事页以时间线 + 地理维度展开 GOTCHA 的发展历程:从澳洲起源,到台湾原料溯源,再到日本涩谷 1 号店的落地,构建「已经被不同市场验证过的品牌系统」的核心信任感。

Our Story Desktop
OUR STORY — 桌面端完整页面
Our Story Tablet
OUR STORY — 平板端

03 · Product

OUR DRINKS & MENU — 产品展示

产品在官网中作为「品牌结果」而非「主角」呈现。OUR DRINKS 页通过高质量饮品摄影展示出品体系,MENU 页清晰展示品类结构,让加盟商评估产品线的完整度与可复制性。

Our Drinks
OUR DRINKS — 桌面端
Drinks Tablet
OUR DRINKS — 平板端
Menu Tablet
MENU — 平板端完整页

04 · Responsive Design

响应式设计 — 平板端完整适配

所有页面均完整适配 744px 平板端布局,导航、图文排版、表单等组件在不同断点下保持品牌一致性。PRODUCT INFO 提供单品详细信息,CONTACT 页是加盟咨询的核心转化入口。

Our Difference Tablet
OUR DIFFERENCE — 平板端
Product Info
PRODUCT INFO — 平板端
Contact
CONTACT — 加盟咨询入口

💡 设计总结

GOTCHA 日本官网以「加盟商视角优先」为核心策略,通过克制的设计语言、高质感的品牌摄影和清晰的信息层级,向日本市场传递「一个成熟而可信赖的国际茶饮品牌系统」。双端响应式设计覆盖主要商务场景,确保加盟商无论在何种设备上都能获得一致的品牌体验。

Design Summary

设计总结

Franchise First 信息架构
所有页面导航与内容优先级服务于加盟商决策链路,从品牌差异 → 系统支持 → 联系咨询形成完整转化漏斗。
克制的视觉语言
避免高饱和、情绪化视觉,以大面积留白 + 精选摄影 + 标准化排版构建「审美可信赖」的品牌印象。
双端完整交付
桌面端(1440px)+ 平板端(744px)完整设计稿输出,所有页面响应式覆盖,规范完整可交付开发。