首页

巧用视错觉 UI更有趣

用心设计

巧用视错觉 UI更有趣

格式塔原理解释了人们如何以视觉方式感觉物体,以及图像的结构,视角,大小等要素是如何影响我们的视觉的。

在下面这篇文章中,我们首先会简单介绍一下格式塔原理中的基本概念,然后再详细探讨一下如何将它们应用于今日的UI设计中。

在设计中建立视觉层级

用心设计

在设计网站的时候,图片资源会在很大程度上帮助你设置站点,以及颜色,排版或者更多内容的基调。如果图片视觉元素没有和设计正确的结合,他很可能会破坏你原本想呈现的感觉。

[系列]APP设计之四:注册[登录]

用心设计

48923-9a2cab7db4c4aa2b

按理说,没准备好就不应该写。但如果继续后推,等准备好再写,觉得自己就会放弃这块的总结。因此,在心里惶惶然的情况下,还是决定把目前自己的一些想法和总结写出来,算是阶段性的一个总结吧。

由于登录是注册之后的事儿,我首先来谈谈注册。


移动应用空白情况页面的设计

用心设计

GW模式。(G=graphic,W=words)即为图案+文字模式。图案经常为一些可以表示“空白”隐
喻的图案或者是自家应用的吉祥物相关的图案,抑或是可以为跟页面引导相关的图案。文字一般包含:标题,说明。标题通常是解释此处空白的原因,如
“Oops,地理定位被关闭啦,无法使用该功能哦”,“网络出问题啦”等,说明则解释出现此状况的原因和解决办法等。文案的风格经常根据产品的调性去设
计,有些走卖萌路线,有些走高冷路线,有些甚至走狂暴路线等等。鉴于此类型是一种最常见的类型,单纯的包涵文字或单纯包涵图案的设计手法也归纳到GW模式
中。如下图:

做一份让工程师泪流满面的标注

用心设计

为什么传统的标注方法让人难受?

没错,Markman 是传说中的标注神器,看起来也确实方便快捷,但是当一个页面中,要同时标注间距、大小、颜色和字号时,过多的信息一齐扔给工程师,就会让人有些抓狂。比如这样:

移动应用空白情况页面的设计

用心设计

移动应用的设计中,最容易被忽视的地方就是空白或者异常情况的设计。从传统PC时代web的异常页面如404,502等页面的设计体验迁移过来,移动应用的空页面,网络故障页面等展示也有相似的设计模式。从以前的纯文本的排版设计,到后来404成为设计师
展示图形创意的舞台,移动应用的空白情况页面的设计也从纯文本提示到后来精彩纷呈。然而在移动应用的设计中,空白页面的的作用不仅仅在于给用户以温柔或者
精彩的提醒,安抚用户焦急或是疑惑的情绪,更重要的是,空白情况页面可以引导用户去填补“空白”。人都是害怕空虚寂寞冷的,当你面对一个空虚寂寞冷的页面
的时候,善意的指点迷津的一些语言和画面告诉你咱们还是可以有方法来填补你的寂寞空虚冷,这时候,用户的操作行为就会被触发,潜移默化中指引用户完成填补
空白的工作,那么,无论从用户个体的活跃度上还是整体的留存率,活跃度上,你设计的空白页面做到了拉升的作用,对电商产品和社交产品等来说,这些页面可谓
是自己展示产品调性,曝光功能,加深引导的黄金地段。

用户研究中常提到的“场景”,到底是什么?-20150704早读课

用心设计

一个好的场景在描述简洁的同时,还需要回答下列关键的问题

  • 用户是谁?人物角色可以反映出网站真实的、主要的用户群体。
  • 用户为什么来你的网站?如果可以的话,记下用户到你的网站来的动机和预期。
  • 用户的目标是什么? 通过任务分析,你可以了解用户到你的网站来是想获得什么,进而可以知道你的网站需要做什么才能让用户满意的离开。

iOS细节设计-交互篇-20150705早读课

用心设计

1.很多人都知道无论是在 iOS 的系统还是一些第三方应用的输入模式下,只要左右晃动手机即可激活「撤销」操作,但也许你不知道是,如果再次晃动手机则可对「撤销」操作进行恢复。

数据驱动的界面设计-20150706早读课

用心设计

1. 用户不同,数据不同

任何时候设计一套复杂的系统,都不可避免要为很多用户和角色进行设计。总裁、经理和分析师是几个常见角色,每个都有自己的工作流程和对数据的需求。

定义好角色,产生不同视角,这本身就是一种艺术。我就不在此详细解释了。如果你对此有兴趣,请看Cooper的这篇有用的文章。

关于角色,重要的一点是预先确定好,围绕它们来组织信息结构与线框图。

下面是我们去年做的一款健康报告应用的最终成品。这套系统有着不同的用户群,他们各自都需要不同的数据管理。创建了关键角色后,我们每次评审会将它们放在旁边。

2

日历

链接

blogger

蓝蓝 http://www.lanlanwork.com

存档