网页情景化设计杂谈


  在信息化时代的现在,网络在人们生活已经产生了巨大的影响力,网络也在逐渐改变着人们的生活和习惯。然而,在如今信息大爆炸的今天,面对海量的网络信息,怎样才能实现既能吸引用户眼球,又能快速准确地传达信息呢?这不仅需要内容本身具备较强吸引力,关键还在于一种比较常见的表达方式——网页情景化设计。

  什么是情景化设计?

  特点:虚拟现实,给人以亲切感,交互友好度较高,应用领域广泛涉及软件、游戏、网页等应用。


  情景化设计是一门综合性极强的表现方式,它涉及到现实社会、文化、经济、市场、科技等诸多方面的因素。设计在很大程度上是既具艺术性,又有经济性的一种实用的艺术形态。


  以上图1-2都有共同的相似之处,并且我们都知道,网络是个虚拟世界,而这个虚拟世界已经逐步的深入到我们现实生活当中,成为不可缺少的一部分。对于网页设计来说,设计不仅仅是“平”的,而是多姿多彩的情景化世界。情景化网页设计的未来发展趋势就是这一切虚拟体验正在成为现实感受,让用户快速融入页面重点内容当中,直观获取有用信息。这对于提高产品运营信息传递起到了很好作用,使页面信息表现的更加准确顺畅,快速有效的把目标用户带入到页面氛围当中。

  网页情景化优势


  首先,情景化在网页中运用,起到了提高信息传输和接收速率的作用,使信息的传达更加顺畅。情景化设计适用于各种领域及产品的网页设计创意中,比如活动专题、新品推荐、游戏专题、等等。情景化设计可以准确体现出页内容主题,并且能够满足目标用户的各种需求,从而更大化的实现转化率。


  其次,情景化在网页中运用,使得每个页面呈现方式、布局画面、整体效果增添了个性化色彩。如今,人们的生活方式开始个性化,所以走在潮流前线的设计理念和战略也愈加复杂和个性化。在网页中应用情景化方式,不同的设计师对同一种产品有不同的展示方式,这样做出的网页永远不会重复。


  再次,情景化设计方式对设计师的创意开发起到一个促进作用,让设计师主动融入这个作品,不是为了设计而设计,而是要全方位考虑该页面中任何一个元素存在之合理性。不论哪种领域的设计,它都是一个互动的过程,设计的过程也不仅仅是设计师借助技术和发挥想象力的过程,还是设计师与使用者不断对话表达使用者愿望的过程。情景化设计不仅让设计师在设计风格视野更开阔,而且这种发散思维更深一步的挖掘设计师潜能,在不断摸索和创新中,实现自我的提升与价值。

  巧用情景化表现方式


  图一:桌球类页面设计,信息承载量相对比较大,页面设计以内容为主,表现形式作为辅助。烘托页面整体氛围,同时也突出主题信息的内容。


  图二:棋牌类页面设计,在较少的内容信息情况下,通常将第一屏作为首要信息显示区域。页面设计除了营造强烈的氛围以之外,设计师对页面细节设计有很高的要求,桌面质感处理的比较细腻。在这样的静态页面中,也可以体验到较强的游戏感。


  图三:射击类页面设计,虚拟现实场景的方式,结合了游戏内部元素。模拟页面场景,具有较强的带入感。重点内容明确。可作为借鉴游戏奖品礼包领取类页面的设计。

  工作中的思索和尝试

  网页设计如同做文章一样,不是一味的素材叠加,情景化网页设计中包含着人、物、环境等各因素及其相互作用所形成的情景,其过程主要围绕网页主题内容来进行情景描述,而网页设计师在整个创意过程中至始至终都要保持局部与整体存在的合理性,不多不少恰到好处的运用素材修饰整体效果。 下面就是学习和尝试的一些过程:


  通常领取礼包的活动页面,都会运用到游戏相关人物、标题、礼包、LOGO等素材,一般我们会简单的将页面的信息做好布局。在这个阶段中,我们已经给页面基本的方向做了定位,当然是需要和产品同事一起讨论确认的。接着就是增加视觉细节和礼包内容,并完成最终的设计稿。但是,我们有没有花一点时间去思考一下,活动页面的关键词“四重好礼”。是否有其他更为贴切的设计方式呢?经过一番思考,我们可以探索性的去尝试,将礼包放在盒子里的设计思路。


  讨论后,我们需要将“礼包领取”按钮和内容保证首屏显示,然而我们设想的打开盒子场景也是可行的,只需要把高度和内容布局做调整。于是完成产品需求重点内容显示,融合产品运营的特点,是思考和探索尝试的目的。但需求内容比较多,首先除了对文字方案优化,还需要设计师在视觉上进行优化,强调视觉传递的重点。目的希望当用户打开页面,可以直接操作领取按钮,使用户得到更友好的交互体验。


  最终我们完成情景化设计的尝试。在这个过程中,设计需要和产品运营思路达成一致,然而必须是要求我们设计师主动和产品进行有效的沟通。保证设计符合视觉要求的同时,满足产品内容运营需求和目的。


  网页设计基于特定情景中用户与产品或服务之间的互动,然而具体采用何总表达方式是设计师研究的关键之处。情景化设计是值得每一个网页设计师深入研究和学习的一种技巧,掌握好这门技巧,将给你的设计思路开辟一条无限创意之路

