阿福智能终端 UI/UX 交互规范 餐饮单店 P0 · 屏幕 × 语音 × 表情 × 小程序
规范数据已加载
01 · PRODUCT POSITIONING

V1 已确认产品定位

门店现场的 AI 经营执行助手

用语音接住问题,用主动提醒推动执行,用关键数据提示风险, 用小程序完成复杂查看、编辑、审批与交付。

唤醒、理解、确认
结论、提醒、风险
状态、任务、数据
复杂动作回小程序
终端边界 已确认
负责
语音采集、短内容、播报、提醒、确认、设备状态
不负责
长报告、复杂表单、采购支付、内容编辑和审批
复杂动作
通过二维码恢复本轮门店、任务与确认上下文
事实来源
业务系统与带时间戳的门店上下文,不使用模型猜测
已确认

硬件或产品基线已经确定

V1 建议

亿货宝建议采用的体验标准

待厂商确认

依赖固件、屏幕或音频能力

02 · INTERACTION WORKBENCH

终端交互沙盘

把设备、场景、角色、优先级和网络状态放到同一条时间线上观察。

全部为演示数据
角色
阿福 1.0 智能终端正视图
就绪ACK: displayed
阿福

今天想先处理什么?

就绪
屏幕原始坐标 0.67× · 480 × 320
V1 建议
expression neutral 12 秒
00:00
03 · SCREEN FOUNDATIONS

小屏基础规范

屏幕是轻提醒和快速反馈层;脸部、语音状态与关键信息统一沿用小程序品牌紫。

1.0 / 2.0 双设备基线
阿福 1.0 3.35 英寸 · 480 × 320

3:2 横屏 · Normally Black · 有效区域 69.70 × 46.46mm · AXS15231B · 4-SPI · 全视角。

阿福 2.0 4.3 英寸 · 16:9

采用 480 × 270 逻辑画布;内容 Token 按 1.23 倍放大,393 × 246 安全区居中。

内容视口 480 × 292 · 坐标原点 x0 / y28
管理模式Wi-Fi 音量 电池
标题区 · 16 字以内
一个主信息
正文 2 行 / 任务 3 条 / 数据 3 项
0480 px
0320 px
背景#060B21

深色底减少环境反光干扰。

品牌基色#6864E3

来自阿福小程序,用于进度、选中和大型图形。

品牌深紫#5956E9

用于浅色页面上的文字、按钮和导航。

屏幕亮紫#A9A6FF

深色屏上的脸部、小字号和关键数字。

动效紫#8E87F4

用于呼吸、音浪、思考和播报光效。

提醒#FFBF5A

只作状态条或图标点缀,不改变脸部颜色。

成功#58D998

只用于已确认成功的勾选和标识。

失败#FF7182

用于失败、拒绝和权限标识,不大面积铺色。

1.0 字号13 / 16 / 21 / 32 / 43

基于 480 × 320 物理画布;业务模板坐标相对状态栏下方 480 × 292 视口。

待实机确认
标题

8~16 个中文字符

描述对象,不重复播报全文。

正文

最长 40 个字符

优先两行,每行约 16~20 字。

任务

单屏最多 3 条

按紧急程度排序,不做滚动列表。

数据

同屏最多 3 个指标

超过三项时拆屏或回小程序查看。

04 · HOME & SYSTEM UI

Home 与系统界面

管理模式常驻入口使用固件本地 LVGL 页面;云端业务屏不能接管网络、音量或雷达设置。

阿福 1.0 · 480×320 · 公共壳已适配
终端固件本地页面SCR-HOM-001~006 · 本地导航、状态读取与触控
云端只承接二维码与业务内容SCR-QRC-009 · 云端 URL,终端下载渲染
Dify 禁止选择 SCR-HOM-*
原生画布480 × 320 · 3:2 · 直角 TFT外围圆角仅表示物理黑色面板,不属于 UI 画布。
SCREEN ANATOMY

