新浪网产品设计指南(含UI规范

位置:首页 > 产品说明

新浪网产品设计指南(含UI规范

  : 以下分各模块介绍。 设计规范介绍 什么是设计规范? 《产品设计部·人机交互界面设计规范 》适用用于WEB产品线的人机交互界面设计方面的指导手册。 贯穿以用户为中心的设计指导方向,根据新浪产品自身的特点制定出的一套规范,以达到提升用户体验,控制产品设计质量,提高设计效率的目的。 谁去读设计规范? 设计规范手册适合界面设计师,用户体验设计师,前台技术 ...

  《产品设计部·人机交互界面设计规范 》适用用于WEB产品线的人机交互界面设计方面的指导手册。

  贯穿以用户为中心的设计指导方向,根据新浪产品自身的特点制定出的一套规范,以达到提升用户体验,控制产品设计质量,提高设计效率的目的。

  设计规范手册适合界面设计师,用户体验设计师,前台技术工程师,发布支持人员,运营编辑人员的参照。

  例如:无论每个频道如何追求个性不能脱离新浪整体风格,要有继承和延续保持从属关系 个案除外,个案量应有百分比,

  考虑用户的文化背景及习惯,做到设计上本地化。体现人文关怀 例如:google,被搜索文字连接采用红色,及中国传统节日的logo体现。设计上不照搬英文站应根据中文特色,体现中文之美

  页面类型:① 普通页面     ② 宽带页面     ③ 自适应页面     ④ 其他页面

  适用范围:新浪首页 频道首页 频道二级 频道各级 正文页面等及其他非宽带产品线

  属性中背景白色为常用色值,对于特殊个性化频道可根据特殊要求变更色彩或者使用背景图。

  背景图片遵循原则尽量选择可复用的图片,减少页面文件量。如果遇到页面整体外描边效果参照图例(01)。

  标准头分为:新浪首页标准头 \ 新闻中心标准头 \ 频道首页标准头  \ 频道二级标准头 \ 正文页面标准头 \ 产品页面标准头

  导航分为: 频道导航 \ 二级导航 \ 专题导航&专题图 \ 三级导航 \ 导航指向

  结构应用:① 新浪首页  ② 新闻频道  ③ 普通频道  ④ 频道二级  ⑤ 专题页面  ⑥ 三级页面  ⑦ 正文页面  ⑧ 产品页面

  类型分类:① 新浪首页标准头   ② 新闻中心标准头   ③ 频道首页标准头   ④ 频道二级标准头   ⑤ 正文页面标准头  ⑥产品页面标准头

  类型分类:① 频道导航  ② 二级导航  ③ 专题导航&专题图  ④ 三级导航  ⑤ 导航指向

  组成部分:频道LOGO ┊ 功能性导航 ┊ 主导航位置区 ┊ 次要导航位置区

  版块组合形式:版块元素之间距为8PX      同名版块元素间的距离为6PX  (例如EEC中 EE距离为6 EC距离为8PX  H2等分版式为6PX)

  模块类型标题种类:① 焦点图  ② 头条区  ③ A类模块  ④ B类模块  ⑤ C类模块

  说明:10号字格式,12号字格式,14号字格式中的数字英文字母为Arial,中文为宋体

  动态链接样式: 鼠标初始: 颜色 #000099 ■ ┊状态 下划线 __

  重要链接样式: 鼠标初始: 颜色 #CC0000 ■ ┊状态 下划线 __

  应用组合:① 导航类   ② 标题类  ③ 信息类  ④ 段落类  ⑤ 功能类   ⑥注释类  ⑥ 表单类

  a 版块标题: 20号文字格式 = 字号 20 px ┊ 字体 黑体 ┊ 细体 ┊ 颜色 #自定义 □ ┊ 行距 无

  文字其它说明 = 标题文字位置前可选择性修饰符号和图片,默认为三角形符号

  文字其它说明 = 正常默认为点状符号,排行性质为数字符号,词语或者小空间区域可采用无符号

  文字其它说明 = 正常默认为点状符号,排行性质为数字符号,词语或者小空间区域可采用无符号

  更多:更多    更多应用于深背景连接连接色彩采用反白,连接颜色可自定义

  片类型:① 横图  ② 竖图  ③ 方图  ④ 专题图类型说明:① 横图  比例 4:3  ┊ 尺寸种类  280*210 ┊ 应用 焦点图

  图片类型:① 按纽  ② 输入框  ③ 文本框  ④ 菜单  ⑤ 复选框   ⑥ 单选框类型说明:表单形式建议采用WIN2000默认外观。

  白色    正面:雪花,纯静,清白,和平,轻盈, 纯洁、天真、洁净、真理、

  绿色    正面:植物,自然,春天,肥沃,希望, 安全  自然、稳定、成长、

  在北美文化中,绿色代表的是「行」,与环保意识有关,也经常被连结到有关财政方面的事物。

  蓝色    正面:天空,海洋,精神性,定度,和平, 个体 忠诚、安全、保守、宁静、冷漠、悲伤

  色彩构成(Interaction of color),可以理解为色彩的作用,是在色彩科学体系的基础上,研究符合人们知觉和心理原则的配色。配色有三类要素:光学要素(明度、色相、纯度),存在条件(面积、形状、肌理、位置),心理因素(冷暖、进退、轻重、软硬、朴素华丽),设计的时候运用逻辑思维选择合适的色彩搭配,产生恰当的色彩构成。最优秀的配色范本是自然界里的配色,我们观察自然界里的配色,通过理性的提炼最终获得我们所需要的东西。

  面积调和的原则是:色彩面积的大小可以改变对比效果,对比色双方面积越大,调和效果越弱;反之,双方面积越小,调和效果越强。对比双方面积均等,调和效果越弱;对比双方面积相差越大;调和效果越强。只有恰当的面积比才能取得最好的视觉平衡,形成最好的视觉效果。

  纯度对比调和。 色相对比调和 多个色相对比调和 两个补色对比调和 两个类似色对比调和 两个同一色对比调和 灰色与高纯度黄色调和 小面积用强色,大面积用弱色”。


上一篇:保险公司招股说明书内容与格式特别规定  下一篇:国家森标产品LOGO及设计说明

新闻相关

    无相关信息

copyright © 2016-2019 www.g22.com