
在移动APP的界面中,图标icon占据着非常重要的地位。好的图标不仅能使整个界面看起来更加活泼、精致,还能在产品使用中让用户更快地理解某一功能。
UI设计中的图标一般分为功能型图标和展示型图标。前者指的是应用界面中底部的标签栏的图标,后者指的是应用商店中代表整个应用的图标。
App Store / Apple(在新标签页或窗口中打开)
在这篇文章中我们介绍了网易云音乐的Logo,也就是展示型图标,接下来我们再为大家介绍网易云音乐的功能型图标设计。
一般来说,在应用的UI界面中,用户可以点击的图标都可以看作是功能图标,点击后可以开启某一功能或者跳转到某一页面。这种类型的图标往往层级划分明确,同一层级内的图标设计样式、尺寸都是相似,非常一致。
网易云音乐的图标设计都是扁平化风格,将具象的原型以抽象化图形的方式呈现出来,删繁就简,省去材质、纹理、阴影、浮雕等修饰元素,用基本的点、线、面绘制,纯粹简练。
具体来说,这些图标可以分为两种,分别是线性和面性图标。
线性图标,顾名思义,纯粹使用线条来勾勒图标。网易云音乐的图标大部分都是极简的线性风格,线条纤细,量感很轻,整体给人的感觉是精致、优雅、细腻的。
>>为你推荐Canva可画提供的同款扁平风线性图标模板(在新标签页或窗口中打开)
面性图标是指主要以面来造型的设计风格,比线型图标更加醒目,看起来颇有份量感。网易云音乐中使用面性图标的按钮都是比较重要的功能,例如每日推荐、排行榜、创作者中心等。
>>为你推荐Canva可画提供的同款扁平风面性图标模板
作为一款上线7年、用户8亿的音乐类应用,网易云音乐的成功不仅要归于与出色的情绪营销和丰富的UGC内容,其界面设计也深受用户好评。下面,我们总结了三个网易云音乐图标设计的要点。
在电脑软件中绘制单个的图标时,页面会可以放大显示,但是手机屏幕中的图标只是一个个很小的图片。太过复杂的设计不仅难以让用户识别,而且反而会让页面变得累赘。
网易云音乐线性图标的设计中,许多都可以用一笔画出来,或者由两个元素组成,非常简单,没有一点多余的装饰元素。
许多同类型的互联网产品长得很像,其中一个原因就是这样的设计可以大大降低用户的学习成本。智能手机诞生这么多年,一些图标代表什么功能几乎可以说是不成文的规定了。
比如,网易云音乐界面中“本地音乐”的这个图标,缓存和下载一般我们都会用向下的箭头来表示。当然,还有其他更好看的形状也可以代表这个功能,但是用户看到新的设计可能无法意识到这是下载和缓存的意思。
虽然图标的基本设计原则就是易于理解,但是设计师无法保证所有用户在第一次使用产品时就能明白图标的含义,因此,最简单的办法还是直接给出文字说明。
网易云音乐的UI设计除了歌曲的播放界面外,大多都有文字提升。例如侧边工具栏的辅助功能,以及主界面的常用功能。
好了,以上就是对网易云音乐UI图标的造型表现和设计要点的介绍。总的来说,这些图标的设计保持了视觉风格的统一,象形、精致、极简的调性既能清晰、直接地传递信息,也表现出了网易一贯的简约美学。
模板推荐
在线设计(在新标签页或窗口中打开)平台Canva可画提供了海量免费的设计模板,涵盖插画(在新标签页或窗口中打开)、海报(在新标签页或窗口中打开)、logo(在新标签页或窗口中打开)、PPT(在新标签页或窗口中打开)等类型的设计需求,还有百种中文字体和千万版权图片。只要你的设计素材(在新标签页或窗口中打开)全部来自可画素材库,在此平台发布的设计可以用于商业用途。
阅读更多
打开浏览器搜索 “Canva设计学院” 阅读更多设计干货、灵感文章,还有精美模板推荐,为你的营销和设计打开灵感。