原文鏈接:https://medium.freecodecamp.com/ins-redesign
作者:Kim Thuy Tu
翻譯:? nicoDrum
我給自己定的挑戰(zhàn):選擇一個(gè)我喜歡的而且每天使用的app揪阶,然后對(duì)它進(jìn)行重新設(shè)計(jì)播演,看看作為一個(gè)設(shè)計(jì)師的話我能有多大創(chuàng)造力偶翅。
? 我之所以選擇Instagram是因?yàn)樵?011年,也就是Instagram誕生了一年之后讶坯,我就已經(jīng)是Instagram的用戶了宣鄙。
? 一開始袍镀,我使用Instagram是因?yàn)橄矚g它的濾鏡。但這六年以來(lái)冻晤,我見(jiàn)證了這款app的所有改變和創(chuàng)新苇羡,現(xiàn)在我使用它是為了能夠展現(xiàn)我自己,和現(xiàn)在的趨勢(shì)不脫軌鼻弧。
? 也許你們會(huì)說(shuō)我是一名Instagram的員工吧设江。
? 邊注:我并沒(méi)有在Instagram就職锦茁,以下的這些對(duì)于這個(gè)案例研究的想法意見(jiàn)也都是我自己的。我不像那些在Instagram工作的的設(shè)計(jì)師叉存,我手上并沒(méi)有那些對(duì)于他們的設(shè)計(jì)至關(guān)重要的用戶數(shù)據(jù)码俩。所以,我這個(gè)項(xiàng)目研究并不是那么詳盡的歼捏,我也沒(méi)有想過(guò)要Instagram公司放棄他們現(xiàn)在的設(shè)計(jì)而采用我的(設(shè)計(jì))稿存。
對(duì)于開展這個(gè)項(xiàng)目的個(gè)人目標(biāo):
? 對(duì)于重新設(shè)計(jì)的目標(biāo):
? 在瀏覽和連接的時(shí)候讓它更加迷人,無(wú)縫結(jié)合甫菠。
? ? 設(shè)計(jì)一個(gè)更加直觀且人性化的用戶界面挠铲。
? ? 通過(guò)用戶的體驗(yàn)感受來(lái)設(shè)計(jì)
? 對(duì)于個(gè)人發(fā)展的目標(biāo):
? ? 學(xué)會(huì)如何組織分析用戶調(diào)查,創(chuàng)建流程圖和線框圖寂诱,通過(guò)Sketch進(jìn)行設(shè)計(jì)拂苹,通過(guò)Principle制作動(dòng)畫,通過(guò)Invision創(chuàng)建模型痰洒。
? ? 從頭到尾查看我的完整工程請(qǐng)點(diǎn)擊my design principles
? 我在這個(gè)重新設(shè)計(jì)的過(guò)程中扮演的角色:
? ? 用戶調(diào)查者
? ? 數(shù)據(jù)分析師
? ? UI/UX設(shè)計(jì)師
? ? 產(chǎn)品設(shè)計(jì)師
? 為了文章的簡(jiǎn)潔我沒(méi)把我的草圖和線框圖放進(jìn)來(lái)瓢棒,如果有意瀏覽可以戳這里。
了解Instagram這個(gè)公司
? Instagram是個(gè)通過(guò)視覺(jué)講故事的應(yīng)用丘喻,為用戶提供了一個(gè)分享生活中美好瞬間的平臺(tái)脯宿。自從Instagram在2010年的首次亮相以來(lái),它的用戶以數(shù)以百萬(wàn)計(jì)的速度增長(zhǎng)著泉粉,使全球各地的人們能夠連接在一起连霉,分享他們的生活瞬間。
? 為了跟上它的成長(zhǎng)速度嗡靡,Instagram保持不斷創(chuàng)新跺撼,提出了它的使命“sharing the world’s moments”。
我的用戶調(diào)查和相關(guān)數(shù)據(jù):
? 在我開始我的這個(gè)項(xiàng)目之前讨彼,我采訪了40位Instagram用戶來(lái)弄清楚我的項(xiàng)目是要為誰(shuí)設(shè)計(jì)的:
? ? 一個(gè)正常的Instagram用戶長(zhǎng)什么樣歉井?
? ? 他們使用Instagram的原因是什么?
? ? 什么能使他們重新使用Instagram哈误?
我通過(guò)了面對(duì)面哩至、打電話等方式采訪了這些Instagram用戶。
目標(biāo)觀眾人口統(tǒng)計(jì)
? 在我采訪的40個(gè)Instagram用戶里蜜自,10名是男性菩貌,30名是女性。男性的年齡在22到27歲之間重荠,女性的年齡在19到25歲之間菜谣。其中65%是大學(xué)在校生或者是想追求更高教育的高校畢業(yè)生。
? 我個(gè)人覺(jué)得這是個(gè)公平的Instagram用戶基礎(chǔ)代表樣本,因?yàn)?0%的Instagram用戶年齡都在35歲以下尾膊。而且媳危,在美國(guó)所有的18到29歲的人中55%是Instagram用戶。
? 更有趣的是冈敛,我調(diào)查的用戶里待笑,67.5%的人把Instagram列為他們最常使用的三大app之一。另外抓谴,這里面72.5%的人每天使用Instagram暮蹂。
有趣的事還在繼續(xù)著
? 我讓我采訪的40位Instagram用戶使用三個(gè)形容詞來(lái)描述Instagram。我的問(wèn)題是你覺(jué)得Instagram怎么樣癌压?Instagram用起來(lái)感覺(jué)怎么樣仰泻?
? 我收集了總共64個(gè)形容詞,其中前三名是Creative滩届,Fun和Simple集侯。
? 我還問(wèn)了他們喜歡Instagram的什么。一下是排在前三的原因:
? 1.基于圖片
? 2.使用簡(jiǎn)單
? 3.使人們保持聯(lián)系
? 你還聯(lián)想到了什么嗎帜消?你是否像Alex一樣棠枉,用Instagram分享自己的日常生活,通過(guò)搜索功能去發(fā)現(xiàn)一些很酷的事情泡挺?又或者像Sam一樣辈讶,使用Instagram就是為了與朋友保持聯(lián)系?還是你兩者都有娄猫?
? 無(wú)論哪種方式贱除,我都會(huì)時(shí)刻記著像你們,Sam和Alex的用戶媳溺,為你們進(jìn)行設(shè)計(jì)勘伺。
? 既然你們對(duì)于我為誰(shuí)而設(shè)計(jì)的問(wèn)題有了更深的了解,那我們就可以繼續(xù)深入了解這個(gè)好東西啦褂删!
Experience #1: 主頁(yè)
? 除了主頁(yè)里幾個(gè)重復(fù)的功能,我還注意到了三個(gè)重要的問(wèn)題冲茸。
Problem #1:內(nèi)容過(guò)多(Instastories vs Feed)
? 打開這個(gè)app之后,為了能夠吸引你們屯阀,你會(huì)發(fā)現(xiàn)兩個(gè)互相獨(dú)立的基本選項(xiàng)——那就是選擇繼續(xù)滾動(dòng)屏幕看instastories還是點(diǎn)進(jìn)去瀏覽圖庫(kù)。
? 兩個(gè)選項(xiàng)都是過(guò)度內(nèi)容飽和的轴术,就像一個(gè)無(wú)盡滾動(dòng)的天坑难衰。根據(jù)選擇的悖論的相關(guān)研究,過(guò)多選擇會(huì)造成決策疲勞逗栽,快樂(lè)感減少盖袭,和一種害怕錯(cuò)過(guò)的罪惡感。特別是考慮到在我采訪的過(guò)半Instagram用戶里,很多人經(jīng)常一醒來(lái)或者晚上睡前一上床就刷Instagram鳄虱。
? 邊注:2016年我決定用最少的顏色來(lái)重新設(shè)計(jì)Instagram弟塞,因?yàn)槲以谝粋€(gè)天才那里得到了這個(gè)決定原因和邏輯的啟發(fā)。詳情可以這里閱讀拙已。
至于解決方案决记,我決定直接將stories整合進(jìn)摘要里,原因如下:
? ? 圖庫(kù)和stories將一起為促進(jìn)更有結(jié)合力的用戶體驗(yàn)服務(wù)倍踪。
? ? 將stories和圖庫(kù)整合在一起也是為了防止它成為一個(gè)Julie Zhou(臉書的產(chǎn)品設(shè)計(jì)VP)所提到的“屋頂甲板”系宫。在現(xiàn)有的Instagram設(shè)計(jì)里,一旦用戶開始往下刷時(shí)Instastories很容易被遺忘建车,這就叫所謂的眼不見(jiàn)心不煩吧扩借。
? ? 把stories和圖庫(kù)整合在一起之后,現(xiàn)在它將在一個(gè)固定的時(shí)間表上進(jìn)行操作缤至。對(duì)于任何目標(biāo)行為來(lái)說(shuō)這是能產(chǎn)生最高響應(yīng)的最強(qiáng)有力的操作條件潮罪,在這種情況下,Instastories誕生了凄杯。
邊注:別擔(dān)心错洁,我并沒(méi)有要丟掉Instastories,我只是把它們移到了消息收件箱里戒突,你們只要主頁(yè)右上角就能進(jìn)入簸淀。我將會(huì)在下面更深入地討論。
Problem #2:頂部導(dǎo)航欄和滑動(dòng)手勢(shì)的分離
? 通過(guò)用戶調(diào)查薯蝎,我要回答的其中一個(gè)主要問(wèn)題就是Instagram主頁(yè)上的滑動(dòng)功能是否直觀禁灼。
? 只不過(guò),Instagram用戶清楚左滑右滑手勢(shì)和頂部導(dǎo)航欄之間的關(guān)系嗎隔崎?
? 為了回答這一問(wèn)題今艺,我在采訪者中進(jìn)行了一個(gè)相對(duì)簡(jiǎn)單的實(shí)驗(yàn)。
方案(n=40)
? 在我進(jìn)行這次實(shí)驗(yàn)之前爵卒,我讓這些用戶不要去看Instagram上的這一部分虚缎。然后我讓他們準(zhǔn)備好通過(guò)向我從頭到尾描述Instagram經(jīng)典簡(jiǎn)介頁(yè)面的布局來(lái)設(shè)想Instagram的界面,再然后就是主頁(yè)钓株。我問(wèn)了他們四個(gè)簡(jiǎn)單的問(wèn)題实牡。
? 關(guān)于滑動(dòng):
? 1.在主頁(yè)上,進(jìn)入哪個(gè)地方你需要從左到右滑動(dòng)轴合?答案:相機(jī)到照片到Instastories
? 2.在主頁(yè)上创坞,進(jìn)入哪個(gè)地方你需要從右到左滑動(dòng)?答案:消息收件箱
? 關(guān)于頂部導(dǎo)航:
? 3.在手機(jī)屏幕上你怎樣拍你的Instastories受葛?答案:頂部左側(cè)相機(jī)圖標(biāo)
? 4.你怎樣進(jìn)入你的消息收件箱题涨?答案:頂部右端“箭頭”圖標(biāo)
? 注意:如果用戶用左滑或者右滑來(lái)回答這部分問(wèn)題偎谁,我會(huì)讓他們做出另一種回答。(比如你知道進(jìn)入xxx的另一種方式嗎纲堵?)
? 這里是我收集的所有數(shù)據(jù)巡雨。
? 基于我的調(diào)查結(jié)果,總體來(lái)說(shuō)關(guān)于Instagram滑動(dòng)的知識(shí)并不是那么令人滿意:
? ? 只有20%的人正確回答了兩邊滑動(dòng)的反應(yīng)婉支。
? ? 30%只對(duì)了一半鸯隅,50%全錯(cuò)了。
? ? 50%的人知道從左向右滑能進(jìn)入相機(jī)向挖。
? ? 20%的人知道從右向左滑能進(jìn)入消息收件箱
? 頂部導(dǎo)航欄:
? ? 72.5%的人知道通過(guò)點(diǎn)擊頂部右端箭頭圖標(biāo)進(jìn)入他們的消息收件箱蝌以。
? ? 55%的人知道通過(guò)點(diǎn)擊頂部左端相機(jī)圖標(biāo)進(jìn)入相機(jī)拍Instastories。
? 一些其他的有趣數(shù)據(jù):
? ? 40個(gè)被采訪者中只有3個(gè)人答對(duì)了全部問(wèn)題何之。
? ? 在一個(gè)關(guān)于Instagram導(dǎo)航欄熟練度等級(jí)為1-5的調(diào)查中跟畅,75%的人覺(jué)得他們達(dá)到4或者更高,其中只有30%的人答對(duì)了上面關(guān)于滑動(dòng)手勢(shì)至少一題溶推。
? ? 高達(dá)92.3%的人覺(jué)得向左滑會(huì)進(jìn)入搜索界面(這就更加有必要把搜索圖標(biāo)在底部導(dǎo)航欄上與home圖標(biāo)放在一起)
? 經(jīng)過(guò)對(duì)這些結(jié)果的分析說(shuō)明了Instagram用戶還沒(méi)意識(shí)到頂部導(dǎo)航欄和滑動(dòng)手勢(shì)的聯(lián)系徊件。
? “我不知道,知道我看到了我所看到的我才發(fā)現(xiàn)蒜危,我突然看到了我的臉......”——某Instagram用戶被問(wèn)到如何找到消息收件箱的時(shí)候說(shuō)道虱痕。
? 一種使滑動(dòng)手勢(shì)更加直觀的方法可能是將它與底部導(dǎo)航聯(lián)系起來(lái)。然而辐赞,這對(duì)我來(lái)說(shuō)可能是個(gè)好機(jī)會(huì)去創(chuàng)造一個(gè)新的功能部翘。。响委。新思。。赘风。
通過(guò)滑動(dòng)查看新老的照片
? 我的用戶研究有一部分是app store上Instagram的評(píng)論夹囚。其中抱怨最多的就是Instagram動(dòng)態(tài)沒(méi)有按時(shí)間順序展示。
? 我想知道的是為什么用戶們希望Instagram是按時(shí)間來(lái)顯示動(dòng)態(tài)的呢邀窃?他們?yōu)槭裁磳?duì)這個(gè)改變?nèi)绱瞬粷M荸哟?通過(guò)進(jìn)一步挖掘,用戶覺(jué)得按時(shí)間順序他們的瀏覽才能徹底瞬捕。根據(jù)Instagram現(xiàn)在的算法鞍历,最受歡迎的照片會(huì)被放在動(dòng)態(tài)的最頂部,這就使得一些用戶會(huì)錯(cuò)過(guò)一些他們想看的照片山析。
? 為了協(xié)調(diào)Instagram現(xiàn)在的算法和用戶想要按時(shí)間順序展示動(dòng)態(tài)的需求,我決定給這一滑動(dòng)功能添加一個(gè)指示器掏父,以給用戶一些滿足:
? 舉個(gè)例子笋轨,如果指示器在中間的時(shí)候,你就會(huì)知道這不是最新的照片,你就可以右滑查看新的照片爵政。如果指示器在最左邊仅讽,你就可以放心了,這就是用戶最新的照片钾挟。想看早一點(diǎn)的只要輕輕左滑即可洁灵。
Problem #3:左上角——夠不到心不煩。
? 握手機(jī)有很多種方式掺出。不管人們?cè)趺茨檬謾C(jī)徽千,左上角永遠(yuǎn)是最不方便最讓人痛苦的地方。
? 而研究表明最適合放置導(dǎo)航欄的地方是接近手機(jī)屏幕的底部汤锨,因?yàn)榈撞拷咏脩舻哪粗浮?/p>
? 從我的數(shù)據(jù)來(lái)看双抽,接受采訪的人都知道怎樣發(fā)照片發(fā)動(dòng)態(tài)(因?yàn)樗麄兤綍r(shí)用它)。然而57.5%的人不知道怎么拍Instastories或者從不使用它闲礼。為了提高Instastories的使用度牍汹,我將這兩個(gè)功能合并起來(lái),理由是1)拇指更容易夠著柬泽。2)不用再花時(shí)間去普及Instastories慎菲。
Experience #2:查找模式
? 現(xiàn)在你可以通過(guò)Instagram已有的算法自發(fā)地查找或是通過(guò)使用“#”標(biāo)簽來(lái)進(jìn)行搜索。所以Sam和Alex只要打開“#ecgtracing”或者“#fitness”就可以更新他們的動(dòng)態(tài)锨并。
? 要是我的話露该,我可能會(huì)打開“#coffeefliicks”和“#dametravelers”來(lái)瀏覽一些關(guān)于咖啡和景點(diǎn)的美圖。你也可以點(diǎn)擊“#”來(lái)每次瀏覽一張然后再往下拖一起查看所有的標(biāo)簽琳疏。你還可以添加新的標(biāo)簽有决,刪除標(biāo)簽或者在你收藏的標(biāo)簽里進(jìn)行搜索(當(dāng)然地,它是按字母順序排列的)空盼。
Experience #3:滑進(jìn)相機(jī)和instastories
? 我采訪的用戶里只有42.5%的人使用Instastories书幕,其中兩個(gè)主要原因是1)他們已經(jīng)有Snapchat了。2)他們經(jīng)常會(huì)看到一些他們并不是特別關(guān)心的人的Instastories揽趾。
? 為了解決第二個(gè)問(wèn)題台汇,我添加了一個(gè)叫“Stories From Your Favs”的新功能,以此來(lái)使更多的人使用Ionstastories±橄梗現(xiàn)在苟呐,為了你能更方便地瀏覽,你喜歡的人俐筋,你崇拜的人的Instastories都在你屏幕上方牵素。交流保持聯(lián)系!
? 你可以通過(guò)點(diǎn)擊用戶名字旁的愛(ài)心隨意從你的favs里移除或者添加用戶澄者。
? 邊注1:我將Instastories移進(jìn)相機(jī)的原因是什么笆呆?首先请琳,把Instastories從首頁(yè)上移除后我需要一個(gè)位置來(lái)放它。其次赠幕,當(dāng)你要發(fā)送照片或者Instastories時(shí)俄精,你只需直接進(jìn)入消息收件箱。因此榕堰,將Instastories和相機(jī)放一起就顯得很有必要啦竖慧。
? 邊注2:現(xiàn)在的消息收件箱沒(méi)有底部導(dǎo)航界面,如果用戶知道如何使用滑動(dòng)手勢(shì)他們也會(huì)知道如何回到主頁(yè)逆屡,而正如我上面提到的——只有20%的人知道向左滑能到達(dá)相機(jī)圾旨。因此我決定保留底部導(dǎo)航欄,這樣用戶才不會(huì)感到迷茫康二。
Experience #4:通知和簡(jiǎn)介
? 啊哈哈哈...最后一部分了碳胳。關(guān)于通知和簡(jiǎn)介頁(yè)面,我想通過(guò)添加一些負(fù)空間和群聊之類的來(lái)給用戶界面更多可擴(kuò)展的空間沫勿。
? 而且挨约,你可以直接在你的通知頁(yè)面里通過(guò)長(zhǎng)按用戶名來(lái)給人點(diǎn)贊或者評(píng)論(短按進(jìn)入用戶簡(jiǎn)介)。當(dāng)你按住用戶名使會(huì)觸發(fā)出一個(gè)自動(dòng)@用戶ID的評(píng)論盒子产雹、然后你只要輸入你的評(píng)論或者點(diǎn)贊就行了诫惭。
? 我認(rèn)為這項(xiàng)功能會(huì)很有用,因?yàn)槟銜?huì)經(jīng)常迷失在評(píng)論的海洋蔓挖。他們的用戶ID是什么夕土?那條評(píng)論在哪里?那條評(píng)論說(shuō)了什么瘟判?
“關(guān)注”通知
? 今天最后一件有趣的事——只有35%的用戶要瀏覽遍他們所關(guān)注的人的動(dòng)態(tài)怨绣。是否保留這一功能是我最難做出的一個(gè)決定。最終我還是把它保留下來(lái)了拷获,并通過(guò)放大照片功能對(duì)它進(jìn)行稍加改造來(lái)獲得更多關(guān)注篮撑。
簡(jiǎn)介
? 說(shuō)實(shí)話,我挺喜歡Instagram現(xiàn)在的設(shè)計(jì)的匆瓜。為了發(fā)揚(yáng)極簡(jiǎn)主義赢笨,我給這些圖標(biāo)做了些輕微的變化并添加了一些負(fù)空間來(lái)保持設(shè)計(jì)的一致性。
總結(jié)一下我所做的工作
? 進(jìn)入這項(xiàng)工程后驮吱,我知道這會(huì)是一個(gè)很好的機(jī)會(huì)磨煉我的設(shè)計(jì)能力茧妒。我剛從上學(xué)期的醫(yī)學(xué)學(xué)習(xí)中轉(zhuǎn)換過(guò)來(lái),我想要追求一份產(chǎn)品設(shè)計(jì)的事業(yè)左冬。所以我認(rèn)為對(duì)我來(lái)說(shuō)最好的學(xué)習(xí)方式就是將我自己投入到一項(xiàng)工程其中去桐筏,然后從那里起飛。
? 現(xiàn)在回溯過(guò)去拇砰,好像輕描淡寫地就完成了這項(xiàng)工程梅忌。在兩個(gè)月里绊袋,我能夠?qū)W會(huì)所有我為了解決一項(xiàng)項(xiàng)目而著手去做的事情,乃至更多铸鹰。
? 我認(rèn)為關(guān)于學(xué)習(xí)和創(chuàng)造的過(guò)程最好的事情就是你開始組織規(guī)劃你自己。你學(xué)會(huì)了什么是有用的皂岔,什么是沒(méi)意義的蹋笼。你學(xué)會(huì)了怎樣做事更快更好更高效。通過(guò)這種方式你可以學(xué)會(huì)任何你動(dòng)手去做的事情躁垛。
? 最重要的是剖毯,這過(guò)程并未結(jié)束。學(xué)習(xí)的過(guò)程是持續(xù)不斷的教馆。
? “設(shè)計(jì)并未變得簡(jiǎn)單逊谋,但你變得更好了⊥疗蹋”
? 這次就到這兒吧胶滋,感謝閱讀!
(溫馨提示:以上鏈接需自備梯子)