微信大改版,为什么这么设计?

2018-12-24    分享达人

如果您想订阅本博客内容,每天自动发到您的邮箱中, 请点这里

 昨天下午 

微信在App Store发布了7.0版本

无论是品牌LOGO还是UI整体界面

都发生了重大的改变。

由于昨天开了一天的会

所以今天才写出设计分析

下面我们进入正题,

一起来看看微信做了哪些调整。


当晚,张小龙也在朋友圈

发布了一段王阳明的话:


你未看此花时,此花与汝心同归于寂;

你来看此花时,则此花颜色一时明白起来。


undefined

LOGO做了升级


通过微信的LOGO历史

我们可以看到

新LOGO的图形其实也做了些微调

图形整体缩小了并且居中

使四周增加了更多的留白


从7.0版本我们能看出

整体都经过了细致的调整

在颜色的对比上能够看出很明显的差别

调整后的新logo整体颜色

更为清淡了许多,

除此之外符号感也加强了不少。






据了解,全新LOGO已经

开始在微信的各个子品牌中进行使用。

我们在使用微信界面时都能够看到。



除了LOGO的变化外,

米醋再来说说整体界面的变化。


undefined


开机画面


进入画面之后,你会看见开屏动画是

蓝天背景下的一枝格桑花,

文案的内容也进行了改变:

因你看见,所以存在,

同时也凸显了升级与视觉的关联。


不过米醋在这里想说

新画面中的格桑花就像中老年的应用一样

散发出了写意和对时尚的追求



再来说说整体的内部变化

给米醋第一感觉就是更加扁平化

其次导航上的深黑色变成了白灰色,

让整体的界面显得更加的整体,层次感更加扁平

视觉集中在内容块上。


 

undefined

   

首页






界面框框的设计


其实很早之前写过一篇相关的设计分析

其中也讲到了

对于左右距离越大,内容信息越聚焦

层次感也越突出

这次微信的改版左右间距宽度的调整

让内容的层次变得更高


有兴趣的同学可以看一下这篇文章

【解构界面】对齐!框框!(MICU出品)

我们对细节进行了像素化的对比

发现整体的图标内容更为清晰

列表高度变得更高了

微信图标的颜色统一为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.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 

分享本文至:

日历

链接

blogger

蓝蓝 http://www.lanlanwork.com

存档