涨姿势!网站产品页设计中隐藏的心理学冷知识 - 优设网 - UISDC

涨姿势!网站产品页设计中隐藏的心理学冷知识

2016/03/05 10518评论区

emotions-landing-pages-1

设计和心理学一直是紧密关联的。今天我们来聊聊着陆页的设计中所隐藏的心理学现象:即时情绪和预期情绪。这两种概念并不复杂,甚至很容易理解,一旦你掌握,就能得心应手地运用。

即时情绪

即时情绪其实就是用户对于产品直接情绪反应。当你的网页出现可用性、可访问性或者可读性的问题的时候,用户出现负面的情绪反应,举个例子,当网页无法流畅滚动,无法加载信息的时候,你的直接反应可能是无奈、困惑甚至不信任。这是用户对于产品所呈现出的一种即时情绪。

当然,用户的即时情绪可能是负面的,自然也可能是正面的。比如一个设计优秀的页面会在你看到的第一时刻,令你为之惊叹,留下深刻印象。这种正面的即时情绪也是设计师们所追求的效果。

Acorns

1-1

Acorns 是一个在线零钱投资APP,可以帮你将闲置的资金动起来。整个主页设计充分使用了简约的设计来平复访客的情绪,整个简约的环境下,用户可以看到这款APP覆盖了全部的平台,在可用性上无可挑剔!当他们看到$6,363.71 会进而产生“这款应用能赚钱!”的心理暗示,整个这一套下来,让用户对这款应用产生正面的情绪,引导他们下载使用。

CartoDB

2-1

CartoDB 可以让地理信息以最漂亮的形态呈现出来。虽然地理信息怎么都不像是能漂亮起来的东西,但是CartoDB还真就做到了。当你打开网页的时候,你会看到一幅令人兴奋且足够华丽的地图。CartoDB的首页大图就是有这样吸引人的魅力。虽然他们的数据库并不是拿来销售的,但是仅目前的网页设计就可以吸引相当一部分潜在客户。

Reuters TV

3-1

作为一款流媒体APP,Reuter TV 无时无刻不在做自我展示。整个网站导航并不多也不复杂,这也使得时刻不停的视频背景显得特别抓人眼球。但是这种方法却以更加直接的方式为用户展示正在发生的新闻,并且可以让用户产生真实的即时情绪。

预期情绪

预期情绪和即时情绪不同,用户会结合他们看到的过去的经验来产生对于未来的某种预期。这方面最常见的例子,就是在网页中展示购买了产品之后的人们幸福的生活照。这样的场景是吸引潜在客户并打消他们的由于的最重要的手段之一,而且,当用户开始想象自己使用产品的场景的时候,就会自然而然地同产品产生情感纽带。如果你的产品能在用户中引起积极的情绪,就能为品牌和产品增加信任度,用户的忠诚度也会随之提高。

Grovemade

4-1

我们曾经多次推荐过Grovemade 的网站,这是一个销售手工木制品的网站,从显示器支架到手机壳,不一而足。当你打开网站的时候,设计师用轮播图展示一系列产品的使用场景图,精致,细腻,吸引人。你会在这些图片中看到你的电脑用上他们的支架有多漂亮,用上他们的手机壳有多帅气,用户就是在这一张张照片中被吸引、被说服的。

Madeindays

5-1

这个网站所展示的照片则更多的是生活方式类的图。整个网站采用的是单页设计,而且整个页面也相当的长,设计师在这个网页中通过九张图展示了一款定制化的钱包,文字很少,图片很赞。这种产品的展现方式谈不上多么突出,但是缺乏干扰的呈现方式让产品图更加吸引人,千言万语不如一张图来的直接。你要的是什么?漂亮的产品么?来买就好了。

Narrative

6-1

