iOS人机界面设计指南 #3 新手教程&加载
翻译iOS人机界面设计指南。译文内容有删改,并增加了个人注解和案例补充说明, 仅供参考, 欢迎交流~
目录
新手教程 (Onboarding)
- 新手教程页是为了帮助用户享受你的APP
- 迅速响应
- 预见帮助
- 教程简练
- 让学习变得有趣和可见
加载(Loading)
-明确何时显示loading
- 尽快显示内容
-加载时提供教育或者娱乐缓解等待焦虑
-个性化加载
---------------------------------------
新手教程 (Onboarding)

新手教程页是为了帮助用户享受你的APP而不是为了设置APP (Provide onboarding that helps people enjoy your app, not just set it up.)
用户希望能通过新手教程更了解你的应用,但他们也希望它能够快点开始使用APP。因此, 避免在你的欢迎页中包括设置和许可的细节。
//“选择你感兴趣的内容...选择关注的博主...填写你的个人资料...”用户不会希望一上来就进行过于详细的设置.
迅速响应 (Get to the action quickly.)
当系统将你的启动页替换为首页后,让用户直接开始享受你的应用. 如果你需要提供教程或介绍,记得提供跳过的选项.
//允许跳过, 给予用户掌控感
预测帮助需求 (Anticipate the need for help.)
主动寻找用户可能陷入困境的时候。例如,游戏可以在暂停或角色停止前进时不经意地展示有用的提示。允许用户重新查看新手教程,以防他们第一次错过了什么。
//把握新手教育的时机, 通过逻辑条件约束触发新手教育, 让教育出现得更恰当合理, 才能让用户自然地接受.
教程简练 (Stick to the essentials in tutorials.)
为初学者提供指导固然不错,但教育不能取代优秀的应用设计。首先,让你的应用更直观。如果需要太多的教育,那就重新审视你的设计。
//最理想的优秀设计是不需要教育的, 存在本身就足以自我解释.
让学习变得有趣和可见 (Make learning fun and discoverable. )
从实践中学习比阅读指导清单更有趣,也更有效。使用动画和互动来循序渐进地进行教学。避免显示交互性的静态截图。
//假装有交互性的静态截图, 也是伪互动教学. 典型案例: 箭头、遮罩、“XXX在这里”、下一步
--------------------------
加载(Loading)
当内容在加载时,一个空白或静止的画面会让APP看起来像是卡住了,导致用户困惑和沮丧,甚至直接关闭APP。
明确何时显示 (Make it clear when loading is occurring. )
- 至少显示一个转圈圈来表明加载中。
- 显示进度让用户可以判断还需等待多久会更好.
尽快显示内容 (Show content as soon as possible. )
- 让人们在看到内容之前等待内容加载 ❌ 立即显示内容页, 使用占位文本、图形或动画来标记尚不可用的内容 ✅
- 尽可能在后台预加载即将到来的内容,例如在播放动画时或用户在浏览菜单时

加载时提供新手教育或者娱乐缓解等待焦虑 (Educate or entertain people to mask loading time.)
- 可以考虑提供有关游戏玩法、有趣的视频序列或有趣的占位符图像的提示。

个性化加载页 (Customize loading screens.)
- 标准的进度指示器一般也是可以的,但可能会脱离APP的背景。
- 考虑通过与您的应用程序或游戏的风格相匹配的自定义动画和元素来设计更逼真的体验。





















































































