UI/UX 设计师是产品开发团队中非常重要的职位。他们是客户和程序员之间的桥梁，他们解码客户洞察，与业务目标协调一致，并将其转化为产品的功能、交互和界面。他们可以承担前期工作，总体策略，或者产品流程应该如何，按钮应该是什么颜色等细节工作。UI/UX Designer除了研究和设计，还做数据分析和测试工作来优化产品。

作为 UI/UX 设计师，您将参与产品开发过程，从最初的客户需求文件到完整的 UI。
工作性质使你专注于处理项目的核心问题。您的 UI 让客户满意，因为您解决他们业务问题的方式非常好。这就是为什么您有时会忘记 UI 的其他子组件的原因。没有它，你的产品仍然可以正常工作，但从用户的角度来看，缺少这些组件会使他们的体验变得更糟。
在成为高级 UI/UX 设计师的过程中，您应该改进这些点，并尽可能地为客户和开发团队提供最完整的 UI 版本。
以下是许多新的 UI/UX 设计师在设计过程中忘记的组件。

1、引导页

当您第一次打开下载的应用程序时，主要的介绍屏幕是引导屏幕。引导屏幕是一个指南，旨在简要介绍应用程序、其主要功能以及如何使用它。
引导界面设计风格简洁，内容过滤，主要功能优先介绍。创建诸如静态页面之类的入职屏幕是为了通知和教育用户。在 UX 方面，引导屏幕使用户免于开始使用应用程序时的困惑以及必须自己找到应用程序功能的挫败感。

App onboarding design by Raquel Sánchez

Walet.vip Onboarding UI Design by Alwi Hesa

Cleaner Intro Screen by me

使用引导页的目的 用户已经安装了该应用程序，无需阅读说明手册。用户还不熟悉应用程序的用户界面或准备好了解它。
欢迎用户并让他们对即将到来的体验感到兴奋 促使用户采取行动以提高参与度和保留率。

2、骨架加载器

骨架只是一组预定义的框架，用于在等待数据加载时替换您要显示的内容。骨架有助于提高用户体验，并且在您的页面/应用程序有太多数据无法加载的情况下特别有用。

骨架的目的是简化加载内容的预览框架，以减少用户对数据完全加载所需时间的期望。元素应该有骨架，例如头像、卡片、图表、列表、表格、文本内容、图像等。

Skeleton Loading Animation by Shane Doyle

何时使用骨架加载器

• 一旦内容已经加载并且用户已经交互，当重新加载页面时，不需要骨架
  不需要立即显示内容且加载时间不长的框架
  不要同时使用微调器加载和骨架加载
  设计时应该用不同层次的灰度来表示，并有加载动画让用户知道他们正在加载。
  使用与内容对应的形状，每个形状代表内容，便于识别。比如头像用圆形，长文字用矩形。

3、空状态

空状态是用户进入页面但没有任何内容可显示时的状态。然后你需要一个这个页面是空的没有数据的插图，你可以从中向他们建议采取行动。例如，对于一个空的待办事项列表页面，您可以添加“创建待办事项”操作。

Google drive with a hint

4、启动画面

初始屏幕是用户启动应用程序或网站时看到的介绍屏幕。这是一个建立您的品牌形象的机会，它可以让用户在您的应用程序在后台加载时保持忙碌。此屏幕可以是图像、图形、徽标或动画，有时还带有进度条。当设备运行缓慢且互联网速度更慢时，经常使用启动画面。

移动应用程序的问题在于您无法承受长时间的等待；用户等待的时间越长，用户放弃应用的可能性就越大。闪屏让用户的等待时间不那么痛苦。

5、404错误页面

当用户登陆不再存在的页面、输入的 URL 不正确或链接进入死胡同等情况时，网站会将您带到 404 页面。当他们被定向到错误页面时，它会打断他们的流程，从而导致沮丧感，他们会找到返回的路。所以你应该需要设计错误页面，否则会导致用户当时对网站失去兴趣。在这些情况下，跳出是产品用户体验不好的明显标志。
用户离开网站不仅是用户体验问题，而且对搜索引擎优化也不利（404 页面是谷歌搜索引擎优化排名因素之一）

Awesome 404 page by Dribbble

6、没有网络状态

用户的设备并不总是连接到互联网，或者有时互联网连接速度很慢，以防他们在飞机上，突然失去 wifi 连接。然后有时，UI 必须显示一个屏幕来告诉他们连接的问题，类似于空状态，错误，这是一个破坏用户体验的问题。
如果您的应用程序具有仅在用户连接时才可用的功能，则您应该向用户发送有关当前连接状态的通知。您可以以 toast 元素的形式显示带有文本标签“您处于离线状态”的离线图钉图标。

设计数字产品是复杂且多步骤的，导致设计师有时会忘记增强用户体验所需的其他不重要的屏幕元素。

来源：NALS工程