SCI论文（www.lunwensci.com）：
摘 要： 网页界面的呈现效果取决于视觉设计与交互体验,为提供给用户更好的体验。该文着重研究沉浸式体验的应用效 果,从沉浸式的故事化、场景化、情感化的视域维度出发,采用 5G 时代下的 3D、VR、动态交互的计算机技术,分析沉浸式 在网页设计中体现形式,提升网页用户在使用网站界面过程中的沉浸式体验感。
关键词：沉浸式体验 ；网页界面 ；视觉设计 ；交互设计
Research on Web Design under the Dimension of Immersive Experience
ZHAO Fengxuan
(Hebei Academy of Fine Arts, Shijiazhuang Hebei 050700)
【Abstract】：The presentation effect of the web interface depends on the visual design and interactive experience to provide users with a better experience. This paper studied the application effect of the immersive experience, from the story of immersion, scenes, and emotional dimension of the horizon, with 5G under the age of 3D computer technology, VR, dynamic interaction, analysis of immersion reflect form in web design, web page in the process of users in the use of the website interface immersive experience.
【Key words】：immersive experience;web interface;visual design;interaction design
1 绪论
1.1 研究背景
中共中央办公厅、国务院办公厅印发《关于加快推 进媒体深度融合发展的意见》, 强调用互联网思维优化 资源配置做大做强主流媒体平台,要以先进技术引领驱 动融合发展,充分利用 5G、大数据、人工智能等信息 技术革命成果。如今网页设计已呈现同质化、模式化趋 势,同时,新兴的信息技术引起设计生产及设计模式跨 时代的变革,软件技术不仅改变设计的过程,而且改变 设计的概念,互联网技术与传输速率的提升,能够承载 更多的内容与视觉效果。由此可见,传统网页界面理念 陈旧,静态与二维的界面效果无法顺应时代审美与技术 发展需求。
1.2 目的及价值
网页作为企业线上推广平台的重要标识,能够映射 企业的基本信息,因此用户获取信息的体验度与效率至 关重要。本课题结合在网页设计研究方向的文献参考与自身实践积累,整合沉浸式的表现特征,通过案例分析 沉浸式的数字体验在网页设计中的应用形式,有效提升 网站界面视觉、交互的优化与升级。网页通过创造沉浸 式的数字体验,塑造出强大的空间感,以及丰富的视觉 效果,模糊现实和虚拟之间的界限,提升网页的价值。
2 传统网页的革新目标
2.1 新颖的视觉呈现
网页设计过程遵循用户的视觉规律,注重以人为本 的设计效果。网页设计是技术与视觉元素的交融,形式 与内容的完美结合。色彩元素是影响用户情绪的第一要 素,网页设计师需要更加精准地抓住用户的注意力,舒 适、新颖的色彩搭配能够第一时间吸引用户的注意,通 过色彩的合理运用感染用户。图形图像使信息传播更加 具象,将页面的整体设计风格运用图像图形的形态转 换,增强视觉冲击力。文案是网页设计中必不可少的视 觉元素,优质的文案内容是保留用户的重要元素。通过 协调统一的版式设计,将网页信息进行具有层次性的排版,为用户呈现更丰富的信息内容。
2.2 前沿的交互技术
如今的计算机技术相比较网页初期有了突飞猛进的 提升,网站界面的体验感不仅取决于视觉呈现的效果, 当代用户群体逐渐将视觉维度体验需求转换为感知维度 上的体验需求。科技的不断发展,智能产业也随之发展 迅速, 3D、VR、视频已经不是全新的技术,但是将这 些技术运用在网页设计与开发中,是网页设计的一次突 破性的发展。随着 VR 设备技术的不断提升,创造出极 具趣味性的内容,从而在使用观感上更加引人入胜。通 过视频传递信息不仅在速度上有优势,同时具备更好的 表达性,作为主动输出的媒体模式,传递信息的情节也 是至关重要的,只有有意义的内容才能提升用户获取信 息的效率。
2.3 独特的设计创意
由于市场因素影响, 国内设计师临摹国外网站或套用 模版导致大量网页界面“同质化”现象。与此同时, 用 户的精神需求不断提升,具有创新性的网页设计是增加 用户黏度的必要条件。“先媒介、后创意”,正确的媒介 呈现优秀的创意才具有传播力。基于新颖的视觉效果与 前沿的交互基础,独特且极具代表性的创意设计是品牌 宣传的有效途径。一切的互动创意设计技术的目的都是 为了信息更好地传播 [1]。
3 沉浸式体验的特征
3.1 故事化设计
故事化设计属于网页运营的一种手段,可以通过数 据可视化将信息直观的呈现。通过讲故事来带动用户的 情绪,故事化设计通常以插画的形式表达,通过故事场 景的画面感、具有趣味性的故事内容以及具有情节式的 互动营造沉浸式的体验感。故事化设计可根据用户的 身份,设置不同的故事情节呈现在网页上,以用户为中 心,增加动态信息,有意识的引导用户将注意力集中到 故事情节上,从而满足潜在用户心理需求。信息图形化 是故事化设计方法之一,不仅可以提升页面信息的可读 性,还可以加强用户的视觉体验感 [2]。暴雪游戏网站界 面,在链接失效的情况下并没有让用户感觉自己立刻脱 离整体网站的大环境,而是以动物形态为主人公打造出 在漫天飞雪的环境下毫无头绪的情景,与用户情感达成 共鸣,将其代入到网页中便是最为精彩的浏览体验。
3.2 场景化设计
场景化思维是沉浸式体验的基础,但在网页设计领 域是一种创新的尝试。精美的场景设计可以增强用户的 沉浸感,是感官系统与认知系统相结合的体验形式。通过计算机技术与视觉设计打造场景化设计的空间维度, 场景的设计可以是视窗式二维或三维的设定,布局、色 调、产品图形的选用需要贴合场景要求,使用户在浏览 网页的过程中全身心投入进设置的场景。借助计算机技 术的创新,开发场景中的交互动效,更好的调动用户浏 览页面的积极性,用户愉悦的沉浸式体验是网页设计最 终达到的目的 [3]。美国时代广场《国家地理遭遇 ：海洋 冒险》展,利用视频映射、8K 摄影动画、超大屏幕投 影、声音的可塑性来调动参观者五感,利用交互式实时 跟踪,使游客身临其境感受海底世界与海洋生物零距离 接触,打通感觉认知的壁垒。新媒体艺术致力于打造沉 浸式体验,是依托于科技的进步而演化出来的一种艺术形 式。因此网站的设计与制作融入图文之外的互联网技术, 同样可以通过线上媒介呈现给用户震撼的视觉体验。
3.3 情感化设计
情感化设计是与用户产生共鸣的情感表达方式之 一,这种情感表达可以及时反馈用户体验度信息。唐纳 德《情感化设计》提出以本能、行为和反思这三个不同 维度为基础进行设计。情感化设计是链接网页与用户的 快速通道,优秀的网页设计大多基于用户的某种情感诉 求,利用网页浏览者的情绪波动来剖析用户的痛点和需 求,从而得到受众群体在心理上的信任。营造用户目标 统一的情感需求,给予用户迫切了解网站信息的欲望支 持,引导其进一步的操作。网页视觉元素的运用与网页 用户的情绪保持一致,方可带来共鸣。苹果的官方网站 页面采用深色系,炫酷与质感的呈现更加吸引年轻的用 户群体,其网页大面积运用立体的产品图片与微动效的 结合,避免大篇幅的文字介绍。购买苹果品牌的用户年 轻群体居多,并且不少存在注重品牌效应而不是注重功 能的潜在用户,因此页面的视觉效果相比较详细的文字 介绍更加吸引潜在客户。
4 沉浸式体验的在网页设计中的体现形式
4.1 游戏互动模式的交互体验
游戏可以使用户快速进入沉浸状态,网站需要收到 用户的及时反馈,因此用户的行为与网站交互功能息息 相关。游戏互动模式使用户在页面切换的过程中扮演着 掌控者的角色,实现从被动观看转换为互动观看的模 式,受众和游戏中主人公的界限更加模糊。用户由客观 到主观意识的转换,能够积极的去发现、认知、探索界 面交互,使用户的体验感与情感需求在很大程度上得到 满足 [4]。
设计师 Byan James 宣传保护野生动物为主题的网 页设计作品,采用精简的扁平化插画与 CSS 的交互式动效的结合,以游戏互动模式的沉浸式体验效果,展示 了不幸濒临灭绝的物种。设计师用三角形拼接出动物 形态,通过碎片化打散重组的粒子过渡动画更换物种形 态。微动效与物种图形切换的版式设计,使页面的层级 关系更加清晰。每切换一种野生动物时,动物图形下 有纹理效果的 ICON,细节足以让视觉品质实现有效提 升,点击后是野生动物数量的统计图表,通过数据可视 化的方式直观警醒浏览者保护逐年锐减的野生动物。优 秀的网页设计可以让用户完全沉浸其中,欣然接受网站 宣传的信息。
4.2 3D、VR 技术的视觉体验
VR 作为虚拟现实呈现技术,再通过整合 3D 技术 来创造一个完全虚拟的场景。虚拟技术的视觉体验是营 造沉浸式网页效果的创新,如今 3D、VR 技术在广泛地 渗透在众多领域,在视听语言和视域空间上产生创造性 地突破。网页设计是企业对外宣传的重要媒介,如今网 页逐渐从二维转换为三维,从静态转换为动态,从图片 转换为 VR 场景。
PRADA 极为重视品牌的宣传,高质量的宣传内容与 形式是连接用户的纽带。2021 年春夏时装秀未能在线下 进行,因此设计师采用视频和 3D、VR 体验的计算机技 术来展示服装秀,将秀场完全转移到线上。虚拟现实项 目以全新形式呈现,开启扣人心弦的感官之旅,越过障 碍,超越距离,重建一段熟悉且崭新的关系。拟现实的 实用技术不容忽视,用户借助移动设备,使用虚拟现实 头盔或眼镜, 通过 YouTube VR、VEER、Oculus、优 酷和 Facebook 等平台感受虚拟现实体验。VR 虚拟基础 呈现任意转换的视角, 全景式的体验效果相对于平面视窗 更加具有沉浸性。3D、VR 技术的融合使网站界面极具 感染力,但在程序开发的过程对设计师而言充满挑战, 设计领域与计算机技术的充分融合,将会使网页的设计 形式迎来质的飞跃。
4.3 视频嵌入式动态界面的感观体验
动态网页的呈现效果取决于交互动效,符合逻辑的 交互动效是用户与网页之间的桥梁,可以满足用户与品 牌之间的情感需求。在网页界面设计中,动态动态效果 设计不仅是形式上的运用,更是满足用户功能需求上的 表现,微动效的流畅性对用户视觉引导具有促进作用。 用户体验设计是以人为本的综合性设计,在倡导理性思 维的背景下,通过用户的感官体验,挖掘用户更深层次的真实需求 [5]。
TED 网站界面不同于常规的网页,在视觉与交互 动效方面极具感染力。BANNER 部分嵌入视频并结合 大字母特效,开门见山地直奔主题。在色彩运用方面, 采用浅色系文字前景与深色系背景的强烈对比,并且确 保界面组件有足够的视觉权重,强交互的色彩可以增强 画面的视觉冲击力,深色的背景设计使访客沉浸其中。 运用视差滚动的交互特效,模块根据鼠标滑动匀速变 换,将图文打破重组,层次分明的文案与高质量图像穿 插排列。微动效提高画面的灵动性的体验感,告别枯燥 乏味的静态布局。如今微交互已经逐渐高速变换转换为 层次演变,富有内涵的用户体验是提升动态界面感官体 验的关键要素。
5 结论
互联网技术的迅猛发展导致用户浏览需求不断变 换,如今的动态网页已经替代静态网页一成不变的设计 形式,逐渐成为网页设计的主流设计形式。网页设计 形式是产品营销的重要手段,有助于提升企业的品牌形 象,增强用户粘性。本文发现在传统网页面临痛点的基 础上,从沉浸式体验故事化、场景化、情感化的视域维 度出发,以网页的设计风格为主要切入点,研究沉浸式 体验在网站界面设计中的具体表现形式。
网站打造沉浸式的体验,可以提升用户接受信息传 播的效率,优化界面的视觉体验,增强受众的体验度。 沉浸式设计是当今最前沿的设计体验形式,网页应用 VR 与 AR 的交互设计仍然是一片蓝海,希望本次课题 可以对网站界面设计的视觉与交互层面起到实质性的借 鉴作用。
参考文献
[1] 陈紫婷.我国商业类网页广告的互动创意设计探究[D].上海: 华东师范大学,2012.
[2] 朱征宇,陈烨,常红要,等.网站界面设计用户体验[J].重庆理 工大学学报(自然科学版),2010,24(8):37-42.
[3] 薛艳敏,戴毓.网页设计元素对PAD情感体验的影响研究[J]. 装饰,2018(2):124-125.
[4] 贠博浩.VR三维动画艺术的创作实践与思考[D].太原:山西 大学, 2020.
[5] 杨晓新,杨海平.沉浸体验视角下的增强现实出版物设计研 究[J].科技与出版,2021(6):57-62.
关注SCI论文创作发表，寻求SCI论文修改润色、SCI论文代发表等服务支撑，请锁定SCI论文网！
文章出自SCI论文网转载请注明出处：https://www.lunwensci.com/jisuanjilunwen/45127.html
