Tabs流
现在最流行的设计风格莫过于经典的TABS风格,下面是某种Tabs设计的实现:
成都创新互联-专业网站定制、快速模板网站建设、高性价比陵城网站开发、企业建站全套包干低至880元,成熟完善的模板库,直接使用。一站式陵城网站制作公司更省心,省钱,快速模板网站建设找我们，业务覆盖陵城地区。费用合理售后完善，十年实体公司更值得信赖。
[---TITLE---]
[---CONTENT---]
[---TABS---]
优点
就是,布局清晰明了,功能切换方便,用户学习成本低,毕竟主要功能都在tabs上,只要会点击按钮都会用这个应用,而且,大部分应用都是这样,是绝对的易上手风格.
缺点
烂大街的设计风格,没法给人耳目一新的感觉,而且存在一个问题,就是屏幕利用的浪费,因为tabs一直占用着底栏,有时候,我们可以思考一下是否必 须要常驻?接着就是功能数目与tabs数量的冲突,有时候,我们一个应用有很多一级页面的功能的,有些人就像把它全部放到tabs里面,就不tabs摆放 得密密麻麻的,有密集恐惧症的人估计,永远都不会用这样的应用了.目前的趋势是tabs 不断做减法.
参考
微信,QQ,Appstore
Tiles流(metro?)
类似于flipbard的那种风格的,我称之为砖块流吧,我的意见是砖块设计风格是用来解决tabs数目过多而出现的一种设计方式,这种设计的逻辑 应该是,当我们一个应用的功能很丰富无法每个功能看上去都是很好用不好决定哪个功能作为默认功能的时候,这时候,我们往往把这个抉择交个用户.下面是某种 Tiles设计的实现
[---TITLE---]
[--[TILE]--[TILE]--]
[--[TILE]--[TILE]--]
[--[TILE]--[TILE]--]
...
优点
解决了应用功能非常之多如何对用户的解释的问题,让用户能够一目了然的在众多砖块里面选择到自己需要的功能
缺点
功能间的切换不方便,例如,一个用户在用功能A的时候,想回头使用功能B,就需要先返回再选择功能B,然后,想用功能A的时候,再返回,在选择.如果一个功能的层级有3层,要切换功能就要返回 多次.使用这种风格的应用,切记一个功能的层级不要太深.
参考
flipbard,zarker
Change流
关于这风格的名字着实思考了很久,现在这种风格并不多见.这种风格可以看做是Tabs流和Tiles流的某种合体的实现,上面提到Tabs流的风格 存在无法展示过多功能,Tiles流无法存在无法暂时默认页面,功能切换麻烦.而Change流正好把这两点给克服了,下面是某个不存在的应用(g+)的 Change设计的实现
[---Control---]
[-[--LeftPage--]-[--MainPage--]-[--RightPage--]-]
现在这个图样,估计不好了解,这里得特地说明一下,Change的设计风格,它把原来的title栏,改造成了可以用于进行交互的 栏,android称之为actionbar,为了大众一点我把它改名为控制栏,把title栏改造成控制栏的一个好处就是能够进行一定的交互,有人可能 会问,tabs流和tiles流的title栏就不可以进行交互了?这里所说的交互是贯穿于整个设计,例如filpboad 的title栏位,可以用作看作用户详细信息,但是,这个已经脱离设计以外了,它本质还是一个用于展示当前标题,只不过,在上面添加了一个功能.
说了这么久这个control栏有什么特别的地方呢?control栏可以说是把tabs风格在tiles风格架设了一个桥梁,使一个继续既然 tabs的功能间方便切换,也能像tiles那样有丰富的功能进行选择.这里的实现,就是把我们的主前端分成了三个page,MainPage保留了 tabs 的功能默认暂时,LeftPage则实现了tiles 级别的美观的功能选择显示,而右边的页面可以做对MainPage的一些补充显示.
优点
拥有tabs和tiles风格的优点,去除了它们的缺点.
缺点
对于大屏手机的操作不方便...
参考
不存在的应用: g+,facebook
最后
貌似写的挺多的,觉得不错,有就顶一下吧,如果,有不同见解,回复讨论!
-同时在oschina,cnblogs 发布...
另外有需要云服务器可以了解下创新互联scvps.cn，海内外云服务器15元起步，三天无理由+7*72小时售后在线，公司持有idc许可证，提供“云服务器、裸金属服务器、高防服务器、香港服务器、美国服务器、虚拟主机、免备案服务器”等云主机租用服务以及企业上云的综合解决方案，具有“安全稳定、简单易用、服务可用性高、性价比高”等特点与优势，专为企业上云打造定制，能够满足用户丰富、多元化的应用场景需求。
网站名称：谈谈常见的移动应用设计风格-创新互联
文章网址：
http://cdkjz.cn/article/coedjd.html
