街区信号：UI 视觉与交互规格

「街区信号 / Neighborhood Signal」采用都市潮流、复古电子设备、强图形排版和有弹性的操作反馈，覆盖游戏内主菜单、调查记录、探索 HUD、对话、潜梦与产品外壳。整体方向已确定；本页色板、字号、圆角、时长和菜单构图是视觉与交互样板的起始参数，规格状态保留 draft，待真实画面与操作反馈收敛

本版取代纸白、低饱和河水青、细线城市导视与生活手记作为全局外观的方案，保留现场轻交互、记录可回看、线索有出处、现实与梦境相互核对、双输入及引擎内文字布局。生活感由场景与人物承载，简洁操作与有分量的图形可以同时成立

本页负责页面、视觉与交互规则；制作方法见 UI 制作，输入动作见输入规格，世界事实、玩家认知和恢复见状态契约。游戏玩法、已定角色关系、地图及 Demo 范围沿用其权威规格；这里列出的页面目标不代表系统已实现

图形来源与信息层级

图形从月台杂货和街坊工作中取得：商品标签、包装封签、街头海报、便携设备面板、照片批注与记录索引。这些是界面素材来源，不要求增加设备或经营系统

N:SIDE 的冒号与两组相邻标记构成识别元素：冒号双点可以指示当前焦点，相邻标签可以区分信息来源；潜梦时仅装饰层短暂错位。图形不代表额外的异常等级或机构徽记

画面以大面积场景或主题画面、深色操作框架、集中的亮色焦点组织。全屏页可不对称，大标题与功能区形成比例差；列表、正文和焦点导航保持稳定排列

层级	适用页面	规则
形象层	游戏内主菜单、章节提示、潜梦准备	大标题、场景或人物构图、较强对比、适量叠层
操作层	列表、选项、工具、地图控制	统一尺寸节奏、粗实图标、明确焦点与选中反馈
阅读层	对白、线索、帮助、错误	平直中文、稳定底板、受控行宽与足够行距

倾斜、溢出和错位用于标题底片、选中标签与装饰层；正文保持正常字形与水平排版。视觉变形不改变按钮实际命中区。普通文字使用可编辑文本，专用标题、图标与装饰独立制作

视觉参数

下表保留设计起点与职责；实际样板采用的结构化值在UI 资产包的 tokens.json 单处编辑。实验调整记录原因与运行结果，待收敛后回写本页，不在页面代码中复制第二套参数

起始色板

Token	初始值	职责
surface.base	#17191D	基础深色面板
surface.raised	#292D34	浮起的按钮、卡片和二级面板
text.primary	#F5F4EE	主要文字
text.secondary	#B6BAC2	次级信息，仍按实际底板检查对比
accent.primary	#D7F244	当前焦点、主要动作与确认强调
accent.warm	#FF8752	生活侧少量图形点缀
accent.dream	#68D9E8	潜梦装饰层与连接表现
state.warning	#FF7068	真实警告，同时配文字或形状

亮色集中聚焦，亮色按钮配深色文字。现实与潜梦保持同一种操作强调色，潜梦通过明确状态标签、辅助层、背景和转场区分。深色框架不要求城市环境变暗，长线索允许暖白资料插页，导航、标题与焦点仍共享整体语言

关键正文最终合成对比度以至少 4.5:1 为本轮目标，包括禁用原因、次级信息及插页文字；检查实际前景、底板、透明度、场景和叠层，不以单独两个 token 的通过代替所有页面验收

字体、图标与布局

标题用厚实、有辨识度的黑体，正文优先使用同家族常规或中等字重。字体按真实中文覆盖、引擎渲染和许可选择，不为换品牌而更换。英文短标题、编号与数字可以紧凑，中文不横向压缩

图标采用实心或粗描边，减少细线细节；主入口同时显示中文名称。字号、行距、分组与自适应增高解决长文本，正文不缩小到难读的程度来填固定框

以下值采用 1920×1080、100% UI scale 的设计坐标，不等同于输出字形像素高度

