起點課堂會員權益
職業體系課特權
線下行業大會特權
個人IP打造特權
30+門專項技能課
1300+專題課程
12場職場軟技能直播
12場求職輔導直播
12場專業技能直播
會員專屬社群
榮耀標識微信iOS新版發布，這些設計細節你注意了嗎？
昨天微信更新了IOS的新版本，有幾項比較明顯的設計細節做了修改，今天作者就和大家一起聊聊具體的修改點和我對這些修改的思考。
廢話不多說我們直接來看圖：
一、表情選擇欄
在新版本中，表情包選擇欄占據的空間更大了，原本隱藏在左側的最近使用表情被突出顯示，放到了表情選擇區頂部。
原本左右滑動切換表情的方式被改成了上下滑動，左右滑動變成了切換表情包標簽的操作，表情包標簽則被放到了最上方。
選擇表情后用戶可以直接使用右下方的懸浮按鈕進行發送表情或刪除表情兩個操作，按鈕位置和大小相對之前的版本體驗都變好了很多，想刪除表情時也不再需要返回文字輸入界面才能刪除了。
那么做出這些修改的原因是什么呢？作者的猜測如下：
1. 為什么表情選擇欄占據的空間變大了？
首先是全面屏手機的占有率在過去一段時間內大幅提升，用戶的手機屏幕長度增加了不少，在不影響聊天信息占據空間大小的前提下輸入區域能夠使用的空間增加了；
加之微信內部絕大多數的切換信息操作都是上下滑動的方式，例如查看聊天信息和刷朋友圈這兩個使用次數最多的操作。
為了保證操作的一致性于是表情選擇區也變成了上下切換的方式，也就是一致性這個說了幾百次的設計規范。
2. 為什么修改了切換表情的手勢操作方向？
第二點還是與硬件有關，在手機觸屏靈敏度越來越高和用戶對手勢操作的接受程度大大提升之后，原本點擊的方式就有了被替換成手勢操作的基礎；
有朋友會說：手勢操作還需要滑動，哪有原本的一次點擊更方便呢？
這里其實利用的是手勢操作的優勢是【不必尋找熱區】，即用戶并不需要先去看一下我要點擊切換的按鈕在哪，然后再去點擊，只需要在手指當前所在的位置直接滑動就可以了，所以實際使用上其實更加便捷。
3. 表情包選擇標簽為什么放到了頂部？
人類最自然（或者說從小養成的習慣）是閱讀時從上到下、從左到右。
先選擇大的分類（用哪個表情包），再選擇具體的對象（發哪個表情）是人類最自然的視線順序。
并且設置表情包順序的按鈕也在這個版本中得到了非常大的突出顯示，直接被顯示到了表情標簽欄的第一位。
可能也是擔心用戶原本可以表情包的位置現在只能顯示兩個會影響輸入，所以把調整順序的按鈕暫時突出了，但是說起來這樣比較低頻的功能被放到這么突出的位置還是有點難以理解，作者并沒有想到特別合理的解釋，如果朋友們有想法歡迎補充。
4. 其他
至于最近使用的表情被突出顯示這一點應該是微信內部根據用戶使用數據做出的修改，例如產品方在之前的版本中發現隱藏在左側的最近使用表情這一功能的使用率達到了某一標準線，則就會決定在本次更新中做出如此修改。
增加了直接刪除表情的按鈕則是一個比較簡單的場景化設計方法，沒有特別多東西可說。下面接著說第二點修改
二、選擇圖片頁面和編輯圖片頁面
首先是選擇圖片的頁面增加了一些動畫效果，有一個從上到下依次加載的樣式，形式上更加自然流暢，也符合人的感官習慣。
但是微信在這里并沒有做出更多的優化，我們之前曾經分享過兩個比較好的上傳圖片的設計案例，分別是ZAO和綠洲中的設計，這里再簡單和大家分享一下：
1. ZAO
我們可以看到，在ZAO中，當我們選擇從相冊上傳素材進行替換時，系統已經自動對相冊內的圖片進行了判斷，在用戶上傳照片之前就對照片清晰度是否合適進行了提示，而不是上傳后再給一個彈框。
作者對這個設計細節大致想法如下：
- 提高操作效率；
- 避免上傳后再進行提示打斷用戶自然的操作流程；
- 避免因操作與預期不符產生的轉化率降低；
- 加快內容生產速度，同時也就加快了產品傳播速度；
- 避免因上傳素材質量差而導致平臺內容平均質量下降；
- 大家可以看到上圖中一張共享單車的照片的清晰度是滿足要求的，但是很明顯我不能用它替換角色。如果加上人臉檢測的話效率會高（當然成本也會更高）。
2. 綠洲
當我們在上傳圖片時，頁面上部為圖片的放大展示圖，頁面下部分為縮略圖，用戶可以在選擇圖片時實時看到自己選擇的圖片的細節；
舉個例子，如果某漂亮妹子想發張自拍，但是相機里保存的是幾十張連拍照片，此時她就可以在選擇圖片時直接看到自己當前選擇的圖片是否是自己最滿意的一張。而不需要上傳后才能看到，或是切換到系統相冊中去查看，再記住那張自己最滿意的照片的位置再回來重新上傳。
我們常見的產品中上傳照片時一般都是直接顯示縮略圖，好處是頁面效率高一屏可以展示更多圖片，壞處是不能直接看到照片的細節。
這種設計比較好的平衡了這個問題，如下圖：
扯得有點遠，我們繼續說回微信的編輯圖片頁面，這里做的修改不是很大，僅僅是把編輯后的完成按鈕放到了更順手的功能按鈕右側。同時調換了馬賽克和截取兩個按鈕的位置。如下圖：
三、小程序的“更多”頁面改版
本次更新中小程序最重要的部分就是這個“更多頁面”的修改，當然嚴謹的來說這可能并不能稱之為頁面，或許叫彈層或浮窗更好一些。
但是這不重要，我們還是來看他的修改：在之前小程序點擊更多按鈕后的頁面樣式是獨立設計的，本次修改之后則與微信公眾號的設計使用了較為一致的樣式，并且把原本比較層級比較深的功能拿到了外面。
例如反饋與投訴功能。并且把返回首頁按鈕變成了一個常駐的按鈕，在之前則是只有在非首頁的頁面才有，可以說是在一定程度上加強了小程序的“APP性”，使他更像是一個APP而不是加強版的H5。
對于這種理解還有另外兩個佐證，一是權限管理功能的層級也比之前更淺了，即右圖中的設計功能；二是某些小程序中增加了成長守護功能，家長可以設置孩子設置使用時間、消費等等功能。
對于小程序的這處修改，作者的理解是這是對微信操作系統的又一次迭代，在之前我們已經說過了很多次微信小程序可以替代大部分APP，但在產品上卻還不夠完善，本次更新則在一定程度上使小程序更加像是一個完整的APP了。
本次更新還有不少其他修改，例如訂閱號中的【未完成的功能】這一彩蛋下線了、用戶可以停用微信支付的消息服務等，但由于這些與產品設計關系不是很大所以就不一一再說。
以上是作者對微信本次更新的一點思考，歡迎大家補充指正~
#專欄作家#
杜昭，微信公眾號：設計的威嚴，人人都是產品經理專欄作家。實戰派設計師，千萬用戶級產品交互設計負責人，致力于用戶體驗設計和用戶增長實驗，努力成為能為商業目標負責的設計師中～
本文原創發布于人人都是產品經理，未經許可，禁止轉載
題圖來自Unsplash，基于 CC0 協議
油潑面加番茄雞蛋澆頭，吃法怪怪的 ??
感覺作者沒有理解zao吧，zao顯示清晰度不足的照片都是非本機拍攝照片。。。。
nihao hhjhjjj