2022年非常流行一个词语——少女感。少女感是什么?少女感是不谙世事的天真感。少女感可以体现在穿搭、言辞、容貌,也可以体现在UI设计中。可爱爆棚的爱心类图标icon,能够让UI界面的“少女感”止不住地溢出。UI设计师可以利用社区资源图标icon模板,尽情享受创意在指尖跳动的欢乐,diy 出属于自己的少女感图标 icon。

爱心类图标

爱心类图标

1. 制作少女感爱心图标icon教程

第一步:用形状工具绘制一个矩形,填充颜色。数值参考:

矩形:W:900 H:600

颜色:#9697FF,100%

绘制矩形

第二步:绘制圆形。点击形状工具,下拉选择圆形(O),填充颜色,数值参考:

圆形:W:165,H:165

颜色:# DBDBEF,100%

绘制圆形

第三步:绘制矩形。点击形状工具,选择矩形(R),填充颜色,数值参考:

圆形:W:40,H:30

颜色:# DBDBEF,100%

填充颜色

第四步:按住shift,选中矩形和圆形,选择联集,进行合并。

联集

第五步:将合并后的形状进行旋转,旋转度参考:-45°。

旋转度

第六步:给形状添加效果。

描边:选择内部,设置数值6,颜色填充 #4A456D;

内阴影:x:-12,y:-12 ;颜色填充 # C5BDD3;

添加效果

第七步:添加装饰。从Pixso社区的组件资源中找到爱心类图标进行收藏,即可在Pixso工作台的资源库中直接拖拽复用。

添加装饰

你也可以利用Pixso的钢笔工具(P),绘制矢量图形进行装饰,一个少女感爆棚的爱心图标icon就大功告成啦。

钢笔工具(P)

2. 用Pixso协作设计少女感爱心图标icon

你也可以直接在Pixso社区搜索图标分类,快速找到少女感爱心图标icon,打开编辑即开即用。

Pixso社区

Pixso是新一代设计协作工具,不仅实现了和 Figma、 Sketch、Adobe XD 的无缝衔接,更基于优秀的组件变体、自动布局等特色功能,让UI设计师在网页上就可以尽情自由创作。作为一款为本土设计师量身打造的国产设计工具,因其实时协作、精细化设计工具等特色功能,收获了广大使用者的喜爱。

使用 Pixso 在线协同设计磨砂玻璃质感天气图标,直接拖拽使用Pixso自带的设计资源库,省去大量重复劳动,让设计更流畅,协作更高效!

3. 协作设计工具Pixso的特点

团队协作:团队成员面对一个复杂的设计项目,可以多人云端协作设计,实时同步字号、边框、颜色等各种细节。

智能设计工具:自带专业设计工具,支持UI/UX设计和原型播放,一体化完成高保真产品设计。

矢量网格:模拟画笔的特色,提供精细化矢量设计,自由切割线段,连点成面。

组件变体:随意切换一个组件的多种状态,设计师可以更加高效地去创建和复用组件。

格式兼容:支持Figma、Axure、Sketch、XD、SVG等文件导入,无缝衔接以往工作。

海量设计模板:Pixso设计资源每月更新,集成腾讯、阿里、字节、蚂蚁设计等众多大厂设计系统,组件素材直接复用,创意快人一步。