尽量将用户需要操作的按键放置在蓝色区域范围内；红色区域避免放置操作按钮，可考虑大区域点击热区或纯内容展示。
横屏车机由于高宽比较小，应以左右横向滑动作为主要交互方式，尽量将滑动响应区域放置在蓝色区域范围内；用户在距离车机较远位置进行滑动操作时，易出现弧线划动轨迹，应避免在屏幕远端红色区域放置需用户划动的操作控件。
由于驾驶员与屏幕间存在特殊的物理距离和视觉角度，且驾车场景较为复杂，建议减少如捏合、双击、长按等复杂交互手势，仅保留基本交互手势，避免因复杂交互操作造成的误操作等情况。推荐触控方式如下：
用户通过点击某个界面元素触发功能或访问界面。点击需要有视觉或音效反馈。
用户通过滑动来滚动列表或平移界面内容，界面内容单屏幕滑动切换（非自由滚动），第二页内容需与前页无缝衔接。（横屏车机为左右滑动，竖屏车机为上下滑动）。
用户将界面元素从一个位置移动到另一个位置。内容/元素跟随用户拖动动作移动。
车机配色尽量避免鲜艳色彩的大量使用，以避免对用户注意力的吸引和占用。
根据Munsell Color原理得出，饱和度和明度的两个数值越大，颜色越鲜艳。在车机配色选择上请遵循以下规则：
由于驾驶环境的复杂光线条件，需要满足在不同照明条件（日间/夜间/暗光/眩光）下的可读性，对比度需满足以下条件：
*注：下图来自 https://color.review/可在此链接查阅色彩对比度关系。
常驻导航区：系统功能常驻导航（如：语音助手、导航、应用列表、桌面）
系统信息区：手机状态栏（如：信号、电量、时间）
应用内容区：桌面内容&应用内容
一种广而浅的应用导航模式，用户可在应用内不同分类间快速切换, 使用标签栏进行呈现，交互效率高。
通过每个界面做一次操作，直到用户到达目的界面，通过“返回键”可按原路径回到初始界面，层级跳转逻辑须可预测、易于理解与遵循。
返回功能是用户最高频的导航功能之一，在非首界面必须固定“返回”按钮的位置，以提升操作效率，降低用户认知和检索信息负担;
返回键固定显示在左上放靠近驾驶员侧（以左舵车为例）;
应用的非首屏界面可以是全屏或悬浮的方式（悬浮可减少界面层级跳转）。
页面大小1920x720px，左侧系统常驻边栏130x720px，上方常驻状态栏1920x55px，应用内容区域1790x665px。
应用侧导航尺寸推荐： 250x720px，收起icon大小120x120px，上、左、下边距分别是10px、232px、10px
选项按钮切图尺寸推荐： 250x120px，图标尺寸48x48px
默认图标和文字颜色为#ffffff，透明度60%；
选中文字颜色#34C0FF，透明度100%，图标颜色为#4EDCFF到#002496的渐变，角度为45度， 文字大小30px
返回上一级界面，返回键在各界面保持固定位置和大小，尺寸120*120px。
界面名称，文本不可换行。
标题区：展示弹框标题
内容区：展示弹框内容，可以是文字或图片，根据需要可在内容区增加“勾选”框
操作按键区：按键不超过3个，当按键布局超过弹框宽度，建议纵向排列
蒙版颜色#000000，透明度85%；弹窗大小900x450px，卡片圆角为20px。
按钮类型： 普通按钮，次要按钮；
按钮布局： 支持左右或者上下布局；
按钮状态： 初始态、点击态、不可点击态。
按钮类型：
普通按钮：用于一般界面操作。部分强调型按钮，可通过色彩、高亮等处理进行区分
次要按钮：最大限度减少按键对内容的干扰，通过高亮色以区分与普通不可点击文本
普通状态： 填充色为#00A2FA—#005AA6的-30度角渐变；描边1px，颜色#ABFFFC—#73CAFF的-60角渐变；内阴影颜色#76CBFF，模糊为5
点击状态： 填充色为#00A2FA—#005AA6的-30度角渐变；描边1px，颜色#ABFFFC—#73CAFF的-60角渐变；内阴影颜色#76CBFF，模糊为5；上边叠加20%#000000
次要按钮状态： 填充色为#001F4B；描边1px，颜色#2D5AA1；内阴影颜色#1D4E9A，模糊为11
次要按钮点击状态： 填充色为#001F4B；描边1px，颜色#4988EC；内阴影颜色#3781F3，模糊为11
不可点击状态： 填充色为#00A2FA—#005AA6的-30度角渐变；描边1px，颜色#ABFFFC—#73CAFF的-60角渐变；内阴影颜色#76CBFF，模糊为5，透明度为30%
页面有多个同级内容时，可通过子页签对其进行分页展示，以便快速访问，页签可以为文字、图标或图标+文字的样式。
页签展示数量不宜过多，建议2-5个以免界面拥挤。右侧最多可放置1个功能入口，整体页签采用左对齐方式。当界面横向显示控件不足时，需简化页签文本或使用图标以确保页签内容可见；
页签上允许有新事件标记，用于通知用户该页签下有新的内容或消息；
页签固定显示在界面中，不跟随页面的滑动而变换位置；
内容区向左/向右滑到底部继续滑动，不可直接切换页签项。
尺寸220x72px，文字大小为30px，正常状态文字颜色#ffffff，透明度80%；选中文字颜色#34C0FF，透明度100。
自适应布局是基于断点的静态布局。系统检测屏幕的大小并为其高度和宽度加载适当的布局。
基本方法包括拉伸、缩放隐藏、均分、占比、拆行、延伸。应用可使用一项或多项适配能力对界面进行自适应重组。
为保证在车机上的正常阅读，将字号分为8种，标题、重要文字、提示性文字使用42及以上字号，主要文字用36号，易于识别，而一些次要信息、示意文字将使用30px或24px的小字号，减少视觉杂讯。为了保证阅读，最小字号尽量不小于24px。
图标：最小的图标尺寸为6.9mm，推荐图标大小为9.2mm。
热区：最小10.7mm，推荐热区15.3mm以上，热区间隔3mm以上。
通过色彩透明度的变化添加黑（#00）与白（#FF）的调和，得出7种不同的颜色，以提炼出不同明度的灰色，使其作为系统中的主要配色体系，不同的灰色代表着不同的功能与意义。
在某些应用中，需要以图片作为背景时，也可根据自身需求，以透明度去设置色值。（如：#EEEEEE为列表分割线色值，当使用图片作为背景时，则可使用#000000 20%透明）
