如何设计优秀的网页让用户有参与感

2016-02-16 21:10 16 1 收藏

只要你有一台电脑或者手机,都能关注图老师为大家精心推荐的如何设计优秀的网页让用户有参与感,手机电脑控们准备好了吗?一起看过来吧!

【 tulaoshi.com - 平面设计 】

参与感一词最近很火,也是打动用户一个非常有效的表现手法,今天阿里的同学从这个角度聊聊如何设计网页,利用空间法则、抽象法则和换角度法则给用户更多的愉悦感和融入感,非常有料的一篇教程,来涨姿势吧。

遇到的问题

在设计运营类需求时,我们采用的比较常规的设计形式是先设计一个漂亮的头图然后再将信息内容进行排版填充,当遇到页面中的文字元素比较繁冗时,大量内容的堆砌不仅很容易让用户浏览时产生疲劳,而且设计师在这个过程中也会容易陷入在传统框框里无法突破,在设计时感到枯燥乏味、越做越无趣。平时采集设计灵感时我们会注意到现在很多优秀的运营设计已经不仅仅局限于常规的形式,而是越来越注重整体画面给用户带来的更多愉悦感及融入感。怎样突破常规,让页面在形式及情感上更吸引用户是我们设计师值得思考的问题。

什么样的设计形式能更有趣、更容易打动用户?运营设计主要表现手法之一就是通过制造情景来渲染主题气氛。对情景的理解一层指场景、环境;氛围有了,那试试再增加一些情绪上的感染和共鸣把,情景的另一层就是指人物,情节,景物唤起人的情绪和内心境界。制造情景体验一方面是把页面信息放置到贴近生活的真实环境中,让画面符合主题并且非常直观,另一方面能引导用户展开想象,唤起某种记忆,让用户有身临其境的感受。

用户不仅作为一个看客,还能以第一人物的视角参与到画面中,让用户迅速置身场景中,带动情绪,引发用户兴趣去完成后续操作。这里总结出一些打造情景体验的具体方法及例子帮助大家去设计更有意思的运营页面:

空间法则

空间感的渲染能让人更有身临其境的感觉,这种方式主要根据主题模拟真实场景,再通过整体透视的构图使画面呈现立体空间感,增加画面冲击力强,一下子吸引把用户代入到氛围中。我们来看几个例子:

如何设计优秀的网页让用户有参与感,PS教程,图老师教程网

如何设计优秀的网页让用户有参与感,PS教程,图老师教程网

以上的例子都通过空间打造增加画面代入感,画面的气氛和现实生活中的场景极其相似,用户很容易被吸引到气氛中。需要注意的是这种立体场景的搭建对素材及整体层次的控制力要求比较高,在设计的时候需要先搭建大的画面关系,再往里头添细节和内容,同时也要注意不要让场景抢了内容的视觉焦点,在适当的时候还需要做些减法。

抽象法则

(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/pmsj/)

不同于上面提到的逼真空间搭建方法,这种设计方式虽然也是选取现实存在的对象,但是需要提炼一个可以将内容信息巧妙的融合串联的承载容器构建出主体轮廓,然后再将内容填充到轮廓里面。这种形式能够让用户一眼就能了解到一些信息,同时又能贴合主题很好地传达情景氛围,让页面生动更有趣味性,特别适合一些节日主题的运营页面。

如何设计优秀的网页让用户有参与感,PS教程,图老师教程网

如何设计优秀的网页让用户有参与感,PS教程,图老师教程网

把内容放到盒子里或者一封情书中,顿时就产生了亲切感,抽象的主题通过实体显性化地表达出来,第一眼就能明白主题。这种方法需要选取合适的现实元素并对其高度概括,注意将形状尽量精简强调,避免太具象,适当地舍弃一些繁琐的、不必要的元素,以免影响阅读的内容。

换角度原则

(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/pmsj/)

除了还原真实场景,角度的不同也会呈现不一样的形式和感受,千篇一律的规则视角会难免让页面显得单调平庸。不妨试试模拟真实生活中的视角,我们来看几个例子:

如何设计优秀的网页让用户有参与感,PS教程,图老师教程网

如何设计优秀的网页让用户有参与感,PS教程,图老师教程网

