App开屏页如何设计？来看这五个常用的方法
第一印象很重要！很多用户会根据App/网站的初始形象来判断是否能信任这家公司或产品。
那么如何解决快速感知的问题呢？ 首先将关注点放在App带给我们的第一印象上。合理的启动页能激发用户的潜意识，有助于吸引和留存合适的用户。
在深入研究设计策略之前，先来了解一下启动画面的基本知识。
启动画面指一系列连续的使用体验—— 从用户点击应用图标开始到内容加载完成为止。 通常包括以下五种形式：
1、应用图标 (参与启动体验的第一个环节)
2、启动画面 (开屏页)
3、开屏页跳转到内容页
4、骨架屏的启动形式 （待加载状态）
5、动画式开屏 （加载更多内容）
开屏页是产品体验的门户， 通过模拟更快的加载时间、创建无缝的启动体验来提升用户体验。
设计不只关注外观，更关注解决特定用户问题的方法。 启动页能解决哪些问题呢？
- 在潜意识中与用户交流，并设定对未来的预期；
- 通过隐藏加载过程来减少可感知的等待时间；
- 向用户介绍App的用途和品牌；
- 为用户提供愉快的体验。
通过对问题的梳理，这里总结了开屏页设计的5种方法，有效吸引用户的注意力。
从iOS10开始，开发者可以将预定义的图标进行个性化设置。例Bear允许用户根据主题色调整图标的颜色。
MLB允许用户选择自己喜欢的团队作为启动图标。
启动页像是一种持续的营销活动，因为用户每打开一次App就会加深对品牌的印象。
通过在启动页中添加标志性的slogan或者图像，既能强调App的用途也为用户设定了一定的期望。
例如上图的3个应用将品牌logo放在开屏页中，这样的设计对用户的感官有直接的刺激。
上图的History、DocuSign和Ted三个App，通过在开屏中添加标语来强化价值主张。
从点击图标到内容加载，中间有一段可感知的加载时间， 如果在这段时间内融入合适的动画，用户能对产品状态有提前的了解。
上图的三个App都利用动画在开屏页和内容页之间建立了无缝的桥梁。
Google，TinyFax和Cinamatic这些App利用动画将图标巧妙地转换成内容。
同样上面的三个App虽然使用的动画不算很细腻，也能完成从初始页到内容的过渡。
有些应用的动效则保持简单，如上图只将标志作为突出展示。
Chick-fil-A在开屏页上添加提示动画，成功将用户引导到内容页。
对于大多数应用来说，使用开屏页+骨架屏的形式更有意义，因为轻量级的应用通常加载速度非常快，骨架屏能获得更流畅的体验。
这些应用在启动页面预加载主页的内容，Breathe(中间)使用与主页内容相似的彩色骨架。Transit(右边)使用地图的骨架作为启动页，加载完成后方便用户直接点击。
上图的应用通过预加载和动画来把握时间，给人一种“即将到来”的印象。
和前面的应用相比，Snow 、Dribbble和Launch Pro使用的骨架状态很少。
有些App启动时需要加载大量数据，例如视频、音频，所以需要大量加载时间。
对于这类应用，稍微长一点的动画更有意义。 随着数据的缓存和加载时间的缩短，动画可以变得越来越短。
上图的App使用动画来加载数据，给用户带来反馈的时间。
Clashem，Tumbleweed和Chefsfeed使用有趣的动画在加载数据的同时又加强了品牌体验。
看了这么多案例，启动画面到底要显示多长时间呢？ 这应该考虑应用的配置和加载数据需要的时间。
自定义启动体验以适应不同的使用时间和用户：
· 各个阶段的用户要有不一样的启动体验；
· 先考虑应用的大小再选择合理的启动页；
· 用图像传达信息，动画作为引导；
· 尽可能使用独特的图标来进行品牌推广。
希望文章能够让你有所收获～
精彩推荐：
1、聊聊卡片式设计的运用
2、案例分析：栅格系统的布局设计
3、如何设计深色模式？这3点因素需要考虑
4、深度解析：服务蓝图的应用逻辑 设计
App中的空白页面应该如何设计？
我认为做一个产品面向于用户时，就像是跟对方交流一样，你的语言就是你的App所呈现给用户的内容。你需要用你的界面跟你的用户去对话，沟通，才能让你们之间的交流顺畅且具有持久的粘性。所以说，每一个页面，你都需要设计的合理，以便让这个页面在被用户看到的时候，是可以说话的，是对方能理解的，是可以引导对方去跟你交流下一步的。好了，回归话题，App的空白页。第一个问题，你的App为什么会产生空白页面？App启动的时候（冷启动，无内容）App出错的时候用户内容为零的时候先说App启动的时候。如果用户第一次打开你的App，你需要有一个靠谱的开场白来让你们迸发出第一句话吸引到你的用户。所以建议在App启动的时候，页面最好有一些预置的内容。比如说，你的App中的内容需要用户注册或者是登录后才能使用。所以很多App一上来就以一个生冷的画面，要求用户去注册或者是登录。换个角度，你是用户的话，遇到一个一上来让你掏身份证的人，你会跟他继续交流么，肯定不会啊。所以，这个时候你应该预置一些内容，比如一些吸引的跟登录后的内容有关的资讯类的东西，让用户先行浏览，浏览后用户后下一步欲望操作的时候，你要求他登录。如果，实在是没有什么优质内容可以免登陆查看的话，那么，可以让你的第一个页面更加“性感”、“有意思”，吸引用户“渴求”进一步操作，“渴求”与你的对话沟通。这个时候，就要考验你的设计团队能力了，不过，作为产品经理，你需要有自己的核心想法并且传递给你的设计团队。然后，App出错的时候。这有可能是用户操作失败了，或者是网络失败了，或者是其他什么问题。无论是哪种情况，都是需要“和谐”的对话的。这就像是你跟用户交流的时候，突然出现故障了，你需要站在你的用户的角度想想，遇到聊天中断的故障时，用户的第一反应是什么——“我擦，出什么事了”。看到了吧，不安的焦躁的情绪。所以你的第一任务是——安抚你的用户，安抚你的聊天对象。安抚的方法可以是你的页面展示元素，也可以是一句温馨的打趣的好玩的话。用户的情绪稳定后，第二反应是——“为什么会这样”，你要用最简洁的语言跟对方解释清楚为什么会这样，例如“网络连接失败”用户知道出错原因后，第三个反应是——“我该怎么办”，你需要有直观的引导方式来告诉用户应该怎么操作才能解除这个问题，例如“稍后再试”、“立即刷新”、“去设置网络”此处，建议页面设计地应该有一些灵动性，符合你的App整体风格，或严肃，或卖萌，或调侃，或温情。然后，用户内容为零的时候。这有可能是用户删除了整个页面的内容，也有可能是用户误打误撞进来了一个无内容的页面。OK，anyway，这个页面啥也没有了，也没有出错，遵循页面功能的原则，也不能出现该页面功能无关的内容。还是跟聊天一样，试想一下你和用户正在交流，他问了你一句话，你无法回复给他答案。这个时候你应该怎么做呢？是应该站着不要说话？NO，no，当然不是，这样你聊还怎么继续聊天。你需要做的就是告诉他“不好意思，我没有什么可以回复的了”。so，这个页面，第一个要表现的元素就是——“页面内容为空这一事实”。其次，为了让你们的对话继续下去，你可以建议你的聊天对象做点对应的事情，会不会让聊天更有持久性。比如，你们的对话可能是这样的“不好意思，我没有什么可回复的了，不过你可以看看那儿没准可以让我回复”。so，这个页面的第二个要表现的元素就是——“建议用户可用的操作”OK，先讲这么多，有问题可以单独留言给我~
app设计的原则及注意事项？
原则：优秀的ui界面是隐形的，华丽的装饰和不必要的元素都已经被剔除，简单直接的页面逻辑和直观必要的元素构成了这样的ui界面。设计ui的时候，你在添加任何元素的时候，都最好问一下自己“这个功能是否会影响用户现有的任务，它是否真的必要，”先将你的ui内的元素限定为必须得，专注于核心的用户体验。清晰应该是所有ui界面都具备的基本属性。请记住，你的ui界面存在的目的是让用户能够更便捷地同你的系统进行交互，为此，它需要能够清晰地同用户进行沟通。一致的设计能够让用户对于你的设计模式更快认知、熟悉，并且在此基础上快速适应整体的体验。所以，用户是期望借助自己习得的经验，来探索更多的内容的，而探索能否有效就得看设计的一致性是否够好了。在整个ui设计中保持一致的语言、布局和设计规律，整个用户体验会显得更加“通透”。注意事项：1、时间戳在设计时间戳时要注意，选择什么样的日期分隔符。2、超长信息在设计的过程中，标题和描述这种东西，会有大量长度的超出范围的情况，内边框保留多少，会不会超出、要不要换行这些基本问题都要搞清楚才行。等到要测试上线才发现，这就面临着又要修改的问题。3、空数据所有的列表都可能出现空数据的情况，所以说设计方案不可或缺。4、加载加载时间的长短，很大程度的决定了用户体验是否有所提升，虽然理想中的页面加载出来应该一秒就够了，但是设计师不要忽略网络问题!如果网速不够的话，页面加载三五秒都算是快的了，所以在用户等待的过程中，设计师也可以通过比较可爱，简单的小设计，安抚用户。从移动互联网特征的角度来看，app设计的基本八条原则：1、内容优先，合理的布局对于手机而言，屏幕空间资源显得非常珍贵，为了提升屏幕空间的利用率，界面布局应以内容为核心，而提供符合用户期望的内容是移动应用获得成功的关键。如何设计和组织内容，使用户能快速理解移动应用所提供的内容，使内容真正有意义，这是非常关键的。（1）充足内容，使内容符合移动的特征。（2）优先突出用户需要的信息，而简化页面的导航。（3）适时提升屏幕空间的利用率。2、是为移动触摸而设计点击操作是PC时代交互的基础，在触摸屏设备上基于手指的手势操作已经代替了鼠标的点击操作。（1）以信息架构为基础，简历手势交互规范。（2）优先设计自然的手势交互，而不是TAP点击（3）引导用户在情境中学习手势操作。（4）特殊手势不是必须的。（5）可触区域必须大于7×7mm,尽量大于9×9mm。（6）手势操作需要提供过程及反馈演示。3、输入方式的转换文字输入是移动端的软肋之一，不管是手写输入还是键盘输入，操作效率都相对较低。在行走或者单手操作时，输入的出错率也比较高。（1）减少文本输入，转化输入形式。（2）简化输入选项，变填空为选择。（3）使用手机已有的传感器输入。4、操作流程必须确保流畅性在移动产品的操作过程中会碰到多种多样的情况——找不到目标、不知道该怎么操作、操作后没有及时反馈，等等，这都会对产品的流畅性造成影响。在移动产品的设计中主要从三个方面来考虑产品的流畅性：（1）手指及手势的操作流。（2）用户的注意流。（3）转场流畅或者自然，不能牵强！5、多通道设计多通道设计是指系统的输入和输入都可以由视觉、听觉、触觉等来协作完成，协同的多通道界面和交互也会让用户更有真实感和沉浸感。当前各个系统平台的基础技术已经越来越成熟，语音输入、手势识别及其他由多种传感器组成的综合识别系统也会给用户带来更接近自然的感觉。作为产品设计师或APP设计师，也可以从其他通道的角度思考设计，给用户更好的交互方式。6、移动APP产品必须具备易学性对于移动产品，提倡的是简单、直接的操作，倾向于清晰地表达产品目标和价值。让用户快速学会使用，尽量不要让他们查看帮助文档。界面架构简单，明了，导航设计清晰易理解，操作简单可见，通过界面元素的表意的和界面提供的想说就能让用户清晰地知道操作方式。只有这样的设计，才能让用户的学习使用没有负担，而不是通过帮助系统来教会用户操作。7、避免干扰和打断在玩手机时突然没电了、写微博时又被老板叫去做重要的事情、在搜索商品时收到一条重要的信息在移动情境中，被各种其他的事情打断是很正常的。（1）保存用户的操作，减少重复劳动。（2）网络中断状态或编辑中断状态。（3）衔接用户的记忆而不是让用户重头开始。8、移动设计必须有爱评价一个移动产品用户体验的好坏，除了要看它是否满足用户需求和是否基友友好的可用性之外，能让用户感受到惊喜是在移动产品设计最为推崇的。这样的设计往往是超越了用户的期望，它的表现是功能、交互或者操作流虽不是用户预期的，但是用户能很好地理解，并且更高效、更有趣地完成任务。移动产品的设计应是惊喜有趣、智能高效和贴心的。从用户的角度来看，APP指导性设计八个规范：1、充分考虑用户的使用习惯。2、尽量减少产品层级以及深度。3、操作栏的设计。必须遵守确保优先展示操作按钮的准则。4、设计要主次分明。将主流用户最常用的20%功能进行显现，其他进行适度的隐藏，越不常用的功能，隐藏的层级越深。5、始终提供明确的导航，即要提供明确的返回上一级的操作，不能中断操作流程。6、自动保存用户输入的内容或一些输入提示信息。7、APP底部工具栏导航数目3-5个为最佳8、尽量去猜测用户的行为，但要允许纠错比如，用户在进行搜索时，可以根据用户最近的搜索行为给出参考答案。
app设计有哪些注意事项?
一、时间戳相信许多设计师在做app设计的时候都会忽略时间戳这个问题，因为用户对相对时间更加敏感，所以对于时效期内的信息，会倾向于提供“相对时间”。在设计时间戳时要注意，选择什么样的日期分隔符。二、超长信息在设计的过程中，标题和描述这种东西，会有大量长度的超出范围的情况，内边框保留多少，会不会超出、要不要换行这些基本问题都要搞清楚才行。等到要测试上线才发现，这就面临着又要修改的问题。三、空数据所有的列表都可能出现空数据的情况，所以说设计方案不可或缺。四、加载加载时间的长短，很大程度的决定了用户体验是否有所提升，虽然理想中的页面加载出来应该一秒就够了，但是设计师不要忽略网络问题!如果网速不够的话，页面加载三五秒都算是快的了，所以在用户等待的过程中，设计师也可以通过比较可爱，简单的小设计，安抚用户。
