将设计执行到底—记Qzone项目组视觉设计标注的前前后后

作者:二米拉 来源:腾讯webteam 时间:2009-04-19 13:22:00 

像素误差
看自己设计好上线的网站,偶尔会发觉像素行间出现了弹性空间,总在不经意间蹦出一定的差距。有些页面很难发现,比如活动类页面,这类页面多呈不规则造型,在设计上也更加灵活多变。但在portal类的页面设计上,像导航、登录框、行距等,几个像素的误差可能就会影响到用户的感受。这时,像素误差问题就很直观了。

面对不断成长的用户,Qzone的平台、活动等不断的推陈出新,新的视觉观感、新的操作方式、新的体验等等都在追求尽善尽美。但由于时间进度和对界面的不同理解,以及上线前开发联调等原因,导致线上的页面和设计稿对比,会出现几个像素的误差。这看似不起眼的像素误差,可能导致用户无法实现操作目标,增加用户的操作成本,让用户沮丧,让我们产品的体验大打折扣。如何让视觉设计师输出的设计稿能更加准确无误的展现在用户面前,是一个问题。

解决方法
怎么更好的解决像素差的问题呢?ISD Webteam众人一阵头脑风暴过后得出了结论—标注

所谓“标注”,泛指标示距离的牌柱或特制的目标。对页面设计稿进行标注,可以大大降低像素误差,尤其适用于portal类产品。

目前在Qzone项目组进行标注的内容包括:页面行宽、间距、对齐等关键点的具体像素数值。为了易于识别,标注以图标“I”为标示,使用红色12号新宋体。

效果如下:




标签:设计,qzone,视觉设计,标注
0
投稿

猜你喜欢

  • 在ASP.NET 2.0中操作数据之三十:格式化DataList和Repeater的数据

    2023-07-22 20:15:21
  • Python实现合并多张图片成视频的示例详解

    2021-07-17 06:18:14
  • 13个你希望早点知道的实用WordPress SQL查询语句[译]

    2010-02-28 12:48:00
  • 在Python中处理日期和时间的基本知识点整理汇总

    2021-05-13 07:12:14
  • 精细讲述SQL Server数据库备份多种方法

    2009-01-13 13:33:00
  • Python中类型关系和继承关系实例详解

    2023-10-08 06:15:06
  • 对python中使用requests模块参数编码的不同处理方法

    2022-11-02 01:30:29
  • springboot配置数据库密码特殊字符报错的解决

    2024-01-17 18:55:07
  • ASP.NET在IIS一些问题经验总结

    2007-08-07 15:42:00
  • python模块的安装以及安装失败的解决方法

    2023-09-14 06:33:04
  • asp使用 sql_dmo 添加新数据库代码

    2010-03-17 20:57:00
  • 分享18个最佳代码编辑器/IDE开发工具

    2022-03-26 01:31:24
  • 解决hive中导入text文件遇到的坑

    2023-06-30 16:28:26
  • python命令行模式的用法及流程

    2022-05-01 17:31:13
  • iview实现动态表单和自定义验证时间段重叠

    2023-07-02 17:09:28
  • PHP常量及变量区别原理详解

    2023-09-05 06:35:45
  • Python3+Appium安装使用教程

    2023-08-22 13:38:32
  • PHP 字符串 小常识

    2023-11-20 22:08:32
  • .Net行为型设计模式之观察者模式(Observer)

    2024-05-13 09:17:50
  • 浅谈一下python线程池简单应用

    2023-08-27 10:48:37
  • asp之家 网络编程 m.aspxhome.com