项目	起始值
一级标题	48–64，粗字重
二级标题	32–40
正文与对话	28–32
重要操作标签	26–30
正文行高	字号的约 1.45–1.6 倍
间距	8 / 16 / 24 / 32 / 48
主面板圆角	16–24
按钮	有厚度的圆角矩形，部分短按钮用胶囊
图标框	32 / 40 / 48，按用途选择

布局由容器、相对尺寸和屏幕边缘安全间距组织；窄画幅与字体放大时重排，较宽画幅扩展场景与留白。实际最小宽度、缩放档位和溢出策略由样板确定，并在页面上检查长标题、多行选项和滚动到末尾

质感与动效

清楚外轮廓、内亮边或短硬阴影表达面板厚度。点阵、颗粒和设备网格仅作为背景或边框层，阅读区域保持足够不透明；先验证轮廓、字重、比例、焦点，再制作纹理。扫描线、色散和噪点只用于有目的的局部效果

事件	动效方向	初始时长
焦点移动	亮色标记立即切换，底片短移	80–120 ms
按下	内容与边框轻压下，确认色反相	90–140 ms
打开面板	前后层错开少量距离滑入、轻回弹	180–260 ms
获得线索	标签进入、停留、收束到记录入口	按阅读量决定停留
潜梦转场	框架重新锁定、边层错位、状态标签更换	350–550 ms

输入立即处理，后续输入可打断装饰动画，不等待动画才能操作。Reduced Motion 使用快速淡入淡出或直接切换，长期阅读的页面保持安静；正文、准星、确认目标和按键提示不持续抖动或色散

声音以短按键、轻卡扣和简短电子提示试制，区分选择、确认、返回，和同一操作事件同步。静音时文字、形状与状态仍完整，音效制作与暂停、切场的 start/stop 归声音契约

页面与信息架构

游戏内主菜单

优先用游戏内主菜单验证风格。画面主体是一处小店生活构图，包含工作台、包装材料及实际已有的人物或 Agent；样板可以复用已有场景或明确标记的占位画面，新增角色菜单演出另行估算资产成本

N:SIDE 图形标题、当前位置与少量贴纸式标记参与构图，核心入口建议为「继续游玩 / 委托 / 线索 / 街区」，设置位于固定位置，操作提示避开主题画面。亮色实底、粗轮廓、少量错位底片表示焦点，未选中项为深底暖白字

工作菜单读取当前会话；未实现或不可用入口给出真实原因。这里不增加抽卡、商城、签到、体力恢复或活动推荐。标题菜单是另一层，入口为「继续 / 新游戏 / 设置 / 退出」，不能把两个页面的返回语义混在一起

城市探索 HUD

HUD 保留场景主体，用有编号感的小标签显示地点与时段，用紧凑信息条显示当前目标。交互提示具有厚轮廓、实心图标与当前绑定按键，占屏克制而造型明确

同一时刻明确一个主要对象，密集对象允许主动切换；贴近屏幕边缘的提示重定位。设备和绑定变化同步到提示。地图是否常驻由实际路线理解验证，HUD 不以新增长期仪表来填满屏幕

对话与选择

底部深色对话板、独立亮色姓名签与厚轮廓推进提示形成框架，局部标签可叠层，正文保持横向和稳定行宽。对白称呼沿用人物正式命名与熟人称呼规则

选择卡以亮色反相表示焦点，已确认状态另有反馈。长选项换行增高并按需滚动，不压缩文字。进入对话的那次输入只负责进入，不同时推进台词或提交选择；历史回看和返回不产生第二次任务提交

调查工作台

「工作台」是界面概念，不额外设定硬件。直接使用「委托 / 线索 / 街区」三个内容入口，省去模拟 App 桌面的中间层。左侧为粗标题分组和可滚动列表，右侧显示图像、原始记录、来源和核对状态

照片、设备记录卡、物品标签与批注共享可读布局。以玩家实际取得的信息组织，现场观察、当事人说法、梦中见闻分别标注；事实与推测并列时有文字标识，核对状态仅由真实叙事事件更新

