longlong ago，故事的起初……“希望像Pokemongo 一样被大多数年轻人接受和喜欢的小生命。”
一切的起源来自于日本大阪伏见稻荷神社的狐狸表情……
但是……
不仅仅只是为了硬要做狐狸而去强奸我们的对ifashion的形象的初衷。当然我们知道阿里的动物已经蜜汁泛滥了，最熟悉的淘公仔、蚂蚁金服的蓝色蚂蚁、淘宝爱逛街的兔酱、一言不合就做动物真的好吗……
但是我们的这个IP形象，狐狸的动物形态只是一个方面的表达，更多的是他灵活穿梭在页面、平面、广告媒介中的一个简洁的型和轮廓，即狐狸只是一个说法，它有更丰富和灵动的方面。
我们中途也走过很多弯路，就像接下去这些“飞机”中你可以体会到有：更可爱稚嫩的狐狸，有简洁的色块拼接的尝试、也有中途组员们尝试的维多利亚风以及其他其他nei nei nei nei什么不知名的风-_-#，过程很开心，因为我们几乎把所有的狐狸都要掏空了～
而最终，我们剔除了花枝招展（少一点套路、多一点真诚），选择了这个清新简洁的方向。这就是我们最终的logo：充分留白的空间内，logo简洁有力。
logo出来了，那他有什么含义呢？
首先他一定是有亲和力有爱的……当然宝宝光有爱是不够哒～～
言归正传，漏狗有三层含义——
1、一张网红锥子脸。
2、一只妩媚的狐狸灵气的回眸……电到米？
3、一本正在被翻阅的时尚杂志。杂志的方式为后续做推广营销和产品界面的设计思路有很多启发和可能性。
哦，对了，我们还有个名字，他叫“哒狸”；
是搭配的“da”~~狐狸的”li”~寓意——一只会搭配的小狐狸。
那我们大致了解了ifashion的品牌怎么诞生的，那接下去看看它是怎么蔓延的。
蔓延分为两端，一是产品界面，二是这个品牌ip形象怎么活用。
首先看看产品端：1、细节渗透；2、趣味化情感化赋能；
先是细节怎么渗透？
其实展现在用户手机上750-1334像素的屏幕中的无非就是“图”，字，也是图，我们先从关键部分的字体着手。举个栗子，就好比：潮流播报&潮流热点的字体，他的透出位置是相当于手淘的“淘宝头条”的位置，是用户了解潮流动向的 touch point入口，所以需要用点功设计下。当然要和我们的品牌气息一致，（ps:logo中拆解的图形，具体可以往下看表急哦～～）我都采用了斜线的处理手法，将文字的比划重新进行了拆解——隔断——变异——优化。重组比划后我再用我们的斜线元素重新检验，如果没有契合的细节，再一遍一遍的调整，直到满意位置~~造吗，就这块咪咪小的领地，宝宝使出洪荒之力啊！
高能入口，奏四仄里！
高能入口，奏四圈圈仄里！
刚上面提到的ps：辅助图形及斜线的演变思路：
将logo进行分解，斜线是脸部的构造线，中间的小眼睛剥离出来是“点”，重新把拆除的元素重新排列组合，构成其他的形态，基础的单元元素是斜线。
除了字体，还有真正的图的部分，我这里细分定义为图分图标和图片。图标又可以出现在底部和顶部的元素等场景，图片主要是用在氛围和模版图等大面积一些的地方。
同理，图形也是把狐狸头的元素用(wang)到(si)极(li)致(yong) !
各种类目标：
各种版块版头氛围图：
潮流播报的小狐狸探出脑袋，耳朵冒出播报的声波……
背景是抽象的元素，有一点透出但不会影响主题信息。
风格私搭list页面体现会员的尊贵感，狐狸头化身小皇冠。
潮流专题的版头，像一个潘多拉的魔盒，或者是一顶魔术帽，缤纷元素纷纷往外飞出。狐狸头化身小皇冠，放大和应用效果：
还有品牌建设初期1.0的时候规划的banner规范：
H5首页在日常中的模版，由原来版头的横条广告变成了内容聚焦的入口：最in专栏
除了设计细节，还有情感化的元素给产品、页面润色添彩。
我们这次处理类目图形表现的时候有别于一般的icon，而是基于我们的品牌色和勾线的表现手法，重新创作了一整套类目插图。
也有一种介绍“白皮书”的感觉，用在每个叶子类目的版头，上色的部分是这个tab分类下主要推荐的分类上身的效果和部位，让用户第一时间能够充分感受到这个页面想和用户交流什么。
H5产品页面也要时时和用户幽默的情感化互动：
页面“潮流志”中也加入了很多情感化的氛围，用card的形式分别包装推荐
最终线上截图效果：卖家也结合自己的特性发挥想象，内容丰富多变，但都统一在一个既定的card卡片容器中。
情感化中当然少不了品牌ip形象的透出：1是通过多元化的形象表现，2是在统一中求变化的展现；
起初只有脸部的表情：
之后因为页面需要设计了带有简洁身体的形象：
再然后，为了更好传播和更生动的表现，有了品牌透出的形象升级版本，脸不只是正面了，还转了一点角度，小狐狸那种略藐视的眼神，你感觉到了吗？
我们为了阶段性检测我们的品牌形象用户买不买账，抽取了5000个可用性用户进行测试，结果还是可观的，60%多的还是知道这只“狐狸”代表ifashion，但是同时也可以看出来slogan“时尚逗号在我身上”的记忆力并不深刻，不如系列活动那句——时尚，潮我看～
2是在统一中求变化，我们通过：营销页面统一的品牌色、动效以及百变的打标，还有手绘90后风格的尝试：
颜色：
统一的品牌色系统，每个品牌色都是一种相互影响的存在，比例的多少、留白的大小，都影响着用户对品牌的认知。我们定义ifashion的品牌色就是在有充足的留白环境中，出现哒狸蓝（品牌色），和哒狸红（强调色），说白了就是红色是代表强调、警戒、强行动力的颜色。平常的品牌色可以用蓝色系（小部分深蓝加上相对多面积的浅蓝）。但周围的留白依旧是充分的，让人感受到我们的品牌色是会呼吸的，透气的。
再加上右侧的丰富的活动推荐颜色，构成了ifashion品牌色的体系。
动效：
活动中版头品牌区的打标：
我变！我变！我变变变！但我还是小狐狸：
其他应用：手绘描线的形式，插图感觉的元素用到banner上。
这是今年音乐节的外景，这种光烁迷离的新潮的即视感也很符合我们的视觉要求：
“点击并长按以下图片，识别图中二维码” 关注我们！
原文始发于微信公众号（淘宝设计）：一只叫ifashion的小狐狸的诞生……
评论0