经验分享丨赶集App中秋节的皮肤设计.docVIP

经验分享丨赶集App中秋节的皮肤设计 　　随着移动互联网的迅猛发展，同一款产品，使用移动端的用户远超PC端，为了更好的提升APP的用户体验，情感化设计也得到了越来越多的关注，通过它来唤起用户共鸣，带给用户愉悦的心情。 　　 　　每逢节假日，在这个“黄金时段”，众多APP除了会准备很多活动来增加人气外；同时，也会相应设计一系列节日皮肤来渲染节日气氛，这正是树立口碑、增加品牌价值的好时机。节日皮肤设计风格多种多样，时不时给予用户莫大的惊喜与愉悦的感官体验，加强了用户对产品的黏性。 　　赶集作为一个提供服务的综合性平台，与电商类产品有着较大的区别。所以，我们在设计赶集APP皮肤的时候，要保证界面的简洁度，避免设计过度造成用户眼花缭乱、心烦意乱。在设计皮肤之前，需要跟产品和研发先确定哪些是可以设计的，并且了解每一处切图的尺寸。赶集主要对APP首页的8个类别icon、底部tab和icon、下拉刷新以及个人中心头图进行设计，同时要清楚知道这些需要配置的图标尺寸。开始做效果图的时候，我们通常以iPhone6的分辨率为标准进行。 　　下面我以赶集App中秋节的皮肤设计为例，向大家分享一下我的一点经验。 　　趣味萌兔 喜迎中秋 　　中秋佳节是中国传统节日中最受重视的节日之一，对于中秋节的相关设计，也是铺天盖地。在这习以为常的节日设计中，怎样做到与众不同，从中脱颖而出是一件相当不易之事，这考量着每一名设计师的综合能力。 　　在设计之前，我们可以先了解中秋节的相关习俗、神话传说以及诗词典故等，比如：嫦娥奔月、吴刚砍树、玉兔捣年糕、拜兔儿爷、赏月观花以及月饼的由来等。接着去了解相关中秋节的设计，可以从平面、动画、影视等多方面寻找创意灵感；同时，可以不局限于对中秋节的搜索，其他节日的设计也许能带来意想不到的灵感，比如说在表现手法、造型设计、色彩的应用等。 　　对中秋节有了大致的了解之后，与该需求的产品经理及其他设计师一起进行头脑风暴，收集创意灵感。最终我们确定采用以兔子为主要元素，设计一套中秋兔子表情的皮肤。我们先以8个大类的icon为设计切入点。 　　1. 确定兔子造型 　　先收集兔子图片，在本子上不断提炼兔子的造型，了解它的身体结构，尝试各种画风。由于主要icon的尺寸是96×96，所以要求兔子的造型必须简洁，最终采用卡通萌萌的兔子造型。在给兔子上色的时候，发现只有淡的近白色的兔子才最可爱，这时候必须有背景色才能突出白色兔子。 　　 　　近白色的兔子最可爱 　　 　　必须有背景色才能突出白色兔子 　　2. 构思创意点 　　中秋节最重要的元素是月亮，月亮代表团圆。抱着尝试的心情，进行草图勾勒，尝试画出月缺的变化图。 　　第一排图标的背景从月缺变成月圆，也是意寓着人们从分离到团圆的过程。则描绘它平时的生活特点，画出兔子各种可爱有趣的动作，如：高兴、睡觉、抱胡萝卜、趴着。第二排背景表现出月亮从升起到降落的形式，其中月亮一直是月圆的状态来表示中秋节团圆的日子，来讲述兔子与中秋相关的习俗，画出捣年糕、望月、吃月饼、点灯笼的动作。 　　 　　兔子的表情传达出节日的趣味性与故事感 　　3. 确定色彩 　　颜色是表达节日气氛的最直接表现手法，掌握好节日的颜色特征，能更直接、准确表达出相应主题内涵。根据中国传统颜色风格，以红、黄、青为主色，其中红色表示白天、青色表示黑夜，红青相间，画面有节奏感，而不会太单调；对于背景和兔子颜色都采用微渐变风格，统一光源，既符合现在的设计流行趋势，也不会显得沉闷。 　　 　　颜色是表达节日气氛的最直接表现手法 　　4. 丰富细节 　　到这一步之后，发现圆形的背景显得比较单调和束缚，于是尝试加入云的样式来打破圆的结构，同时加入星星的点缀，使得整个图标活跃和丰富起来。 　　 　　丰富细节来使画面丰富 　　最后是对底部tab的设计，背景的创意来源于中国传统山水画，描绘的是中间为月亮升起来，兔子趴在月亮上睡觉，以月饼的形式，突出中秋快乐的文字。整个创意既与上面的图标相呼应，同时与背景相融合，毫无违和感，使得整个画面更加生动，更好地烘托出中秋节的特点。 　　完稿之后，最终整体皮肤界面达到视觉一致性、图形识别性强，充满了风趣可爱，得到了产品的一致赞赏和认可，身边的同事也纷纷表示喜爱有加。 　　 　　最终稿设计方案 　　赶集APP节日皮肤欣赏 　　 　　2016元宵节皮肤 　　 　　2016圣诞节皮肤 　　 　　2016元旦皮肤 　　 　　2017元旦皮肤 　　 　　2017元宵节皮肤 　　本文来源于人人都是产品经理合作媒体@58用户体验设计中心