在 APP 的日常运营中，我们设计的同学经常会接到中心举动类的设计需要，其中举动头像框就是一个主要的类型。
中心头像框能满足用户的个性化需要，可以充当举动奖品，提高用户对举动的参与积极性，也有着一定的举动推广作用。
那么对于大部分手绘能力并不突出的 UI 设计师，怎样能在短期内利用素材建造举动中心的头像框呢？本期文章我将分离以往我做过的中心头像框，给各人讲解我的思绪与方式。
相关干货：
一、素材综合与建造思绪
在需要开始前，我们一定要和需要方做好沟通，确定好需要方的想法与要求，提出自己对于元素、颜色、质感等元素大致思绪，避免大改。
这里举例用一张 AI 素材做一个头像框，中心是冬天雪景，给用户带来冬天的感觉，那我们便可以围绕这点综合这张素材和提取可用元素。
首先是色彩的综合，整体 kv 色彩以蓝白色为主，亮暗分明，上方天空融入五彩的极光，有很好的丰厚总体色彩的作用，我们可以大致上直接按这种布局给框体配色。同时下方的积雪也可以做冬季的点题，可以加在头像框底部，刚好之前设想的底部深蓝色也能很好的衬出积雪轮廓。
再就是一些装衬元素的选取，例如空中的飘雪、人物身上的装饰等，又或者一些图案纹理、特效等，都可以用来丰厚头像框，一般我会倾向找一些偏三角形的元素去搭配圆形的框体来做一个方圆分离
二、框体的建造
框体建造上首先是框体粗细不宜过细，要记住头像框始终是应用在界面上很小的一个元素，框体太细会压不住元素导致总体看上去很散乱，同时看上去也不够份量，而且框体的内圈最好略微小于头像（下图红色区域），让框体与头像产生一些重叠
接下来我们可以用颜色渐变与色块模糊给框体做亮暗丰厚体积，还可以试着增添一点特殊结构，增加趣味性
可以看到框体完整度看起来差不多了，接下来我们可以去叠一些半透明纹理，清晰度不需要太高
最后根据具体情况再做下调整，这里想要给框体增加一些发光的感觉，于是增添了一层白色描边做高光，以及模糊化的蓝色外发光
对比后可以看到框体看上去更晶莹闪耀，而且更有质感了
三、元素的使用
首先需注意点是元素的巨细与位置，所有元素尽量避免相同巨细，我们可以以优先级去给每组元素做巨细排序，例如题目>ip>配角>其他
然后元素的摆放位置与朝向也可以去做呼应，让元素之间产生互动感，例如图中生物望向小人，小人望向题目等，这么做也能让总体看起来更总体和谐
还有一个元素摆放方式，我们可以复制框体的外圈做蒙版，然后选择一些元素置入，例如下图中的积雪、云朵和黑色星球。这么做也是为了丰厚总体层次，让元素与框体产生联系
最后我们可以给元素增添投影，投影只需要铺在框体上即可，否则一些半透明模糊化的像素会超出画板的尺寸，所以我们可以最后确定好所有内容后，再以整体头像框区域为蒙版做这一步
总结一下，以上做的每个步骤都是为了元素丰厚同时更好地融入框体，让头像框有总体性，还有很多方式可以继续优化，但这里就不再赘述了。
四、AI 工具的分离
有时候我们拿到的素材没什么可用之处时，我们可以用 AI 去炼制元素。目前在 SD 上有模型可以直接炼制整体头像框，但效果并不是特别好，所以我更推荐各人用 AI 生成元素去做拼贴。
基本的 AI 炼制方式相信各人都会了，这里我们需要强调下画风的提示词，以及记得加上 black background，方便抠图。
后续就是分离上面元素使用的思绪去做即可，这里放两个古风向的头像框，可以看到 AI 元素的应用效果还是挺不错的。AI
OK 这期教程就到这里啦，希望对各人有所帮助，欢迎在评论区提出不同的见解