管理 Home 固定结构

  1. 28px 公共状态栏全部 1.0 Screen 共用;模式、Wi-Fi、音量和四节电池由固件实时驱动。
  2. 58px 时间问候区时间最大,日期横排,问候语只占右侧剩余空间。
  3. 2×2 入口区位置固定:问阿福、进店客流、阿福小程序、设置。
  4. 实物化 3D 图标图标与阿福 Logo 使用一致的体积、材质和高光方向。
SCR-HOM-001 管理 HomeFB-TPL-HOME-MANAGEMENT-01
INFORMATION ARCHITECTURE

入口与页面跳转

二级页返回上级,Home 不显示返回按钮。

SCR-HOM-001管理 Home固件本地
问阿福SCR-VOI-004手动唤醒后直接进入聆听
进店客流SCR-HOM-006日 / 周 / 月
阿福小程序SCR-QRC-009云端二维码
设置SCR-HOM-002进入系统设置
SCR-HOM-002V1 建议

设置首页

网络配置、扫码绑定、音量调节、客流设置;入口展示状态摘要。

FB-TPL-SETTINGS-HUB-01
SCR-HOM-003待厂商确认

网络配置

页头显示在线 / 离线 / 连接中与 SSID;已连接可刷新,已保存可重连或删除,密码 10 秒后自动隐藏。

FB-TPL-NETWORK-CONFIG-01
SCR-HOM-004V1 建议

音量调节

页头显示静音或当前档位;独立静音 + 连续滑杆,松手吸附至 25%、50%、75%、100%。

FB-TPL-VOLUME-CONTROL-01
SCR-HOM-005待厂商确认

客流设置

采集开关、雷达在线与校准;只统计匿名进出。

FB-TPL-RADAR-SETTINGS-01
SCR-HOM-006V1 建议

进店客流

日、周、月指标和趋势;覆盖空、离线、过期与待校准。

FB-TPL-TRAFFIC-DASHBOARD-01
SCR-QRC-009V1 建议

阿福小程序

重庆云端生成 PNG URL,终端下载渲染,默认 5 分钟有效。

FB-TPL-QRCODE-01
SYSTEM COMPONENT CONTRACT

系统组件与复用规则

状态栏是全部阿福 1.0 Screen 的公共固件壳;其余系统组件只在本地页面组合,业务图鉴组件继续由云端 Screen 使用。

组件用途与状态内容限制LVGL 控件
TerminalStatusBar阿福 1.0 全部 Screen 常驻;Wi-Fi 0~3 格、静音/四档音量、电池 1~4 节及充电28px;管理 / 访客 / 设备模式firmware_shell
HomeClockBand时间、星期、日期和两行问候问候各 ≤ 10 字clock_band
HomeEntryTile常态、按下、禁用;固定 2×2,不重排标题 ≤ 6 字,说明 ≤ 12 字entry_grid
SystemPageHeader二级页返回与标题;不重复展示模式名40px;标题 ≤ 8 字page_header
SystemSlider拖动预览、松手吸附、静音与恢复四档 25% 步进volume_slider
NetworkFormSSID、密码、查看 10 秒、连接反馈凭据永不进入 Registry/MQTTnetwork_form
SavedWifiList已连接、重新连接、删除确认最多 3 条可见saved_wifi_list
SegmentedTabs今日、本周、本月单选固定 3 项period_tabs
TrafficMetricSummary1~3 个匿名客流指标数字不换行metric_summary
TrendChart小时、七日或月度趋势最多 24 个点trend_chart
TrafficEventList匿名进入/离开事件最多 3 条,不含身份event_list
InlineStatus加载、成功、失败、离线、过期、待校准结论 1 行 + 说明 2 行inline_status
CompactConfirmDialog删除常用网络等高风险本地动作只保留取消与确认confirm_dialog
management管理模式Home、经营、任务、数据、通知、培训与普通业务二维码。
visitor访客模式消费者问答、身份验证二维码和访客侧权限提示。
device设备模式配网、绑定、设备生命周期及设备服务异常。

模式、Wi-Fi、音量和电池均由固件本地输入驱动;不进入 screen_render_v1 或 MQTT screen.params

