【轉(zhuǎn)載】APP解構(gòu)重構(gòu).勿忘初心

引子


大學美術(shù)史(選修)的第一堂課上,那老師開門見山的說:知道大家認真聽課的不多号俐,下節(jié)課能來多少也不知道,這里介紹一個自學閱讀的辦法秸应,方便你們抱佛腳摹蘑,在我看來大部分書籍講的實質(zhì)性內(nèi)容都很少绸罗,這就需要擰干提純愉老,發(fā)現(xiàn)一本書有用之處最有效的方法是看目錄嚷节,大家能消化掉美術(shù)史這本書的目錄就能考60分了硬萍。對于其它休閑類書籍你大可從目錄里面選擇自己有興趣的章節(jié)閱讀扩所,感興趣的章節(jié)對你來說就是干貨,整個目錄你都不感興趣的話朴乖,那這本書就杯具了…不知道其他同學的感觸祖屏,我后來閱讀一直用這個方法,此技巧甚至可以列入我大學所學有用知識前十強买羞,其它九強已然忘卻袁勺。

其實一本書寫好之后放在那里就是按照作者意圖設(shè)定的靜態(tài)結(jié)構(gòu)存在,但是讀者看書時沒有必要建立和作者一樣的結(jié)構(gòu)畜普,對個人來說是完成一個任務(wù)的過程期丰。任務(wù)如果和結(jié)構(gòu)吻合是好事,如果不吻合那就痛苦了吃挑,很多人很可能還沒看到有用的地方就合上這本書終止任務(wù)了钝荡。新華字典就有一個嚴謹?shù)慕Y(jié)構(gòu),用戶需要認證學習才能掌握使用方法(也就是了解字典結(jié)構(gòu))進而完成查字典的任務(wù)舶衬;兒童識字卡沒有自己的結(jié)構(gòu)埠通,甚至可以一頁頁拿下來,同時兒童的任務(wù)也是最簡單直接的逛犹,認識一個字和另外一個字都是獨立的任務(wù)植阴,不需要建立聯(lián)系蟹瘾。

這位老師介紹的方法實際上把我們從執(zhí)行閱讀任務(wù)依附于書籍結(jié)構(gòu)的習慣中解放出來。書籍的結(jié)構(gòu)和讀者的任務(wù)是可以不對等的掠手,你愿意讀哪一頁就哪一頁。這可以類比到APP的結(jié)構(gòu)與用戶的任務(wù)狸捕,APP都是按照固定結(jié)構(gòu)上線的喷鸽,用戶在使用過程中完成的確是一個個獨立的任務(wù),這就是為什么云閱讀后臺尘呐模看到:離線下載后去哪里查看白鲎!?搜索去哪里了鸡岗?這類反饋的原因混槐,因為用戶不關(guān)心你是什么結(jié)構(gòu),只要在完成任務(wù)過程被終止了他們就會抱怨轩性。當然了設(shè)計師也會對著悲慘的數(shù)據(jù)說:此按鈕如此明顯怎么用戶就不知道去點擊呢声登?網(wǎng)易云課堂的課程詳情頁右上角有個大大的按鈕“參加該課程”,But數(shù)據(jù)顯示用戶就是不去點它揣苏,理由很簡單悯嗓,用戶執(zhí)行自己的任務(wù)時不會想到用它,你就是弄個閃電雷鳴的提示效果都不會大卸察,傳言設(shè)計師后來在目錄中加入“課時預覽”就好多了脯厨。

用戶很坦然,微信滿足不了他們約炮的欲望坑质,可以改去陌陌合武。但是設(shè)計師就忐忑了,網(wǎng)易云閱讀的產(chǎn)品結(jié)構(gòu)滿足不了用戶的閱讀任務(wù)時就會流失他們涡扼。所以作為設(shè)計師要最優(yōu)化的解決APP結(jié)構(gòu)與用戶任務(wù)間的關(guān)系稼跳,如何優(yōu)化?我們先理解一個APP結(jié)構(gòu)是個啥壳澳;再來看看被解構(gòu)的APP如何組裝起來已滿足用戶任務(wù)岂贩。

