自拍偷在线精品自拍偷,亚洲欧美中文日韩v在线观看不卡

微信發(fā)布新版,有3個設計細節(jié)值得關注!

移動開發(fā) 移動應用
前些天微信更新了 iOS 的新版本,有幾項比較明顯的設計細節(jié)做了修改。今天就和大家一起聊聊具體修改的功能和我對這些修改的思考。

前些天微信更新了 iOS 的新版本,有幾項比較明顯的設計細節(jié)做了修改。今天就和大家一起聊聊具體修改的功能和我對這些修改的思考。

表情選擇欄

微信發(fā)布新版,有3個設計細節(jié)值得關注!

在新版本中,表情包選擇欄占據(jù)的空間更大了,原本隱藏在左側的最近使用表情被突出顯示,放到了表情選擇區(qū)頂部。原本左右滑動切換表情的方式被改成了上下滑動,左右滑動變成了切換表情包標簽的操作。表情包標簽則被放到了最上方。選擇表情后用戶可以直接使用右下方的懸浮按鈕,進行發(fā)送表情或刪除表情兩個操作。按鈕位置和大小相對之前的版本,體驗都變好了很多,想刪除表情時也不再需要返回文字輸入界面才能刪除了。

那么做出這些修改的原因是什么呢?我的猜測如下。

1. 為什么表情選擇欄占據(jù)的空間變大了?

首先是全面屏手機的占有率在過去一段時間內(nèi)大幅提升,用戶的手機屏幕長度增加了不少。在不影響聊天信息占據(jù)空間大小的前提下,輸入?yún)^(qū)域能夠使用的空間增加了,加之微信內(nèi)部絕大多數(shù)的切換信息操作都是上下滑動的方式,例如查看聊天信息和刷朋友圈這兩個使用次數(shù)最多的操作。為了保證操作的一致性,于是表情選擇區(qū)也變成了上下切換的方式。

2. 為什么修改了切換表情的手勢操作方向?

第二點還是與硬件有關,在手機觸屏靈敏度越來越高和用戶對手勢操作的接受程度大大提升之后,原本點擊的方式就有了被替換成手勢操作的基礎。有朋友會說:手勢操作還需要滑動,哪有原本的一次點擊更方便呢?其實這里手勢操作的優(yōu)勢是「不必尋找熱區(qū)」,即用戶并不需要先去看一下我要點擊切換的按鈕在哪,然后再去點擊,只需要在手指當前所在的位置直接滑動就可以了,所以實際使用上是更加便捷的。

3. 表情包選擇標簽為什么放到了頂部?

人們的閱讀習慣是從上到下、從左到右。先選擇大的分類(用哪個表情包),再選擇具體的對象(發(fā)哪個表情)是人類最自然的視線順序。并且設置表情包順序的按鈕也在這個版本中得到了非常大的突出顯示,直接被顯示到了表情標簽欄的第一位。

4. 其他

至于最近使用的表情被突出顯示這一點,應該是微信內(nèi)部根據(jù)用戶使用數(shù)據(jù)做出的修改。例如產(chǎn)品方在之前的版本中發(fā)現(xiàn)隱藏在左側的最近使用表情這一功能的使用率達到了某一標準線,就會決定在本次更新中做出這樣的修改。

增加了直接刪除表情的按鈕則是一個比較簡單的場景化設計方法。

選擇圖片頁面和編輯圖片頁面

微信發(fā)布新版,有3個設計細節(jié)值得關注!

選擇圖片的頁面增加了一些動畫效果,有一個從上到下依次加載的樣式,形式上更加自然流暢,也符合人的感官習慣。但是微信在這里并沒有做出更多的優(yōu)化,我們之前曾經(jīng)分享過兩個比較好的上傳圖片的設計案例,分別是 ZAO 和綠洲中的設計,這里再簡單和大家分享一下。

1. ZAO

微信發(fā)布新版,有3個設計細節(jié)值得關注!

我們可以看到,在 ZAO 中,當我們選擇從相冊上傳素材進行替換時,系統(tǒng)已經(jīng)自動對相冊內(nèi)的圖片進行了判斷,在用戶上傳照片之前就對照片清晰度是否合適進行了提示,而不是上傳后再給一個彈框。