时间: 2024-12-08 18:38:37

网页情景化设计杂谈的相关文章

网页情景化设计:特定情景中用户与产品设计

文章描述:在如今信息大爆炸的今天,面对海量的网络信息,怎样才能实现既能吸引用户眼球,又能快速准确地传达信息呢?这不仅需要内容本身具备较强吸引力,关键还在于一种比较常见的表达方式--网页情景化设计. 在信息化时代的现在,网络在人们生活已经产生了巨大的影响力,网络也在逐渐改变着人们的生活和习惯.然而,在如今信息大爆炸的今天,面对海量的网络信息,怎样才能实现既能吸引用户眼球,又能快速准确地传达信息呢?这不仅需要内容本身具备较强吸引力,关键还在于一种比较常见的表达方式--网页情景化设计. 什么是情景化设

网页扁平化设计的五个最典型的特征

文章描述:如今设计界最炙手可热的明星大概就是扁平化设计了吧,关于它的讨论至今都没有冷却的迹象.诸多设计师分成了泾渭分明的两个阵营,一边努力把扁平化做到极致,一面对其不屑一顾. Kryptoners:如今设计界最炙手可热的明星大概就是扁平化设计了吧,关于它的讨论至今都没有冷却的迹象.诸多设计师分成了泾渭分明的两个阵营,一边努力把扁平化做到极致,一面对其不屑一顾. 我是个骑墙派,不支持也不反对,在我看来,优秀的设计的定义就是好用,只要能设计出优秀的产品,我可以采用任何方式,扁平化也是其中之一.但是必

UI的扁平化设计趋势与拟物化设计

  实际上是这一两年,我们可以发现越来越多的程序的GUI变得"平面化"了:google.Microsoft.facebook.甚至apple的首席设计师Jony Ive也说过苹果会开始适当扁平化一点,WWDC2013的新logo也能看出这个暗示了. 于是很多人都问,为什么会有这样的趋势了? 我认为扁平化是一个必然趋势.并不是单纯的因为审美疲劳导致的为了变化而变化,而主要是因为数码化程度越来越高的日常生活中导致的.随着时代的变化,一方面是拟物化作用越来越少而退出主流,另一方面是扁平化更适

网页的版式设计(五)

