体验设计细则（落地版）

体验设计细则（通用落地版）一、总则（设计核心原则）本细则适用于APP、小程序、网页、终端界面等全品类产品体验设计，覆盖视觉、交互、内容、情感、适配、落地全流程，核心目标为降低用户认知成本、提升操作效率、塑造统一舒适的品牌体验、规避体验漏洞，所有设计输出均需遵循以下基础原则：易用性优先：功能逻辑简洁直白，符合用户直觉习惯，杜绝多余操作、复杂层级和无效交互；一致性标准：全产品内视觉样式、交互规则、操作逻辑、文案话术统一，建立用户稳定认知；容错性可控：支持用户操作撤回、错误修正、状态兜底，避免误操作造成不可逆损失；舒适性适配：兼顾视觉舒适、操作舒适、场景舒适，适配不同用户、不同设备、不同使用场景；目的性明确：每一个界面、按钮、弹窗、文案均有明确用户价值与业务价值，无冗余设计元素。二、视觉体验设计细则视觉是用户感知产品的第一维度，核心要求：层级清晰、主次分明、美观统一、阅读舒适。1.色彩规范主色：仅设定1个核心主色，用于核心按钮、重点标签、选中状态、关键引导，全产品统一复用，不随意替换色相；辅助色：限定2-3个辅助色，用于次级操作、状态提示、标签分类，不得大面积使用，避免干扰主视觉；中性色：严格区分黑色、深灰、中灰、浅灰、白色层级，分别用于标题、正文、辅助文案、占位文字、背景，文字层级色差清晰可辨；功能色：固定成功（绿色）、警告（黄色）、危险（红色）、提示（蓝色）色系，状态语义统一，不混用、不自定义；适配要求：满足WCAG视觉无障碍标准，文字与背景对比度达标，浅色模式、深色模式色彩适配无刺眼、无模糊问题。2.字体排版字体家族：全产品统一字体，移动端、PC端分别固定标准字体，杜绝多字体混用；字号层级：建立固定字号体系（大标题、页面标题、模块标题、正文、辅助文案、备注文案），层级固定，无随意字号；行间距/字间距：正文行间距统一为1.5倍，标题行间距紧凑适配，长文本避免拥挤、松散两种问题；排版规则：文字左对齐为主（数字、时间可右对齐），居中仅用于弹窗标题、空状态提示，杜绝杂乱对齐方式；段落留白均匀，无挤压、悬空问题。3.布局与层级栅格体系：统一页面栅格、边距、模块间距，所有元素对齐规整，无错位、参差不齐问题；层级优先级：核心功能>核心内容>次级内容>辅助信息，通过大小、色彩、留白、阴影区分层级；留白规范：模块之间、内容内外保留合理留白，避免页面拥挤空洞，保证视觉呼吸感；卡片设计：统一卡片圆角、阴影、边框、间距样式，同类卡片视觉完全一致，区分可点击与不可点击卡片样式。4.图标与素材图标风格：全产品统一线性/面性图标风格，统一粗细、圆角、尺寸，杜绝混搭风格；图标语义：图标含义通用易懂，贴合用户认知，冷门功能必须搭配文字说明，不单独使用抽象图标；图片素材：插画、banner、商品图风格统一，清晰度适配设备，无拉伸、模糊、变形问题；占位图样式统一，适配空数据、加载、错误状态。三、交互体验设计细则交互核心要求：操作高效、反馈及时、逻辑闭环、无卡顿无困惑，所有用户操作必须有对应响应。1.操作逻辑层级极简：核心功能操作路径≤2步，高频功能置顶、就近展示，杜绝多层嵌套、反复点击；逻辑统一：相同操作对应相同结果，相同状态对应相同样式，例：所有列表下拉刷新、所有弹窗关闭逻辑统一；手势规范：移动端手势符合平台原生规范（点击、滑动、长按、下拉/上拉），不自定义反直觉手势；权限可控：用户可自主关闭通知、退出页面、取消操作，无强制弹窗、强制跳转、无法退出页面。2.状态反馈操作反馈：点击、滑动、提交、删除等所有操作均有反馈（变色、缩放、动效、提示），杜绝无响应空白操作；加载状态：页面加载、接口请求、文件上传/下载时，展示加载动画/加载文案，禁止空白等待，超时需给出超时提示；结果反馈：操作成功、失败、警告、为空均有明确文案提示，告知用户结果及后续操作建议；状态留存：用户操作后的页面状态、输入内容、滚动位置合理留存，避免刷新重置、页面跳转丢失信息。3.容错与防错设计前置防错：输入框实时校验、规则前置提示，高危操作（删除、清空、注销）增加二次确认弹窗；后置容错：操作失败提示清晰，告知错误原因+解决方式，支持重新操作；误操作支持撤回、返回、恢复；兜底机制：网络异常、接口报错、空数据、无权限场景，均有专属兜底页面/提示，无空白、无崩溃、无代码报错。4.动效规范动效克制：仅用于状态切换、页面跳转、操作反馈、重点引导，杜绝多余花哨动效，避免视觉干扰、增加加载负担；节奏统一：动效时长、速度统一，流畅不卡顿，无闪烁、抖动、延迟问题；适配性能：低端设备、弱网环境下动效不失效、不卡顿，可适配关闭动效模式。四、内容体验设计细则内容核心要求：简洁易懂、精准清晰、统一规范、无歧义，解决用户看不懂、读不懂、不知道怎么做的问题。1.文案规范话术统一：全产品文案语气一致（简洁正式/轻快亲和，贴合产品定位），杜绝口语化、网络化杂乱话术；简洁高效：去除冗余废话、重复说明，标题直击核心，操作文案直白（确定、取消、保存、返回）；语义准确：无歧义、无错别字、无病句，专业术语统一，新手用户可快速理解；层级文案：标题抓重点、正文讲详情、辅助文案做补充、报错文案给方案，各司其职。2.信息展示信息优先级：核心用户需求信息前置展示，次要信息折叠、隐藏，避免信息过载；数据展示：数字、时间、金额、状态格式统一，数据规整，无错乱、无缺失、无多余符号；引导说明：新手流程、新功能、复杂操作提供轻量化引导，不强制、不扰民，按需查看。五、适配与场景体验细则覆盖多设备、多场景、多用户，保证全场景体验一致舒适。1.设备适配移动端：适配不同屏幕尺寸、分辨率、暗黑/浅色模式，页面无截断、无溢出、文字不挤压；PC端：适配不同浏览器、窗口大小，自适应布局，按钮、输入框尺寸适配鼠标操作；终端设备：适配触屏、键鼠等不同操作方式，操作区域尺寸合理，无点击盲区、误触区。2.场景适配网络场景：适配强网、弱网、无网、断网场景，弱网精简加载内容，无网给出专属提示和离线能力；使用场景：单手操作、夜间使用、快速浏览等场景，保证按钮可达、视觉不刺眼、信息易读取；用户场景：适配新手、熟手、老年用户等不同人群，支持极简模式、放大字体等适配能力。六、情感与品牌体验细则核心要求：有温度、有记忆点、品牌统一，降低用户抵触感。情绪适配：成功场景轻快正向、报错场景温和安抚、高危场景严肃提醒，贴合用户情绪；空状态/兜底页：拒绝冰冷空白，搭配温和文案、轻量化插画，缓解用户焦虑；品牌统一：色彩、图标、动效、文案风格全程贴合品牌定位，形成专属视觉体验，不割裂、不杂乱；细节温度：支持个性化设置、用户偏好留存，记住用户常用操作、自定义设置，提升归属感。七、落地校验与验收细则所有设计产出上线前，必须完成以下体验校验，确保无体验漏洞：1.设计自查视觉：样式统一、层级清晰、适配正常、无视觉bug；交互：逻辑闭环、反馈完整、操作流畅、无无效点击、无卡顿；内容：文案准确、信息清晰、无歧义、无冗余；场景：全网络、全设备、极端状态均有兜底。2.体验验收标准高效性：核心流程操作路径最短，无多余步骤；稳定性：无崩溃、无卡顿、无报错、无状态异常；易