這個細節(jié)的優(yōu)勢:

  • 提高操作效率;
  • 避免上傳后的提示,打斷用戶自然的操作流程;
  • 避免因操作與預期不符產(chǎn)生的轉化率降低;
  • 加快內(nèi)容生產(chǎn)速度,同時也就加快了產(chǎn)品傳播速度;
  • 避免因上傳素材質(zhì)量差而導致平臺內(nèi)容平均質(zhì)量下降。

大家可以看到上圖中一張共享單車的照片的清晰度是滿足要求的,但是很明顯我不能用它替換角色 。如果加上人臉檢測的話效率會高,當然成本也會更高。

2. 綠洲

當我們在上傳圖片時,頁面上部為圖片的放大展示圖,頁面下部分為縮略圖,用戶可以在選擇圖片時實時看到自己選擇的圖片的細節(jié)。舉個例子,如果漂亮妹子想發(fā)張自拍,但是相機里保存的是幾十張連拍照片,此時她就可以在選擇圖片時,直接看到自己當前選擇的圖片是否是自己最滿意的一張。而不需要上傳后才能看到,或是切換到系統(tǒng)相冊中去查看。

我們常見的產(chǎn)品中上傳照片時,一般都是直接顯示縮略圖,好處是頁面效率高,一屏可以展示更多圖片,壞處是不能直接看到照片的細節(jié)。那么綠洲的設計就比較好的平衡了這個問題。如下圖:

微信發(fā)布新版,有3個設計細節(jié)值得關注!

那么,微信的編輯圖片頁面,做的修改不是很大,僅僅是把編輯后的完成按鈕放到了更順手的功能按鈕右側。同時調(diào)換了馬賽克和截取按鈕的位置。如下圖:

微信發(fā)布新版,有3個設計細節(jié)值得關注!

小程序的「更多」頁面改版

微信發(fā)布新版,有3個設計細節(jié)值得關注!

本次更新中小程序最重要的部分就是這個「更多頁面」的修改,當然嚴謹?shù)貋碚f這可能并不能稱之為頁面,或許叫彈層或浮窗更好一些。

之前的小程序點擊更多按鈕后的頁面樣式是獨立設計的,本次修改后與微信公眾號的設計保持了較為一致的樣式,并且把原來層級較深的功能提高顯示了。例如反饋與投訴功能。并且把返回首頁按鈕變成了一個常駐的按鈕,之前只在非首頁的頁面才有,使它更像是一個 APP,而不是加強版的 H5。對于這個改變的理解還有另外兩個佐證,一是權限管理功能的層級也比之前更淺了,即右圖中的設計功能。二是某些小程序中增加了成長守護功能,家長可以設置孩子的使用時間、消費等等。

對于小程序的這處修改,我的理解是這是對微信操作系統(tǒng)的又一次迭代,在之前我們已經(jīng)說過了微信小程序可以替代大部分 APP,但在產(chǎn)品卻還不夠完善,本次更新則在一定程度上使小程序更加像是一個完整的 APP 了。

本次更新還有不少的修改,例如訂閱號中的「未完成的功能」這一彩蛋下線了,用戶可以停用微信支付的消息服務等,由于這些與產(chǎn)品設計關系不是很大所以就不一一細說。以上是我對微信本次更新的一點思考,歡迎大家補充指正。

責任編輯:未麗燕 來源: 優(yōu)設
相關推薦

2023-08-14 08:34:14

GolangHttp

2020-07-14 08:45:13

Flink特性jira

2023-03-16 17:28:59

技術AI

2021-12-01 17:42:42

微信macOS騰訊

2019-11-25 13:25:20

微信微信公眾平臺微信電腦版

2013-04-15 17:53:58

微信

2015-12-29 09:25:33

網(wǎng)頁設計趨勢2016

2017-02-17 15:30:52

2013-07-02 17:35:18

HelloCamera拍照軟件

2017-10-10 22:50:56

2021-01-28 14:50:50

微信朋友圏版本

2020-06-11 16:20:38

UI趨勢設計

2022-06-16 11:51:43

IE 11微軟Windows 10

2020-07-06 11:17:14

MacOS 11蘋果iOS

2018-11-16 12:12:11

網(wǎng)絡認證網(wǎng)絡管理員數(shù)據(jù)中心

2021-06-27 06:28:55

微信微信派微信官網(wǎng)改版

2012-06-20 16:13:59

街旁

2013-11-04 11:12:12

微信公眾平臺

2021-08-12 05:24:41

微信文件傳輸騰訊

2010-06-18 13:24:01

GroovyGroovy 1.7.
點贊
收藏

51CTO技術棧公眾號