这些例子往往是我们生活中很熟悉的情景却容易被忽略,工作中俯视看到正在写作的区域,对页面的倾斜还原最真实的状态;吃饭时关注自己盘子中食物的角度,亲切的视觉感受令人置身其中,感染力非常强。同样的元素主题往往变换一下画面视角的方式能巧妙的打破常规构图的呆板并不落俗套,让页面轻松活跃。同时真实的场景一下次拉近了和用户的距离,也很容易和用户内心产生共鸣。不过变换角度可能不太适合文字正常阅读,要注意文字排版保证流量的舒适性。

局部突出法则

我们常常看到很多电影海报的设计中会截取某部分的方式作为的重心集中表现,最大化也是最突出,以小见大来引起注意,同时犹抱琵琶半遮面的方式制造更多悬念,引起观众兴趣及思考。具体运用在运营设计中又是怎么做的呢?我们来看几个例子来体会其中的设计思路。

如何设计优秀的网页让用户有参与感,PS教程,图老师教程网

如何设计优秀的网页让用户有参与感,PS教程,图老师教程网

以上的例子都是通过截取局部来吸引眼球,这种某个局部特征被放大强调的方式推翻我们常规的视觉习惯从而让感情集中强化,视觉充满神秘感瞬间抓住了用户的眼球,页面的目的也就达到了。这种方法可以多从电影、摄影中借鉴手法,通过特殊的视角打造出精彩的画面。

小结

制造页面中情景体验主要通过还原现实场景再加以艺术化的表达来增强页面的整体气氛,让用户不用去阅读文字就能很快明白这是个跟主题相关的页面,代入感极强,能比较直观获取信息;同时拟物具象的方式也减少了用户认知成本,亲和的设计形式在情感上给用户更多情共鸣。当然这种方式需要设计师日常要注意观察生活中的细节,多联想与各场景相关的事物,不一定需要靠素材的堆积也能打造出动人的页面一击击中用户。

运营设计现在越来越注重个性、趣味性以及视觉冲击力,页面的形式和技巧也是多种多样,以上总结的方法希望能帮助大家在设计遭遇瓶颈时找寻一些解决思路。设计师需要时刻灵活创新汲取灵感,才能够避免按习惯性的思维去设计,不断创造出新的视觉表现。当然还有更重要的是运用方法多多进行实践转化成自己的东西,才能得到能力上的有更大地提高。

来源:http://www.tulaoshi.com/n/20160216/1574428.html

延伸阅读
你们尚不需要去研究网站和网页的基础代码,而只需考察不同的网页,思考其中应该包括哪些要素,并思考一些关键性的问题,如一致性、可用性和可访问性。本篇文章的目录如下: 主页对我们的网站来说,这意味着什么?导航网站上的其他一些通用元素上下文关系非常重要相关内容标题可用性可访问性总结练习题 主页 很多人倾向于认为让我们从多数用...
导航是网站不可或缺的一部分,看惯了一成不变传统的网站导航和今年倍受宠爱的隐藏式汉堡菜单导航,是时候来点不一样的刺激下灵感了。这20个网站不仅都有自己脑洞大开的导航设计,整体设计也是创意丰满,一起来点意料之外的惊喜吧。 Vincent Tavano ACT Festival ECC Architectural Print Gallery Heat Architecture ...
提到用户访谈,根本上说就是我们提出问题,用户回答问题。如果稍稍进行细化,访谈又可以分为两个阶段,即访谈阶段和体验阶段。访谈阶段主要目的是从用户的经验和认知中获得有价值的问题,而体验阶段是让用户在体验我们给予的部分设计,激发他们的评价,观察他们的体验,从中寻找问题。 让我们假设一次最理想的用户访谈,如果用图表示出来应该...
标签: Web开发
表单,我相信这是前端开发者工作中最难处理的一个作业了.表单设计中几乎涉及了所有前端各方面的思想与技术.其用户注册页面即为最典型的代表,我要说设计本身没有对与错只有好与坏,就好像人的脸,只有漂亮与不漂亮,不能说某人的脸长错了.当然这其中就会有尺度去衡量,但难就难在这个尺度本身没有标准.好的,我已经为我将要阐述的观点铺好了下去的...
我们都希望成功的设计改版能让网站重新焕发活力,不仅仅吸引用户,并且让用户愿意花更长时间浏览。要做到这一点,并不需要什么神秘的技能。下面就告诉你让你的网站更受欢迎的技能,接招吧,骚年~ 我们都知道,吸引人的插图、有创意的网站布局和有说服力的内容能够吸引用户。可有时候好像又不是那么一回事。你也许也有过类似经验,得意地做出当...

经验教程

487

收藏

22
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部