APP解構(gòu)方法


設(shè)計師都可以輕易的知道“APP是由頁面組成的”,但這又是一個毫無意義的結(jié)論巷波,那么我們來嘗試站在“頁面”這個角度宏觀和微觀的看一下萎津,借用一個口語就是——向左看向右看。
1抹镊、向左看
APP的世界里有三個頁面:聚合頁锉屈、列表頁、正文頁垮耳。聚合頁匯聚了各個模塊的入口颈渊,從這里用戶可以選擇要去的地方遂黍,比如網(wǎng)易云閱讀的首頁,里面有用戶訂閱各大資訊源俊嗽;列表頁就是純粹某項內(nèi)容的列表展示雾家,如果你進入網(wǎng)易云閱讀的某個訂閱源就可以看到這個頁面了;內(nèi)容頁是最底層的內(nèi)容展示頁绍豁,用戶在內(nèi)容不能再往下走層級了芯咧,當然了橫向串動或者向上跳是可以的,對應(yīng)的就是你在網(wǎng)易云閱讀里面看某篇資訊詳細內(nèi)容竹揍。

2敬飒、向右看
一個頁面總是由三個元素組成,主內(nèi)容芬位、頁面工具无拗、頁面操作。主內(nèi)容必然存在昧碉,即使是空態(tài)都會展示個哭臉之類的英染。拿書籍正文頁來說,這本書的文字就是主內(nèi)容晌纫;頁面工具用來改變一些展示方式税迷,如:字體大小、夜間模式锹漱、亮度箭养;頁面操作含信息的處理路徑,如:評論哥牍、分享毕泌、加書簽、查看書籍詳情嗅辣、復制撼泛、剪切。

這三個頁面組合在一起澡谭,僅內(nèi)容頁不夠時加上列表頁愿题,不夠再有聚合頁。每個頁面自身的內(nèi)容蛙奖、工具潘酗、操作又會有序的組合,這樣就形成一個封裝好模塊雁仲,這個模塊對外以節(jié)點方式溝通仔夺,多個模塊組合在一起就形成一個結(jié)構(gòu)化的APP。這里舉一個埃菲爾鐵塔的故事:埃菲爾鐵塔攒砖,組成零件有18038個缸兔,重10000噸日裙,施工時共鉆孔700萬個,使用鉚釘250萬個惰蜜,設(shè)計圖紙5300多張昂拂,其中包括1700張全圖,在18世紀的時候施工僅用了2年2個月蝎抽。因為事先嚴格的編號政钟,施工過程沒有做過任何改動。所以當我們面對一個APP設(shè)計時樟结,不要擔心它的復雜,并不是復雜精算,而是由此帶來的混淆狀態(tài)和無條理性讓我們擔心瓢宦,APP能復雜過300米高的鐵塔嗎?


APP重構(gòu)方法


APP解構(gòu)后的各個模塊及頁面自己的內(nèi)容灰羽、工具驮履、操作如何通過組合來更好的吻合用戶任務(wù),是交互設(shè)計師發(fā)揮的地方之一廉嚼。常用的手法是用戶研究玫镐,去研究自己設(shè)想的目標用戶,其實獲得這些數(shù)據(jù)和結(jié)論后要用在結(jié)構(gòu)上同樣需要費一番心思怠噪,相當于準備了做菜的材料和知道了吃飯人的口感偏好之后如何把菜炒出來恐似。