已确认画布与入口

3.35 英寸、480×320、直角 TFT;四宫格顺序和主文案以 Home Demo V1.5 为准。

V1 建议交互与隐私

状态栏为固件公共外壳,不进入 screen_render_v1.params;业务模板坐标相对下方 480×292 内容视口。SSID 可展示,密码不进入 Registry、MQTT、Dify、日志或规范截图。

待厂商确认硬件能力

系统软键盘、安全凭据存储、雷达校准、电池与音量回调需厂商确认。

2.0 未适配设备范围

本章只提供阿福 1.0 坐标;阿福 2.0 不做推断式拉伸。

05 · MULTIMODAL STATE

屏幕、语音与表情如何协同

每轮只保留一个视觉焦点,屏幕和语音表达同一个结论。

V1 建议
先后顺序

屏幕先出现或与 TTS 同时

不要先说完再补屏幕,用户会失去上下文。

完成落点

播报结束立即回到就绪

基础语音主链路不设置独立结果保留状态。

硬件限制

播报期间不可打断

等待 TTS 播放完成并回到就绪后,用户再次唤醒发起新问题。

抢占

紧急可以抢占普通内容

同级通知按时间排序,过期通知不再补播。

06 · COMPONENT SYSTEM

精密经营终端组件系统

深色高对比、品牌紫聚焦、语义色辅助。组件按信息语义复用,不按文案外观临时拼装。

V1 建议
设计风格精密经营终端

面向门店现场的工业化经营工具,不做消费级娱乐屏,也不做缩小版小程序。

布局变化
3 / 10
动效强度
4 / 10
信息密度
7 / 10
DESIGN TOKENS

双设备字号与间距基线

数字不换行;空间不足时切换组件密度或字号层级,不截断核心经营数据。

语义 Token阿福 1.0阿福 2.0使用规则
screen-title24px30px单行标题,最多 16 个中文字符
value-lg / md / sm32 / 28 / 22px39 / 34 / 27px按单、双、三指标自动切换
body / label / caption16 / 12 / 10px20 / 15 / 12px正文最多两行,标签和说明不承担主结论
space-1…54 / 8 / 12 / 16 / 20px5 / 10 / 15 / 20 / 25px组件内部只使用五档间距
line-height数字 1.05 · 标题 1.15 · 正文 1.35禁止用固定高度压缩文字行盒
TERMINAL COMPONENTS

屏幕组件目录

同一业务语义只能落在一个主组件中,屏幕不并列两个主焦点。

ScreenCanvas

画布与安全区

约束设备纵横比、屏幕边界和内容内边距。

ExpressionFace

表情与语音状态

就绪、聆听、思考中和播报只保留中央状态。

MetricGrid
¥8,420126¥66.8

经营指标

1~3 个指标使用不同数字字号,核心值不换行。

RankList
1保温杯2购物袋

排行列表

序号、对象和可选数值分栏,不使用指标卡代替排行。

InsightSummary
+12%主要来自晚市套餐

经营洞察

主变化值与原因拆层,先让用户看懂结论。

SingleActionTask
01闭店前提醒活动复盘

单任务

活动复盘提醒使用单任务结构,最多两行大字。

TaskList
待提交提交物料制作待采购确认礼品采购

任务列表

执行准备提醒支持 1~3 条动态任务,未使用行必须隐藏。

NoticePanel
!营销活动提醒

通知与风险

紫色内容主体配合黄、绿、红语义标识。

ProgressPanel
68 / 100

进度

当前值、目标和进度条使用同一数据来源。

QRCodePanel
回小程序处理

二维码承接

绑定终端与打开阿福小程序统一使用该模板。

ConfirmationPanel
请明确确认或取消17:00 改到 18:00

二次确认

明确对象和变更值,只接受确认或取消。

ErrorPanel
!这次没有处理成功

异常兜底

说明失败事实、原因和可继续的出口。

COMPOSITION RULES

复用与组合规则

布局由 `layoutVariant` 决定,`screen.type` 只定义能力类别。

