三板斧帮你快速搞定移动缺省页设计

   饭饭妥妥的:缺省页面,是出现在用户没有提交任何资料或者网络连接不通畅的情况下所展现的页面。通常设计师们习惯用丰富的数据内容把页面设计得美观实用,考虑的都是界面展现的“理想状态”,往往会忽视没有内容的“缺省状态”。未经过精心设计的缺省页面降低了用户的使用体验,并可能给用户带来困扰,如下图iOS系统邮件App,无邮件时界面上没有任何有效反馈信息,用户不能明确得知到底是网络问题还是账号同步出错亦或者是收件箱内确实一封邮件都没有。同样的情况也出现在Pinterest和出发吧的界面里。


  那什么内容可以被添加进入缺省页面从而使其“丰富友好”呢?Nathan Barry 在 Designing Web Application 中提出了“WWH”的概念来帮助产品设计师解决此类问题。

  告诉用户什么样的数据将会出现在这里(What)

  首先,用户很可能是第一次接触你的产品,他们对于使用还不是很了解,而这正是你可以利用缺省页面向他们提供说明的好机会。设计时可以使用简单明了的文案告诉用户这里将会放置什么样的内容。花点心思在这里,不要让空白的缺省页成为用户最后看到的状态。

  下面是一些优秀的范例:

  支付宝钱包的电子券和行程单页面通过票据图形+文字清楚地说明该分类下会出现什么内容,并在屏幕下方提供添加票据的按钮。


  Dropbox是笔者非常喜欢的一款网络文件同步工具,产品面临的问题是需要引导用户上传内容。应用在用户首次使用收藏、相册及提醒功能时通过灰阶加线条风格的图示和浅白的文字说明告知用户如何使用这三个功能,画面在保持一贯品牌风格的同时也降低了用户因为列表内空无一物而产生情绪上的挫败感。


  除了简单的图标加文字说明之外,一些应用还有一种更为快捷直接的方式:预置内容,即让用户直接体验真实的信息内容,或是一些范例信息,而不需要凭空想象。

  Shadow Puppet可以把照片和视频剪辑结合声音、贴纸等制作成动画,制作简单,被誉为视频版的PPT。它的首页预置了展示用的视频样本,用户可以通过观看视频案例对Shadow Puppet的视频制作有感性的认知。


  告诉用户为什么要在这里提交内容(Why)

  在了解完信息的内容形态以后,就要提供给用户一个提交内容的理由。缺省页的设计应该简单告诉用户建立内容的好处,比如你可以认识更多人,可以更有条理也更高效地管理信息等等,帮助用户产生使用目的。

  多看阅读的已购和云空间缺省页面直接告诉用户:快来买书并上传到云空间吧,这样你就能有跨平台同步书籍的体验了。


  充满情感的文案和图示也可以激发用户提交内容的兴趣。Headspace是由Headspace.com出品的一款专注于教人们怎么冥想并提供语音引导的应用。它在缺省状态下的朋友页面就提供给了用户这样的理由,通过添加朋友,可以监督和鼓励彼此的冥想过程。看到这样萌萌哒的缺省页面,用户还有什么理由不邀请好友一起来互相监督呢?


  或者可以像兴趣社交应用Same一样,通过俏皮的文案来激励用户在自己的频道添加内容。


  通过明确的步骤性的操作引导用户如何提交内容(How)

  给用户明确的操作指引,在界面中提供明显的按钮、箭头指示用户操作。指示内容最好在一页内显示完毕,如果步骤多,可以拆分到具体使用过程中进行指导。

  “乐动力”的好友排行页面,在没有添加过好友的情况下,该页面展示了一些社交网络的图标和大大的添加按钮提示用户可以通过绑定社交账号来找到更多好友一起PK运动量。


  Pocket是一个可以让用户把内容(文字、图片甚至视频)一键保存下来,用于其他时间完成阅读的工具。在初次使用时它的列表页面内没有内容时,会显示一个“了解如何保存”的按钮,点击可以详细了解添加列表的各种方法。


  Taasky和Clear作为两款交互优秀的任务应用,都拥有非常丰富手势操作,它们没有像别的软件一样在界面上加遮罩、标注做出冗长的用户教育页,而是直接将操作指引嵌在一条条的任务里,用户只要跟着当前任务的简单描述滑动屏幕就能了解全部手势操作,即充实了原本空白的缺省页面又很自然地指导用户如何使用该软件。


  Orgami是一款折纸风格的记事App,在首次打开应用时,笔记页面内并不是空空如也,当然这些预置内容不单纯是为了美观,和应用相关的操作指引也包括在这些便签内。


  总结

  缺省页面的状态多半是用户刚开始使用应用时才会被看到,这时他们仍然对你的产品有些耐心,设计师应该把握住这个天然的与用户对话的机会,可以从以下几点入手设计出空而不空的缺省页面。

  1. What

  明确指出页面内会出现的数据。

  可以试着让用户直接体验范例信息。

  2. Why

  激励用户提交内容。

  3. How

  操作引导。

  精简步骤。

时间: 2024-10-29 12:35:54

三板斧帮你快速搞定移动缺省页设计的相关文章

帮你快速搞定网页配色的方法(附配色神器)

  完全零基础的新手如何做好网页配色?今天@喪心病狂十六夜貓 这篇好文,从网页基色.强调色.深色到应用整个配色方案 都有详细的流程与教学,每个步骤几乎都不用思考,用文章提供的配色神器就可以搞定了,你只要决定整个风格就行了.好东西千万別错过,来收! 目录 决定基色 决定强调色 决定深色 让我们应用配色方案 01. 首先决定基色 首先,来决定网站的基色吧!虽然说你可以使用任何你喜欢的颜色,但为了让别人理解你的设计意图和理念,尽量还是需要注意以下几点. 善于使用手边的资料 客户端的标志上常用的颜色,往

