APP下载

浅谈移动app界面的色彩设计

2015-10-21宁璐

探索科学 2015年10期
关键词:色彩设计

【摘要】 随着智能手机的普及,移动媒体已然成为人们生活中不可或缺的部分,而界面中具有良好交互设计的app愈发受到用户的青睐。本文对移动app交互设计中的色彩应用进行分析和探讨,以期为移动app的界面设计提供一些实质性的建议。

【关键词】 app;色彩设计;视觉平衡

1 移动app基本属性与发展

移动应用(application的缩写,简称app)是基于移动设备的第三方程序。随着智能手机的日益流行,多平台的app应用应运而生。以苹果应用商店为例,截至2015年7月,其24个类别下的应用程序数量多达150万。而今,其中100多万已被或正被苹果公司或开发商删除。面对如此庞大的移动应用数量,要想在优胜劣汰中长久生存,软件自身的设计不容忽视。

能被用户持续使用的优秀app应用,除了固有的基本功能以外,往往还拥有优良的界面的设计。而界面设计通常包括:风格设计、版式设计、色彩设计、文字设计以及交互方式等。符合用户需求的界面设计能够提高用户的使用感受,更能充分体现出app的功能特点。

近年来,几乎所有的设计媒介和个人都在提倡“简约设计”。一般情况下,设计者的主流观点就是将页面所谓的“冗余”减少和删除,而呈现给用户的可能已是“干净无比”的页面。科尔伯恩在其著作《简约至上-交互设计四策略》中有过这样的陈述:“简单是用户体验是初学者、新手的体验,或者是压力之下的主流用户的体验。”例如:图1。

看似简单的两个主界面是笔者参与开发及设计的企业移动app办公软件的页面演变。从1.0到3.0版本的变化,反映了用户对界面操作的主观性需求愈发明显,而主流用户群对最为直观的、带有色彩冲击力的图像模块的敏锐度持续增强。

同时随着网络信息技术的飞速发展,3G、4G技术的普及,趋于“本地化”“数据化”及“移动化”的app更易让普通大众所接受。于是,使移动app从设计层面脱颖而出,便是当务之急。

2 色彩设计的原理

关于色彩,事实上是一种不确定的元素,即计算机屏幕上的呈现及打印或印刷到其他媒介上同一种物体亦会出现不同的色值。為了区分,我们通常用RGB(计算机屏幕上)和CMYK(印刷品上)来表示色彩。

色彩有多种属性,传统意义上我们将其概括为以下几点:1、不协调与和谐对称;2、对比色与互补色;3、色调的冷色与暖色等。在设计中,大面积的色彩的选择直接影响了感受者的第一印象。为了使其产生安心的感觉,获取最为协调的配色,通常采用色相、明度、纯度的一致性及间隔色的选取采用同色系的技巧。因为色相一致的配色,会让人同时感到一致与带有一些幻想的印象;明度一致的配色,即便使用多种颜色也能产生整体均衡效果;而纯度一致的配色让人感觉稳重,相反则让人感觉有精神;当色彩与色彩互相冲突的间隔色出现时,在其间插入灰色或者是同系列的颜色更为协调。

人对色彩的感知,在学术领域直接被运用到“心理疾病的治疗”及色彩心理学的范畴。由此可见,色彩确实具有情感和特定的心理效应。每一种颜色均可表达出自己特定的情感,而设计中合理的色彩选择,自然赋予特定的印象。在设计中色彩的选择又往往受到各自地区甚至各国文化的影响。各地文化复杂多变,在产品的配色上呈现出多元的特点。这一点,在时下普遍的电商类移动app色彩设计中有了最为明显的呈现。为刺激用户消费,其用色往往鲜艳,即纯度较高,而为了区分彼此,色彩呈现多姿多彩。

从宏观角度剖析,色彩的情感和地域文化直接影响到了设计本色色彩的选取。因此,色彩设计往往是被束缚的“框架设计”,而在框架上做的色彩选择,更多的是通过色相、明度及纯度的相应变化,给予色彩以更多的空间层次感,在外部因素出现的同时,使设计本身更易被使用者记忆和接受。

3 色彩在移动app中的应用

针对界面设计,设计者往往遵循“总体协调、局部对比”的基本原则。而正是因为色彩所特有的情感属性,为了使产品本身脱颖而出,色彩便成为app界面中不可或缺的视觉因素,而良好的色彩组合是产品本身的利器。用户通过色彩来理解产品,同时色彩亦影响用户的情绪。合理的色彩选择和协调的色彩区域划分,更能突出重点,使用户第一时间合理使用产品本身。反之,亦然。