字段	内容与来源
标题	玩家能够理解的线索短标题
来源类型	现场观察、当事人说法或梦中见闻
获得位置	已知的取得地点，不泄露未发现地点
核对状态	按本委托真实状态显示待核对、已核对或实际定义的其他状态
记录	当时实际观察或获知的描述，保留说法归属
已知关联	已取得的信息之间真实成立的联系

「箱封有重复粘贴的痕迹 / 现场观察 / 待核对」可用作版式测试文本，接入任务前必须替换或绑定经过委托规格确认的实际记录。UI 不把梦中形象自动宣布为历史事实，不生成可信度百分比，也不替玩家先展示策划掌握的真相

获得、切换和核对时可以有短促图形强调，阅读时保持稳定。空列表说明尚未获得记录并提供返回；已看条目与当前焦点分开，关闭再进入保留有效选择与阅读位置

街区地图

采用厚实道路、街坊色块、鲜明地点标识和少量标贴编号。当前位置和当前目标最突出，其他地标按需展开，河岸、桥梁、坡道、入口和高差对应实际可通行关系

地图投影继续依据同源空间数据，简化视觉细节不修改走法。地图仅展示当前允许信息，不直接把开发地图中所有后勤、私人入口或隐藏状态当作玩家已知内容

潜梦准备与行动

准备页用分层的连接工作卡显示进入者、现实接应者、目标和已有工具，强调一个主要确认动作。兄妹一次一人潜梦、另一人现实接应，巧克力使用已定的游戏内支援逻辑

梦中保持同一套图标、位置和操作强调色，装饰双层短暂错位，浅青辅助层与「潜梦」标签明确状态。危险突出真实风险、工具与支援反馈；资源条、工具槽仅显示玩法已有机制

正常处理完成与紧急撤出使用不同动作和解释，结果以委托状态及恢复契约为准。界面关闭、动画结束或出现完成图形都不能自行提交剧情结果

产品外壳与异常状态

标题、暂停、设置、加载、保存、错误、退出和结束页共享深框架、粗标题与亮色焦点。继续仅在真实有效存档存在时可用，加载和保存反馈绑定实际状态，不用动效伪造进度或成功

空存档、坏档、素材加载失败、手柄断连、不可用动作和重复提交分别给出可读说明与恢复路径。覆盖与退出等有后果的操作明确对象和结果，错误页允许回到有效状态；具体持久化与旧档规则由工程契约落实

组件、输入与恢复

首批从实际页面提取 Panel、ChunkyButton、Tab、ChoiceCard、FocusMarker、InputHint、NameTag、DialogueBox、RecordCard、SourceTag、Notice、Modal 的共同视觉与行为；没有使用场景的组件不提前搭空壳

状态	表现与语义
idle	深底暖白内容，边框稳定
hover	边框或底片响应，保持当前选中内容可辨
focus	亮色实底或清楚外框，同时保留文字或形状标记
pressed	短距离压下，即时输入反馈
selected	持续的小标记或固定状态签，区别于暂时焦点
disabled	降低强调但仍可读，必要时说明原因

当前页、临时焦点和已提交结果各有含义。正文、图标、底纹与焦点装饰分层控制，页面复用语义 token；真实实现按已用组件扩展，不在每页写独立的配色和动效常量

每个页面交付时明确用途、信息来源、进入条件、默认焦点、导航顺序、确认取消、返回层级及正常、空、加载、不可用、错误状态。不适用的状态说明原因；交互区域与装饰分离，焦点可见且能抵达全部可用控件

