涂鸦王国是国内精英插画师社交网站，涂鸦王国以原创插画为主要核心内容，作品风格多样，涉及使用行业广泛。本文是关于涂鸦王国APP概念设计与思考。
涂鸦王国APP概念设计总结：
前言
由于平时喜欢画画，几年前有幸接触到涂鸦王国这个产品。是同行介绍给我的，最初是被内容吸引到的。内容不错，也会有一些业内大佬。萌生改版的念头是在16年左右的样子，当时越发感觉不对劲。
个人感觉产品是有问题的，但是我考虑更多的是这家公司是什么状态。这期间有过几次改版，但效果并不显著。
2018年下半年开始有大改动的趋势，包括PC、移动端、小程序。下面我会放一些目前涂鸦王国APP的截图。一款产品并不是哪一个人决定的，是一个团队的力量，是市场环境和内部因素决定的。所以本次改版只当是我个人主观意识上的改版（虽然也做了市场调查，和竞品分析）！大家也可以认为原版本的好一些，这都没关系！
借此多说两句概念性设计和商业作品。
首先，本次概念性设计更倾向于线上产品与市场。不是单方面的追求美术效果和自由。更不是为了形式而形式。不反对过度包装和追求华丽的作品，无论作者的出发点和目的是什么，它们确实可以提供引向性和设计灵感。
关于好看的作品与现实的差距这方面的讨论网上有很多，个人认为：概念性设计更多的是设计师的主观意识，是追求自我取悦自我满足的状态，是没有约束的，是自由的，可以无限的发挥个人的想象力；但是不能偏离土壤太多！
而商业作品，不论是线上还是线下，亦或者其他产品。我想可以用一句话概括：市场需求大于个人认知。
为了这个项目不光做了分析，还添加了涂鸦王国一些群（这让我想起之前有个做UI的卧底，最终还破案了，哈哈~）。在群里能得到一些信息，包括涂鸦的一些动态！当然，内部数据是不可能得到的，这个可以用得到的综合信息去推算，包括一些数据网站。
接下来我会用聊天的口吻来阐述此次改版的过程，主要改版方向还是以视觉为主，其次就是功能性和战略方向的一些想法，多纬度的讲解产品目前存在的问题和如何优化。如果想要进一步了解产品，大家可以下载看一下（不是广告）。
声明：配图来源于网络，仅供学习使用，不作商用，如有不妥请联系更正。
接下来就让我们一起进入正题吧~
目录：
产品背景
产品分析
升级目标
交互原型
视觉设计
页面展示
一、产品背景
涂鸦王国成立多年（看资料是03年成立，但是一篇采访创始人的文章里说是14年。这个很关键，十年和一年做出的成绩差距还是很大的），已经培养出一大批忠实用户。
涂鸦王国是国内精英插画师社交网站，涂鸦王国以原创插画为主要核心内容，作品风格多样，涉及使用行业广泛。涂鸦王国在业内拥有良好的口碑与权威，以众多优质精美原创作品而闻名中国，从而吸引众多国内知名插画家漫画家在此聚集！
涂鸦王国是一片未染尘世，而却又是国内外众多画手，插画家云集的心灵净土和彼此交流栖息地，是以涂鸦为主的交流性质的自由网站。
网站的理念在于超越传统的绘画思想，接近绘画最初的自由，与表达的本质。是一群活跃在互联网ACG界，热衷绘画也爱好生活的画手们的Collective Blog。从不作为广告以及盈利所用，因为它属于来到这里的每个人。如果要用一个词来形容王国，也许唯有“梦之地”最为合适吧。
据创始人介绍，目标是将艺场（站内栏目，同时也有独立网站）发展成一个可以聚集百万级插画师，吸引插画创意需求商家，完成图片授权交易百万次以上，且成为数字艺术行业的版权领导者，以及艺术家信任的平台，让艺术广泛的融入人们的生活。
上述内容来源于网络资料，提炼一下：涂鸦王国是一个以插画为主要内容的社区网站，不以盈利为目的。不清楚最终要做的核心功能是不是维护用户版权问题 （维护版权功能有很多网站在做，比如花瓣的DCI 版权登记）。
先不说是不是未染尘世的心灵净土，还是不以盈利为目的社交网站。最低保障是要生存，要活下去。情怀可以有，但更要理性，产品优化还是要做的，不然用户流失或者没有用户使用这款产品，那么“未染尘世的心灵净土”谁来享用呢？
因此，我希望通过本次的改版升级，能够从视觉、功能、品牌、体验等多维度的优化这款产品，提升用户体验。
二、产品分析
1. 用户画像
数据显示30-39岁的用户人群居多。但是各个群显示比较活跃的用户是20-30岁之间，这些用户会往群里积极地发一些作品并讨论一些绘画方面的问题。如果说03公司成立，说明曾经辉煌过，而且积累了一大批用户。
而现在存在的问题是用户老龄化加剧，且流失严重。需要及时注入新鲜血液，开发新用户，（我和涂鸦一些IP比较老的资深用户沟通后发现，他们的多数并不是没有需求，而是流失到其他的平台去了，例如站酷和微博……）用户流失是多方面的原因。
最主要的原因可以提两个点：
产品给与不了用户价值（用户在其他平台能获得更多关注，能获得更多的成就感和影响力，且其他平台综合实力优越）。
用户主要分为三种人群：
插画师（学生、在职、资深、自由插画师）；
不爱画画但是对插画需求的人（例如设计公司、出版社、装修公司等、他们会在涂鸦上约稿）；
绘画爱好者（看作品、找资源、找灵感）。
2. 产品截图（部分）
3. 问题总结（结合平台用户反馈）
各种bug，闪退、适配问题、加载慢、空白页、上传作品失败、等等……
视觉问题（视觉不统一、页面繁杂、内容条理不清晰、图标、颜色、字体、留白等问题优化、整体用户体验差……）
内容不丰富、功能不健全（PC功能到APP上怎么样取舍，APP上一些页面完全就是网页H5代码、并没有针对APP进行页面设计）
交互逻辑性差、不够灵活高效
操作可控性、状态可知感、设计美学主义、人性化提醒帮助等问题待优化
产品无温度、品牌辨识度不足
三、升级目标
在这个过程中，一定要用平常心去客观的观察分析问题，不要被自己的思维定势所影响。
关键词：
本次升级可分为4个方面：
1. 程序优化
程序不是视觉能够左右的，但是目前该产品确实存在很多bug ，所以还是提一下。综上所述bug问题，程序方面还需要加大优化力度，优化整体框架结构，减少问题的发生，提高用户体验。这点对用户的伤害是无限大的，最严重的结果就是用户流失问题。
设备适配也是很严重的问题，大屏幕过多的留白，小屏幕的拥挤、叠压。
内容加载、缓存的问题。对于以图片内容为核心的产品一定要注意这个问题。目前涂鸦用的是下拉加载，每滑动一屏就要手动点击加载一次。下拉加载没问题，也是加载样式的一种主要类型。但是在信息流样式的页面里，手动加载已经很少见了。
操作不方便且让用户在使用过程中停顿是不友好不人性的行为，何况是崇尚沉浸式设计的当下。取消加载更多按钮，换做预加载、无限滑动会不会好点？
（这些问题，包括用户的反馈，涂鸦的工作人员应该是能够看到的。至于问题为什么无人问津，这里就不过多的推测了）。
2. 视觉改版
优化界面，更简洁、清晰、友好。设计一致性、独特的视觉层次和深度、包括元素的克制等方面进行优化。
3. 交互逻辑
清晰流畅的交互易于用户理解内容并进行操作（我从哪里来；要到哪里去；怎么去；如何回来；遇到岔路口开怎么办；操作控件是否友好）。
4. 品牌升级
优化品牌标识、品牌色，通过上述改版方向最终达到产品整体升级，提高用户体验。
四、交互原型
通过产品分析，改版的大致方向和设计风格可以确定下来。下面先看一下思维导图，主要添加两大功能：
社区（画友圈）
购物
思维导图：
原型图：
五、视觉设计
1. 品牌色
色彩在设计中起到了至关重要的作用，每一种颜色都有自己的属性。主色也代表了品牌的语言和标识。例如：提到可口可乐大家立马想到可口可乐的红色。在商业战略上加深消费者对品牌的认知度。
那么涂鸦的品牌色该如何定义呢？
我们先来分析一下，涂鸦王国目前的用色是以黑色为主，蓝色和绿色为辅助。黑色和企业所传达的“灵魂净土”、“栖息地”、“神秘王国”，很匹配且具有神秘感。另一方面是用户对产品已经有一定的认知度，所以延用已有认知的黑色，但是以辅助色的身份出现。考虑到产品特性和用户群体，主色定义为了蓝色。
为什么使用蓝色？
数据显示，大多数人喜欢蓝色；
蓝色具有准确、稳定的感觉。让人有安全感，让产品看起来更值得信任；
谈及绘画就少不了大自然，而蓝色又和大自然息息相关，海洋、天空；
蓝色是纯净的、理智的、选择蓝色会让页面更整洁、干净、克制；
蓝色传递的情感更加抽象；
蓝色特殊的故事富有神秘色彩，和产品很符合；
蓝色对画家（用户）来讲有特殊意义。
2. 品牌标识
先来看一下原有标识，都是在网上找到的，顶部圆点的一版是小程序上的。
logo解读（该解读仅代表个人经验推断，与涂鸦王国无关）
logo的设计思路很直白，和产品也很符合。绘画需要笔，用钢笔概括画笔元素，用王冠形状表达“王国”的理念。坦白讲，这个logo堪称完美。
但是确实有点问题，作为一个企业形象标识，在公开场合尽可能的统一显示，比如形状和颜色。VI使用规范不知道是不是有上方黄色版，在大多数平台显示都是黑色标识，突然看到黄色就会很奇怪。
大家见过红色的星巴克logo吗？
所以尽量统一规范，增强品牌认知度。线上产品尽可能的减少锐角，在不同尺寸显示时会出现失真。logo整体不够规范，留白不平衡。不够精致，太过锐利，缺少温度。
改版方向，首先是规范，负空间的角度、间距统一，让整体比例更平衡、精致、清晰、更具设计感。随着时代的发展，品牌识别不光要考量印刷输出，更要兼具跨载体应用的易读性及可识别的弹性，要与时俱进，让logo在萤幕显示上更具挑战性。
所以锐角优化为圆角，更有温度，更具亲和力的同时也能经得起不同终端和不同尺寸的考验。保持原有logo视觉的辨识度，对形状进行微调，整体更简洁舒适，让用户更容易接受。同时改版后的标识视觉上更加稳重、有效率、易识别。
3. 文字规范
4. 界面设计
修改的地方还挺多的，以下就不提原版了，可以直观的看新旧版对比，主要阐述一下修改的页面。
把原本的综合首页改为我的关注页面，我关注人的动态包括，发布新作品，对其他用户的点赞与评论行为。
页面采用卡片式+大圆角，一方面是基于流行趋势，另一方面是因为卡片式设计能解决该产品界面混乱的问题，让页面更加简洁，板块清晰。信息模块化，聚焦内容，增强点击感。
舒适的留白与间距让整个页面看起来更加清晰和放松；字体的大小对比让主要内容更加凸显，主次分明。
产品的大多数图标采用面性图标，保持页面统一性（特殊页面特殊处理）。
一级导航从左至右分别是首页、发现、发布、商城、我的。
首页：我关注人的动态
发现：这个页面主要功能是解决产品的延伸功能的扩展问题，比如：生活圈、活动…
发布：发布作品；发布生活；签到
商城：出售画材与周边
我的：个人信息综合
可以看到最大的区别是添加了社区和电商功能，后面会讲到为什么添加这两大功能。这两个功能对于任何一个产品想要实现其中一个都不会那么容易。标签栏图标没有添加文字，也许会有人说看不懂，这块学习成本其实很低，使用一次就可以明白，如果大部分用户反馈影响使用，可以加上，允许试错。
推荐页面添加了搜索功能，同时采用下拉超级菜单式导航，更加方便用户按照条件查看。
发现页面，添加了生活圈功能。产品社区化愈演愈烈，是大多数主流产品的发展目标。我们可以看到淘宝、他趣、网易云音乐等等……间接竞品类似站酷。
为什么要添加生活圈能呢？
产品社区化趋势。
填充页面，让产品内容充实。
提高用户使用时间，增加留存率。
最为一个画画的用户，我不想发作品，或是其他的原因。这个时候生活圈就起到了作用（从目前来讲生活圈一定要克制，弱化于作品，产品要强调主要功能），涂鸦的未来走向有很多种，不一定非要以展示作品为主。以社交为主的绘画类综合社区。这两个概念与思想是完全不一样的，这也是我为什么要在本身就是社区平台的涂鸦产品里面添加生活圈的主要原因。
具有更多的可能性，比如：生活圈列表添加广告，即使是首页也可以添加广告。形式有很多种，就不延伸了，花瓣网已经这么做了。
发帖页面，讲一下签到功能。签到本质是引导用户登录APP或者完成某一任务，得到一定奖励（实物、虚拟奖励、荣耀），用户为了得到奖励或者更多的奖励再次签到，从而形成闭环。签到有很多种玩法，比如：连续性签到和间断性签到。
签到的方式又可以分为很多种，不同的产品给予用户签到的回报也有所不同。对于产品来讲可以实现增加日活量的目的，提高用户粘性，增强用户体验，用户得到签到给与他的奖励或者荣誉更好的反哺产品。
商城页面，讲一下为什么添加购物功能。
产品如何盈利？
我相信这是每一个产品在开发之前都会想的问题，也有些产品是摸着石头过河。
盈利主要可分为两类：
流量；
服务。
花瓣网那么大的流量都没找到合适的盈利模式，虽然有一些增值服务。目前开始在信息流里插入广告了。不同的产品对流量的使用方法有所区别，并不是产品流量高就可以转化为资金，但是接广告是大多数公司在做的事情。微信把流量入口给拼多多，最终上市了。今日头条可以把流量放给广告商，2018年今日头条广告收入目标是500亿，大家可以想象。
那么对于涂鸦来讲，目前流量变现有些困难，只能做增值业务，而对于画手来说肯定是离不开画材的。所以商城对于涂鸦的用户是有实际用途的，是实用的。涂鸦做购物会比某些平台更能让用户信任，但是前提是要好好优化APP，不买假货，保证购物体验愉悦。
实际上不做购物，优化教学服务也是可以的，越来越多的用户愿意为知识付费。涂鸦的PC端有“绘画学院”教育平台，总之有很多可能性。
我的页面改版还是按照前面分析的问题以及设计方向走的，保持整洁、统一、清晰等等，说一下原版的这种排版样式。现在这种样式使用的越来越少了，如果放在内容信息流页面，九宫格还是不错的选择，节省页面空间，而且好适配。
但还是要设置间距，不然内容就会不清晰，页面整体感觉很混乱很脏。（并不是说作品，这位大神也是能力通天，在画圈里也是有影响力的。同时也是典型的用户流失案例，最后一个作品也是好多年前了）。
再看涂鸦这个页面，首先是背景图浪费太多空间，用户关注等信息下面留白过多，界面很空的感觉，作品信息不全面。作品下方每次加载都要点击查看更多，无限滑动会不会好一点？
同时他人主页添加更多功能，比如：分享、投诉等功能。
登录界面，增加第三方登录，方便用户快速登录。
页面优化，如果国外用户少或者不考虑国外用户，可以把归属地功能去掉。实际上考虑国外用户对于开发这块还是增加难度的，包括一些判断，主要还是看用户群体。
登录按钮在内容不正确时显示无效状态，一方面是提高用户使用体验，另一方面是在信息提交之前对内容进行判断是否正确，预防提交无效内容。
六、页面展示
（文件太大，分开上传）
以上就是对涂鸦王国APP的概念性设计与思考，界面没有展示全部，主体框架清晰可见，保留了一些对产品的想法。
任何产品都有无限优化升级的可能性，设计中的观点为个人经验尝试，接受大家不同的想法及建议，希望与大家交流学习，不断的完善产品。也希望涂鸦王国能够重视移动端，未来越来越好。
