# Jade Dynasty —— 有传统，但不落俗套 > 案例研究：自发的中式茶品牌与电商概念 —— 十九个界面，建立在关于蒙版、渐变与金色的三条硬规则之上。 Source: https://ricardoportfolio.xyz/work/jade-dynasty Language: zh-Hans --- Jade Dynasty 案例研究 · 03 / 04 · 自发概念项目 概念项目 品牌 · 电商 · 视觉系统 # 有传统，但不落俗套。 一个自发项目：为虚构的中式茶铺做的品牌识别与电商概念 —— 十九个界面、一套可复用的设计系统，以及一个不靠视觉套路也显得考究的品牌。 阅读完整故事 ![The Jade Dynasty lockup](https://ricardoportfolio.xyz/projects/Jade%20dynasty/Lockup%20%E2%80%94%20Vertical.png) ![Jade Dynasty case study cover](https://ricardoportfolio.xyz/art/Home%20%E2%80%94%20Jade-Dynasty-Banner.jpg) 角色 品牌与数字 设计师 类型 自发的 概念项目 范围 品牌识别 · 19 个界面 设计系统 年份 2026 01 — 命题 ## 线上的高端茶，不是落进戏服感，就是落进千篇一律的养生风。 龙纹、笔触、玉石质感堆到品牌像在扮装；或者把文化元素全抽掉，变成又一家极简养生店。这个命题就是找出第三条路。 「先把茶当农产品，再当奢侈品 —— 海拔、采摘期、杀青锅温。」 查看案例 01 太像戏服 龙纹、笔触、玉石质感堆到最后，品牌看起来像在扮装。 02 太没身份 把中式元素全抽掉，就变成又一家极简养生店。 03 机会在哪 先把茶当农产品，再当奢侈品 —— 海拔、采摘期、杀青锅温。 04 要做出什么 一条完整的电商流程、一个撑得起专业感的内容板块，以及一套开发者能照着做的系统。 02 — 决定一切的那条规则 ## 不压蒙版。不用渐变。让材质自己说话。 三条规则里最难、也最有用的一条：没有了「把字压在图上」这个省事的工具，每一个主视觉都必须做成刻意的硬分割。 规则 01 不用蒙版压字 文字和图像永远不共用一层。硬性分割逼着每一页自己挣出版面。 规则 02 不用渐变 只用平涂色块。这套配色本身就够强，不需要靠渐变过渡。 规则 03 金色只做点缀 金色只出现在细线、分隔线或价格上。翡翠绿与炭黑撑起每一页的八成。 03 — 具体的工作 ## 十九个界面，一套标准。 一套完整的电商系统 —— 从首页到结账 —— 建立在十一个设计变量之上，规则上一步不让。 ![The Jade Dynasty homepage](https://ricardoportfolio.xyz/art/Jade-Dynasty%20%E2%80%94%20homepage.png) ![Jade Dynasty on mobile](https://ricardoportfolio.xyz/art/Jade-Dynasty%20%E2%80%94%20mobile.png) ![The Jade Dynasty design system](https://ricardoportfolio.xyz/art/Jade-Dynasty%20%E2%80%94%20system.png) ![A Jade Dynasty storefront](https://ricardoportfolio.xyz/art/Jade-Dynasty%20%E2%80%94%20storefront.png) ![Jade Dynasty packaging](https://ricardoportfolio.xyz/art/Jade-Dynasty%20%E2%80%94%20bag.png) 一个必须走出浏览器的品牌。门店、包装与界面共用同一套克制的视觉语言。 04 — 关键决定 ## 决定它形状的几个判断。 三条硬规则，从第一块画板一致贯彻到最后一块。只要破了规则，页面就会坏 —— 而且一眼就看得出来。 金色是线，不是面 金色只以细线、分隔线或价格出现。翡翠绿与炭黑大约撑起每一页的八成。 朱红每屏只用一次 只用在印章上，让它读起来像仪式性的标点，而不是警示色。 文化靠内容，不靠纹样 中英并置的产品名，以及卷轴般的竖向节奏，承载了传统 —— 而不是靠装饰纹样。 05 — 字体系统 主要标题字体 Cormorant Garamond 选它是因为它的编辑气质与文艺复兴渊源。在这个自发的概念项目里，这份考究支撑起虚构的传统定位，同时不假装这个品牌真有历史血统。 结构与系统正文 Geist Variable 干净、当代、技术上精确。这款无衬线平衡了衬线体，表明这是一套现代商业系统，而不是博物馆展品。 06 — 回顾 ## 是限制给了这个品牌性格。 三条规则从第一屏守到最后一屏，整套系统因此显得理所当然。不压蒙版，意味着每个版面都必须诚实面对图像在做什么；不用渐变，意味着每个颜色决定都在承重；金色只做点缀，意味着它每次出现都有分量。 查看全部作品 下一个案例 → 04 Kairova 一套可以「玩」的人生操作系统。