页面	信息与进入条件	默认焦点和返回	必须处理的边界
工作菜单	当前场景、位置和已有系统；从探索动作打开	继续游玩；关闭回原场景	没有任务、入口未接入、切场后上下文失效
调查工作台	已获得记录及真实核对状态；从菜单或线索提示进入	上次有效条目，否则第一条；空列表聚焦返回；退回进入层	无线索、长正文、来源未核实、条目删除或更新
对话与选择	当前有效对话节点、说话者与允许选项	推进或首个可用选项；按节点允许方式退出	跳过、历史回看、长选项、人物离场、读档恢复
物件观察	当前可交互对象及已知描述	主要观察动作或返回；退回现场	对象不可用、交互距离失效、场景清理
街区地图	已允许公开的路线、已知目标和当前位置	当前位置或有效当前目标；退回进入层	没有目标、目标不可达、楼层和入口信息不足
潜梦准备	有效入梦条件、分工、工具与目标	主要确认；取消回现实准备位置	工具缺失、连接条件变化、不能进入的原因
暂停与设置	当前会话和实际可用设置	继续或首个可用设置；返回保持上一层焦点	断连、失焦、不可用选项、关闭时设置应用失败
标题与错误	真实存档和加载结果	可用的继续，否则新游戏；错误聚焦可执行恢复动作	空档、坏档、资源缺失、重试失败和安全退出

这张表约定页面职责，不提前确定所有剧情中的取消规则。对话是否可中止、潜梦紧急撤出与结果提交仍由对应节点和恢复规格决定

输入由最上层页面拥有，同一输入不能同时打开对话再推进、关闭菜单再触发场景动作或提交两次。鼠标悬停与键盘/手柄焦点能够共存，设备切换保留有效选择，提示使用实际绑定

关闭子页恢复仍存在且可用的原焦点，否则落到明确默认项；空页面仍有返回入口。暂停、切场和读档时按系统规格关闭或重建 UI，不保留失效实体引用；手柄断连和应用失焦停止持续输入，重连恢复可达状态。具体检查步骤统一见制作与恢复检查

交付与收敛顺序

交付包括可编辑设计源、效果图、可复用素材、规格和可交互验证。普通文字、布局、底板和焦点用 UI 组件与文本数据；图标和标签保留 SVG 源，按实际运行方案导出透明 PNG 等资产；边框、纹理与插画单独记录切片、缩放和采样要求

完整画面设计可输出 PNG，进入 Wiki 的位图按项目规则导出质量 80 的 WebP；源工程、运行资产与本轮截图分别归源资产包、game/assets/ 与任务证据。色彩、字号、间距、状态和动效用本页语义及结构化 token 对应，生成图不能代替可编辑文字或整页运行布局

顺序	样板	本轮要回答的问题
1	游戏内主菜单	字重、比例、图形焦点与场景是否形成统一方向
2	调查工作台	真实长中文、出处、事实与推测能否清楚回看
3	城市 HUD 与对话	小面积提示与稳定阅读是否仍有同一辨识度
4	潜梦对照	同一或相近场景构图下能否明确识别状态变化

首轮图必须包含长文本、焦点状态和输入提示，占位场景与人物明确标注。随后提取实际用到的 UI Kit，在引擎内验证探索 → 对话或观察 → 获得线索 → 打开工作台 → 返回，再接潜梦准备与往返；演示数据仅证明 UI 行为，不计作委托系统、潜梦功能或存档实现

验收边界

维度	必须检查	证据
风格	遮住 Logo 后，字重、形状、构图、焦点仍形成统一的都市电子风格	相同尺寸与场景的画面对照、作者真实反馈
阅读	长中文不丢失，放大后重排，正文合成对比达本轮目标	布局与文字检查、实际截图
输入	键鼠、手柄完整进出，热切换、断连和焦点恢复	状态断言、真实设备操作，模拟输入另行标注
无障碍	静音和 Reduced Motion 保留关键信息	同一路线的有无反馈对照
性能	展开、滚动、输入切换和潜梦效果的增量成本可测	固定场景的运行参数、基线与帧时间，不用截图推断
信息	记录出处正确，未知真相不提前出现，确认取消不误提交	已知/未知、空、错误和重入状态断言

Bevy UI 是优先验证方向，API 以锁定版本和实际编译为准。规范不预设 SVG 渲染、特效或完整焦点系统已经存在。客观通过、视觉自查、作者认可与真实试玩分别记录，具体结果与下一轮问题进入任务卡