一个主信息

每屏只允许一个主数字、一个主任务或一个状态中心。

数量决定密度

单、双、三指标分别使用 lg、md、sm 数字 Token。

结构优先于缩字

内容超限先切换排行、洞察或列表组件,再考虑降低字号。

终端不放触控按钮

确认、延期、忽略走语音;复杂动作显示二维码。

SPEC CONTROLS

规范页控件

这些按钮只属于交互沙盘和规范页面,不属于量产终端屏幕。

07 · LVGL TEMPLATE REGISTRY

LVGL 模板注册表

112 个 Screen 使用稳定编号;14 个云端业务模板与 6 个本地系统模板按运行边界隔离。

20 个 LVGL 模板
SCREEN REGISTRY · V1.7110

103 个业务图鉴、6 个本地系统页和 1 个小程序首页二维码。

LVGL TEMPLATE20

14 个云端模板 + 6 个仅适配阿福 1.0 的本地系统模板。

GIF ASSET18

14 个微表情与 4 个固定状态动效,并提供首帧 PNG 降级。

RUNTIME PAYLOAD按需

screen.params 经模板 Schema 筛选;固定素材明确传 {}

Dify选择 Screen ID
生成必需参数与 TTS
重庆服务校验模板映射
封装 MQTT 命令
设备固件加载 LVGL 页面
填入控件内容
DEFAULTS ARE NOT PAYLOAD

默认展示信息不能直接透传固件

defaultParams 是 Screen Registry 的完整默认数据;Dify 和重庆服务必须依据 Template Schema 过滤后,才能生成 MQTT 中的 screen.params。例如任务列表中的摘要和表情不会被下发。

QRCODE DELIVERY

云端生成二维码图片,终端下载渲染

Dify 只输出 qr_request.route,按需补充 handoff_ref;重庆服务生成签名 HTTPS PNG URL,设备下载后填入 LVGL qr_image 控件。URL 默认 5 分钟过期。

坐标档案
SCREEN ID MAPPING

110 个 Screen 编号与模板映射

本地系统 Screen 仅支持阿福 1.0;其余业务 Screen 按设备型号加载对应页面与资源包。

Screen ID业务画面Template ID渲染类型默认展示信息
08 · COMPLETE SCREEN ATLAS

全量 UI 状态图鉴

覆盖屏幕 Home、P0 经营、消费者、设备生命周期和异常兜底;每张图鉴均标注 Screen ID 与固件模板。

0 个模板
任务与营销活动 · 本期范围

SCR-CAM-002 执行准备提醒和 SCR-CAM-008 活动复盘提醒标记为 P0 主动提醒;其余营销 Screen 全部保留,暂不定义本期主动推送规则。

屏幕 Home · 一级与二级页面

独立 Tab 收录 6 个固件本地页面、阿福小程序首页二维码,并关联复用 SCR-QRC-002 扫码绑定;两类二维码均复用 FB-TPL-QRCODE-01 通用承接样式。阿福 1.0 全部图鉴由 TerminalStatusBar 作为固件公共外壳,问阿福继续复用既有唤醒与聆听 Screen。

设备
09 · EXPRESSION SYSTEM

表情与微动效

表情负责传达态度和阶段,不能代替文字结论;以下素材均为阿福 1.0 黑底固件资源。

14 种表情
10 · VOICE UX

语音播报与听觉反馈

先结论,再原因,最后只给一个下一步。

量产音色待确认
VISIBLE STATE MACHINE

基础语音状态机

下载高清图

使用规范页真实渲染的阿福 1.0 屏幕,串联主链路、不可打断约束和异常恢复;图中事件名与重庆服务协议一致。

声画一致

音频、气泡和 spoken_text 必须来自同一条播报文本;切换阶段不得复用错误音轨。

one narration source
普通回答

平稳、直接,通常 8~15 秒;不逐字朗读整屏。

conclusion → reason → next
主动提醒

先说任务和时间,再给“完成、延期、查看详情”。

earcon → task → options
风险预警

说明风险级别、事实依据和可执行出口,不制造恐慌。

