Redesign——iphone中的“再”設(shè)計(jì)

0 評(píng)論 1192 瀏覽 1 收藏 6 分鐘

很久以前看過一本書,講的是一些設(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端的網(wǎng)站層級(jí)往往會(huì)架構(gòu)很深,因?yàn)閷?dǎo)航和面包屑的輔助,邏輯和軌跡也不難尋找。但是手機(jī)屏幕和操作系統(tǒng)限制,多于三級(jí),用戶就不再好操作。

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

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

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

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

頂部為title+nav(頁面名稱和導(dǎo)航),導(dǎo)航為表示流程操作的上一步、下一步。不難發(fā)現(xiàn)蘋果希望流程設(shè)計(jì)像用戶行為一樣,一條線走下去,一氣呵成。而不是不斷的遇到拐角和選擇。

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

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

 

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

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

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

比如一個(gè)用戶拍照、裝扮并分享的app。

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

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

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

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

如果說design is solving problem.那么,方法永遠(yuǎn)比困難多,設(shè)計(jì)如何解決問題和困難的方式也多樣。

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

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

手指操作不可以復(fù)雜,不可以過于精確。

來源:http://www.zhangyq.com/redesign-iphone-in-the-re-design/

更多精彩內(nèi)容,請(qǐng)關(guān)注人人都是產(chǎn)品經(jīng)理微信公眾號(hào)或下載App
評(píng)論
評(píng)論請(qǐng)登錄
  1. 目前還沒評(píng)論,等你發(fā)揮!