<address id="ttjl9"></address>

      <noframes id="ttjl9"><address id="ttjl9"><nobr id="ttjl9"></nobr></address>
      <form id="ttjl9"></form>
        <em id="ttjl9"><span id="ttjl9"></span></em>
        <address id="ttjl9"></address>

          <noframes id="ttjl9"><form id="ttjl9"></form>

          微信大改版,為什么這么設計?

          2018-12-24    ui設計分享達人

          如果您想訂閱本博客內容,每天自動發到您的郵箱中, 請點這里

           昨天下午 

          微信在App Store發布了7.0版本

          無論是品牌LOGO還是UI整體界面

          都發生了重大的改變。

          由于昨天開了一天的會

          所以今天才寫出設計分析

          下面我們進入正題,

          一起來看看微信做了哪些調整。


          當晚,張小龍也在朋友圈

          發布了一段王陽明的話:


          你未看此花時,此花與汝心同歸于寂;

          你來看此花時,則此花顏色一時明白起來。


          undefined

          LOGO做了升級


          通過微信的LOGO歷史

          我們可以看到

          新LOGO的圖形其實也做了些微調

          圖形整體縮小了并且居中

          使四周增加了更多的留白


          從7.0版本我們能看出

          整體都經過了細致的調整

          在顏色的對比上能夠看出很明顯的差別

          調整后的新logo整體顏色

          更為清淡了許多,

          除此之外符號感也加強了不少。






          據了解,全新LOGO已經

          開始在微信的各個子品牌中進行使用。

          我們在使用微信界面時都能夠看到。



          除了LOGO的變化外,

          米醋再來說說整體界面的變化。


          undefined


          開機畫面


          進入畫面之后,你會看見開屏動畫是

          藍天背景下的一枝格?;?,

          文案的內容也進行了改變:

          因你看見,所以存在,

          同時也凸顯了升級與視覺的關聯。


          不過米醋在這里想說

          新畫面中的格?;ň拖裰欣夏甑膽靡粯?

          散發出了寫意和對時尚的追求



          再來說說整體的內部變化

          給米醋第一感覺就是更加扁平化

          其次導航上的深黑色變成了白灰色,

          讓整體的界面顯得更加的整體,層次感更加扁平

          視覺集中在內容塊上。


           

          undefined

             

          首頁






          界面框框的設計


          其實很早之前寫過一篇相關的設計分析

          其中也講到了

          對于左右距離越大,內容信息越聚焦

          層次感也越突出

          這次微信的改版左右間距寬度的調整

          讓內容的層次變得更高


          有興趣的同學可以看一下這篇文章

          【解構界面】對齊!框框?。∕ICU出品)

          我們對細節進行了像素化的對比

          發現整體的圖標內容更為清晰

          列表高度變得更高了

          微信圖標的顏色統一為LOGO色,

          其次“發現”圖標也進行了加粗。


          底部欄高度對比

          從原來的的147px增加到168px

          底部欄圖標描邊對比

          從原來的的1dp加粗到1.5dp


          undefined


          下滑小程序背景對比


          深黑色的下拉背景改為了灰白色背景之后

          讓上面不再顯得頭重腳輕


          undefined

          添加好友頁


          添加朋友變化不大

          下方的菜單欄沒有變化

          頂部“添加朋友”的底色改為了灰色



          添加好友的圖標

          于底部標簽欄圖標統一為24dp



          undefined


          個人主頁


          對比一下效果

          你就能發現很明顯的變化吧!

          新版的設計,列表高度進行了加高

          讓用戶的點擊感變得更強

          讓頁面的留白也增多了

          讓視覺效果更加舒適輕松

          其次圖標進行了更新

          這樣的調整也能夠減少用戶的錯誤率


          單行列表高度對比


          undefined

               

          發現頁


          同樣發現頁也進行了細致的調整

          除了更新了之前的圖標

          同時也增加了列表的高度,

          使整個界面舒適了不少。


          undefined


          通訊錄


          通訊錄的變化改了圖標的顏色

          同時去掉了深色的底色。



          undefined

          聊天頁


          聊天頁面的上方的

          功能圖標顏色進行了加深

          去掉了icon背景的描邊

          讓多圖標的頁面更加輕松

          另外輸入框的高度也進行了增高

          更易于用戶的點擊


          undefined


          朋友圈


          朋友圈頁面除了個人頭像邊框更加圓滑

          其次右上角的相機圖標也做了相應調整

          刪除了左上角的“發現”字標


          undefined

          錢包


          再來說說微信的“錢包”,

          更新后改為了“支付”。

          零錢余額不會像從前那樣

          直接在“零錢”下方顯示出來

          頁面的設計也比之前變得更為好看了!



          undefined


          “好看功能


          去中心化,通過關系鏈,

          提高內容分發效率和質量,

          把朋友看的內容推送給你。


          但是像菊花一樣的圖標

          沒有體現出好看的識別度

          新功能上線不太好建立

          功能識別和印象。




          會發現原來

          點贊的位置變成了“好看”!


          可以將你認為好看的文章

          進行分析推薦,

          當然你也可以在看一看

          里瀏覽朋友認為好看的文章。

          undefined

          跟拍前置功能


          跟拍功能前置到輸入框的表情選擇

          可以添加自拍表情包



          自拍表情包

          聊天界面發表情時,

          可以直接制作「拍自己的表情」!

          還可以根據自己的需求添加文字

          顏色可以隨意更換!






          undefined


           即刻視頻


          點擊“我”之后,進入個人頁面,

          你會發現右上角多了一個照相機符號。

          點擊它,可以立即錄制或者上傳一段小視頻。


          你想要查看自己的即刻視頻,

          可以點擊“我”,

          在個人頁面的最上方,

          就是你的即刻視頻,

          下拉可以進行錄制拍攝播放。

          錄制完成之后,

          還可以配樂、加表情符。


          這應該是本次微信7.0版本

          更新最大的變化,發布之后,

          在24小時之內朋友能夠看到,

          并且可以進行互動哦~~



          發布后被點贊會顯示氣泡





          undefined


          即刻視頻可見


          如果你的朋友發布了即刻視頻,

          無論是在朋友圈還是群聊天,

          點擊朋友頭像,也能看到他的即刻視頻。 


          當頭像上有個圈

          雙擊后就可以看到視頻了!

          undefined


          朋友圈相冊


          打開朋友圈相冊

          你也能看到“時刻視頻”的圖標

          點擊后之前錄制的視頻在那里都能看到~~




          總體來說,此次的微信的升級進行了很多地方的改變,其實核心最關鍵的是“好看”的功能,利用了關系鏈打通了朋友之間的互動,讓“看一看”里面的內容更有互動感,而增加的“時刻視頻”,恐怕是堪稱史上最巨大的變化,也許這也意味著微信將全面進軍短視頻領域 。



          藍藍設計www.syprn.cn )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 

          日歷

          鏈接

          個人資料

          藍藍設計的小編 http://www.syprn.cn

          存檔

          亚洲va欧美va天堂v国产综合