通过普通配色,我们似乎很难看到模块的“意义”。用户在使用过程中,很难找到“切入点”,更谈不上色彩是否融入主题环境。而将色彩赋予图形化的意义,在众多文本内容中,用图、用形突出点亮,便有了导向性的使用模式。在满足导向的同时,“导航”逐渐开始起到关键作用。而导航按钮与整体界面色调的基本统一,又使色彩具有了一定的象征意义。抛开软件本身的功能性,倘若颜色从产品的本身分离出来,将色彩与软件本身反向融合,将其创意概念用色彩充实或者暗示,而带给用户以全新的记忆点,更能增加用户习惯性的“依赖”使用,迎合用户心理使用需求。

显然,现阶段众多app默认背景色彩为中性色调或者浅色调。因此,需选择最能体现软件本身主题的色彩作为整个界面的主色调。虽然主色调的选择是建立在整体界面环境上的,但将背景色设置为浅色调或纯色会更让人感觉清新、柔和,不但便于整个界面的配色,亦能突显移动界面的重点,从而让主流用户轻松识别最直接的信息点。而在辅助色的色彩运用上,应达到相对的平衡感,即用色彩设计的三项最基本的原理:和谐与协调、对比与互补及冷暖色均衡。稳定的界面色彩更能让用户需求得以满足,增加亲切感而使其保持一定的使用频率。

当然,界面的色彩设计还需结合界面中元素的色调和面积的大小,而做到总体和局部的良好诠释。界面设计不同于网站设计,其不需太多的板块和外部组件及颜色种类。网页设计往往优先考虑内容的充实度,以板块诠释几乎全部的“信息点”。而界面设计由于自身版面大小的局限,在设计中,必须首先确定菜单的导航、植入的广告区域和基本空间元素及这三点所占的区域面积,再考虑“信息点”的介入方式及文字量。

而针对色彩“不確定元素”的属性,移动app中用户自主化的多元化色彩选择成为新的切入点。关于这点,在现阶段较为流行的众多移动化通讯工具中得到较广泛的普及。根据环境的不确定性,移动设备在不同光源和动静状态下,所需的较为合适的色彩值亦不同。对于暗环境,视线频繁在显示屏与环境这两种亮度对比强烈的界面移动,很容易造成用户的视觉疲劳,从而影响用户的身心健康。因此,在夜晚或其他昏暗环境中,移动app的界面应以暗色彩为主色。反之,相对的明亮环境,使用令用户兴奋的亮色调,更能刺激使用需求。于是,针对用户自身使用环境变换而设计“皮肤”切换功能,是移动app产品设计工作中不容忽视的内容。

4 结语

综上所述,移动app作为时下最为流行的产品,为期达到主流用户满意,除了基本软件定位、框架和创意外,产品设计中色彩的选择和使用承载着相当大的使命。在移动app出现伊始,产品多呈现为功能大于界面设计。而随着苹果手机ios7系统的更新,色彩的华丽感接踵而来,移动app的色彩设计方式全面更新换代。而在满足视觉感的同时,多方考虑产品本身的定位属性,在主色调确定的同时将相互协调的辅助色彩加以诠释,使色与色之间达到相对平衡但不失对比。再经过多方实践及调研,据其逐步深化设计,才能开发出更为优秀的移动app软件产品。

参考文献

[1伊达千代.色彩设计的原理[M].中信出版社,2011

[2Dan Saffer.交互设计指南[M].机械工业出版社,2010

[3黄晟.基于用户体验的app设计研究[D].陕西科技大学硕士学位论文.2012

[4百度百科.色彩[OL/DB]. http://baike.baidu.com/link?url=7xP_R0ybGof_wzyS08Atq_Xogw0K9gMYEN0SDqmKXiEppMWv_g7r7q2Bd9wr6DhwemQM_QmQXtztH__KqmwU6qumXOyJvmrQ15YNb_9UjXu

[5蓝蓝设计.如何在界面设计中“色”诱用户?[OL/DB]. http://www.lanlanwork.com/blog/?post=2878

作者简介:宁璐(1987.07——),女(汉族),湖南长沙人,中级工业设计师,硕士研究生学历,现从事交互设计及项目管理相关工作。

猜你喜欢

色彩设计
论知觉通感在色彩设计中的应用
动画造型中的色彩作用
色彩设计在餐饮空间中的应用
品牌包装设计中的色彩研究
职院多媒体色彩设计理念与课程改革研究
浅析中国传统民居建筑的色彩设计对文化的诠释