2021-7-2 ui设计分享达人
设计行业每天发生着翻天覆地的变化，随着专业的发展，我们也在不断的学习新的技巧和趋势，但同时我们也要明白，设计中那些基础的UI准则，才是好的趋势和风格建立的基础。今天我们就一起来聊聊做好设计最重要的能力之一：区分视觉层次。
视觉层次你可以理解为，通过将界面元素进行设计上的区分，引导用户的注意力，并使用户的注意力始终集中在页面的关键地方。但是今天没有一个方法可以一直控制用户注意力，就像我们今天做设计一样，不同的产品要用不同的设计手法去设计，才能达到帮助用户分清主次的作用。
视觉层次不仅仅包含文字有关，它还包含我们的图片，视频按钮以及文字以外的视觉元素。所以当你设计一个网页时候，除了网站整体的颜色，排版，图片也能够影响视觉层次。那么如何让设计的层次更清晰，常用方法有哪些，今天我们一起来聊聊关于设计层次，希望可以帮助到你。
▲如上图插画的比重很大，在设计这种大的元素时，你的每个元素比例和细节处理都被同时放大了，我们可以看见这副插画四周还运用了很多元素，让页面达到平衡，同时这个画面和旁边的文字场景也很好融合在一起。一个好的设计一定是通过视觉手段让用户理解信息更加准确，在看完页面文字和图片后，很自然的引导到底部的按钮，这才能算是一个很引人注目的设计。
▲Zenly：国外知名产品，在引导页面设计时候运用红色按钮吸引用户注意，在App主页面里面，通过深蓝色强调选中效果以及Tab.
▲Tiktok：抖音海外版本设计，整体UI部分非常简单，页面还是一如既往突出内容为主，所以在整个设计上就通过色彩来强调页面优先级，比如拍摄，分享，选择这些核心操作都通过色彩来引导完成任务。
▲如上图，选中的黑色视觉重量最重，其次是蓝色选中效果，最后是未选中的黑色，视觉重量几乎我们每一个页面中都会使用到。
▲headspace这款产品我非常喜欢，将情感化用到了极致，在页面很多细节地方运用了不同的小橙人在背景上，视觉重量有轻有重，通过不同视觉重量来表达页面内容，非常巧妙。
▲在列表的表达上，不同视觉重量感受是不一样的，比如左边的视觉重量更轻一点，用户关注图形同时也去关注文字内容，右边这个视觉更重，更加引导用户去点击功能模块内容。
▲设计师熟悉的medium官方App设计，在正文阅读时，同样采用不同的视觉重点来突出重要信息，比如左边通过字重以及文字背景绿色底色和正文对比，非常醒目。右侧通过浅绿色作为背景强调突出。
▲同样在一些重要位置，Medium也是运用视觉重量处理，如左图通过顶部提示条提示可以通过语音播放，在右侧付费文章通过行动按钮引导用户升级付费。
蓝蓝设计建立了UI设计分享群，每天会分享国内外的一些优秀设计，如果有兴趣的话，可以进入一起成长学习，请扫码蓝小助，报下信息，蓝小助会请您入群。欢迎您加入噢~~希望得到建议咨询、商务合作，也请与我们联系。
分享此文一切功德，皆悉回向给文章原作者及众读者.
免责声明：蓝蓝设计尊重原作者，文章的版权归原作者。如涉及版权问题，请及时与我们取得联系，我们立即更正或删除。
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务