车载端音频类应用UI走查要求

用户头像
杭州/UI设计师/154天前/281浏览
车载端音频类应用UI走查要求
一、文档总则&通用红线
1.1 车载音频核心设计原则
1.零视觉分心
:音频以听为主,弱化画面动态效果,行车过程无需驾驶员频繁看屏操作
2.全场景可用
:音频无行车播放限制(区别视频类),行车/驻车均可正常播放音频,仅限制高视觉消耗操作
3.大触控热区
:适配车内颠簸驾驶场景,所有播放控件、菜单按钮尺寸远大于手机端,盲操作无压力
4.座舱系统一致性
:字体、色彩、弹窗、控件样式、日夜模式完全跟随整车HMI规范,视觉无割裂
1.2 全页面通用致命红线
l 界面动态特效过多、歌词高频滚动闪烁,造成驾驶员视觉眩晕
l 控件尺寸过小,无法适配车载粗手指触控,行车盲操作极易误触
l 页面弹窗、浮层遮挡车载系统状态栏(车速、时间、空调、报警提示)
l 行车状态开放手写键盘、长文本编辑等高分心输入操作
l 夜间模式亮度过高、歌词高亮刺眼,夜间行车影响驾驶视线
1.3 全页面通用UI基础规范
车载端音频类应用UI走查要求(图ZMTU2NDE1NzY=) - 观点 - 站酷设计师火腿蒸蛋原创素材 - 站酷ZCOOL
通用基础规范
收藏
 二、分页面走查细则
2.1 首页
2.1.1 页面布局规范
l 顶部导航:固定搜索、个人中心、返回入口,导航栏高度贴合整车UI规范,不侵占系统状态栏
l 推荐轮播:轮播间隔≥4s,禁止快速自动轮播;行车状态自动暂停轮播动画,仅静态展示
l 分类入口:电台、音乐、有声书、播客等核心功能采用大宫格布局,拒绝手机端细长列表,一键直达
l 推荐歌单/节目列表:卡片尺寸加大,单屏内容不宜过多,减少上下频繁滑动操作
2.1.2 行车&驻车权限差异
l 驻车模式:全部功能开放,可正常浏览歌单、进入播放页、查看详情
l 行车模式:关闭自动轮播、关闭卡片动态预览;禁止展示全屏营销弹窗、开屏广告;可正常选歌播放,无需限制音频播放
2.1.3 问题判定分级
l 严重问题:轮播动画过快眩晕、首页常驻营销弹窗、控件尺寸不达标
l 一般问题:卡片对齐错乱、文字截断、图标和整车组件样式不统一
 
2.2 搜索页
2.2.1 搜索核心规范(车载音频重点)
l 搜索框:尺寸加宽加大,默认展示
语音搜索按钮
(车载首选);
行车状态强制屏蔽手写/全键盘输入
,仅保留语音搜索,减少手动操作
l 热门搜索/历史搜索:词条按钮化展示,直接点击即可搜索,无需手动输入文字
l 搜索联想列表:列表行高加宽,点击区域充足,避免误点相邻词条
2.2.2 搜索结果页规范
l 结果区分音乐、电台、有声三大标签,标签醒目清晰;单条歌曲信息精简,只展示歌名、歌手,多余文案全部隐藏
l 无结果空态:文案通俗易懂,无网络梗、无晦涩话术,搭配简约车载空态插画
l 行车适配:搜索浏览全程无限制,支持直接点击播放音频,无播放拦截
2.2.3 禁止项
l 禁止行车唤起全屏手写键盘;禁止搜索页插入弹窗广告、悬浮营销挂件
 
2.3 播放页走查要求(音频核心页面)
2.3.1 行车&驻车权限规则
区别视频APP:音频行车无画面黑屏限制,全程可正常播放
驻车模式:完整展示专辑大图、滚动歌词、全部播放控件行车模式:自动
精简界面
,弱化动态歌词、降低专辑封面动效,支持一键收起歌词页面,减少视觉注视
2.3.2 播放控件UI规范
l 底部播放栏:上一曲、播放/暂停、下一曲、音量、收藏全部超大图标,支持盲操作;进度条触控区域加宽,方便拖拽调节进度
l 歌词功能:支持开关歌词按钮;行车模式默认关闭全屏动态歌词,避免文字滚动分散注意力;歌词滚动速度缓慢平稳
l 播放模式:循环、随机播放按钮样式统一,状态区分一目了然
l 切歌反馈:切歌、暂停、播放操作有柔和视觉反馈,无闪屏、无亮度突变
2.3.3 车载专属优化要求
l 支持最小化播放:可收起至桌面迷你播放条,后台持续播放,不占用全屏界面
l 来电自动暂停:车载来电时音频自动暂停,挂断后自动恢复播放,和车载通话系统联动正常
l 专辑动效:禁止3D旋转、剧烈晃动等花哨动效,仅保留静态或微弱呼吸动效
 
2.4 个人中心走查要求
2.4.1 页面布局规范
l 顶部个人信息区:极简展示头像、会员状态,无多余动态装饰效果
l 功能菜单:播放历史、我的收藏、下载管理、定时关闭、播放设置采用
大按钮宫格布局
,适配车载触控,淘汰手机细长列表
l 播放历史:音频条目加大,支持一键续播,减少点击层级
2.4.2 设置页面专项要求
l 播放设置:歌词开关、动态效果开关、日夜模式跟随、定时关闭,选项控件放大适配车载
l 账号登录:行车状态禁止密码输入,仅支持扫码快捷登录,规避长文本输入分心
l 行车专属设置:内置「行车极简模式」开关,开启后自动隐藏歌词、弱化界面动效
2.4.3 行车适配规则
l 个人中心全程无播放限制,行车可正常查看收藏、历史记录;高风险输入操作(密码修改)行车直接禁用
 
三、问题严重等级划分
1.致命问题(阻断上线)
:界面频闪眩晕、遮挡车载状态栏、行车开放手写键盘、控件严重无法点击
2.严重问题(本轮必改)
:行车模式未精简界面、来电无法自动暂停、播放控件失灵、动效过激、日夜模式失效
3.一般问题(版本内修复)
:排版对齐错误、文案错别字、图标样式不统一、文字滚动速度异常
4.优化建议(迭代优化)
:界面美观微调、交互细节优化,不影响行车安全与基础音频播放功能
0
举报
|
收藏
分享
相关推荐
评论
用户头像
评论你的想法~
表情
喜欢TA的作品吗?喜欢就快来夸夸TA吧!
推荐素材
【新年UI图标】会员icon
【新年UI图标】体育icon
原创UIUX交互橙红渐变炫酷视觉平面设计作品集模板PSD
【新年UI图标】30个图标
3D卡通UI界面图标可爱插画免扣素
APP/小程序商业项目UI模板|99个高保真UI+79个原型
我的钱包-UI界面设计-app
智能家居中心 简约 UI设计组件库
拟物风质感写实UI卡片合集源文件
高级感金属拟物 UI设计组件库
【新年UI图标】秒杀icon
Security Camera UI kit
科技医疗透明柜UI界面设计
户外旅行飞机情侣假日出行
3D渐变流体抽象矢量UI背景图
盲盒APP UI设计
钱包ui模板
新能源APP应用UIKit
【新年UI图标】钱包icon
高级表盘系列UI源文件
【新年UI图标】旅行icon
新拟态风格 UI设计组件库
【新年UI图标】礼物/活动icon
UI通用设计素材1
你可能喜欢
相关收藏夹
大家都在看
登录注册