CafeDaily
重构原型 · v2 冲煮实验台

一杯咖啡,
是一次可复现
测量。

CafeDaily 不是一本咖啡日记,而是你手边的萃取仪表。把注水、水温、粉水比与风味变成可读的刻度—— 让好喝那一杯,下次还能倒出来。

1:15.2
粉水比 · Ratio
92.0°
水温 · Temp
1.38%
TDS · 浓度
第 3 段注水 1:42 注水 228 / 320 g

萃取色板

01 / 色彩

颜色对应萃取的真实状态,而非情绪装饰。蜂蜜琥珀是仪表读数的辉光;青草绿代表新鲜与萃取不足;砖红代表陈化与萃取过度。刻意避开了「咖啡 App」惯用的陶土色。

Ink / Dark
Espresso 浓缩
#1A120B
Paper / Light
Paper 纸
#F1EBDF
Accent / Data
Crema 蜂蜜琥珀
#D2914A
Fresh / Under
Sage 青草
#6F7D53
Stale / Over
Garnet 砖红
#9E3B2A

字体系统

02 / 字体
Display · 标题
Aa
Fraunces — 带光学与「WONK」的复古科学感衬线,仅用于少量标题与关键数字,克制出场。
SOFT 40 · WONK 1 · opsz 144
Data · 读数
0.1g
Space Mono — 所有计时、重量、比例、TDS 读数的等宽声音,给整个产品一种仪表口吻。
tabular-nums · 92.0° · 1:15
Body · 正文
手冲
系统中文栈(PingFang / Noto Sans SC)承载界面正文,保证中文可读性与本地质感。
记录每一杯咖啡的风味与参数

界面流程

03 / 界面

五个核心界面——冲煮、豆仓、方案、记录、登录——统一在同一套刻度语言下。切换顶部主题可预览明暗两态。

设计原则

04 / 原则
P—01

读数优先

时间、重量、温度、比例是主角。等宽数字放大、对齐、可扫读;文字退居其后。界面像仪表盘,不像日记本。

P—02

颜色即状态

青草→琥珀→砖红是一条萃取轴:新鲜、正当赏味、陈化。同一套颜色贯穿豆仓赏味期、风味强弱与计时分段。

P—03

克制的暖调

暖色只在一处发力——刻度盘的琥珀辉光。其余留白、纸质底纹与细线保持安静,让仪器感而非咖啡馆感主导。

P—04

顺序有意义

编号只用在真正的序列上:注水分段、冲煮步骤。它承载「先后」这一信息,而不是装饰性的 01 / 02 / 03。

这是原型,不是上线版本。 此页用于评审重构方向——色彩、字体、刻度语言与界面骨架。确认方向后,再落到 Next.js 生产代码中,且不改动任何业务逻辑。