向商品宣战——开发者眼里的Android UI Design-Android-优质IT资源分享社区

admin
管理员
管理员
  • UID1
  • 粉丝27
  • 关注4
  • 发帖数581
  • 社区居民
  • 忠实会员
  • 原创写手
阅读:152回复:0

  向商品宣战——开发者眼里的Android UI Design

楼主#
更多 发布于:2016-05-21 22:59



预备了半个月,考虑商品规划、交互规划,见证了公司的商品、UE和开发的撕逼,将自个的考虑、感悟,整理成下文,谨代表广阔程序猿,向规划狮、商品X开战。期望广阔程序猿能够坚持遵从Google的Material
Design,实在认真负责的履行Android的规划思想,将MD规划带到商品中去,不做我国特征的App,将Android的开发习尚带到正轨,建立准确的开发观、规划观。
期望广阔程序猿朋友在博客后边留言、签名,标准Android规划、建立Android开发习尚,需求你们的力气——Android
need YOU。

根本元素
移动端的App界面,不论是iOS仍是Android,一般由四个元素构成,别离是:状况栏(status
bar)、导航栏(navigation)、主菜单栏(submenu)、内容区域(content)。
状况栏:闪现信号、运营商、电量等闪现手机状况的区域
导航栏:闪现当时界面的称号,包含相应的功用或许页面间的跳转按钮
主菜单栏:类似于页面的主菜单,供给悉数运用的分类内容的迅速跳转
内容区域:展现运用供给的相应内容
不相同的是,由于Android在4.0以后移除了实体键而运用屏幕下方的虚拟键,所以,Android将iOS中的主菜单从下方移动到了上方,然后防止误操作虚拟键。
本来许多Android、iOS的UI差异性,都是由于iOS的闭源致使的,由于它的商业化,致使许多规划被请求了专利,Android在许多当地都必须有所不相同,说的最多的即是iOS的弹性翻滚,本来Android的ScrollView要完成这么的作用,只需求修正一个参数的值即可,但是由于这个作用iOS请求的专利,所以Android就无法运用了。
规划差异性
导航栏位置与个性
iOS
iOS一般运用经典的Tab页面来进行页面的规划,也是最早最经典的规划方法。
Android
Android官方供给了两种页面切换方法:Actionbar和可滑动的Tab。Actiobar给用户供给了导航标题和触控按钮,如下:

或许:

通过滑动的方法来展现Tab页面。
展现数据
当一个选项具有多种数据可选信息的合适,Android一般运用spinner的方法来展现可选数据项,而iOS则喜爱运用segments:

Back键
iOS
从iOS的规划上咱们能够发现,由于iOS设备没有回来键,所以页面不得不在一页中闪现或许在页面上供给回来按钮。
Android
Android的回来操作对比iOS就愈加丰厚,它不只能够回来上个页面,更能够回来上一次的操作,例如翻开、收起键盘。
别的,从Android 4.0开端,Google也提出了一个“向上”的概念:

即是导航栏标题前面的一个小箭头,点击这个箭头,是回到该页面的上一个层级,而不是单纯的向上一页回来。
查找
iOS中的查找一般以控件的方法展现出来。而Android中的查找,大多以search
widget的方法展现,在点击后闪现查找框:

按钮
iOS中的按钮根本会带有显着的边框,而在Android
MD中,按钮一般不需求边框,并带以涟漪作用来展现鸿沟。
渠道差异性
交互架构
iOS的标准交互架构是第一层导航在底部,左上角回来,右上角操作,右进左出,默许笔直翻滚。不得不说,这套架构运用得到老练,很彻底,最终在这套架构上和各种进化也很优异。
Android标准交互架构的紊乱许多,但是,不好用的天然会不见,看看G1的实体按键还有几个。search没了,menu越来越少用了,顶部导航少了。各种移植景象也让交互越来越iOS化。但是Android的特征在back上。iOS的优异在于app内部,缺陷却是app外部,app之间的切换十分弱。而android,由于back物理按钮的存在,运用之间的接口十分灵敏。以栈的方法来办理活动,而不是以运用来办理活动,这就让开发者对大局的掌握愈加轻松。
widget
两个体系都包含主屏幕,但iOS的主屏幕只能闪现运用列表,而Android的主屏幕不只能够闪现运用列表,还能够自界说各种widget,这是极好的进口。不光是主屏幕上,乃至是锁屏界面上,Android也能够自界说widget,这个功用,是Android对比iOS最闪光的UI元素。
Notification
Notification相同是Android
UI元素中十分主要的一环,恰当的运用,会给用户供给十分便利的运用进口。但是,假如乱用告诉,相同会让用户十分恶感。
ScreenLock交互界面
与iOS不相同,Android的锁屏界面能够闪现的元素愈加丰厚。也支撑锁屏控件的自界说,告诉的自界说、闪现等级的自界说。

