模式 启动屏幕

启动屏幕

启动屏幕是用户对应用的初体验。

骨架屏会显示应用的核心结构元素,例如状态栏和应用栏,直到应用内容加载完成。

品牌启动屏幕显示你的 Logo 或其他元素,以提高品牌认知度。

用法

骨架屏适用于加载时间非常短的应用。

Material Design 启动屏幕为用户提供初次体验

启动屏幕类型 Expand and collapse content An arrow that points down when collapsed and points up when expanded.

在启动应用时显示空白画布会增加用户感知到的加载时间,因此可以考虑使用骨架屏或品牌启动屏幕。

骨架屏是最无缝的启动过渡——它适用于应用启动以及应用内的页面过渡场景。

品牌启动屏幕提供短暂的品牌展示,让界面可以把重心放在内容上。

Material Design 中的品牌启动屏幕

品牌启动屏幕

Material Design 中的骨架屏示例

骨架屏

骨架屏 Expand and collapse content An arrow that points down when collapsed and points up when expanded.

当应用的加载时间非常短,或没有强烈的品牌需求时,使用骨架屏可以减少过渡次数,并让用户感知到更快的响应。

启动时,核心结构元素(例如状态栏、应用栏和底部面板)将在没有内容的情况下显示,直至应用内容加载完毕。

Material Design 中的骨架屏示例

骨架屏示例

品牌启动屏幕 Expand and collapse content An arrow that points down when collapsed and points up when expanded.

品牌启动屏幕是应用加载时展示品牌形象的好方式。利用加载时间来显示 Logo 或其他可提升品牌识别度的元素。避免在此屏幕上使用文字,但 Logo 以及(如适用)标语除外。

品牌启动屏幕

启动屏幕应仅用于从主屏幕进行初次(冷)启动。如果应用正在运行,或是从其他应用启动,则不应显示启动屏幕。

Material Design 中的品牌启动屏幕示例

品牌启动屏幕示例

Material Design 中的品牌启动屏幕示例
Material Design 中的品牌启动屏幕示例
Material Design 中的品牌启动屏幕示例