移动设计的七原则

标签: 移动开发 | 发表时间:2015-04-20 07:51 | 作者:IT江湖
出处:http://www.itjhwd.com

一、内容优先

对于手机而言,屏幕空间资源显得非常珍贵,为了提升屏幕空间的利用率,界面的布局应该以内容为核心,而提供符合用户心里预期的内容是移动应用获得成功的关键。那么在设计组织内容时,要注意一下几点:
从产品设计开始,就不能抱有将pc上的一切功能都往移动端搬得思想。敢于删除不必要的内容,只抓重点,是对移动设计师德基本要求。

做到内容优先。在浏览内容的过程中,适时的隐藏一些干扰功能,让内容最大化。多采用手势操作,也能极好的隐藏一些操作元素。

二、为触摸而生

在触屏设备上,基于手指的手势操作已经代替了鼠标的点击操作。手势操作灵活多变,交互自然,但也带来识别性差,操作精度不高等缺点。

1、以信息架构为基础,建立手势交互规范

2、优先设计自然的手势交互,而不只是点击

3、引导用户在情境中学习手势操作

4、可出区域必须大于7*7mm,尽量大于9*9mm。在触摸操作设计时,我们已经知道,在界面中的可触物理区域不应该小于7*9mm,为了让用户能在各种情境中都容易操作,建议可触区域不应小于9mm,但是可触区域不同于屏幕中直接呈现的物理大小,为了视觉及审美的需要,有时设计时会把屏幕元素设计得较小。

三、转换输入方式

文字输入是移动端得软肋之一,不论手写输入还是键盘输入,操作效率都相对较低,在行走或单手操作时,输入的出错率也较高。那么在应用设计时要注意尽量避免文字输入,或者使用一些代替方案来提升输入效率。

1、减少文本输入,保留之前输入的内容。如在文本框中输入内容,要做到意外退出后能在返回,依然可以看到之前输入的内容。也可以通过关键字联想,如在搜索时输入一个字,可以通过联想匹配让用户尽快找到目标,而无需输入全部文字。

2、转化输入方式,可以通过将常用的输入框转化为选择控件,或其他自定义控件(如日期、地址、城市等可转化为选择项的)。

3、使用手机已有的传感器输入,如语音、扫描识别(二维码、条形码、文字、图片等)。

四、明确的反馈

屏幕小、硬件性能差、网络不稳定等等,移动产品需要面对各种情景,所以有效、清晰、及时的反馈起着重要作用。它能让用户知道自己的行为正在被后台程序响应和处理。

1、为用户的行为操作提供提供及时的反馈。如点击列表后背景会变灰色,这样在网络缓慢或性能较差的设备上,用户能快速察觉到已经点击成功,从而避免多次点击。

2、提供有价值的状态提示反馈。避免使用模态窗口,打断用户的当前任务。早期的app对模态框的滥用,让用户很容易忽视框中的内容。可以考虑toast、状态栏、导航栏等反馈方式,也可以考虑结合声音、震动、闪光灯等组合方式,让反馈信息更有效。

五、为中断而设计

考虑到移动应用使用情景复杂而不稳定,在移动场景中被打断是很平常的事情,所以确保在各个产出中断的情境下,让用户恢复之前的操作,保持用户的劳动付出。

1、保存用户的操作,减少重复劳动

网络终端状态:在移动应用上行服务数据时,都需要考虑网络状态出现异常的状况。例如新浪微博客户端,当博文发送不成功时会暂存到草稿箱中;iphone发送消息不成功,也会保存内容,标记为发送失败,允许用户重新发送。

编辑中断:在编辑内容的界面中,要考虑在各种中断事件后,保存已编辑的内容,减少用户的重复操作。

2、衔接记忆而不是重头开始

当用户在阅读是被打断,基于内容可分为两种不同的情况,一是书籍类的阅读,用户再次进入界面后,衔接上一次正在阅读的页面而不是书本的首页;另一种是新闻阅读类的阅读,需要根据时间间隔来判断,超过一天时间没有阅读,再次进入后,可以让用户选择是否继续阅读或返回首页最新内容,若时间间隔很短,则直接返回之前的页面内容继续阅读。

六、为用户的误操作而设计

1、在设计产品时,通过页面的设计、重组或特别安排,尽量的防治用户出错,因为比出现错误信息提示更好的是更用心的设计防治这类问题的发生。

2、为了避免用户的误用和误击,应该为用户提供撤销和重做的功能。

