很久以前看過一本書，講的是一些設(shè)計(jì)師如何把已有產(chǎn)品、品牌進(jìn)行重新設(shè)計(jì)，既保持原有特色，又煥然一新。工作中似乎充滿著“再”設(shè)計(jì)，無論是網(wǎng)站改版，還是外面產(chǎn)品的復(fù)制模仿，或是一些成功產(chǎn)品的跨平臺(tái)、操作系統(tǒng)的移植。

尤其，隨著移動(dòng)app的發(fā)展和升溫，PC端的產(chǎn)品有逐漸向手機(jī)端移植的趨勢(shì)。如何將一款pc端產(chǎn)品成功移植到手機(jī)端，必然要對(duì)交互操作進(jìn)行“再”設(shè)計(jì)。

從pc到iphone的“再”設(shè)計(jì)

目前來說，需要移植的多為用戶量比較大，相對(duì)成熟，數(shù)據(jù)累積豐富的產(chǎn)品。保持原有特色和常用功能讓設(shè)計(jì)師覺得踏實(shí)。但麻煩往往也常來源于此：

網(wǎng)站結(jié)構(gòu)層級(jí)在pc端往往很深。

但是，移動(dòng)界面的信息架構(gòu)往往不適合設(shè)計(jì)很深的層級(jí)。層級(jí)深容易讓用戶迷失，也不好找回主頁。

pc端因?yàn)橛袑?dǎo)航和面包屑的輔助，邏輯和軌跡也不難尋找。但是手機(jī)屏幕和操作系統(tǒng)限制，多于三級(jí)，用戶就不再好操作。

在iphone guildline里對(duì)于面包屑也提出盡量勿用的提示。

有人說手機(jī)交互是讓設(shè)計(jì)師最能發(fā)揮的地方。我覺得沒錯(cuò)。交互設(shè)計(jì)師眼中優(yōu)雅的產(chǎn)品往往都是“小而簡(jiǎn)單清晰的“和重視用戶使用目的流程的。

美圖秀秀iphone我相信出自設(shè)計(jì)師之手，界面開始就清晰的表達(dá)目的和需求：拍照或是處理圖片，之后的操作也是一氣呵成。

手機(jī)如果想獲得好的體驗(yàn)，最好靠像用戶一樣不斷操作來感受。也就是說，手機(jī)交互設(shè)計(jì)分析不像傳統(tǒng)分析從產(chǎn)品已有功能開始，更應(yīng)該從用戶操作目的和流程開始。Iphone似乎先天領(lǐng)略了這個(gè)：

頂部導(dǎo)航采用頁面名稱+導(dǎo)航（title+nav）的形式。左右傾向后退和前進(jìn)的跳轉(zhuǎn)，符合用戶一步一步處理的規(guī)范。也就是層級(jí)結(jié)構(gòu)（sitemap）的扁平化。

除此之外，交互操作方式上，雖然觸摸屏的手勢(shì)和pc有一些操作相似的地方，比如點(diǎn)擊、拖拽。PC和觸摸屏方式也不盡相同。但觸摸屏不存在所謂鼠標(biāo)的懸停（hover）狀態(tài)，也沒有右鍵點(diǎn)擊。Iphone有自己的獨(dú)特手勢(shì)，比如縮放、拉大多點(diǎn)觸碰，長按圖標(biāo)抖動(dòng)后移動(dòng)或刪除。

iPhone、ipad上手勢(shì)的總結(jié)圖

對(duì)需求的“再”設(shè)計(jì)

“需求”對(duì)于交互，在我理解分為兩部分，用戶需求和商業(yè)需求。

用戶需求很好理解，就是用戶為什么使用這個(gè)產(chǎn)品，為了解決什么問題，用戶的使用場(chǎng)景和流程分別是什么？

比如一個(gè)用戶拍照、裝扮并分享的app。流程很簡(jiǎn)單：

如此而來，分割這些頁面，可以通過對(duì)流程的梳理。每個(gè)頁面反復(fù)問用來解決什么問題的，會(huì)讓頁面架構(gòu)邏輯變得清晰。

另一個(gè)角度來說，蘋果的確是老外的思維，單線條的。ios系統(tǒng)也是一步一步的。頂部為title+nav（頁面名稱和導(dǎo)航），導(dǎo)航為表示流程操作的上一步、下一步。不難發(fā)現(xiàn)蘋果希望流程設(shè)計(jì)像用戶行為一樣，符合用戶習(xí)慣，簡(jiǎn)單直接。

而現(xiàn)實(shí)永遠(yuǎn)充滿著無數(shù)的選擇，比如，我拍好照片難道不能只保存不分享么？

于是流程演變成：

實(shí)際上，產(chǎn)品會(huì)更復(fù)雜。甚至有更多選擇分流。

這就顯現(xiàn)ios處理這種多線任務(wù)情況的弊端——如何在處理同一個(gè)頁面下，既滿足A又滿足B呢？這就會(huì)有商業(yè)需求分析上的主次之說，哪條才是有傾向性的主線呢？

對(duì)于公司來說，分享是會(huì)贏得更多粘性、用戶的方法。從這個(gè)角度來說，分享和保存的重量，明顯分享優(yōu)于保用戶個(gè)人行為的保存。那么主線就該是：拍照——》裝扮——》分享

保存可以作為分享中的輔助支流，放在屏幕中。

當(dāng)然這個(gè)例子只是說明觀點(diǎn)，實(shí)際分析上，保存作為對(duì)用戶沒有傷害性，完全可以默認(rèn)保存，之后繼續(xù)分享。

這里可以看到，商業(yè)需求就是公司戰(zhàn)略重點(diǎn)，產(chǎn)品利益傾向和方向。一個(gè)交互設(shè)計(jì)師如何斷定層級(jí)往往來自與他對(duì)于商業(yè)需求的解決能力。舉個(gè)簡(jiǎn)單例子來說明：

拍拍的搜索提示，引導(dǎo)用戶的熱門搜索

把用戶看成懶而怕麻煩的。上面的情況尤其對(duì)于瀏覽型無目的的用戶來說，具有很強(qiáng)的引導(dǎo)和暗示，也是運(yùn)營的發(fā)力點(diǎn)之一。

如果說design is solving problem.那么，方法永遠(yuǎn)比困難多，設(shè)計(jì)如何解決問題和困難的方式也多樣。交互設(shè)計(jì)師如何權(quán)衡各要素的層次永遠(yuǎn)是思考的重點(diǎn)。

優(yōu)雅的降級(jí)

用戶有在手機(jī)上使用這個(gè)功能的需要嗎？在什么情景下有呢？優(yōu)先級(jí)高么？

PC端的功能未必適合于手機(jī)端。我在手機(jī)端會(huì)有ps圖片的需求么？要到什么程度呢？是睫毛的根根分明還是膚色的修飾呢？目的是什么呢？自我欣賞還是讓好友看看評(píng)價(jià)下呢？

所以，這就是涉及到pc端功能優(yōu)雅的降級(jí)問題。