原文來(lái)自 Smashing Magazine（Approaches For Multiplatform UI Design Adaptation: A Case Study）
也是來(lái)談一下讀后的體會(huì)黎休，不逐字翻譯了浓领。（除了WIRE的splash為自截圖玉凯，其他圖片均來(lái)自原文。）
這是我們?cè)谠O(shè)計(jì)移動(dòng)端交互的時(shí)候不可避免的一個(gè)問(wèn)題：跨平臺(tái)設(shè)計(jì)联贩。在面對(duì)一個(gè)交互設(shè)計(jì)需求的時(shí)候漫仆，我也往往糾結(jié)，是iOS泪幌、Android一致呢盲厌，還是各自遵循各自規(guī)則呢？
文章里剛好對(duì)于這種疑問(wèn)座菠，做了比較細(xì)致的詮釋狸眼，不過(guò)最終的決定權(quán)，在用戶身上浴滴，而不是設(shè)計(jì)師拓萌、產(chǎn)品經(jīng)理，或者公司升略。
有三種方法來(lái)解決跨平臺(tái)設(shè)計(jì)：
1微王、保持產(chǎn)品品牌的一致性，忽略平臺(tái)差異品嚣。
2炕倘、恪守各個(gè)平臺(tái)規(guī)則，淡化甚至抹去了產(chǎn)品自身的品牌個(gè)性翰撑。
3罩旋、在1，2之間尋找到一個(gè)平衡眶诈，混合型的設(shè)計(jì)產(chǎn)品涨醋。
這三種方法其實(shí)是各有利弊的，也不乏很多優(yōu)秀的應(yīng)用曾經(jīng)或正在使用著這些方法逝撬。
那么我們從第一種開(kāi)始說(shuō)起浴骂。
1、品牌導(dǎo)向性宪潮。保持產(chǎn)品品牌的一致性溯警，忽略平臺(tái)差異
從界面設(shè)計(jì)的層面來(lái)看，這種方法的確是最快狡相，最簡(jiǎn)單梯轻，也是最劃算的方法。不過(guò)在技術(shù)實(shí)現(xiàn)層面尽棕，自定義的UI組件比起系統(tǒng)默認(rèn)組件來(lái)說(shuō)檩淋，也會(huì)耗費(fèi)更多的時(shí)間和精力。
這里幾個(gè)比較有代表性的栗子。
VSCO CAM
很有名的圖片編輯應(yīng)用蟀悦，不過(guò)我沒(méi)怎么用過(guò)（羞……）但能被很多攝影師推薦媚朦，大概也在一定成都上說(shuō)明了這個(gè)應(yīng)用的專業(yè)性了。
不過(guò)這里僅僅分析它的UI日戈。文章中給出了如下的比較圖：
很明顯询张，iOS（左）和Android（右）在UI設(shè)計(jì)上是一模一樣滴。浙炼。份氧。VSCO并沒(méi)有乖乖的遵守什么平臺(tái)設(shè)計(jì)規(guī)范指南，而是最大程度的突出了自己的品牌個(gè)性弯屈，從而讓不同平臺(tái)上的用戶得到的體驗(yàn)是一致的蜗帜。正如VSCO創(chuàng)始人曾經(jīng)提到過(guò)的，『創(chuàng)意更重要』资厉，這個(gè)app的目的是為品牌服務(wù)的厅缺，是品牌的一部分，也是幫助這個(gè)品牌融入藝術(shù)家們的團(tuán)體宴偿∠嫔樱看來(lái)，這個(gè)愿景的確是在實(shí)現(xiàn)著窄刘，也的確越來(lái)越多的攝影師會(huì)用到窥妇，甚至推薦VSCO了。
我喜歡管這個(gè)APP叫Ins娩践，這也是很多熟識(shí)INSTAGRAM的人對(duì)它的稱呼活翩。最早Ins只有iOS版本，并且是相當(dāng)?shù)姆蟟OS設(shè)計(jì)規(guī)范的呀翻伺，簡(jiǎn)單好用纱新，獲得了大批大批用戶的涌入和青睞。后來(lái)穆趴，過(guò)了很久，Ins終于推出了Android版本遇汞，但顯然木有花很多時(shí)間和精力哈未妹，所以Android版本的UI和iOS版本如出一轍，完全把Android的設(shè)計(jì)規(guī)范拋開(kāi)空入，然而络它，卻也在Google Play獲得了巨大成功，打我呀~用戶喜歡的不得了歪赢。
雖然在不同的系統(tǒng)平臺(tái)化戳，但兩個(gè)版本也是傻傻分不清，如下圖：
僅僅有著細(xì)微的差別，比如logo是在左邊還是在中間的問(wèn)題……
WIRE
即時(shí)聊天應(yīng)用点楼，騷瑞扫尖，國(guó)內(nèi)收不到驗(yàn)證短信，無(wú)法注冊(cè)掠廓，但從splash來(lái)看是cool的不要不要的换怖。
從作者提供的對(duì)比圖來(lái)看，WIRE的iOS和Android版本也基本一致蟀瞧，如下圖：
據(jù)創(chuàng)始人說(shuō)沉颂，WIRE有一些很有趣的用戶交互，具體是哪里有趣悦污，只能等我能收到短信驗(yàn)證碼的時(shí)候再體驗(yàn)了Ｖ搿！
同樣WIRE也是有著很強(qiáng)的品牌氣質(zhì)切端，跨平臺(tái)交互和圖標(biāo)等都保持了高度的一致性彻坛。
從VSCO CAM, INSTAGRAM, WIRE來(lái)看，他們都以品牌為導(dǎo)向設(shè)計(jì)帆赢，也都在各自領(lǐng)域取得了一定成功小压，但單純的效仿這種方式也未必是個(gè)好方法，還是具體問(wèn)題具體分析哦椰于。
當(dāng)同一批用戶在各個(gè)平臺(tái)上都會(huì)使用你的產(chǎn)品時(shí)怠益。
這種情況下，使不同平臺(tái)上的交互瘾婿，視覺(jué)保持一致蜻牢，會(huì)更多的減少用戶適應(yīng)和學(xué)習(xí)的時(shí)間，保持了品牌的一致性偏陪，體驗(yàn)的一致性抢呆。
優(yōu)秀的自定義組件可以給用戶帶來(lái)更加直觀和吸引眼球的感受。
在保證品牌一致性的同時(shí)笛谦，也優(yōu)化了體驗(yàn)抱虐。
2、平臺(tái)導(dǎo)向性饥脑。恪守各個(gè)平臺(tái)規(guī)則恳邀，淡化甚至抹去了產(chǎn)品自身的品牌個(gè)性。
和1的觀點(diǎn)不同灶轰，2是嚴(yán)格遵守這平臺(tái)規(guī)則去設(shè)計(jì)產(chǎn)品谣沸。作者也舉了幾個(gè)栗子，總覺(jué)得這樣的app有那么一丟丟的性冷淡（請(qǐng)忽視我的感受……）
TELEGRAM
也是在某個(gè)地方比較受歡迎的即時(shí)聊天APP笋颤，而界面給我的感覺(jué)看來(lái)乳附，和1中提到的app比起來(lái)，的確高冷了許多。TELEGRAM更注重功能而非外觀赋除，因?yàn)閺耐庥^上看可以說(shuō)是沒(méi)什么特色的阱缓，甚至?xí)`以為是個(gè)系統(tǒng)app，如下圖：
顯然贤重，iOS版本就是嚴(yán)格遵循了apple設(shè)計(jì)規(guī)范茬祷，Android版本嚴(yán)格遵守了google 的Material Design。
雖然在國(guó)內(nèi)不怎么普及并蝗，但被facebook收購(gòu)的事實(shí)也讓人無(wú)法忽略它的受歡迎程度祭犯。從下面的對(duì)比圖不難看出，iOS和Android版本有著十分明顯的差異滚停，并且都在遵循著各自平臺(tái)的規(guī)范：
KOMOOT
這個(gè)APP來(lái)自德國(guó)沃粗，是關(guān)于跑步和騎車的應(yīng)用。最先推出的依然是iOS版本键畴，一年后有了Android版本最盅。不過(guò)從作者分享的界面對(duì)比圖來(lái)看，整體的布局差別不是很大起惕，在細(xì)節(jié)上還是有很明顯的平臺(tái)區(qū)分涡贱，如下圖：
兩個(gè)版本都遵循了各自平臺(tái)的設(shè)計(jì)規(guī)范，按作者的話來(lái)說(shuō)惹想，不太像初創(chuàng)公司的風(fēng)格……呃问词，所以初創(chuàng)公司傾向于簡(jiǎn)單粗暴的搞品牌一致性么？
那么什么時(shí)候比較適合使用平臺(tái)導(dǎo)向的思維來(lái)設(shè)計(jì)APP呢嘀粱？
有一種可能是激挪，你面臨一個(gè)競(jìng)爭(zhēng)激烈的市場(chǎng)，需要迅速迭代發(fā)布和積累大批用戶锋叨。
這種情況下垄分，遵循平臺(tái)規(guī)范，對(duì)于開(kāi)發(fā)人員來(lái)說(shuō)會(huì)更加容易實(shí)現(xiàn)設(shè)計(jì)人員的需求娃磺，提高效率薄湿。
Apple和Google引領(lǐng)的一些設(shè)計(jì)趨勢(shì)在用戶中的反響也的確是成功的。
比如扁平化設(shè)計(jì)取代擬物化設(shè)計(jì)偷卧。
你的APP有復(fù)雜的功能和用戶交互豺瘤。
這個(gè)時(shí)候遵循設(shè)計(jì)規(guī)范，可以讓用戶很自然的按照操作其他系統(tǒng)應(yīng)用一樣的方式來(lái)使用你的應(yīng)用而不會(huì)遇到太大的困難和疑問(wèn)涯冠。想到一句話『返璞歸真』，拋開(kāi)花哨的視覺(jué)和炫酷的交互方式不談逼庞，最根本的還是幫助用戶毫無(wú)障礙的解決掉他面臨的問(wèn)題蛇更，而你的app就是這之間的橋梁紐帶，這座橋通暢筆直平坦。
3派任、混合型設(shè)計(jì)
這個(gè)方法混搭了前面提到的兩種砸逊，既突出了品牌個(gè)性，又能在一定程度上遵循平臺(tái)設(shè)計(jì)規(guī)范掌逛。作者列舉了幾個(gè)耳熟能詳?shù)睦踝印?/p>
SOUNDCLOUD
一個(gè)流媒體播放應(yīng)用师逸。同樣存在iOS和Android兩個(gè)版本，和很多app不同的是豆混，這兩個(gè)版本是同時(shí)推出的篓像。
從對(duì)比圖中看來(lái)，iOS和Android版本各自的平臺(tái)特性還是挺明顯的皿伺，比如iOS典型的tabbar和Android的hamburg menu员辩。
Facebook的移動(dòng)端最早是HTML5搭建的，但最終還是決定在不同平臺(tái)上使用各自的原生界面鸵鸥。一方面Facebook的品牌影響力不容置疑奠滑，另一方面Facebook龐大的用戶基數(shù)，也讓他們不得不在保證品牌影響力的同時(shí)兼顧各個(gè)平臺(tái)上用戶的使用習(xí)慣妒穴，由此宋税，產(chǎn)生了混合型的界面設(shè)計(jì)，如下圖：
iOS和Android兩個(gè)版本看起來(lái)類似讼油，但都遵循了各自平臺(tái)的設(shè)計(jì)規(guī)范杰赛。
AIRBNB
被稱為成長(zhǎng)最迅速的初創(chuàng)公司。和facebook類似汁讼，兩個(gè)平臺(tái)的版本在保持品牌一致的同時(shí)淆攻，又兼顧了本平臺(tái)的設(shè)計(jì)規(guī)范，如下圖：
VIBER
對(duì)這個(gè)app太有印象啦嘿架，在wechat瓶珊，米聊還沒(méi)有走入我們生活的時(shí)候，viber就有了耸彪，當(dāng)時(shí)覺(jué)得可興奮了伞芹，這工具還能打電話，還不要錢２跄取唱较！哈哈，但召川，好景不長(zhǎng)南缓，很快就出現(xiàn)了一堆跟隨者，而且有越戰(zhàn)越勇的架勢(shì)荧呐，最終汉形，我的手機(jī)上留下的即時(shí)聊天工具里面纸镊，viber早已無(wú)聲無(wú)息的消失了。
不過(guò)作者還是蠻欣賞viber的概疆，它雖然布局交互都十分遵守系統(tǒng)規(guī)范逗威，但視覺(jué)上的識(shí)別度很高，不同平臺(tái)的品牌一致性保持的很好岔冀。比如凯旭，都是紫色系……
那么什么時(shí)候用這種混合型的方法最合適呢？
你在迭代產(chǎn)品使套，根據(jù)反饋和預(yù)估來(lái)優(yōu)化產(chǎn)品的時(shí)候
混合型設(shè)計(jì)的方法罐呼，有個(gè)前提是，你已經(jīng)十分了解用戶是怎么使用你的產(chǎn)品童漩，所以在此基礎(chǔ)上對(duì)現(xiàn)有產(chǎn)品進(jìn)行改進(jìn)優(yōu)化弄贿。
最后，到底哪種方法最好使矫膨？
呃差凹，顯然是木有最好使的，只有最適合的侧馅。讓用戶用起來(lái)最舒服危尿，解決用戶的實(shí)在需求迫切需求的應(yīng)用，有著更加頑強(qiáng)的生命力馁痴。
與小伙伴們共勉谊娇。