Narrative 可穿戴的相机,它可以每隔几分钟就帮你拍张照片,这种功能使得这款相机有许多不同于其他产品的优秀特性。所以,当你打开网站的时候,映入眼帘的是个一个由不同生活瞬间构成的视频。页面最终确实给你展示了相机的造型和外观,但是这不是最重要的——你买的最终并不是一个实体相机,更多的是一种生活方式,或者说就是生活本身。你再也不需要掏出手机来刻意记录,这个相机会帮你拍摄,那些难忘的记忆也会清晰地记录在其中,这是一个简单但是意蕴丰富的镜头,帮你记录生活的瞬间。

专注价值

我们都很清楚,专注于呈现产品的价值和优势,而非分析它为何会这样。所以,让用户与产品产生情感联系是最重要的。从上面的案例可以看出来,情感联系和情绪感染对产品销售而言是何等的重要。当然,文案是整个设计中的重要组成部分,如果你想设计出真正调动用户情绪,吸引人的优秀着陆页,那么不妨参考一下下面的优秀文案。

Evernote

7-1

搜集想法并输入

将正确的人引入到讨论当中。你可以将一段对话发给任何人,即使他们并不使用Evernote。

UberConference

8-1

了解谈话对象

始终看着说话的人。你会更轻松掌握他们的社交状况。

Pencil by FiftyThree

9-1

运行良好

通常手掌误触、删除和混淆只会在纸张和非支持的应用中出现,不过 Paper Pencil 依然可以在非连接状态下,同任何其他应用中作为触摸设备而使用。

Flow

10-1

不再错过任何邮件主题

相比于在诸多邮件中迷失,团队实时聊天、清晰的任务管理和项目计划等功能的集成,将会很好的缓解你的困境。交流信息、分享反馈都可以很好地帮你完成工作。

结语

了解用户的需求和心理并不难,更好地利用产品的特性和用户的情绪才是最终达成目标的设计技巧。我想就是这样的。

【你必须知道的设计趋势】

用户体验设计趋势:
《设计行业大起底!图说2015用户体验行业调查报告》

配色搭配趋势:
《业界良心!2015年最优秀的20款网站配色方案(附配色工具)》

网页设计趋势:
《你知道了吗?2015年网页设计的9大趋势》

原文地址:designmodo
原文作者:Paula Borowska
优设译文:@陈子木

uisdc-hao

本文由优设网原创翻译,请尊重版权和译者成果,转摘请附上优设链接,违者必究。谢谢各位编辑同仁配合。

【优设网 原创文章 投稿邮箱:2650232288@qq.com】

================关于优设网================
“优设网ag游戏网站“是国内人气最高的网页设计师学习平台,专注分享网页设计、无线端设计以及PS教程。
【特色推荐】
设计师需要读的100本书:史上最全的设计师图书导航:http://hao.uisdc.com/book/。
设计微博:拥有粉丝量104万的人气微博@优秀网页设计 ,欢迎关注获取网页设计资源、下载顶尖设计素材。
设计导航:全球顶尖设计网站推荐,设计师必备导航:http://hao.www.bvfyw8.cn

优设大课堂

非特殊说明,本文版权归原作者所有,转载请注明出处
本文地址:http://www.bvfyw8.cn/emotions-landing-pages

发表评论 加载中....

评论加载中....

uisdc

评论区都快饿瘪了,看看我期盼的小眼神...

优设专访 转场动效 设计师 扁平化设计 优设大课堂 交互设计师 界面设计 排版布局 职场 配色 视觉设计 素材下载 web前端开发 设计流程 设计师专访 平面设计 AI教程 设计理论 神器下载 用户体验设计 字体下载 设计趋势 海报设计 psd下载 设计规范 动效设计 图标设计 logo设计 产品设计 ICON 神器推荐 职场规划 App设计 字体设计 酷站推荐 交互设计 ui设计 设计师职场 优秀网页设计 ps技巧 用户体验 酷站 PS教程 网页设计 经验分享

您还没有登录

优设启用更安全省心的 微信扫码登录

微信扫码

300万设计师聚集地!优设网是极具人气的设计师平台
2012年成立至今,一直专注于设计师的学习成长交流

把好文章收藏到微信

打开微信,扫码分享
学设计 优设网 在这里