APP开屏图设计思路 手机app的开屏广告效果设计

夜以继日的撸一个又一个版本的界面，开屏图的设计大概就是UI设计师唯一可以发挥视觉插画的战场。（设计部门里分工比较细，我主要工作就是负责版本的迭代界面设计&开屏图&新版本视频宣传封面，其他运营的活动不在负责范畴里）

做这样的总结，主要目的是为了自省过去，因为发现每一次做完后，都会发现自己要么内容画得太单调，要么构图太散乱，要么用色太无趣，这么多的问题好像会反复出现在“下一次的画面”里，那这次就写下来。

画面要考虑的几点：构图、明暗关系、主次关系、配色（占比、轻重、分布、冷暖搭配、色彩区间）

设计开屏图有几大难点：

1. 用户驻留时间短，导致注意力无法集中；

2. 用户主观意识认为它不重要，进一步减少注意力；

3. 要用用户投入较少注意力的情况下，用图像+文字吸引用户，并告之用户，这对文案和图像表达都很有挑战；

开屏的类型有哪些呢？

1. 页面截图为主

2. 插画（将页面主体元素融入插画）

3. 截图意象化

我的设计过程：

1. 文案解读，提取关键字

2. 素材灵感搜索，想传达什么画面，营造什么气氛

3. 手稿构图【老大建议前期上个色看气氛小稿，之前还没这么做过，下一个版本尝试】

4. PS/AI钢笔绘制

接手项目以来做了5个版本开屏图：

既然要举个栗子，拿最新的热乎乎的刚刚上线的来解说吧：

（沉浸当下时总无法看到问题，回过来再瞧瞧时又能发现在画面上处理不当的地方，啪啪打得脸好疼，捂脸...）：

产品给的需求文案如下图，字号的大小加粗来区分文案的主次关系。

（需求一开始是2张，“消息盒子”是版本上了公测后临时补充的需求，当时就按照前面2张的构图把元素拼进去，没有一开始就整体设计思考，补充的第3张，真的补得超痛苦，手稿就在纸上简单画了。）

关键字提取

根据关键文字，进行素材搜集，找一些插画寻找自己想要的元素，构思画面。

ps：4399family有好多个角色可以使用

对找到的参考元素，结合角色进行手稿草图。

文案的第1点“消息盒子”后面临时加入的，就先讲一开始有构思连贯的两张：

【全局搜索 新用法 直搜礼包更带感】：吃鸡游戏场景的加入，女枪手扫射到跳伞甲，“啊”给画面带来小趣味；打算把礼包放着在下方的彩带处。

【预约游戏 等上线 微信通知好及时】：飞船控制室，有很多个爪，可以放置游戏卡片，微信也以它的动物的形式围绕在控制室旁边。

草图搭好构图后，就使用ps钢笔工具进行绘制。

对于画面把握还不是很厉害的小司机，绘制的过程中，要不断的去看整体，协调画面里的元素，和草图的元素有些增减。

第一版初稿做到这样，重新再审视，发现一些问题，以及给产品看后，反馈目前的页面里没有传达出“某款游戏的礼包、预约、搜索栏”，结合反馈又再次做了元素及构图调整：

这是最终稿：

在做临时插入的“消息盒子”时，反过头审视原先完成的2张图，色彩的运用，主体内容在绿色的背景下，对比度处理得不是很好，用色偏灰。

阶段性小结，也看到自己不足的地方，被喷一下也无妨。