這是2017年的第10篇文章。
據(jù)說總結(jié)出100個(gè)打動(dòng)人心的APP設(shè)計(jì)點(diǎn)，就能召喚神龍，還沒看過前兩篇文章的，請(qǐng)補(bǔ)上：《那些打動(dòng)人心的APP設(shè)計(jì)（1）》《那些打動(dòng)人心的APP設(shè)計(jì)（2）》。
設(shè)計(jì)師必須站在系統(tǒng)層面做思考，滿足某一類人的需求并提供解決方案，這需要系統(tǒng)化的交互方法論，包括需求分析、信息架構(gòu)及流程設(shè)計(jì)等等。但當(dāng)設(shè)計(jì)師專注于宏觀思考問題時(shí)，往往會(huì)忽略設(shè)計(jì)細(xì)節(jié)?；谶@種情況，Smart Design 的交互設(shè)計(jì)主管 Dan Saffer提出了“微交互”的概念。為此，他專門寫了一本書，書名叫做《微交互》。有興趣的小伙伴可以看看。
好，我們繼續(xù)梳理那些打動(dòng)人心的APP設(shè)計(jì)，希望對(duì)你有幫助。
18.微信讀書的查詢功能
微信讀書是我個(gè)人很喜歡并常用的一款閱讀類APP，簡(jiǎn)單的產(chǎn)品架構(gòu)，優(yōu)秀的文字排版，以及基于筆記和讀后感的社交屬性，都是打動(dòng)我的產(chǎn)品點(diǎn)。其中不乏一些打動(dòng)人心的微交互，如上篇文章中第15條。而今天講的是微信的查詢功能。
閱讀的時(shí)候會(huì)遇到一些不懂的概念或者不認(rèn)識(shí)的外文，貼心的微信讀書不僅提供了詞典功能，如果要查詢的詞字典里沒有，還可以直接查詢百度百科，簡(jiǎn)直不要太方便?？磿臅r(shí)候再也不用在閱讀軟件和瀏覽器之間來回切換了。
19.網(wǎng)易出品必屬精品
互聯(lián)網(wǎng)公司，注重產(chǎn)品體驗(yàn)的，一個(gè)是騰訊，另一個(gè)則是網(wǎng)易，網(wǎng)上流傳這么一句話：網(wǎng)易出品必屬精品。最近新上線的網(wǎng)易蝸牛讀書APP，又偷偷火了一把。不過今天要講的是另一個(gè)網(wǎng)易出品：有道詞典。
常規(guī)的APP都將搜索欄放在頁面頂部，這樣會(huì)遇到一個(gè)問題，不利于單手操作。有道詞典在首頁右下角放置了一個(gè)搜索icon，讓用戶在進(jìn)行翻譯任務(wù)時(shí)，單手操作便可完成。
20.撩人的小妖精：小紅書
小紅書成功了，這是個(gè)讓無數(shù)妹紙種草剁手的地方，小紅書為了伺候好這幫小公主，可謂處處用心。光一個(gè)點(diǎn)贊，就給做出花來了。
每次點(diǎn)贊，提示的文案都不同，而且每句都讓人忍不住再點(diǎn)一次，誰讓你不要臉的這么夸我，哈哈。
21.音樂APP中的文藝青年：網(wǎng)易云音樂
網(wǎng)易用個(gè)性化的推薦和豐富的社區(qū)內(nèi)容，在音樂市場(chǎng)殺出了一條血路，讓其他老牌音樂APP望塵莫及。除了個(gè)性化的推薦、社區(qū)，優(yōu)秀的產(chǎn)品交互也是不可或缺的亮點(diǎn)。
網(wǎng)絡(luò)不好或斷網(wǎng)狀態(tài)，和網(wǎng)絡(luò)正常，這兩種情況打開APP，默認(rèn)的標(biāo)簽頁是不一樣的。斷網(wǎng)時(shí)會(huì)直接前往本地的“我的音樂”，網(wǎng)絡(luò)正常則是“發(fā)現(xiàn)音樂”頁。沒網(wǎng)的時(shí)候發(fā)現(xiàn)個(gè)毛線音樂，只能是聽本地音樂了，這個(gè)細(xì)節(jié)給滿分。
22.再次提名的QQ郵箱
該系列文章第一條夸的就是騰訊出品的郵箱，今天繼續(xù)夸一夸。查看郵件之后，用戶有幾條路徑：回復(fù)郵件，轉(zhuǎn)發(fā)郵件，返回郵件列表等。QQ郵箱，在閱讀郵件頁下滑，便可直接回復(fù)郵件，提高了上班族處理郵件的效率。
在頁面不需要下拉刷新時(shí)，嘗試用下拉交互喚起其他功能是個(gè)不錯(cuò)的方法。
23.啟動(dòng)頁面真的可以不用是廣告
不知道從什么時(shí)候開始，打開每個(gè)APP，都要等待3到5秒，默默的被強(qiáng)迫看完廣告。嗯，不能忍，各大廠商為了商業(yè)利益真是想盡辦法。從點(diǎn)擊APP啟動(dòng)圖標(biāo)到APP開啟并完成數(shù)據(jù)加載，是需要一個(gè)時(shí)間過程，通常會(huì)用開啟圖片來展示，以降低用戶的等待焦慮，微信的開啟圖片就是很有名的例子。也有顯示廣告的做法，還有顯示完啟動(dòng)圖片再展示廣告的，具體是哪家APP我就不說了，大家自行去體會(huì)。這些都是平衡商業(yè)目標(biāo)和用戶目標(biāo)最終方案，無可厚非，但僅僅從用戶體驗(yàn)的角度出發(fā)，會(huì)有更好的方案。
Dosnap，中文名：多色，定位于手機(jī)攝影的分享平臺(tái)。開啟過程比德芙還要絲滑，完全感覺不到有個(gè)啟動(dòng)過程，沒有啟動(dòng)動(dòng)畫和廣告。這是怎么做到的？其實(shí)很簡(jiǎn)單，當(dāng)APP首頁框架固定時(shí)，做一個(gè)類似主頁的圖片作為APP的啟動(dòng)圖片，就這么取巧，用戶便感覺不到開啟過程，體驗(yàn)比起五秒的廣告簡(jiǎn)直好到爆炸。
24.驗(yàn)證碼短信也有大文章
一條驗(yàn)證碼短信，有什么可設(shè)計(jì)的？你錯(cuò)了，站在以用戶為中心的視角，什么都可以被設(shè)計(jì)被改善。用戶的瀏覽習(xí)慣是， 從左到右或從上到下，然后找到自己想要的內(nèi)容便停止瀏覽。下圖左側(cè)直接將公司名和驗(yàn)證碼放在文本開頭，將說明性的文字放在后面，便于用戶更快的找到自己想要的信息。此時(shí)你再看看右側(cè)的驗(yàn)證碼短信，對(duì)比下。
25.流量很貴，省一點(diǎn)是一點(diǎn)
《人機(jī)交互與數(shù)據(jù)傳輸：關(guān)于數(shù)據(jù)加載的六種形式》提到智能加載的問題。這一條設(shè)計(jì)點(diǎn)的原理類似，在知乎的設(shè)置中有一欄無圖模式：在非WiFi條件下不下載圖片，如下圖。知乎：我就這么默默的幫你省流量，你會(huì)愛上我嗎？當(dāng)然，如果你是土豪，請(qǐng)忽略這個(gè)功能。
這條功能設(shè)計(jì)出發(fā)點(diǎn)是幫用戶節(jié)省流量，從而為用戶創(chuàng)造價(jià)值，在保證用戶順利完成主任務(wù)的前提下，多為用戶著想，這很人性化。
26.用手勢(shì)代替點(diǎn)擊
手勢(shì)和點(diǎn)擊是移動(dòng)設(shè)備中最重要的兩種交互方式，恰當(dāng)?shù)氖褂脙烧?，在保證操作統(tǒng)一性的前提下給用戶帶來便利。iOS自帶相冊(cè)，在編輯狀態(tài)下，用手指在界面滑動(dòng)，劃過之處的照片都會(huì)被選中，從而實(shí)現(xiàn)批量操作。
iPad中三指上滑喚起多任務(wù)頁面，五指內(nèi)縮關(guān)閉APP，都是手勢(shì)操作巧用的例子。
27.標(biāo)簽icon不止是標(biāo)簽icon
瀏覽器作為流量入口，被多家廠商重視，為了獲取更多的用戶和流量，國(guó)內(nèi)瀏覽器都在首頁放置了新聞資訊模塊，獵豹瀏覽器便是其中之一。獵豹瀏覽器底部是常規(guī)的標(biāo)簽欄，我們都知道標(biāo)簽欄是一種常用的導(dǎo)航形式，點(diǎn)擊某個(gè)標(biāo)簽icon就會(huì)回到該標(biāo)簽頁，如果用戶正處于當(dāng)前標(biāo)簽頁，點(diǎn)擊該icon便無反應(yīng)。獵豹瀏覽器就將此充分利用起來，用戶在當(dāng)前標(biāo)簽頁點(diǎn)擊icon時(shí)，一是會(huì)回到首屏位置，二是會(huì)隨機(jī)更換8條新聞資訊給你，讓你在沒感興趣的新聞資訊下，可以快速換一批內(nèi)容瀏覽。
充分的利用每個(gè)頁面元素，讓其承載更多內(nèi)容，給用戶帶來驚喜。
28.左右滑動(dòng)切換歌曲
上面夸完了網(wǎng)易云音樂，再來夸夸QQ音樂，對(duì)于音樂類APP，播放器是操作頻次很高的部分，所以像QQ、蝦米、搜狗等產(chǎn)品都將播放器常駐在界面底部，除了點(diǎn)擊能進(jìn)入播放器頁面外，還有播放/暫停，歌曲列表，下一首等功能，但是基本都是回不到上一首的，要回到上一首只能點(diǎn)進(jìn)播放器頁面。
QQ音樂在常駐在底部的播放器，用左劃來啟動(dòng)下一首歌，右劃來播放上一首。又是一個(gè)個(gè)活生生巧妙利用手勢(shì)操作的例子。
29.沉浸感
沉浸感其實(shí)是簡(jiǎn)約的另一種表達(dá)，將用戶需要的內(nèi)容盡情展現(xiàn)，不需要或次要的內(nèi)容刪除或隱藏，好讓用戶沉浸在當(dāng)前任務(wù)中，閱讀APP就是個(gè)很好的例子。
在聽音樂時(shí)，QQ音樂提供了另一種沉浸：在播放了幾秒的歌曲后，將進(jìn)度條、各種操作按鈕全都隱藏，只顯示歌手寫真和歌詞。寫真都很好看，顏控們請(qǐng)準(zhǔn)備舔屏。
30.更好的鎖屏方案
在手機(jī)同質(zhì)化越來越嚴(yán)重的今天，鎖屏壁紙幾乎成了個(gè)性化最后的領(lǐng)地。在手機(jī)上放一張符合自己調(diào)性的壁紙也能成為一種生活的小確幸。作為處女座的朋友摩羯座，當(dāng)美美的壁紙被時(shí)間、日期等字段遮住時(shí)，內(nèi)心有一萬匹草泥馬在奔騰。有個(gè)APP很好的解決了這個(gè)痛點(diǎn)，簡(jiǎn)直是處女座和強(qiáng)迫癥患者的福音。
今天介紹了13條打動(dòng)人心的APP設(shè)計(jì)細(xì)節(jié)，希望對(duì)你有所幫助。
總結(jié)：
Dan Saffer認(rèn)為交互細(xì)節(jié)能夠使得系統(tǒng)更加人性化，這些細(xì)節(jié)可能是一個(gè)動(dòng)效、一個(gè)提示音、一句文案或是一個(gè)簡(jiǎn)單的手勢(shì)。如果說在系統(tǒng)層面考慮的是用戶的目標(biāo)和任務(wù)，那微交互關(guān)注的則是用戶完成每個(gè)簡(jiǎn)單任務(wù)時(shí)的行為。目標(biāo)、任務(wù)、行為，每個(gè)維度都應(yīng)該為目標(biāo)用戶著想，進(jìn)而打動(dòng)人心。