1、放羊傍念,讓用戶決定模塊間的組合與穿插矫夷。
卡片分類法就是一例,云閱讀的各個模塊歸類時就用過憋槐,其中本地書上傳模塊的入口就被認為應(yīng)該在書城里出現(xiàn)(我們實際放在“我”這個模塊里)双藕;APP頁面工具布局時,有時侯過份強調(diào)一致性阳仔、統(tǒng)一性忧陪,會忽視用戶任務(wù)的隨意性、連貫性近范,云閱讀的用戶在任何頁面隨時想使用夜間模式嘶摊,總沒人希望在家里關(guān)書房的燈需要去客廳按下開關(guān)吧,所以云閱讀的winPhone客戶端就在首頁Appbar中放入夜間模式開關(guān)顺又,同樣的功能在正文頁與設(shè)置的列表頁都有更卒;有個小區(qū)建成大概有六年了,樓與樓之間有草坪和大道,但沒有小徑.如此一來,人們自覺不自覺地會抄近道,踩踏草坪.于是管理人員豎起牌子嚴厲提醒大家:請勿踐踏草坪,但根本不奏效稚照。時間一長蹂空,草坪上就形成了許多不規(guī)則的小徑俯萌。管理人員生氣了,把小徑重新整理成草坪上枕,并在出口和入口處攔上繩子咐熙,起初似乎好一點,后來又恢復原樣辨萍。如此幾番折騰棋恼,他們終于悟出了道理:沿著自然形成的小徑鋪上石板,讓人們心安理得地行走锈玉。草坪有了小徑的點綴爪飘,也顯得更有情趣(這個案例引自互聯(lián)網(wǎng))。APP產(chǎn)品中放羊放的比較好的還有注冊這個功能模塊拉背,現(xiàn)在新舊APP都允許用各大社交平臺帳號登錄师崎,在這之前是每個APP都強制用戶搞一個帳號,說白了就是為方便推送廣告椅棺,但也直接攔截掉了至少一半潛在用戶犁罩,得不償失。現(xiàn)在用戶愛用什么社交帳號登錄隨意两疚,而且這種方式瞬間成為標配床估,就是結(jié)構(gòu)追隨任務(wù)的實例。放羊的方法是用戶最樂意看到的诱渤,但是產(chǎn)品方很不樂意丐巫,設(shè)計者也容易被弄暈,有時候一個功能模塊需要在另一個功能模塊的三個頁面都放入口源哩,這個還好點鞋吉,關(guān)鍵是一些用戶永遠不需要的模塊怎么辦,放到哪里都不是用戶希望的励烦?這就要用到下面的濫竽充數(shù)了谓着。

2、濫竽充數(shù)坛掠,對于用戶不希望的模塊赊锚,可以悄悄得植入以實現(xiàn)產(chǎn)品目標。
就是讓用戶看著這個產(chǎn)品很順眼屉栓、很好用舷蒲,但是里面確實有產(chǎn)品植入性的東西。比如云閱讀的猜你喜歡模塊友多,在用戶讀完一篇文章和每個訂閱源詳情后都跟著猜你喜歡牲平。這些推薦都是追隨類型相關(guān)性出現(xiàn)的,如果你正在閱讀的是三胖干掉姑丈的新聞域滥,我們就會猜你喜歡早期三胖機關(guān)槍掃射銀河樂隊這類事件纵柿。當然蜈抓,濫竽充數(shù)讓用戶識破的例子也很多。很多APP中的頁面底部廣告就是典型例子昂儒,這個頁面操作讓人不惜關(guān)掉網(wǎng)絡(luò)以換取安靜純粹的看書沟使;云閱讀首頁右上角總是掛一個消息提醒的Icon(屬于頁面操作),碰巧如果你的郵箱悲催的被各種垃圾郵件干擾渊跋,這個Icon會不厭其煩的給你彈出氣泡腊嗡,這個氣泡對你其實沒什么用,因為你不care這些郵件拾酝,然后很多用戶就來詢問哪個地方有個關(guān)閉通知的按鈕(反饋系統(tǒng)看到的)燕少。有時候濫竽充數(shù)沒做好的同時設(shè)計師還不忘給用戶閃個Tips,仿佛吼著說“看蒿囤,我在這兒”棺亭,鬼才愿意看到。新功能Tips提醒也是同樣討人厭的濫竽充數(shù)蟋软,更新或下載一個APP后總是各種提示諸如“點擊這個發(fā)布動態(tài)、這里添加好友”嗽桩,真的等用戶任務(wù)到了要用此模塊且不知道怎么辦的時候岳守,結(jié)構(gòu)確給不出回答。另一個場景是這樣的:你選擇用掃一掃加一個朋友的微信碌冶,到“添加好友”模塊卻找不到掃一掃湿痢,而對方此時虔誠的舉著個二維碼略帶蔑視的看著你,經(jīng)過一番周折你可能終于在“發(fā)現(xiàn)”模塊里面找到了掃一掃(也可能換其它方法)扑庞,雙方一陣嘖嘖譬重,你內(nèi)心估計會嘀咕一下微信:這是咋整的!我們避開業(yè)務(wù)層面的(掃一掃功能增多了)討論這個現(xiàn)象罐氨,用戶的任務(wù)確實就是在“添加好友”時需要用到掃一掃臀规,這就是說,這個悄悄移位的的舉措一下子就讓用戶感覺到不適了栅隐。

