版式设计在UI设计中的应用

版式设计是对版面格式的设计。设计者根据设计主题和视觉需求, 在预设的版面内, 运用形式美法则, 将文字、图形图像、色彩、空间等视觉元素, 有组织进行排列组合, 有效的传递信息, 并使用户获得美的感受。在新媒体背景下, 版式设计的内涵和外延都有所扩展, 交互性、动态化、多维度等新元素的加入使得版式设计的任务更加艰巨。美观实用的用户界面离不开版式设计。用户界面与平面设计一样具备图、文、色、空间等基本元素, 版式设计的基本原理在UI设计中同样适用。

传统媒体是单线传播, 受众处于被动接受的状态, 而新媒体的及时交互性打破了以前人们接受信息的线性方式, 加入了各种视听元素带给受众多方位的体验和享受, 针对UI设计的特点, 版式设计需要调整单向思维, 注重用户和界面的交互性, 将空间和时间的因素纳入设计思维当中, 如何将这些新的元素在界面上成功地表达是版式设计需要研究的问题。

日本设计师原研哉提到这样一个观点:“对设计师来说, 信息就应该是一种产品, 设计师的任务就是提高信息的品质, 增强传播的力量。”

随着技术的发展, 曾经限制了新媒体视觉表现力和操作便利性的问题逐一解决, 更清晰的画面, 更丰富的色彩, 更逼真的特效配合良好的操作性不断提升界面的视觉表现力, 带给版式设计更广阔的的创作空间。

UI界面通过光来传递信息, 长久的注视较传统的平面媒介更易使人在生理和心理上产生疲劳感, 设计者应提供更快速有效的传播方式。比起文字, 图形图像、动画更为直观, 容易理解, 因此在UI的版式设计中常常将文字图形化或两者相结合, 缩短用户的阅读时间, 减轻阅读压力。另一方面, 版面元素的现状、大小、色彩、空间位置等也需要考虑用户的阅读习惯, 分清主次, 引导用户按照有序的秩序接受信息。界面的版式尽量保持整体性、一致性, 以减少视觉跳跃感, 节约用户的时间成本, 偶尔有所变化则会给版式带来一定的活力。好的版式设计必须具有主题明确、表达清晰, 具有简易性、一致性、灵活性。

用户界面可分为信息展示型界面和功能操作型界面。信息展示型界面以传递信息为主, 强调信息的传播性, 版式上注意以浏览引导为主。功能操作型界面结构更为清晰、简洁, 多采用扁平化图标, 简洁清晰, 易于操作、功能明确, 利用统一的外观、大小、相似的色彩、整齐的排列吸引用户。

UI设计是功能性和审美性的结合。UI设计在关注视觉美感的同时更加注重功能性。好的UI版式设计应以人为本, 关注用户的操作感受。

一方面运用视觉原理, 采用科学的视觉方法将视觉元素进行合理的安排, 对用户进行视觉上的引导, 在使用过程中按照一定的秩序诱导用户能够顺畅的获得信息, 另一方面运用形式、色彩上的统一性营造视觉上的整体感, 弱化单个视觉符号的力量, 让用户更加关注内容的主体, 理所当然的点击、滑动图标、链接, 在自然而然的过程中完成交互体验。

版式设计中应注意动静结合。大量静态信息会使用户在心理上产生疲劳感, 而动态信息能调节情绪, 为受众注入新的活力。UI设计常常将动静元素相结合。

静止的界面随着手指的点击滑动呈现动态的效果, 配合适当的音效进入另一级界面, 流畅的转换增加操控的趣味性;用FLASH、GIF等动态视觉元素穿插在各级页面当中, 增强视觉效果, 更为快速的传达信息。

用户界面的多维度牵涉到两个层面的含义, 一是界面的立体网状信息架构模式决定界面不再只是二维的空间表达, 超级链接使得界面呈现网状化、层次化, 构成立体化的信息传递空间。二是动画、视频等常常整合到界面当中, 增加了三维空间和四维时空的元素, 使得用户界面的版式设计更为复杂。版式设计不仅要考虑每一层面的版面排列, 还要有时间、空间的观念, 依靠技术与艺术的结合构造完美的虚拟空间。UI的版式设计需要借鉴影视动画的相关知识, 将所有平面的、时空的元素, 按照一定的条理、秩序排列, 形成一定的节奏和韵律, 通过对形状、方向、层次、颜色的控制营造统一的风格、氛围, 环环相扣, 增强界面的感染力, 让用户在视觉上获得享受, 在使用过程中得到美好的体验。

在新媒体背景下, 人们的生活越来越智能化, UI设计作为连接用户和产品的桥梁, 其应用范围越来越广。立体网状层级信息架构的UI设计给传统的版式设计在理论体系、设计思维、设计技巧上提供了新的发展空间, 研究UI的版式设计对促进UI设计的科学发展也有着重要价值。

摘要：UI即用户界面 (User Interface) 。UI设计是指对软件的人机交互、操作逻辑、界面美观的整体设计, 也叫用户界面设计。UI设计大体包含三个方面:一是图形设计, 对用户界面进行外观设计。二是交互设计, 对产品的操作流程、树状结构、操作规范等进行设计。确立用户与产品间的交互模型, 交互规范。三是衡量UI设计的合理性、美观性。优秀的UI设计首先要通过美观的产品外观设计吸引用户, 带给用户舒适简单的操作感受, 这些功能的实现都离不开合理的版式设计。本文就版式设计在UI设计中的应用进行了简单的梳理。

关键词：版式设计,UI设计