S界面设计

此番发文搞错了,竟然首发在QQ空间了,导致全数的图纸都挂了。。那里是QQ空间的地方:http://user.qzone.qq.com/87723501/blog/1337499163

进销存系统,是自身有史以来做的最认真的一套系统。不管是界面依旧操作,都有自然的长处。算是贰个能够拿入手的创作。可是生活久了,望着同几个界面也觉得乏味。玩了几天的安卓手提式有线电话机,发现安卓之所以流行,还是有其一定的道理的。使用酷狗听音乐也有1段时间了,感觉酷狗的界面做的也是很不错的,用户体验也很棒。简单分析一下,便有了此文。

 

第一看望酷狗的默许界面:

航天科技 1

页面包车型地铁总体颜色是深蓝。是这种绿土色。这些很好解释,算是相比较经典的颜色。包涵Windows,360,QQ等,都以以浅莲红为默许颜色。经典耐看。

页面包车型地铁主基色:灰绿,深黑,杏黄。主体布局是反正,然后左后又各分为了左右。个中,上1些的万丈是稳定。

页面入眼,感觉是WindowsPhone7的作风。窗体上的平底的状态栏,是还是不是和WindowsPhone7上的菜单栏很像吧?

由此看来,酷狗音乐的风格和以One plus为表示的炫彩派格格不入。他是微软派。界面中能找到一些windows八的影子。比如,他的装置界面:

 

航天科技 2

那些是Windows8的装置界面

 

航天科技 3

能够见到,色沪指选项导航都被规划到了左侧,而且所选择的水彩不是不可枚举,可是拥有很强的杰出性。

航天科技,有相当短一段时间,小编老是觉得,圆角比直角美观。就如,小米的图标是圆角的,他必然比WindowsPhone柒的“Metro”风格雅观一样。不过,后来自家觉得自身错了,其实,使用直角,倘若您能处理好阴影的话,依旧会比圆角美观的。

航天科技 4

直角的酷狗,是还是不是和圆角的QQ方驾齐驱呢?假使这一点比较不出去,我们看看诺基亚和WindowsPhone7的比较:

航天科技 5

图形的清晰度不是很高,先将就着看呢。很显明,WindowsPhone的“瓷砖”界面包车型客车表现力比圆角加tag的表现力要好的多了。

 

用作三个开发职员,常常遇上的难题,正是数据分页,毕竟,假若有上万条数据的化,不管是B/S架构的软件只怕C/S的软件,都会境遇那几个难点。日常性的做法正是,做八个分页控件,仿佛这样:

 

航天科技 6

如此那般做,并不曾错,可是你回想一下,在您选择QQ空间的个体基本时,有未有探望这么些事物吧?

在QQ空间中,使用的是“瀑布加载”(一时这么说吗,也不领会对不对)。意思正是说,这些分页控件不再存在了,当你把数据浏览到接近完毕的时候,自动加载下1页的数量。所采纳的技术就犹如ajax了,其实这些技能也足以用在C\S架构的软件上,比如,酷狗是这样做的:

 

航天科技 7

在浏览到结尾一条时,将出现加载中,请稍候字样。假若数额加载成功,那么那壹栏就会消退。若是到了最终壹行,就会那样:

航天科技 8

嘲笑下:《小编深信不疑》那首歌太流行了。。。

这是一个很棒的用户体验,不用翻页,上一页的音讯也不会丢掉。 感觉很流畅。

但是,那样也会有2个题材,就是说,假诺有新数据了,可定是排在第一页的,但是今后列表已经加载了,那时候或许曾经加载到了第三页,第5页,如何做呢?

腾讯的处理情势,是在列表的上方做小动作。假设有立异时,就在列表的上边展现一个:“有xx等几个人好友更新日志,点击查看。”要是你点击的化,数据就会从第3页重新加载。就如这么。。。

 

航天科技 9

 

在酷狗上,小编从未找到对那种状态的处理方式,或者是软件设计者认为,数据更新的不会很频仍吧,所以就从未安插。

事实上,在安卓上,早就有了消除方法:“下滑刷新”。

在妹夫大操作中,如若应用”瀑布式数据加载“,大家利用手指上划来查阅越来越多多少。程序自动加载下1页的多寡。当有立异时,无论你什么样上划,只可以看到更为老的数量。想看最新的怎办呢?很简单,下滑就行了。通过手指下滑,大家过来了第3页数据。再持继续下降低,那么列表就会刷新。。效果图?未有。。。你装1个淘金殿堂看看就知晓呀。。航天科技 10

 

在诸多时候,大家会有对记录的删减操作,平日性的做法就是给某二个数额行添加3个刨除按钮。。

 

航天科技 11

这么的做法,其实不是太好,借使应用的系统不一样的化,所表现的效应是差别的,比如,在win200三下恐怕是那样:

航天科技 12

除外丑陋,正是丑陋。纵然,能够使用第壹方控件来弥补那或多或少。不过有些软件有明文规定:不容许行使第3方组件。(二炮,航天监测控制。。)

那要如何是好?相当粗略,用图形代替之!效果就是那般:

 

航天科技 13

自然,怎么着促成,还在研商中。。。。

有了去除,那么批量去除神马的就少不了了。一种办法是将去除按钮放在表头:

 

航天科技 14

酷狗的做法是坐落了与之对应的情事栏上:

 

 

航天科技 15

本条,哪个好丰硕坏便是三个独持异议,各持己见的难点了。不商讨。 

关于尾巴部分总计行,说实话,DotNet做的并不佳。能够说尤其差。原生的不匡助固然了,连扩张的控件都一定的挫。。。(那是本人遇上的最头痛的题材)。

 

壹经运用了“瀑布加载”的话,恐怕会有改动,能够把总括音讯在最终显示。正是在一直不越多多少的时候。

 别的三个,正是要落到实处hover效果,按钮,数据行,甚至图片。。那样的话,效果就会要命nice!

列表hover:

 

航天科技 16

按钮hover:

 

航天科技 17

 最终二个是有关搜索框的

 

航天科技 18

本条,我其实是不敢做点评,确实太强大了。也采纳了windows捌的风骨。

再说一点,正是细节和配色难点。当然,大家搞开发的跟搞UI设计的不1致,只怕不会关切这个,但是还是有要求注意一下的。正是色彩变化和光明效果。。显示到界面上正是表格的表头:

 

航天科技 19

 能够看出,表头的顺序单元格之间的分割线不是一条线拉到头的。。。

 

航天科技 20

 奚弄:真的是异样啊,看的笔者都恶心了。。。

今天就这样啊。。。转发请评释哦,韦氏原创哈。。。

 

 

 

发表评论

电子邮件地址不会被公开。 必填项已用*标注