细节至上——Splus微博设计之界面篇（转）

细节至上——Splus微博设计之界面篇（转）

http://blog.snaildesign.com/?p=41

 

Posted on September 26, 2010 by admin

首先，要感谢新浪微博，强大完善的开放API，让我们得以实现自己开发一款小互联网产品的梦想:)
我们的Splus微博是基于新浪微博API接口的AIR桌面客户端，目标是为了使用户获得更好的接受微博信息、传播微博信息的体验。
设计之初，Splus微博就想要做最优秀的微博客户端，并以此为目标，从用户层面开始设计，并且在上线后不断完善，不断追求，关注每个微小的细节，任何一点不满意的地方都会被反复重设计并测试。

一起来了解一下Splus微博UI设计方面一些背后的点点滴滴吧，开始咯~
———————————-时刻注意细节的分割线————————

0.原型设计
原型必不可少，我们先使用Axure画出了Splus的低保真原型，简单而粗糙，但它却奠定了我们UI的基础。

图-1 Splus微博axure原型

参考现有的客户端是开发必不可少的，因此，从AIR微博、SinaTair，到微波炉、wing微博，我们都一直在充分试用，吸收一些优秀的客户端 的经验。而且不仅仅是新浪微博的客户端，一些现有的IM的客户端，也是我们获取参考的重要途径，这些包括QQ、Gtalk、MSN等等。

图-2 各类客户端

我们从Splus微博的登录界面开始，来一点一点看看Splus的UI设计细节。

1.主程序背景样式

使用了单张PNG图片为背景，并设计了窗口边框的阴影和四周圆角，增强视觉效果。

图-3 主程序窗口样式

2.登录Logo设计

为了能充分使用应用样式，所有的图片均被设计成PNG格式，保留了图片的Alpha通道。Logo也遵循了PNG格式图片，保留了一些图片的透明部分，这样Logo和背景样式无缝地融合在一起。

图-4 动态更换的LOGO

注：为了能在特别的日子里设计特别的LOGO ，并没有固定死LOGO 图片，而是根据配置来动态更换LOGO ，这样在情人节、五一、中秋、国庆等等节日，或者一些纪念日里，都可以设计一些相关主题的LOGO 。

3.用户登录