这儿的闪现作用与告诉的闪现个性根本相同。

规划主张
许多人把用户体会看成是单纯的规划或可用性疑问,过于狭隘。用户体会的构成是多个方面的,商品根底功用、新技能、内容、交互体会、UI视觉、功用本来都是体会的构成。有时分商品的成功不是一两处就能决议的,乃至献身其间一些关键环节,假如能确保满意其它十分好的需求,也是值得的。
而对于开发者, 尤其是跨渠道开发者而言, 别离遵从不相同渠道的规划标准会为规划带来更大的压力 ——
对于大多数运用而言, 需求规划多一套视觉款式 (对于许多规划师/开发者而言, 还需求从头规划一套交互逻辑 —— 尽管这是毫无必要的), 必然会增加作业量.
但是, 遵从渠道规划标准能够让开发者十分好的体现一个渠道的实力 (调用自带标准控件节约功用, 不需调用外部库完成仿照 iOS 的视觉/交互作用,
标准规划更简略完成, 等等)。
对于渠道特性去规划同一功用的不相同元素
创立一个跨渠道的规划,最需求考虑的计划即是这两个渠道上展现同一功用的元素是不相同的。所以规划应当尊敬原生UI的标准,让用户坚持同一的操作习气。

最需求遵从的即是不要刻意仿照别的渠道的闪现特性。
最佳不要共用一套UI
如今在开发中,大多运用一套UI来规划Android和iOS两个渠道的主要因素,本来仍是由于移动互联网的版别节奏太快,两套UI规划与保护的本钱过大会致使功率下降,这是采取两渠道彻底共同的最关键因素。同一个商品在两个终端并行,规划资本会严峻紧缺,两渠道功用同步规划不相同步的状况使得项目进行得适当缓慢。从团队的功率看这么做的确无可厚非,本来也即是在争取时刻本钱。
但是,规划师应当把自个的规划作为自个的儿子,比方乔布斯,他必定期望自个的儿子像自个,假如长得像爱因斯坦相同,尽管绝顶聪明,但是却显得和父亲方枘圆凿,规划也是这么,坚持体系本身的特征,是对体系本身最起码的尊敬。
假如说Android的规划个性不完美,但这必定不是运用iOS个性的理由,由于iOS个性的Android运用只会让界面看起来更差劲,不三不四,Android
Design 就算再怎样不完美,总比iOS个性要合适Android。假如说Android Design 不完美,或许是不行美丽,那么Android
Play上面那么多界面精美的运用都是怎样做出来的呢?
假如说两个渠道用同一个界面是为了提高功率,节约时刻,那为何Windows Phone
又是别的的界面?为了一个占有率80%的渠道你去“节约时刻”,为了一个占有率2%的渠道你去“花费时刻“,说得通?Windows Phone
之所以不是iOS个性的,是由于微软压根就让你做不成iOS个性的,要能照搬你会不照搬吗?所以,大多数的App以2%为理由,拒不支撑WP。
UI能够相同,但是操作方法肯定不能相同
即便咱们退一步,UI做成一套,这个许多人也还能够承受,但是最无法忍受的是悉数操作都是以iOS方法进行、并且Android的长处都悉数去掉的规划。举个比方,许多人以为Android左上角也有回来,但是那只是看起来像回来,实际上是向上,用过Windows资本办理器的人都知道,尽管有时分回来和向上都是回到同一个文件夹,但是许多时分又是不相同的,那么你在左上角做回来,能不能把功用改成向上?Android
4.1支撑富告诉,为何微信来了多条音讯仍是只能闪现发来XX条音讯,而不能直接闪现音讯内容?
这也是官方拟定标准的意义之一,让各个开发团队了解体系生态的初衷和导向,让用户在同一个体系生态下能得到尽也许共同的体会;一起也削减独立开发者的作业本钱。
而现状是 Android 上经常呈现 iOS 式操作,让人觉得十分紊乱……
不要以用户的学习本钱为托言
说到用户的学习本钱,有多少用户是两个渠道都用的?恐怕远小于只用一个渠道的。一个Android手机用户,大多数软件都是Android
Design 的,他用习气了,然后装了一个微信,俄然发现是肾6个性的,这要不要学习本钱?有多少用户是在不相同的渠道间来回切换的?请问是一个用惯了Android
Design
运用然后安装了一个肾个性的微信的用户多,仍是用惯了肾机换到Android的用户多?显着是前者多,莫非腾讯只照料后者的学习本钱,不照料前者?况且用惯了肾机,反过来用Android,没了回来就不会用了?用户都是弱智?回来在上面会用,在下面就不会用了?这种智商,根本也就不会谈天了,还用微信干啥。既然Android用户转到肾机,能学会按上面的回来,肾机转到Android,反而学不会按下面的回来,这是啥道理?轻视肾机用户智商?
真恰好的规划,是两个渠道看起来差不多,操作根本上相同,但是又能把不相同渠道的特征体现出来,界面规划根本相同,iOS渠道用圆角矩形,Android渠道用直角矩形,既能够接触切换标签,又能够滑动切换标签,一个人来了音讯能闪现,两个人来了音讯也能够闪现,不再是只闪现数量了,把上面的回来改成看似回来实则向上的按钮,这么操作起来也差不多,如今微信假如要回到主界面,需求点屡次回来,并且配上时刻很长的过渡动画,操作极端繁琐,把回来按钮改成向上,不只契合标准了,操作也大大方便了。
不要以Google放浪形骸为托言
在天朝,各种运用坚持不按照Material Design规划标准的因素,仍是在于Google
对于生态环境的任其天然,不想管,也管不了,即便不让上架Google
Play,尽管咱们如今也上不了,但是还有那么多play商铺,91、豌豆荚、baidu、360,所以,Google无法控制App的规划和质量。
并且,对应手机ROM厂商,更是为了自个的利益、让自个的ROM能够跟别的ROM有所区别,提出各种所谓的规划主题,啥三星的touchwizard,HTC的Sense,试问有哪个所谓的主题在体会上比的过原生体系,算了不说了,肝火值要满了,大招不能白放。
规划思想
不得不说,有太多的规划师误把技能当艺术、把美丽当规划了,实在主要的交互有些反而被疏忽,你能够看看,一大批的商品都是近乎静态的,许多操作怪异备至,比方你想增加一个条目到列表里,它就僵硬的出如今那;你想删去,它就直接不见。这么的商品规划,你们究竟有没有考虑过用户的感触,有没有考虑过商品的感触。
交互实在革命性的意义在于,它把时刻这一魔幻般的属性带入静态的商品当中,通过对动作、速度、闪现等等的界说,让商品的操作体现出实在感,使得用户能天然而然的了解每一个动作的意义。
动效、动效、动效
App的动效规划,不管是在iOS仍是在Android上,都是体系竭力推重的。格外是在Material
Design中,怎样运用时刻特性来规划合理的动效,是一门十分大的学识。
下面咱们看一个动效的规划图:

这是一个线性的动画实例,线性的动画尽管给出了交互,但是却是十分僵硬的交互。

非线性的动画愈加实在的仿照了动画的运转作用,让用户的体会,愈加实在。这即是运用时刻特性来改动交互特性的最简略实例。
下面这个比方也是相同,咱们仿照一个简略的刺进、删去作用:

这个比方没有经过任何动效处理。僵硬的展现,粗糙的交互规划。

而上面这两个比方,则运用动效,让刺进、删去的动画作用愈加传神,且拟合天然状况。
one more,咱们再来看一个切换的作用:

又是一个十分僵硬的切换,仅仅是画面的过渡。
咱们运用Material Design来装备这个比方:

Android在Material
Design中提出的Activity的四种状况切换方法,恰是期望运用这种方法来改动这种僵硬的规划。
动效商品实例

Material Design Guide
请一切的规划师、程序猿,必定要每日拜读Material Design
Guide,前面咱们只学习了Material Design Guide中的冰山一角——动效规划,就让悉数App完成了逆袭。假如参透了悉数Material
Design Guide,可想而知,其作用绝不亚于九阴真经、九阳神功、易筋经、葵花宝典,而其最大的好处是每人都能拿到一份copy而不必抢。
许多规划辅导,咱们就不详细写出来了,究竟咱们是代码攻城狮,以此奠基:
http://developer.android.com/design/index.html
趁便贴几个gif,展现MD规划的强壮。

