关于界面设计说明的撰写参考.pdfVIP

关于界面设计说明的撰写参考

在网上看到的一篇，觉得还可以，供大家参考！

一、界面现状分析

（1）界面外观的横向、纵向比较

第一套界面色调柔和，亲和力较强，但长时间观看会较快失去新鲜感；

第二套界面色彩反差大，对视神经的刺激能保持较长时间的新鲜感；

Longhorn的界面色彩单纯明快。

略

三套界面风格设计比较表：

1）明度

2）纯度

3）对比度

4）界面质感

5）优点

6）缺点

小节：新改版的界面风格一定要有更强更持久的生命力，在传统的

风格基础上有超前的设计理念，作为依附微软操作系统Longhorn而

生存的应用型软件，界面外观更应该参考Longhorn的风格设计体系，

和它的风格特征同步发展。

（2）硬件、软件环境分析

我们的产品定位

界面的分辨率最低要满足800*600的用户，以1024*786为基准进行

设计，界面的整体布局要适应更高分辨率的扩充效果。

小节：登录、关于界面尽量图形化，突出品牌特色。界面以1024分

辨率为基准进行设计，同时满足800分辨率，在更高分辨率下的整体

外观也要协调，布局合理。

二、界面设计的主要因素

（1）设计环境

技术环境：受WEB和GUI不同的技术结构和传统风格的限制，界面外

观会稍有不同。设计时要求尽量保证控件外观的一致性，企业信息门

户的基本技术框架是由portlet组成，等同于GUI容器控件的概念，

所以，如果能保证门户的portlet和GUI的容器在外观上一致，就很

大程度上保证了WEB和GUI产品外观的一致性。

业务环境：portlet里面所展示的内容是用户完全可以自定义的，而

这些内容大部分是GUI产品的内容，如果内容所呈现的外观差异大，

就会引起用户视觉理解上的混淆，所以portlet所展示的内容外观必

须和GUI的内容保持一致。另，portlet里面的内容是千变万化的，

在进行容器设计时一定要注意简洁清爽，方便用户定制和查看。

产品特性：信息门户是WEB产品，在设计主界面时要适当体现WEB特

色，如：增加动画效果的图片或flash，界面结构更为简洁，框架容

易扩充。GUI的外观设计相对来说更加严谨，间距要尽量小，以最大

限度展示业务内容为目的，要具有成熟稳重、简洁大方的GUI产品风

格特征。

小节：信息门户的portlet和GUI的容器外观保持一致，并且是最简

洁有效的色彩和造型；业务内容所呈现的外观在门户和GUI里都必须

保持绝对一致；WEB的控件外观尽量和GUI的保持一致；信息门户主

界面的设计要适当体现web产品特性。

（2）目标用户心理

操作使用：色彩的基本作用是区分功能模块和对业务流程进行视觉导

向。所以，色彩的应用要有远近层次感，体现导向功能；对于功能模

块的区分，色系的应用依据规范的理论基础，如：蓝色系表示选中、

编辑；黄色系表示警示、注明；绿色系表示通过、安全。色彩的选用

首先要保证这两方面功能的实现，在此基础上再考究色彩之间的美观

协调性。

感观享受：美观是产品销售过程中提高竞争力的策略之一，同时也可

以保持用户对产品的新鲜感，并提高用户使用产品的忠诚度。所以，

外观的整体设计要有超前意识，设计灵感来源于用户但要高于用户。

让他们在繁忙工作的同时得到心灵上的享受。

小节：色彩的基本作用是区分功能模块，对业务流程进行视觉导向；

色彩的选用首先要保证这两方面功能的实现，在此基础上再考究色彩

之间的美观协调性；设计灵感来源于用户但要高于用户，提高用户的

欣赏水平并保持相当长时间的新鲜感和忠诚度。

三、品牌应用

略

小节：辅助形沿用天空和大海，但没有“形态”只有“神韵”，宣传

一种企业文化精神。

四、典型界面描述

安装、登录、关于典型界面的设计要体现“天高任鸟飞、海阔任鱼游”

的意境。亮蓝色色系为主，加很少亮的橙色做对比呼应，界面的感觉

要轻灵通透、有活力、质感要强，整体外观给人要有耳目一新的触动

感；

向导、信息提示界面亮蓝色系为主，但背景要求清爽简洁，设计的图

形化符号表意要明确，造型

要美观，由于表意的载体元素（如：信息提示的问号）要遵循通用性

原则，但为了突出产品特色，在元素的造型上建议设计为立体效果，