首页

网站配色,如何给使用者一点“颜色”瞧瞧?

蓝蓝

大多的网页设计组成都是明亮的背景(通常是白色的)以及黑色的内文,但也有少数的网站设计是属于暗色系的、或是色彩鲜艳的网页界面设计

但你曾想过为什么有些网页用鲜明颜色、有些则选用白色当背景吗?

这跟使用者的“动机”有很强的关联性。如果把使用者用某个服务的动机,简单用二分法来说,一个是“功利”动机、而另一个则是“享乐”动机,那么:

  • 功利动机适合低唤起、高亮度设计
  • 功效被定义为有用的特征或是状态,使用者寻求功效。例如,当你每次在使用计算机时,你可能就有一个功利性的动机在背后,像是协助你算帐更快。

研究显示,属于功利动机的消费者在低唤起环境,会比起高唤醒环境,更容易产生正向认知。唤起程度是指外界环境如何刺激引发我们的感觉,像白色较容易营造低唤起环(较不会刺激我们的感觉)、而红色则容易营造出高唤起环境(刺激性较强)。

举例来说,使用 Google 的使用者许多是因为功利动机,像是搜寻资料、观察信件……。所以 Google 网站和应用程式主要以白色为主,对使用者而言,身处于低唤起环境,不容易刺激人们的感知,使用 Google 服务时会比较轻松自在。

做共赢的设计!社交登陆表单那点事

蓝蓝

什么是社交登录表单

和单纯的注册与登录不一样,现在是社会化的合作时代,一切都讲究共赢、!而社交登录表单界面设计正是为我们提供了一个快速进入网站的入口,通常包括注册和登录两部分。社交登录入口一般都是facebook、推特、新浪、qq等。
要想使用网站设计提供的社交登录表单功能,前提是你有那些社会化网站的帐号,不过这个时代,谁会木有QQ或者微博呢:)话说国内的一些网站利用社交登录表单登录后,体验很不好,层层跳转,进入网站后,依然要填写一大堆个人资料。而且每次还不能记录登录状态!这哪里是提供便捷,分明只是一个噱头而已。

直观看一个例子 Wunderlist:

1

该应用允许用户使用社交账号登录,也可以另外直接创建账号。

直白地说,社交登录表单就是一个进入某系统的入口,用户可以在这里注册账号,实现快速登录。

社交登录表单用例

提高网站可用性的经验指南

蓝蓝

我想每个人都会赞成,网站设计的可用性是它能否受欢迎的一个重要方面,无论你进行的是公司网站、在线商店还是其他,让你的界面变得容易操控,使用时令人舒服是关键,近几年已经有很多针对网站界面设计优化的研究,而且这些研究的成果对于提高网站可用性是非常有价值的。现在这里有10个超实用的经验分享,相信蓝蓝设计,这些建议会极大地提高你那个网站的用户体验,让用户爱上你的网站界面设计! 

一、善用人物配图,使用户专注于你想呈现的

当进入你的网站,我们会本能地关注网站上人物图片中的脸和眼睛,这倒是为我们提供了一个想法,是不是可以用人物配图吸引小伙伴的注意力呢?当然,但这仅是第一步,我们还可以这样做,你瞧,是不是大不相同!(见下图)

这是第一步:

20090316 dmwcj8wqr8egihdihssm4xm517 You look where they look

漂亮的APP应用网站

蓝蓝

如果我说很多iPhone应用网站的界面设计都颇为精美,相信筒子们不会有什么意见的。看来那些ui设计师们都敞开胸怀迎接“苹果style”,创造出干净简约又优雅的网站设计。可不嘛,作为一枚合格的设计师,他们才不会随随便便弄个网站展示他们的app设计呢,都卯足了劲设计出新颖的版式,配上美美的图片、大量留白和恰当的字体。那么今天呢蓝蓝设计将要带给你的这份灵感清单就是一些绝赞的iPhone应用网站啦,切克闹~

Wedding Party

与你的客人一起,通过这简单有趣的app捕捉并分享你婚礼中的美好瞬间。

21 Beautiful iPhone App Websites

追寻点击愉悦感:提升网站平板体验的6个技巧

蓝蓝

提升网站平板体验的6个技巧

Queen译者注:随着平板电脑市场的迅猛增长,你可曾考虑到网站在平板上的用户体验?本文给出了6个提升网站平板体验的简易技巧,让你花小气力,出大成果,可谓事半功倍。要不你试试看。
原文链接:the-pursuit-of-tappiness

在这篇文章发布时,仅在美国就有近7000万的平板电脑用户,这比前一年的数据增加了一倍。这意味着,美国近30%的互联网用户使用平板设备上网浏览。2011年到2012年间,电子商务网站在平板电脑上的交易量增长了348%,第一次超越智能手机的交易量。由于平板市场很年轻,其未来的发展空间必定很大。
这一趋势传递了一个强烈的信号:如果你的网站还没有针对平板电脑进行设计的话,现在是时候优先考虑其在平板电脑上的可用性了。否则,忽略这一点可能会对网站的整体转化率,回访量,销售量等带来负面影响。

什么是”点击愉悦感”(tappiness)?