4个流程帮你快速搞定运营设计!

  请同学们留出3--5分钟,看完这条微博要用.前两天<我是歌手>失控,汪涵超强的救场能力让大家都看到他背后几十年的沉淀.同理,设计师想适应运营短且快的特点,持续高产,有一套可执行的流程非常重要.微博之后,更加精彩 >>> 在现如今的社会中,每天都在进行着一场场没有硝烟的商战.运营设计则是至关重要的一部分.那么怎么才能做出一个好的运营设计或者一个相对比较成功的运营设计呢?我们要知道设计的目的. 设计的目的是什么? 设计核心在于能够让用户在有限的时间内Get最有价值的信息,找到

大数据的设计师帮你快速搞定一个极简风格网站

  如何快速做出一个极简风格网站?国外某个网站统计分析了112个明显带有极简风格的网站后,发布了这篇超级干货.全程都是以数据来说话,从占比最大的设计要素开始说起,有案例有分析,把极简风格的设计彻底发挥到了术的地步. 最小化设计的目标是移除界面当中不必要的元素或内容,减少干扰,使界面最大程度的支持用户的任务流程. 要将界面以恰当的方式简化到只保留必要元素的程度,设计师需要对一系列与最小化策略高度相关的设计模式有所了解.界面设计,就像人类的语言一样,最终是由人们的使用方式所定义的.如今,虽然"最小化

如何快速搞定一份看起来还不错的PPT?

  纸面功夫30%.素材收集30%.软件制作20%,今天这篇是阿里巴巴的资深交互设计师@Heidixie 在内部分享的干货,重在帮你摆脱工具,直击PPT「沟通传达」的本质. 新年除了做工作规划,还做了一些个人2016年学习和提升计划,其中,"聚焦"又是工作中项目的关键词,也是个人提升这块的关键词. 所谓厚积而薄发,在我理解,反而是之前要做大量的积累(所谓厚积),而之后更多的是垂直向下深挖打透,在这个基础上,才能够薄发一些可给别人以启迪的东西. 那么我的2016,想要聚焦于[可视化]话题

经典算法(6) 快速排序 快速搞定

快速排序由于排序效率在同为O(N*logN)的几种排序方法中效率较高,因此经常被采用,再加上快速排序 思想----分治法也确实实用,因此很多软件公司的笔试面试,包括像腾讯,微软等知名IT公司都喜欢考这个 ,还有大大小的程序方面的考试如软考,考研中也常常出现快速排序的身影. 总的说来,要直接默写 出快速排序还是有一定难度的,因为本人就自己的理解对快速排序作了下白话解释,希望对大家理解有帮助 ,达到快速排序,快速搞定. 快速排序是C.R.A.Hoare于1962年提出的一种划分交换排序.它采用了 一

怎么用SmartArt快速搞定PPT图片排版

  怎么用SmartArt快速搞定PPT图片排版         SmartArt是PowerPoint自带的一款插件,或许你没有听过,或许你听过了,但是不会用,本文讲述了使用SmartArt快速搞定PPT图片排版. 首先我们了解一下,这款神器在PPT中的位置,只要点击插入菜单就能在弹出的工具栏中找到SmartArt.打开之后,你会发现他有很多选项,有列表,流程,循环,关系,层次结构,矩阵,凌锥,图片等. 用法一:图片快速排版 这款神器的其中一个作用是,能对图片进行快速排版,只需要几秒钟就能排出

如何快速搞定APP关键词优化

  近年来,依靠超强关键词设置能力冲入大家视野的APP屡见不鲜,前有喜马拉雅"搜什么都有它"的传奇,后有牛股王"搞定热度10000的股票关键词"的佳话,搞得运营小伙伴们一时心猿意马,苦心钻研捷径,希望有朝一日能在关键词上大放异彩.文公子要提醒大家,夯实关键词优化的基础才有可能成就佳话.与其钻研捷径,不如花点时间审查自己的关键词设置是否符合规则.下面我们就来说一说如何用8小时快速搞定一款APP的关键词优化. 一.六大基本原则 1.关键词权重排序:APP Title &

Word2007文档中快速搞定毕业论文方法

平时积攒的一些office技巧在写论文时可以用上了.但是由于时间已久,很多技巧和方法的来源已经忘记出处了,故未写明原作者的地址和申明转载.见谅. ·1.论文参考文献的添加 以word2007为例,6步搞定: [第一步] 文档中快速搞定毕业论文方法-快速搞定小姨子攻略"> [第二步] 若需要重复引用文献,则进入第三步: [第三步] 插入参考文献之后会发现没有 [ ] , 尾注不用管它,文中我也没有找到好方法,只能一个接一个加!并且会发现尾注中序号是上标,网上我找到2种方法:1.选中序号按快捷

注册表快速搞定被写保护的U盘

  U盘没有写保护开关,为什么还是被写保护了?该如何解开呢?碰到这种情况的朋友想必都非常着急,因为这样的U盘无法存读取文件,无法删除,甚至连格式化操作都不能用,用各种U盘修复程序都无效.关于U盘被写保护其实是有解决方法的,下面让我们一起来看看如何用注册表快速搞定被写保护的U盘. 一.首先我们应当要查看U盘上面的写保护开关是否打开,该开关与过去使用的软盘原理一样.如果有开关一定要将它打开. 二.查看该U盘的根目录下的文件数目是否以达到最大值,通常格式的应256个.如果没有达到256个继续看下一步.