恭喜你成为UI中国推荐设计师 (详情)
//百度统计 20220402 uicn

您的意见是我们 UI 中国进步的动力!
点击立即反馈按钮,发表您的意见!
立即反馈
QQ群反馈
您也可以加入UI中国官方反馈群进行反馈!
群号:302892100
备注:反馈问题后@管理员能让我们及时了解您的意见

提交需求

赛事与广告咨询合作,请填写需求表单,我们会在第一时间与您联系!

0/20
0/200

设计大赛

  • 设计大赛
  • 发布广告
  • 发布招聘
  • 其它需求

提交完成
感谢您对UI中国的支持和信赖!
微信大改版,为什么这么设计?
0.0°
2018-12-23 原创文章 行业资讯 举报 6756 23 15 0

微信在App Store发布了7.0版本,无论是品牌LOGO还是UI整体界面,都发生了重大的改变。


 昨天下午 

微信在App Store发布了7.0版本

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

都发生了重大的改变。

由于昨天开了一天的会

所以今天才写出设计分析

下面我们进入正题,

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


Image title




当晚,张小龙也在朋友圈


发布了一段王阳明的话:


Image title



你未看此花时,此花与汝心同归于寂;你来看此花时,则此花颜色一时明白起来。





关于这句话其实有有很多种解读,


米醋对于这句话的理解:


关于7.0版本的改版,


其实更多的希望用户


能够融入到微信的关系链中


从而加强朋友的关系,


这与本身的功能也是一致的。





Image title



LOGO做了升级


通过微信的LOGO历史

我们可以看到

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

图形整体缩小了并且居中

使四周增加了更多的留白

Image title

Image title


从最新7.0版本我们能看出

整体都经过了细致的调整

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


Image title


调整后的新logo整体颜色

更为清淡了许多,

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


Image title



据了解,全新LOGO已经

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

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

Image title


除了LOGO的变化外,

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


Image title


开机画面


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


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


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


因你看见,所以存在,


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


Image title


不过米醋在这里想说

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

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

再来说说整体的内部变化

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

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

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

视觉集中在内容块上。

 

   Image title


首页

       

列表间距对比


我们能够看到

内容的间距从10dp

调整到了更宽的16dp


Image title


界面框框的设计

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

其中也讲到了

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

层次感也越突出

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

让内容的层次变得更高

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

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


Image title


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

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

列表高度变得更高了

微信图标的颜色统一为LOGO色,

其次“发现”图标也进行了加粗。

    

Image title


底部栏高度对比

从原来的的147px增加到168px


Image title



底部栏图标描边对比

从原来的的1dp加粗到1.5dp

 

Image title


列表高度对比

从原来的的67dp增加到72dp


Image title

Image title


下滑小程序背景对比


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


让上面不再显得头重脚轻


Image title


       Image title

添加好友页


添加朋友变化不大

下方的菜单栏没有变化

顶部“添加朋友”的底色改为了灰色

      

Image title


添加好友的图标

于底部标签栏图标统一为24dp

Image title


Image title



个人主页


对比一下效果


你就能发现很明显的变化吧!


Image title


       

新版的设计,列表高度进行了加高

让用户的点击感变得更强

让页面的留白也增多了

让视觉效果更加舒适轻松

其次图标进行了更新

这样的调整也能够减少用户的错误率


单行列表高度对比

     

Image title


Image title


发现页


同样发现页也进行了细致的调整


除了更新了之前的图标


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


使整个界面舒适了不少。

       

     Image title


Image title


通讯录


通讯录的变化改了图标的颜色


同时去掉了深色的底色。

       

     Image title


Image title


聊天页


聊天页面的上方的


功能图标颜色进行了加深


去掉了icon背景的描边


让多图标的页面更加轻松


另外输入框的高度也进行了增高


更易于用户的点击



     Image title


Image title

朋友圈


朋友圈页面除了个人头像边框更加圆滑


其次右上角的相机图标也做了相应调整


删除了左上角的“发现”字标


Image title



Image title


钱包



再来说说微信的“钱包”,

更新后改为了“支付”。

零钱余额不会像从前那样

直接在“零钱”下方显示出来

页面的设计也比之前变得更为好看了!

       

     

Image title


Image title



“好看”功能


去中心化,通过关系链,


提高内容分发效率和质量,


把朋友看的内容推送给你。


但是像菊花一样的图标


没有体现出好看的识别度


新功能上线不太好建立


功能识别和印象。


Image title






会发现原来


点赞的位置变成了“好看”!


Image title


            

可以将你认为好看的文章

进行分析推荐,

当然你也可以在看一看

里浏览朋友认为好看的文章。

                            

Image title


Image title


跟拍前置功能



跟拍功能前置到输入框的表情选择

可以添加自拍表情包


Image title


自拍表情包

       

Image title


聊天界面发表情时,

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

还可以根据自己的需求添加文字

颜色可以随意更换!

                            

Image title

   

Image title


 即刻视频



点击“我”之后,进入个人页面,

你会发现右上角多了一个照相机符号。

点击它,可以立即录制或者上传一段小Image title视频。

你想要查看自己的即刻视频,

可以点击“我”,

在个人页面的最上方,

就是你的即刻视频,

下拉可以进行录制拍摄播放。

                               

   Image title

录制完成之后,

还可以配乐、加表情符。

这应该是本次微信7.0版本

更新最大的变化,发布之后,

在24小时之内朋友能够看到,

并且可以进行互动哦~~Image title

发布后被点赞会显示气泡


Image title

Image title


Image title


即刻视频可见



如果你的朋友发布了即刻视频,

无论是在朋友圈还是群聊天,

点击朋友头像,也能看到他的即刻视频。 

当头像上有个圈

双击后就可以看到视频了!


Image title


Image title


朋友圈相册


打开朋友圈相册


你也能看到“时刻视频”的图标


点击后之前录制的视频在那里都能看到~~

       Image title


                     

    

总体来说,此次的微信的升级进行了很多地方的改变,其实核心最关键的是“好看”的功能,利用了关系链打通了朋友之间的互动,让“看一看”里面的内容更有互动感,而增加的“时刻视频”,恐怕是堪称史上最巨大的变化,也许这也意味着微信将全面进军短视频领域 。

对于新界面的设计,各位小伙伴的感想如何呢?

更新:2018-12-23

下载
收藏

23人已收藏

  • 63

    作品

  • 6880

    粉丝

  • 0

    关注

  • 提UI设计的8个技巧
  • 这些3D素材生成器,让我果断放弃了C4D!
  • 8点了解栅格系统的应用
  • 大厂都在用的10个防呆设计法则!
相关标签
设计资讯UI设计

    猜你喜欢

      2018-12-23 原创文章 行业资讯 举报 6756 23 15 0

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

      0.0°

      你确定要举报微信大改版,为什么这么设计?

      如果查出恶意举报,十天内禁止提交任何举报申请。

      0/200

      上传证据: 超过10M的附件请使用网盘地址

      点击上传附件

      对谁可见:

      全部设计师
      • 全部设计师
      • 推荐设计师和认证设计师

      您确认要推荐?

      该作品发布时间:2018年12月22日

      评分

      完整度

      启发性

      勤奋性

      排版布局

      推荐心得

      建议20-200字以内

      0/200

      15
      23
      0

      账号或密码错误,请重新输入

      账号或密码错误,请重新输入

      登录

      手机号

      发送验证码 120s 验证码错误

      登录
      第三方账号登录