设计|网页 3.图像的编排 (1)四角与中轴四点结构 页面的四个角与对角线.中轴四点及水平与垂直的中轴线,具有支配页面结构的作用. 四角是页面边界相交形成的四个点,把四角连接起来的斜线即对角线,交叉点为页面中心.中轴四点指经过页面中心的垂直线和水平线的端点.这四个点可上.下.左.右移动. 通过四角与中轴四点结构的不同组合.变化,可以求得多样的页面结构.在图像排版时紧紧抓住这八个点,可以突出网页的形式美感,网页的版式设计.视觉流程的筹划也得到相应简化.   (2)块状组合与散点组合结构 块状组合,

什么是扁平化设计?扁平化设计方案突出简洁

文章描述:扁平化设计:你在这趋势中收获了什么? 扁平化设计-这个早在多年前非常流行的设计领域-又再一次卷土重来了.许多新网站以及需要重新设计的网站都纷纷采用了扁平化设计的方案,这种趋势无论是在网页设计或者移动端的设计方面都已经蔓延开了. 随着融汇了扁平化设计美学的windows8以及新版谷歌的推出,以及其他人气网站纷纷采用这种扁平化的主题设计,这种扁平化的趋势将很有可能受到更加多的亲睐. 你是否考虑过?你能够把它运用到你的项目当中吗?这种设计方案是否能够给你带来更加轻松的工作体验? 扁平化设计具

迷失在扁平化设计风潮

  文章对现在风靡全球的扁平化设计给予了深刻的思考.牡丹花确实是很美,但如果世界上都剩下了牡丹花了,你又会作何感想呢? 本文源自Medium,本文发稿时原文在短短几天时间内已经获得了364个推荐,中文版本由天地会珠海分舵进行编译.文章对现在风靡全球的扁平化设计给予了深刻的思考.牡丹花确实是很美,但如果世界上都剩下了牡丹花了,你又会作何感想呢?这里让我们从著名乐队别安的<光辉岁月>的一句歌词开始:"缤纷色彩闪出的美丽,只因它没有,分开每种色彩--" 扁平化的盛行 伟大的UI设

做好扁平化设计-交互篇

  扁平化不仅仅是界面视觉扁平无立体感,更应该是交互体验的扁平化,信息架构的扁平化 有哪些方法可以做到交互扁平化. 1.结构层级减少-高效 先从字面意思来理解交互的"扁平化",与之相对应的应该是"结构层级",在这里我理解为交互步骤,以前也一直在强调精简交互步骤,想要用户用最少的步骤就完成任务,显然这里是要求层级结构的扁平,所以交互步骤和层级结构是相互关联的. web网页更注重深广度的平衡.由于手机设备的限制,手机主界面的广度大大减弱,信息深度更为明显. 我们怎样才能

扁平化设计美学:以Facebook为例的设计趋势

最近一个在网页和UI设计上逐渐增长的趋势是"扁平化设计"的使用,而且现在已经是一个非常热门的话题了.满大街的现场讨论会以及大量的教程.我常常被吸引到极简主义设计中,所以扁平化设计是一种很自然的给我启发的设计美学,特别是在最近的一个项目的重新设计中. 在本文中,我将讨论下什么是扁平化设计.回顾其它设计方式,并提供如何在你自己的设计中实现的一些技巧. 什么是扁平化设计? 实际上,扁平化设计意味着在设计中不使用常用的渐变.像素完美的阴影,然后通常是近年来蔓延的用来实现看起来"平面&

谈谈用户界面中扁平化设计

扁平化设计在当下的用户界面设计界是很有争议的,微软的Metro风最早将其介绍给大众,之后有了很多人跟风,比如LayerVault.The Next Web以及更多.许多设计师从最开始就不看好这类设计,主要是因为在稍微复杂一点的界面中,扁平化设计会带来很多困扰. 扁平化设计既漂亮又清新,设计起来快,也更容易响应.如果只是绘画上的设计趋向可能会被广为接受,但是网页设计者总是对易用性持有很高的关注度,因此总会觉得扁平化设计天然的就有缺陷. 下面这张图从左往右分别是苹果.Google和微软的设计美学展示