规划实例
MD标准
镇楼
http://www.谷歌.com/design/spec/material-design/introduction.html
Dribbble
不解说,规划师、程序猿、爱不释手的当地。
但是,正告规划师,里边不是一切特性都是极好完成的,请不要让拿个特性就让程序猿来完成!!!
https://dribbble.com/
UI我国
还能够吧,国内的一些对比不错的规划。
http://www.ui.cn/
INSTAGRAM with Material Design
上面的这段视频是规划师Emmanuel
Pacamalan放出的Instagram安卓L版别的概念视频,这段视频更明晰地描绘出了Material Design的方方面面。Material
Design的动画十分丰厚,每一个操作之间都有动画联接,精约而又生动。而App内各个界面之前的切换,也极好地表达出了“层级”的概念。总的来说,安卓L的App规划标准对比之前安卓4.×年代的Holo前进良多。
WeChat with Material Design

上面是微信with Material Design的规划图,能够显着的感觉到Android
Material Design的规划个性。对比方今的微信客户端,差距不言而喻。
下面再来个简图:

规划参阅教程
跨渠道 UI/UX 规划示例 —— Android & iOS 篇
http://www.phonekr.com/cross-platform-android-ios-1/
http://www.phonekr.com/cross-platform-android-ios-2/
Material Design 研究会
http://www.phonekr.com/
Material Design in Action — 以猿题库为例
http://www.phonekr.com/yuan-ti-ku-redesign/
Android Design in Action — 以知乎为例
http://www.geekpark.net/topics/186387
Android Design in Action — 以微信为例
http://www.geekpark.net/topics/186657
对立的因素
以下内容也许过于过火,有有些知乎的谈论。请慎重观看。
Google工程师、理科生思想
Google的纯粹逻辑思想规划(某些时分为了简练而简练,某些时分只看逻辑不看体会和认知)是工程师式的思想。从逻辑和道理上说都是对的,比方常用APP放桌面,不常用放抽屉,看似很有道理,但是小白了解不了(他们只在一个当地找APP,即是他们第一眼看到的桌面),或许在几十年以后,智能手机对每一个人类,就像遇到奶嘴就天然地会去吮吸时,Android
Design的思路才是对的。找APP这个详细规划点,能够做一个“对于储物”的类比。人类初始期间的储物,是在屋子内到处乱放的,在人类对空间和物品储存思路满足了解、物品满足多满足杂乱后,才有储物柜、分门别类的抽屉的做法。谷歌的规划即是略过了前面期间,直接到了后边(从科学/工程师/纯理性/逻辑的视点来说,后边的做法当然是更对更领先的,但用户即是暂时承受不了)。
前面说到的国外的不相同,本来就在于国外的发达国家的我们更利于测验、更喜爱尝鲜,学习/承受速度更快。给第三世界的国家像我国商场相同满足大的商场、剧烈的竞争环境、较低水平的国民教育程度和了解能力(和公司/企业无关),这些国家的互联网/移动互联网商品的规划,也必定会趋于以接触、直观、逻辑层级浅、逻辑维度少的规划个性和标准(也即是iOS规划标准之于Android规划标准)。
或许过几年/几十年以后,人类对手机交互天然就会包含“滑动”这个操作(如今人类对手机交互的无前置认知只需接触/点击,这是从几千年的什物操作中总结来的基因和经历)。到那时,许多选用滑动操作的规划才干被无前置教育的人迅速承受。
而在此之前,更保存、直观、逻辑层级更浅、逻辑维度更少的iOS规划标准,始终要比逻辑准确、思想超前、寻求简练大于易了解、寻求功率快大于好承受的Android规划标准,要好得多(好的标准是更受干流用户的承受、运用和喜爱)。
标准来的太晚
Google直到Android L才首次在规划语言和标准上逾越了Apple。Material
Design在视觉构造(Layout和Structure)、视觉层次(谢谢Google认识到了Shadow的主要并充分运用)、颜色标准(Color
Scheme,妈妈再也不必忧虑我的配色)、字体排布(Typography和全新Roboto字体)、过渡动画(Transition和Animation)上彻底逾越了Apple的HIG。
而M上的Material
Design,让规划不只仅是一种艺术,并且是一门科学。彻底标准的文档和规划资本,现已能够让开发者、规划师彻底实习Material Design。
仿照、山寨
曾经有个段子,说乔布斯死之前,出资了几十个我国ROM厂家,以至于每次我国ROM发布会,都把自个的ROM与iOS进行对比,不知不觉,我们都发现,一切的厂商都他X说iOS是最佳的,自个的ROM怎样怎样马上就跟上它了。iOS真的应当谢谢这些我国厂商给你们做的宣扬。
尽管对于大多数国内用户而言, 他们是不知道也很难认识到 Android 和 iOS
在规划上有啥不一样的. 而国内干流的 ROM (我说的是 MIUI,流氓并且山寨的代表) 在 UI 上也仿照了十分多 iOS 特征, 在这么的大环境下,
用户很难认识到两个渠道规划标准的差异。
但是人是会前进的. 而国外优异运用大多数都遵从着渠道标准,
国内的新晋运用和开发者也逐渐都开端遵从标准, 当用户用过了更优异, 契合渠道标准的运用以后, 他们中的一有些会逐渐认识到标准的优越性,
体会到遵从标准的运用具有更高的共同性. 而不相同的渠道究竟是不相同的渠道, 一个渠道的运用会逐渐趋于遵从共同的视觉标准 —— 只需这个标准”具有满足的说服力”,
渠道内运用间一致感会不断增强.
用户不需求标准,用户只想运用好的App。用户视点看一个运用是不是用着随手即是一个习气疑问,用户看到的只是成果;而商品背面的细节需求由规划师和开发者掌握好,才干给用户一个最佳的成果。
所以,假如是天资一般般的团队或许想走群众普适道路的团队仍是恪守标准对比好,近期远期都是有利的;
假如是格外牛比的团队,那么你能够疏忽官方标准自界说一套格外的交互标准,比方
Flipboard、Facebook Paper。但是这些公司如今也在遵从Material Design。
但我现在看到的更多优异的 APP 都是在恪守标准的根底上,体现自个的规划理念,比方:Expedia、
Timely,还有国内一些新秀App,例如知乎、网易的各大App,我们能够去看看他们的App,Material
Design的规划是不是让他们的App愈加受欢迎。
公司利益
从一个公司的视点来说,从一个 App
是不是恪守标准就能够大致判别出这个商品团队的作业态度。那些从商品发布前期就恪守标准做出双渠道商品的团队,我觉得仅这一点细节的关注上就说明他们不会太水太二,即便他们是个草创团队他们的商品还有许多缺乏,由于第一步就为今后商品杰出迅速的迭代打下了根底。并且,能够从一个团队的规划标准上来看出一个公司是事务驱动技能,仍是技能驱动事务。
许多时分,商品的托言都是用户现已了解了咱们这套UI,假如换成新的规划个性,用户也许难以承受。但是,Apple刚刚提出扁平化规划的时分,网上有多少人在骂,但是后边我们不仍是都去用了,曾经被骂成X的扁平化居然成了竞相仿照的目标,怎样解说?本来很简略,优异的规划,总会被时刻所证实。
就推行而言,一个恪守标准一起又有本身商品亮点的运用,无论是 App Store 仍是 Google
Play 都是欢迎并推重的。国外的Google Play是肯定不会feature一个iOS规划个性的App的,App Store也同理。
所以,我以为一个负责任、用心的团队应当恪守渠道标准,假如能够,再加以本身的个性和理念,即是如虎添翼了。
最终
文章很长,也写了好久,期望规划师看见这篇博客,能够真的去反思怎样从程序猿的视点来规划商品,尽管这也许并没有啥卵用,但请你必定这么去做。期望程序猿看见这篇博客,能够真的去考虑怎样把技能运用到商品,Material
Design并不是仅仅给规划师看的,程序猿相同需求。程序猿的最高境地,即是一个会规划的程序猿,不光是规划程序、架构,更是规划UI、UE。与我们共勉。
最终,期望我们能把这篇文章顶起来,有缺乏、写的不对的当地,请指出,撕逼也能够,意图只需一个,让一切人——程序猿、规划师,都能够反思,怎样做一个好的Android
App。
以上。









[img]https://img.alicdn.com/imgextra/i2/2223466637/TB2PnMukXXXXXcvXpXXXXXXXXXX_!!2223466637.png[/img]

优质IT资源分享社区[font=Tahoma  ]为你提供此文。 [font=Tahoma  ]
[font=Tahoma  ]本站有大量优质android教程视频,资料等资源,包含android基础教程,高级进阶教程等等,教程视频资源涵盖传智播客,极客学院,达内,北大青鸟,猎豹网校等等IT职业培训机构的培训教学视频,价值巨大。欢迎点击下方链接查看。[font=Tahoma  ]

android教程视频
优质IT资源分享社区(www.itziyuan.top)
一个免费,自由,开放,共享,平等,互助的优质IT资源分享网站。
专注免费分享各大IT培训机构最新培训教学视频,为你的IT学习助力!

!!!回帖受限制请看点击这里!!!
!!!资源失效请在此版块发帖说明!!!

[PS:按 CTRL+D收藏本站网址~]

——“优质IT资源分享社区”管理员专用签名~

本版相似帖子

游客