当一个网站具有”点击愉悦感”时,用户在手机或平板设备进行访问的操作将变得容易而愉快。点击愉悦感包括巧妙使用的空间,易于阅读的文本,符合逻辑的交互线索,和大尺寸的点击目标,这些让访问者浏览网站时充满信心。

1359424540_87

本设计中,大字体和大点击目标的体验很好,即使在平板电脑上缩小后,体验依然不错。
而在另一些设计中,文字太小无法阅读,链接太接近容易误操作,无形中增加了操作时间、复杂度以及体验上的挫败感。糟糕的体验下,用户将快速流失。

1359424551_62

本设计中的小字体和小触摸目标被证明在平板电脑上难以阅读和使用。
一种理想选择可能是:重新设计你的网站,让它能针对各种不同设备进行自适应布局,但时间和成本可能会使你无法完成这样的全面翻新。然而你还有其他选择。本文给出一些技巧和方法,能快速帮助你提升网站的平板用户体验,只需几个简单的变化,你今天就可以做到!

7个值得收藏的用户体验行业网站和博客

蓝蓝

7个值得收藏的用户体验行业网站和博客

推荐一 :(5星)

Smashing Magazine

网站的精选文章比较综合,包括Design, Coding, Mobile, Word Press等,整体质量很高,非常适合用户体验从业人员持续关注。

推荐理由:

  1. 对于设计师而言,DESIGN, MOBILE, UX DESIGN这三个tag的内容都很棒;
  2. 文章总体质量非常高,篇幅虽长,但很成体系;
  3. 订阅者超过1,100,000,用户活跃度高,每篇文章的回复都很专业;
  4. 超过1,700篇原创文章,890位作者,他们均有多年从业经验;
  5. eBooks中很多优秀书籍免费。

7个值得收藏的用户体验行业网站和博客7个值得收藏的用户体验行业网站和博客

 

掌握动效设计!让你的设计富有未来科技感(下)

蓝蓝

基于情景的消隐

掌握动效设计!让你的设计富有未来科技感(下)

这是iOS上的Chrome,有着基于情景的消隐动效。

掌握动效设计!让你的设计富有未来科技感(上)

蓝蓝

掌握动效设计!让你的设计富有未来时尚科技感

为何有的产品、服务特别受欢迎?

是因为这些产品、服务在内容、外观、设计、可用性、功能等方面具有无可匹敌的优势。其实,所有的这些层面都属于交互设计的细节,其中一个关键点便是动效。

本文将介绍几种常见的动效模式(用GIF图演示),分析一下为何这些简单的设计模式在实际应用中能够奏效。
当我们设计数码产品时,我们一般用PS或者Sketch这种设计软件来进行设计。

了解设计的人明白这样一个道理:设计不光只是视觉表达。设计也不应该是静态的。乔布斯说过这样一句话:

设计并非外观怎样,感觉如何。核心在于,它是怎样工作的。

影响用户对产品的体验与印象的因素有很多,交互在其中扮演着关键性角色。我们不能再简单的把用户界面当成一种静态界面而设计。我们应该顺应互联网动态的本质,打造更加动态的图形用户界面。
好了,废话不多说,我们来看看,什么叫做更智能的交互、更精致的动效。看看这些设计模式是怎样提高用户体验的。

动效滚动

超链接是互联网的双刃剑,当你点击链接时,你可以在互联网中任意遨游,随心所欲。

可是过度自由好吗?不见得,比方说你在浏览一款精美的产品页面,然后你点击了一下页面中的链接,突然导入了一款令人毛骨悚然的木偶商店页面。这就是超链接的弊端,有时候的页面转换太突然,缺少过度,让用户一时不能接受。

我们可以看看书籍的用户体验:故事发展一般是线性的,每一章都和上文有所联系。想要阅读第二章,必须先阅读第一章,以便大致了解书中的环境与人物关系。如果你”跳章”阅读,不可避免的会错过一些关键剧情,因此无法理解有些内容。

在网页设计中,同理,尤其是那种内容比较大,页面比较长得网站,这种情况经常无意识的发生:用户会错过之前的某些关键内容,而且又缺少提示,因此很难理解当前内容,通过添加动效滚动,可以修正这一问题。

别让用户发呆—设计中的防呆策略

蓝蓝

  生活中总会有些状况让我们无所适从摸不着头脑:面对一排电灯或空调的按钮,哪个才是控制我想要的?开锁时掏出一把钥匙,哪个才是正确的?拿起U盘插入电脑,朝那个方向才是对的?……类似的犹豫充分说明,你呆住了。现在,是需要“防呆设计”来拯救你了。

 

通过潜意识情感来驱动用户行为(51活动小结)

蓝蓝

内文版头图

现在我们见到的大部分推广活动往往都以折扣,抽奖作为噱头。长期的价格战轰炸来刺激消费心理的方式已经让用户形成一定的疲劳感甚至是抵触感,因此,我们思考能否在劳动节这个比较传统但是特点鲜明的节日中通过新的创意来达到我们活动目的呢?

日历

链接

个人资料

蓝蓝 http://www.lanlanwork.com

存档