3塔嬉、照葫蘆畫瓢,遵守用戶在其它APP上的既有習慣租悄。
組合各個模塊和布置頁面內(nèi)容谨究、工具、操作泣棋。云閱讀4.0版本的模塊的結(jié)構(gòu)有好幾個方案胶哲,最后用的是最大眾化的底部導航,用戶熟悉這種交互方式是選擇此方案的原因之一潭辈。教育用戶這種事就像第一個吃螃蟹的人——付出的多收獲卻不一定豐厚鸯屿。米聊大家還記得莫澈吨,國內(nèi)移動互聯(lián)網(wǎng)即時通訊最早期試水者,微信將其秒殺后碾盟,模塊結(jié)構(gòu)卻基本被沿襲下來(當然了也可能是巧合)棚辽;再比如下拉刷新這個已經(jīng)全民皆知的習慣,最早來自Twitter冰肴,而且也獲得了專利屈藐,現(xiàn)在APP中遇到列表頁需要刷新內(nèi)容時不用下拉刷新試試?這種頁面工具咱們大可不必去創(chuàng)造新輪子熙尉。在所有的APP里“設(shè)置”模塊其實像一個垃圾桶联逻,設(shè)計師覺得不重要又不好去掉的東東都在里面堆積(相對來說產(chǎn)品經(jīng)理更擅長做這件事),這樣做的好處就是用戶的任務(wù)實在走不下去了設(shè)置可以來彌補检痰,用戶用的不舒服卻沒其它辦法時就會來設(shè)置里淘淘寶試試運氣(從用戶反饋中可以看到這些習慣)包归,所以頁面工具在設(shè)置中基本都要有,正文頁有夜間模式工具铅歼、設(shè)置中也要有公壤,設(shè)計時諸如此類往往需要照葫蘆畫下來。


4椎椰、騎驢看賬本厦幅,邊上線邊改。
現(xiàn)在的APP幾個月不換個結(jié)構(gòu)出個版本都不好意思和別人說這個項目還活著慨飘。云閱讀winPhone端有一個模塊是離線下載确憨,之前離線下載完成后的資訊分布在各自訂閱源內(nèi),用戶就跑來吼了瓤的,下好了不知道去哪里看休弃,這不是浪費人家流量莫;然后就多出一個模塊:離線資訊圈膏,設(shè)計師在離線資訊聚合頁中放了個離線下載的入口(頁面操作)被各方否決塔猾,理由是這個會串到離線模塊里去,而且首頁Appbar原來就有離線下載入口本辐,于是就沒有加桥帆;上線后用戶又不樂意了,離線資訊里面想去下載不知道怎么辦慎皱,最后我們又順速補上這個入口老虫,因為用戶任務(wù)在這里需要而且也是常理,結(jié)構(gòu)最好滿足它茫多。細算一下為了這個事情就有三個版本祈匙,不過騎驢看賬本還是蠻管用和常用的,這里對廣大用戶的期望就是你們要多吐槽啊,不管通過什么途徑夺欲,你們一句有時侯頂我們設(shè)計十句跪帝。
以上說了四種方法,那么神馬時候這個APP算是有譜了呢些阅?當設(shè)計師一時描述不清APP結(jié)構(gòu)時伞剑,說明很吻合用戶任務(wù)了。以張三豐與張無忌的對話舉例(電影版倚天屠龍記):
無忌市埋,你記住了沒有黎泣?
嗯,沒記住…
這套叫什么拳缤谎?
不知道…
你老爸姓什么抒倚?
我忘了。
好坷澡!只要記著把這兩個混蛋打得不成人形就是了~