risk → evidence → action
二次确认

复述对象和变更前后值,只接受明确确认或取消。

object → change → confirm
播报不可打断

TTS 播放期间不启动新一轮 ASR;播报结束立即回到就绪,用户需要再次唤醒。

tts.start → tts.end → ready
失败降级

说明没有成功,不能使用“已经处理”一类误导表达。

failure → reason → handoff
消费者问答

只使用公开信息;内部数据请求转身份验证。

public only / verify staff
提示音用途要求
唤醒确认设备已进入聆听短、轻、不重复
普通提醒日历、培训、一般通知低打扰
风险提醒库存、超时、指标异常和普通提醒可区分
成功真实写操作执行成功未收到 ACK 不播放
失败操作或设备执行失败必须配文字与 TTS
11 · LAUNCH CAPABILITY SCOPE

首发能力清单

首发版只交付 Home 与系统、基础语音、两类通知提醒和二维码承接;全量版保留后续规划。

首发交付基线
12 · CONSUMER MODE

消费者公开问答与隐私边界

门店现场任何人都可能唤醒阿福,身份不明时默认按消费者处理。

默认最小权限
可以回答

公开且经过审核的信息

  • 营业时间与门店位置
  • 公开菜品、服务和营销活动
  • 食品安全的一般说明
  • 预约与小程序入口
不得回答

门店内部经营信息

  • 营收、订单、成本和客单价
  • 会员、员工和内部任务
  • 精确库存、采购和内部通知
  • 未验证身份下的门店经营建议

身份不确定

先拒绝内部信息,再展示身份验证二维码。验证后恢复本轮问题。

13 · DEVICE LIFECYCLE

设备生命周期与异常恢复

绑定状态与连接状态正交:在线、离线和重连不会覆盖已经成立的 bound 关系。

2026-07-31 重庆后端确认
稳定绑定事实unbound / binding / bound

只有解绑成功才能从 bound 回到 unbound。

独立连接状态unknown / connecting / online / offline

连接状态只描述通信,不改变门店归属。

终端呈现边界一个主画面

绑定前由厂商固件负责,事务失败主要由小程序承接。

MINI PROGRAM ONLY

小程序阶段与事务结果

这些步骤参与产品流程,但不是设备持久状态,也不新增终端屏幕。

VISIBLE TERMINAL STATES

终端可见状态与反馈

图鉴保留持久状态、组合态、短暂反馈、管理结果和故障兜底。

14 · AGENT & IOT CONTRACT

Agent、屏幕与终端命令映射

screen_render_v1 通过 Screen ID、Template ID 和按需参数决定显示;action_requests 只表达经过服务端校验的执行意图。

agent_response_v1
当前标准返回

            
App Server 最终鉴权

模型不能直接放行写操作或敏感查询。

模板映射确定性校验

Dify 选择 Screen ID,代码节点按 Registry 修正 Template ID 并校验参数。

参数按需传输

模板不需要的字段直接省略,不传 null、空字符串或空数组。

二维码云端兑换

App Server 将 qr_request 兑换为短时有效的 PNG URL。

命令必须可追踪

共用 commandId、traceId、deviceId 和 expireAt。

音频不走 MQTT

控制指令走 MQTT,大音频文件走 HTTPS/CDN。

没有 ACK 不宣称成功

区分 received、displayed 和 played。

15 · ACCEPTANCE & HANDOFF

验收、交付与待确认项

业务、体验和技术使用同一套 Screen ID、模板编号与终端状态。

联调基线

业务验收

体验验收

技术验收

01

字体与字号系统字体、字重、中文渲染和像素密度实机效果。

02

动画格式CSS、序列帧、Lottie 或固件原生动画的支持范围。

03

语音能力TTS 音色、方言、端到端延迟和失败码;硬件已确认不支持播报打断。

04

设备协议MQTT Topic、QoS、TTL、离线保留和设备执行 ACK;OTA 当前接口未提供。

05

输入能力触控不作为 V1 依赖,实体按键能力仍需确认。