界面 01 · 全部分店总览
预约、人员、收支，以及店里哪些地方在造成损失——一个界面就能看清
今天的营业额对比上周同一天，并对比设定目标 —— 金色进度条直接显示已达成 ฿40,000 目标的 81%，不用自己算
- 今天有 38 笔预约 已完成 24 笔——数量和进度都看得见
- 正在服务的预约有 7 笔 3 间房空着 —— 立刻知道还能不能接散客
- 技师服务报酬累计 ฿8,760 共 16 位技师——当天结束时该付多少，已经算好了
SELECTED WORK · 04 PROJECTS
我自己写代码做的项目
从第一屏
到必须对得上的每一笔账
这些不是为了好看而做的装饰图 —— 它们是我亲自设计并编写的项目真实界面， 既有网站也有后台系统。行业各不相同，但遵循同一个原则： 系统必须跟着店铺真实的运作方式走
后台系统截图中的数字和名称是示例数据 正式系统设有演示和培训模式， 用来避免泄露真实客户信息—— 图中的营业额不是开发系统的价格 项目起价 9,800 泰铢，取决于所选功能和需要对接的系统
01 · SYSTEM · MASSAGE
一家有两家分店的按摩店——老板打开一个界面，就知道打烊前该先看什么
拥有两家分店的老板不可能整天守在店里。他们想要的不是二十列的表格， 而是三个答案：今天收了多少、谁在做什么、有没有急事要处理。 这套系统先回答这三个问题，再往下展开细节。
界面 02 · 打烊前该看的事
系统找出店里哪些地方在造成损失，再用大白话告诉老板
底部的红色条是这一屏的核心 ——“打烊前老板应查看的 2 件事”。系统自己总结出是哪两件，不用翻报表找
实收金额与系统金额相差 ฿500 ——只差五百泰铢，系统也会标红，因为账款对不上时，拖得越久就越难查清原因。
还有，18:00 的双人预约时间重叠，技师不够 —— 提前提示并附带“查看解决方案”按钮，而不是等客人站着等了才发现
界面 03 · 分店对比
哪一家真正赚钱 —— 不只看营业额，还说明为什么在流失客户
两家分店的营业额、预约数和技师服务报酬并排显示，系统再用一句话总结
- 正在服务的技师：13/16 · 使用中的房间：9/12 —— 看得出瓶颈在人还是在房间
- “Nimman 店营业额更高，但傍晚因技师不足流失了 3 位客户” —— 系统把它写成老板可以直接据此决策的句子，例如傍晚从另一家分店调一位技师过来
click to zoom
02 · WEBSITE · LÉVONNE
日夜防晒套装销售网站 —— 第一屏就让品牌显得高端
LÉVONNE 是一个美妆品牌。要求是网站要和产品一样高级，并且能在聊天中促成成交。 我既做了客户看到的网站，也做了团队用来接单的后台销售系统。
界面 01 · 首页
黑色与玫瑰金配色贴合品牌，不是大家都在用的模板
衬线体标题“一套搞定日夜”，真实产品作为主视觉。优惠价和聊天按钮就在第一屏 —— 不用往下滚才找得到
- 原价与折后价写在同一行 —— 2,500 降到 1,390，免运费。客户还没点任何按钮就已经看到划算在哪
- 滚动的卖点条 ——不含 Paraben 防腐剂 · 对珊瑚礁友好 · SPF 50 PA+++，不用打开新页面就能看懂
- 幻灯片标注 03/03 ——客户知道还有哪些内容可看，不用猜
界面 02 · 讲清产品
“早间／夜间”切换按钮，让客户看到实际怎么用
这套产品有两件，分别在不同时间使用。与其写一大段说明，我把它做成切换按钮，让人直接看到早晚各要做什么 ——“短到真的能每天坚持的护理流程”
固定在屏幕底部的常驻条 ——“优惠套装 1,390.- · 提前转账或货到付款均免运费”，旁边就是“立即咨询 →”按钮。
无论滚动到哪里，都能立即购买。大多数电商网站都漏了这一点。
click to zoom
03 · SYSTEM · NAIL SALON
有多位技师的店 —— 每一张账单的钱都必须分对
美甲店的一张账单可能包含多项服务，而这些服务可能由不同的技师完成。 再加上会员折扣，收工后用手算提成就是最容易出错的环节。 所以这套系统在结账那一刻就算好，然后自己再核对一遍数字对不对得上。
界面 01 · 店铺今日概览
一打开就知道今天生意如何
净营业额、账单数量、提成百分比，以及应付技师的提成总额，全在一屏。下面是即将到来的预约，附带技师姓名和使用的工位
营业额下方的绿色条是自动对账 ——营业额＝各收款渠道合计＝按技师分账的合计金额。
这三项对不上就不会显示绿色，老板当天就知道，不用等到月底才发现。
界面 02 · 今日预约
今天的预约，按时间和技师排序
这个界面是给前台人员当着客户的面操作的，所以必须看得清楚，操作步骤也要尽量少
- 筛选单个技师技师可以只看自己的预约，不用滑过别人的
- 每张卡片状态清晰 ——已预约／已到店／服务中／已完成
- 绑定工位、座椅或床位 这样在预约时就能避免时间冲突
界面 03 · 账单明细
一张账单、多项服务、多位技师，钱当场分清
每一行都显示原价和折后价，以及由谁完成。账单底部，系统把每位技师应得的金额分开列出，再核对账单总额与分账总额是否完全相等
实际经营中才知道少不了的细节——系统将实际使用的收款方式与POS 机传来的标签
分开保存，因为前台点错选项很常见。系统同时保留这两项记录，以实际收款方式为准，也不会就此判定是谁操作错了
click to zoom
04 · SYSTEM · PARKING
现场人员与财务人员用不同的界面，背后是同一份数据
现场需要快、点得少；后台需要看到完整数字。这两件事塞不进同一个界面。 所以这套系统分成两个视图，一个按钮就能切换，而背后仍是同一份数据。
界面 01 · 现场人员的界面
预订 → 入场 → 出场，数据自动带过去
现场工作的难点在于：接受预订时信息还不完整 —— 客人没到，票也还没出。所以系统不强制一开始就把每个字段填满
- 预订时票号可以先留空 等客人到了再把票绑定到那笔预订上
- 车辆出场时，系统按实际停放时间自动计费
- 四个步骤连成一条线：现场只录入一次，后台立刻就能接着用
界面 02 · 财务人员的界面
另一个角色只看到跟钱有关的部分
切换到另一个视图就是后台 —— 今年收入、今年支出、结余，以及历史客户数量，还有近六个月的收支对比图
按角色拆分界面，好处是不必把整套系统教给每个人
现场人员只学自己要点的部分，钱的部分也不是人人都看得到
click to zoom
SAME RULES · EVERY PROJECT
这四个项目服务于不同的生意，但我做每个项目都遵循同样的原则
不管是电商网站、按摩店、美甲店还是停车场，这三点我每个项目都会做
01
数字必须能自动核对
系统内置核对功能，检查营业额、实收金额和分账金额是否一致。老板不用自己逐笔核对，对不上当天就能知道
02
每个人只看到自己需要的
界面按角色分开：前台人员看预约和需要操作的按钮，老板看收支。培训更容易，不该公开的信息也不会显示
03
要点的按钮永远在视线之内
电商网站的聊天按钮固定在屏幕底部；后台系统的新增预约按钮固定在顶部，紧急的事在上方标红 —— 不用找，也不用记