后記


還有一個和描述不清APP對立的現(xiàn)象是這樣的托呕,公司新人接觸一個APP時總能提出巴拉巴拉一大堆不符合用戶任務(wù)的問題,這時候深陷其中的設(shè)計師會禮貌的回答:“嗯频敛,這個我們會考慮的项郊。”當然了大多數(shù)情況下是不會改的斟赚,這可能是設(shè)計師已經(jīng)忘卻最初目標呆抑,這類現(xiàn)象很常見,畢竟80%的APP都不是很成功汁展。


其實不管是解構(gòu)還是重構(gòu)APP,都需要時刻知道自己從哪里出發(fā)的:勿忘初心厌殉。
特別感謝網(wǎng)易識字的視覺美眉魏同學的配圖(最后一章)食绿,前面的撮圖都是我自己畫的。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末公罕,一起剝皮案震驚了整個濱河市器紧,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌楼眷,老刑警劉巖铲汪,帶你破解...
    沈念sama閱讀 216,919評論 6 502
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異罐柳,居然都是意外死亡掌腰,警方通過查閱死者的電腦和手機,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,567評論 3 392
  • 文/潘曉璐 我一進店門张吉,熙熙樓的掌柜王于貴愁眉苦臉地迎上來齿梁,“玉大人,你說我怎么就攤上這事∩自瘢” “怎么了创南?”我有些...
    開封第一講書人閱讀 163,316評論 0 353
  • 文/不壞的土叔 我叫張陵,是天一觀的道長省核。 經(jīng)常有香客問我稿辙,道長,這世上最難降的妖魔是什么气忠? 我笑而不...
    開封第一講書人閱讀 58,294評論 1 292
  • 正文 為了忘掉前任邻储,我火速辦了婚禮,結(jié)果婚禮上笔刹,老公的妹妹穿的比我還像新娘芥备。我一直安慰自己,他們只是感情好舌菜,可當我...
    茶點故事閱讀 67,318評論 6 390
  • 文/花漫 我一把揭開白布萌壳。 她就那樣靜靜地躺著,像睡著了一般日月。 火紅的嫁衣襯著肌膚如雪袱瓮。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 51,245評論 1 299
  • 那天爱咬,我揣著相機與錄音尺借,去河邊找鬼。 笑死精拟,一個胖子當著我的面吹牛燎斩,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播蜂绎,決...
    沈念sama閱讀 40,120評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼栅表,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了师枣?” 一聲冷哼從身側(cè)響起怪瓶,我...
    開封第一講書人閱讀 38,964評論 0 275
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎践美,沒想到半個月后洗贰,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 45,376評論 1 313
  • 正文 獨居荒郊野嶺守林人離奇死亡陨倡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 37,592評論 2 333
  • 正文 我和宋清朗相戀三年敛滋,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片兴革。...
    茶點故事閱讀 39,764評論 1 348
  • 序言:一個原本活蹦亂跳的男人離奇死亡矛缨,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情箕昭,我是刑警寧澤灵妨,帶...
    沈念sama閱讀 35,460評論 5 344
  • 正文 年R本政府宣布,位于F島的核電站落竹,受9級特大地震影響泌霍,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜述召,卻給世界環(huán)境...
    茶點故事閱讀 41,070評論 3 327
  • 文/蒙蒙 一朱转、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧积暖,春花似錦藤为、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,697評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至遍愿,卻和暖如春存淫,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背沼填。 一陣腳步聲響...
    開封第一講書人閱讀 32,846評論 1 269
  • 我被黑心中介騙來泰國打工桅咆, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人坞笙。 一個月前我還...
    沈念sama閱讀 47,819評論 2 370
  • 正文 我出身青樓岩饼,卻偏偏與公主長得像,于是被迫代替她去往敵國和親薛夜。 傳聞我的和親對象是個殘疾皇子忌愚,可洞房花燭夜當晚...
    茶點故事閱讀 44,665評論 2 354

推薦閱讀更多精彩內(nèi)容