diff --git a/zh-cn/application-dev/key-features/multi-device-app-dev/design-principles.md b/zh-cn/application-dev/key-features/multi-device-app-dev/design-principles.md index 1079073aa98e16ab58cc454254b6de20b2f19c91..9b2af2b3c312ec3c47d1d2abf9b165f97eaa52a5 100644 --- a/zh-cn/application-dev/key-features/multi-device-app-dev/design-principles.md +++ b/zh-cn/application-dev/key-features/multi-device-app-dev/design-principles.md @@ -1,6 +1,5 @@ # 设计原则和要点 - ## 设计原则 当为多种不同的设备开发应用时，有如下设计原则： @@ -21,14 +20,12 @@ 在硬件能力、交互方式、使用场景差异较大的设备上，除了考虑布局位置、内容宽度、横向组件数量，还需支持不同的输入方式、考虑功能架构的调整，避免出现输入不识别、功能不可用、使用困难的问题。 - ## 设计要点 很多用户的多设备体验以默认设备为核心或从默认设备往外延伸，因此，围绕全场景体验的OpenHarmony UX设计，将优先确保用户在不同的设备上获得跟使用默认设备类似的体验，同时充分利用设备的优势使体验最大化。 在进行OpenHarmony的多设备应用设计时，需考虑应用以下内容： - ### 自适应应用架构 使用自适应应用架构，可以确保应用在不同终端上，以最佳的导航形式来访问应用。OpenHarmony 在开发SDK上提供了便利，开发者可以通过简单配置轻松完成，无需从0开始构建。 @@ -37,8 +34,7 @@ ![一多-1-1](figures/一多-1-1.png) -更多应用架构的设计内容，详见：[应用架构](architecture-design.md)。 - +更多应用架构的设计内容，详见：应用架构下的[应用导航结构设计要求](navigation-design.md)和[应用页面结构设计](page-design.md)。 ### 响应式界面布局 @@ -56,15 +52,13 @@ OpenHarmony 提供了多种布局能力，开发者通过组合运用使内容 ![概述-界面布局-歌单详情高保真](figures/概述-界面布局-歌单详情高保真.png) -更多界面布局的设计内容，详见：[界面布局](interface-layout-design.md)。 - +更多界面布局的设计内容，详见：[界面布局](interface-layout-design-intro.md)。 ### 交互归一 交互归一描述了在多种交互任务或场景下，应用在触屏上和其它常用的输入方式（例如鼠标、触摸板、键盘）上分别对应的正确的交互规则。设计师和开发者应保证在当前输入方式下应用能够以正确的、符合用户习惯的交互规则进行响应。通常情况下，系统已经做好了这些事情，开发者只需正确调用。如果您的操作比较特别，您需要考虑多端上的交互归一，以确保用户体验的一致。 -更多交互归一的设计内容，详见：[人机交互](man-machine-interaction.md)。 - +更多交互归一的设计内容，详见：[人机交互](interaction-basics.md)。 ### 视觉参数化 @@ -72,8 +66,7 @@ OpenHarmony 提供了多种布局能力，开发者通过组合运用使内容 ![画板copy](figures/画板copy.png) -更多视觉参数化的设计内容，详见：[视觉风格](visual-style.md)。 - +更多视觉参数化的设计内容，详见：[视觉风格](visual-basics.md)。 ### 多态控件 @@ -81,7 +74,6 @@ OpenHarmony 提供了多种布局能力，开发者通过组合运用使内容 OpenHarmony默认提供支持多设备的控件，开发者可以直接使用并对不同状态进行自定义。例如平板可以连接蓝牙键盘和鼠标来做文字编辑工作，此时控件需要同时满足键盘和鼠标交互，需要支持获焦态和悬停态。 - ### 针对性优化 在上述设计内容以外，在具体设备上，推荐针对性地进行特殊的操作和布局优化，使之符合当前设备的使用习惯。 diff --git a/zh-cn/application-dev/key-features/multi-device-app-dev/navigation-design.md b/zh-cn/application-dev/key-features/multi-device-app-dev/navigation-design.md index 7bec736913b899523468cad314227f917c734231..41dcdb3b7203b3d1def7415f72b0db6589ef0c49 100644 --- a/zh-cn/application-dev/key-features/multi-device-app-dev/navigation-design.md +++ b/zh-cn/application-dev/key-features/multi-device-app-dev/navigation-design.md @@ -8,15 +8,15 @@ 导航需要遵循以下原则： -- **一致：**导航操作的结果应该与用户的期望保持一致。相同或类似的场景使用用户熟悉的界面布局和控件，在多设备上确保一致的应用架构和导航行为，让用户无论在什么页面，都知道如何导航。例如二级界面使用左上角的返回按钮来返回界面的上一个层级。 +- **一致：** 导航操作的结果应该与用户的期望保持一致。相同或类似的场景使用用户熟悉的界面布局和控件，在多设备上确保一致的应用架构和导航行为，让用户无论在什么页面，都知道如何导航。例如二级界面使用左上角的返回按钮来返回界面的上一个层级。 -- **清晰：**导航应该提供清晰的路径。用户使用的时候，逻辑关系简单且容易理解，能够知道当前处在界面的什么位置，操作后将会跳转到什么位置，不会迷失方向。例如使用底部页签，让用户在平级页面之间进行切换。 +- **清晰：** 导航应该提供清晰的路径。用户使用的时候，逻辑关系简单且容易理解，能够知道当前处在界面的什么位置，操作后将会跳转到什么位置，不会迷失方向。例如使用底部页签，让用户在平级页面之间进行切换。 导航要避免以下设计： -- **层级过深：**导航层级建议在三层以内。对于太深的层次，会带来操作效率的问题。如果确实需要深层级设计，建议使用面包屑设计或增加一键回到首页的功能。 +- **层级过深：** 导航层级建议在三层以内。对于太深的层次，会带来操作效率的问题。如果确实需要深层级设计，建议使用面包屑设计或增加一键回到首页的功能。 -- **导航复杂：**在侧边导航中，使用底部页签，会让操作变得复杂，建议仅使用侧边导航。 +- **导航复杂：** 在侧边导航中，使用底部页签，会让操作变得复杂，建议仅使用侧边导航。 ## 导航的分类