APP设计师面试题:移动视觉设计的七大原则

年底啦,APP设计师的心一直在蠢蠢欲动,想要换一家舒服的公司,但是面试的时候,问道一些相关移动APP视觉设计方面的知识的时候,就会没那么自信啦。

所以,25学堂帮大家整理出了七大移动视觉APP设计原则。非常干的干货,足以让大家在面试过程当中,侃侃而谈! 向面试官展示出充分的自信。

我们就是要告诉面试官,设计作品与设计理论样样牛!

 

app-日历界面设计

一、内容优先

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

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

 

二、为触摸而生

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

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

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

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

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

 

app咖啡界面设计

 

三、转换输入方式

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

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

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

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

 

四、明确的反馈

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

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

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

 

五、为中断而设计

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

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

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

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

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

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

app视觉设计xins

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

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

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

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

 

七、一致性

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

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

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

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

 

以上移动视觉设计的七大原则干货,值得大家收藏!特别是APP设计新手,值得好好阅读和领会。

每天更新,
全站高品质素材免费下载!