系统类界面、数据仪表盘、PC端UI，三级菜单应该怎么设计？

今天讨论一下系统类UI界面、数据仪表盘、PC端UI，三级菜单应该怎么设计？通常的导航布局包括：
上-上-上
上-左-左
上-上-左
上-左-上
左-左-左
左-上-上
左-左-上
左-上-左
我们分别从用户响应速度、用户犹豫率、光标移动、选择出错率和用户使用偏好几个角度来看一下那种最好。

1、用户响应速度
通过研究发现，左侧导航总比顶部主要导航更快些，此效果也适用于左侧二级菜单级别。研究还发现，当一级与二级和三级分开时，导航速度会更快。总体而言，左-上-上 和 上-左-左 的用户响应速度最快，上-上-上 和 上-上-左 最慢。

2、用户犹豫率
犹豫是指用户犹豫是否要将光标从一个菜单级别移动到另一级别子菜单。在所有布局中，左-上-上的犹豫最少，而左-上-左的犹豫最多。当第二级和第三级处于同一平面时，犹豫感显着减少，反之犹豫率增加。

3、光标移动
光标移动到不正确平面的频率代表光标移动。当主菜单位于左侧时，光标移动较少。当辅助级别与主级别分离时，光标移动也会减少。当二级和三级菜单位于不同平面上时，会发生许多光标移动。但当他们在同一平面时，表现会更好。
左-左-左 和 上-上-上 的光标移动最少，而 上-上-左 和 上-左-上的光标移动最多。

4、选择出错率
选择出错率表示点击次数过多表示选择错误。当主要级别位于左侧平面时，发生的选择错误最少。与顶部初级相比，左侧初级可减少 80% 的选择错误。 当初级和次级都位于顶平面时，会发生大量选择错误。
上-上-上 和 上-上-左表现最差。当二级和三级与一级位于不同的平面上时，发生的选择错误会较少。
左上左 和 左左左的表现最好。

5、用户使用偏好
用户使用偏好大多数用户更喜欢使用左侧初级而不是顶部初级。左-上-上 和 左-左-左 为最优选。左-上-上和左-上-左是最不受欢迎的。这种效果意味着用户不喜欢在多平面间来回跳跃切换。

综上研究，最佳与最差整体表现
根据每个布局在所有标准类别中的表现，对每个布局进行总体评分。
性能最佳的导航布局是：左 上 上，其次是 左 左 左。
表现最差的是：上-上-左 和 上-左-上。
最好的比最差的快大约 17 秒。

左-左-左 比 左-上-上 慢，是因为当所有菜单都在左侧时，用户需要通过滚动项目列表查看，随着级别的扩展和深入，用户必须滚动以更多内容，并且无法再在单个屏幕上查看所有主要项目。

左-上-上的屏幕视图优势允许用户一次查看更多主要项目，无论他们导航的深度如何。然而，由于顶部导航栏，他们在每个屏幕上看到的内容较少。因此，用户体验到的菜单滚动较少，但内容滚动较多。

最后，对于用户体验设计的影响：
这项研究具有三个重要的设计意义，将极大地优化三级菜单的导航速度。
1：主菜单应该位于左侧而不是顶部
将节省约 17 秒，因为以列列表的形式组织菜单项使它们更容易浏览。当项目位于列而不是行中时，用户可以在单个视图中看到一组项目。使用顶部主选项时，用户在扫描行时只能单独查看项目。

2：主菜单应与二级菜单和三级菜单位于不同的平面上
将节省约 23 秒，因为主菜单是父类别，其优先级高于子类别。当二级和三级与一级分开时，可以清楚地区分层次结构并防止同一平面上的视觉混乱。

3：二级菜单和三级菜单应在同一平面上
将节省约 9 秒，因为二级和三级都是父类别的子类别，使它们更加相关度。将它们放在同一平面上可以使从一个子项导航到另一个子项更加直观且更容易遵循。

当您在设计系统类UI界面、数据仪表盘、PC端UI时，请参考上面的研究报告，当然很多理论不能一刀切，具体情况具体分析，有时候还要考虑开发边界问题，设计出最适合您产品的UI才是当下你值得拥有的最佳设计产品。