3、当用户操作有误需要错误信息提醒时,错误信息应该用语言表达,要较准确地反应问题所在,并且为用户提出一个建设性的解决方案。

七、一致性

一致性是设计的基本原则,它可以让产品更加的易用,降低用户的认知成本,从而带来整体体验的提升。

1、设计上的一致性:基本结构布局、模块化内容、文案、交互行为和视觉风格等方面的设计要遵循一致性的要求

2、于平台环境一致:例如ios屏幕左上角的返回设置,除非产品的特殊设计需要,否则尽量不改变这样的设计,保持与平台的一致性,避免用户在使用上的不习惯。

3、跨平台的一致性:移动产品往往是多平台布局,包括ios、android和web app,内容设计上的处理要追求一致性。

via:简书

相关 [移动 设计] 推荐:

移动产品设计之设计

- crystal - 互联网的那点事
移动产品设计最大的差异点在于用户使用场景的变化,场景的变化引发了交互方式巨大的变化,从而也使得信息呈现方式有所不同,再加上硬件设备的差异,最终使得2者千差万别了. 所以,移动产品设计之设计应该首先从用户的使用场景出发,同时考虑用户的硬件设备差异,综合以上2点去帮助用户完成某个任务. 按照我的理解,场景、任务、用户可以称之为设计的三要素,每一个设计实际上都是试图去帮助用户在某个场景下完成某个任务的.

移动界面隐喻设计

- PigheadX - 所有文章 - UCD大社区
是的,有些时候,我就在想这个简单的问题,而那时我的答案还是:界面是对软件应用解决方案的显性,使用图形化符号,向使用者解释它的功能与任务. 但最近一些认知却让我对这个问题有了新的回答:界面就是软件应用它本身. 它不是一份对软件应用功能的图形化说明书,不是对软件应用功能与任务的图形化翻译,它就是软件应用本身,并且与之浑然天成.

移动端的拟物化设计

- Han - 所有文章 - UCD大社区
人在处理信息,学习和记忆的能力是有限的. 现实生活中人们又会经常受到各种客观因素的影响,所以有效的降低用户的操作和学习负担能够使产品更易于被广大用户所接受. 随着互联网产品设计越来越重视用户体验的今天,除了产品本身的功能的创新之外,产品与用户之间的交互体验成为各个公司追求的目标. 好的设计不但在视觉上带给用户更多美的享受,同时还可以从视觉层面帮助和引导用户完成所需的操作.

移动设备手势设计初探

- redhobor - 腾讯CDC
  嘿~最近在做各种移动端的产品,设计啊体验啊操作啊,用的手都起茧,工作之余也思考了“手”这种较新的交互方式,以及它与界面的关系. 本文从手势的种类,应用场景,存在的可用性问题以及如何设计四个大的部分谈起,在此抛砖引玉供大家思考和学习.   移动设备大行其道的今天,手势是一个流行词汇,那手势是什么呢.

移动应用表单设计秘籍

- - 落花流水——elya妞╰_╯
一直想写一篇文章,关于移动应用表单设计的,可惜最近项目很忙,忙到没有时间打理博客. 最近体验产品的时候,经常看到错误的的表单设计,要么信息混乱,要么步骤繁复、要么语言程序化,要么视觉焦点跳跃,要么校验顺序混乱,要么反馈不及时,如此种种的问题,让我很想认真的总结一下,思考一下,为移动应用的表单设计,提供一些个人力所能及的建议,希望更多地设计师能认真思考移动应用表单的特殊性,能最大限度的提升表单设计的体验,提升效率,提高满意度.

移动产品设计新思路

- - 互联网的那点事
随着时代的变迁,移动产品的设计也有了更多的变化. 用户的需求越来越多、使用的场景也更加复杂. 也因此移动产品就有了更多设计的新思路. 当然,手机的玩法虽然不再被局限在有限的领域,但是对于那些更喜欢用手机拍核桃、钉钉子以及起瓶盖的各位童鞋,还是看看本次由朱坤 @kentzhu 分享的移动产品设计真正的新思路.

移动客户端UI设计指南

- - 博客 - 伯乐在线
最近整理电脑,发现有篇11年编写的内部培训的交互指南,整理了一下,去除涉及公司机密的部分,分享给同行. 因为是AI格式的,嘻嘻当时为了臭美,就用AI编写排版的,所以只能给大家分享PNG图片了. 综合了爱疯、安卓、疯7的交互原则,适用于移动设备,比如其中的按钮尺寸、视觉大小、触控大小,唯一遗憾的是,没把字体的设计原则列进去.