如何获取设计灵感？你没理解它真正的含义！
2017-05-02 | 发展规划

@呆呆丶L ：前阵子有不少人反馈：呆总，我平时看了不少图，但是做项目的时候没办法用上，怎么办呀？ 这类问题我一般只会用一句话回答：看得多没用的，要多想多做。（虽然是至理名言） 但是我觉得这样回答太敷衍了，所以写了这篇文章来告诉大家如何在工作中复用自己找到的好图，以及平时要怎么去做，即所谓的“如何在工作中找到设计灵感”。 相信很多人在日常的工作中都会为寻找设计灵感而犯愁，想通过查看更多更好案例总结出最好的方案将公司的项目做得出彩，然而⼜无从下手。 我自己也是，平常会去刷 Pinterest、花瓣、Dribbble、Behance 等平台，将好的创意和设计方案保存下来以备日后用。但是，很少人能真正理解这些保存的图片或素材，大部分人仅仅是觉得好看，然后就存了，而没有去分析当中真正的含义。 积累很重要，分析更重要。 下面我从两个方面来说说灵感来源：个人创意设计；商业产品设计。 个人创意设计 个人创意是自发的一种行为，好比 Dribbble、Behance等一些视觉平台，有很多个人主观创意类的作品。这类作品想要去找灵感复用到作品中，其实很简单。 我随便举一些例子： 1. 个人属性 星座（12） 生肖（12） 地域（中国 23 个省，4 个直辖市） 年龄（不同年龄的不同状态） 职业（趣味形象，如程序猿） 2. 世界环境 时间（节气、季节、节日） 习俗（民族、国家的不同习俗） 3. 情感 4. 热点 还有许多，我就不一一举例了。在我们做个人创意设计时，不仅可以参考别人的图来延伸出自己的想法，还能通过这些来找出自己想要创意的点。这也是为什么很多人说“做好看的图没用，做出符合公司产品需求的才有用”的原因（当然我不同意这个观点）。 商业产品设计 今天的重点其实是这块。商业产品的设计都有一个具象的有待解决的问题，不像个人创意那样可以天马行空的进行，更多的是需要考虑用户是否能够容易理解和接受。 下面从两个点出发，来讲解下如何在商业产品设计中获取灵感。 第一个简单的例子：弹框。 通常 iOS 会有自带的弹框组件，而很多 App … 继续阅读 →

浅谈设计师的转型之路
2017-04-29 | 发展规划

摘要 先去尝试你最想做的事情，不用考虑太多。竭尽全力去试。如果真的不可为之的话，再回到你只能去做的事情，这时候也能踏踏实实做出成绩来，不再疑惑。 (图001)   在谈转型之前，我们先来聊聊设计师的职责范围是什么？ 一个产品最终呈现到用户面前之前，通常会经历产品需求（提问）、产品方案（回答）、设计/开发（实现）这三步。可以看到，设计师的职责一般出现在第三步。 根据公司规模和业务需求的不同，设计师的职责范围也是多种多样的。有细分到产品、交互、视觉，精耕细作深挖专业的设计师；也有三头六臂身兼多职的全栈设计师。 精耕细作深挖专业的设计师 这类设计师可能更专注于做好本领域的份内事，不需要花过多时间去质疑产品需求和方案的合理性或可行性。各司其职的螺丝钉们运转良好，就能保证整个业务的顺利推进。 但问题也是显而易见的，不了解前因后果的设计，极有可能出现“只是好看，但并没有什么卵用”的产品。或者吭哧吭哧完成了任务，才发现最初的产品需求本身就是个伪命题。 比如那些年震惊业界的path，许多设计细节是具有划时代意义的，哪怕放到今天来看都惊艳无比。然而美则美矣，在惊艳之后，是产品定位和策略失败带来的一败涂地。 (图002)   三头六臂身兼多职的全栈设计师 这种生物常见于资源匮乏的初创型公司。上到参与讨论需求和方案，顺便亲手撰写PRD，下到出视觉稿和切图，甚至连数据分析都不在话下，样样亲力亲为的一条龙服务。 看似十项全能，比前者不知道厉害到哪里去，但这类设计师的短板也非常致命。在有限的时间内，精力被四分五裂地消耗在各项繁杂工作中，难有余力去精炼其中任何一项。长此以往，很容易就变成了一个什么都会但什么都不精的“全（都只）沾（边）设计师”。 (图003)   看完上面的职责范围和各自的利弊，对自己的定位是否已经有所判断？ 知己知彼百战不殆，无论是在设计师的范围内互相转型，还是往其他领域发展，都需要先了解它的职责范围，并从力所能及的角度去权衡它的利弊，来判断自己是否能胜任。 想好要转型了吗？ 如果答案是“yes”，请往下看。 (图004)   我真的适合转型吗？ 因为对某个领域产生了不可抗拒的兴趣，而想转型的人不在少数。将兴趣作为职业，听起来就是件做梦都要笑醒的事情。有了兴趣就不乏动力，这样看来似乎只要大跨步向目标迈进就好。 但怎么确定这个方向真的适合自己呢？ 作为一个从UI设计师转型产品经理的过来人，我先来说说自己踩过的坑。 工作初期供职的公司都是偏向视觉重心的业务，作为UI设计师我只需要考虑怎么将界面表现到极致。不用问我们为什么做这个产品？为什么这样做？甚至连我们到底做得算不算好都很难客观判断。只能从App Store中赞美我们产品视觉精致的用户评论里略窥一二。 之后经过一些契机，对产品设计产生了兴趣，也把自己的想法和当时任职产品经理的朋友聊了聊，他鼓励我去他就职的公司试试，他们正好在招聘移动端设计师。于是在面试时厚着脸皮提出了“虽然我来面的是设计师，但我想当产品经理”的要求。还以为会被拒绝，没想到不但被欣然接受，还为我安排了产品经理当我的mentor，从专业的角度引导我走上转型之路。 除了完成设计的份内工作，第一次听说还需要去质疑需求和方案的合理性和可行性。这对当时的我可谓醍醐灌顶，如果一开始就没想清楚，那么后面做再多也很可能是徒劳。 而质疑也不能仅仅是质疑，提出疑问的同时自己还得有自己的解决方案： “吃麻辣香锅吗？” “不吃。” “那你说吃啥？” …… 没错，你得说得出吃啥，才有权利说不吃。 在不断质疑、提问、回答的过程中，慢慢从无脑埋头做设计，开始懂得去思考设计背后的问题，给出答案，再验证答案是否正确。 此时再回头去看自己之前做的设计，已经惭愧地抬不起头。但正是这种惭愧，让我深深确信这条转型之路没有走错。 … 继续阅读 →

瓶颈期的设计师该如何走出迷茫？
2017-04-26 | 发展规划

苏大牙牙牙 ：每个设计师都会遇到工作的瓶颈或者迷茫期，或早或晚。写这篇文章的原因，也是因为自己遇到工作以来第一次最迷茫的阶段，持续了几个月的时间。可以用挣扎、痛苦、焦虑来形容。不过还好，最近渐渐的走出迷雾，人生又美好了起来。 所以想记录下来，作为一个总结，也可以说是一个具有仪式感的翻篇儿。正好分享给大家，希望能帮助到正经历这个阶段的你，或者鼓励到正在奋斗的设计师。 什么原因会导致迷茫？ 这里说的迷茫，不是针对执行力差，经常打嘴炮，天天说自己迷茫其实还不都是因为懒的人。 而是足够努力，但不确定方向是否正确；不满足于呆在舒适区，然而短时间没有明确的目标；一步步完成了目标，突然发现不知道自己到底想要什么样的生活；等等… 其实总的来说一般有几个原因导致：1. 对现状的不满 2. 对未来事情的未知 3. 对长期目标的不明确。 我经历过的两个迷茫阶段 1. 毕业前 将要步入社会时，是个迷茫的坎儿。要么找工作遇到困难，要么不知道自己适合做什么，要么专业不对口，要么刚刚脱离集体生活很蒙逼… 举个自己的例子：我在毕业前，也是不知道未来进什么样的公司会对自己之后发展有利。是bat这样的大公司？还是高速发展的中型C、D轮融资的公司？或者去产品更加小而美的、有情怀的创业公司？… 后来发现，是自己想多了。由于考研错过校招，而社招的话，都要有工作经验，我没有。作品集都是大学做的平面广告设计和书籍装帧相关的，而人家要互联网设计相关的，我也没有。 面试几次失败后我都是哭着回学校（嗯，那时候我还是年轻娇羞的大牙），发现自己进入了一个死循环（在找工作－没经验－作品不对口－面试失败），特别的迷茫… 我当时的处理方式是： 发现再痛苦再纠结也没有什么卵用，根本解决不了问题，要做的就是立即付出行动，而不是陷入无尽的迷茫。 所以，我决定不继续面试了，本身已经意识到自己的差距，再继续面下去，除了浪费精力和好的机会。因此，我把面试过程中自己所有不足的地方梳理出来，开始狂看互联网相关的书、体验各种App、加班修改设计、顶着油油的脑袋重新调整作品集和简历、找学长学姐给自己提意见、自己模拟面试问题，自己回答… 后来找到满意工作，渡过了第一个迷茫期。 2. 工作3-5年 不知道大家意识到没，招聘信息里，要么是招应届毕业生，要么是3－5年工作经验。1-2年的就很少。 我尝试从自己这几年的经历和想法的变化，思考这是为什么。然后发现工作1-2年的时候，由于刚开始工作，兴奋劲儿很足，不挑活，感觉做什么都是学习，浑身都是鸡血，看谁都是大牛。所以想要换工作的想法不多，一般还不会遇到工作瓶颈。 但是3-5年的时候，自己的小目标也陆陆续续实现，重复性的工作使你对工作变得麻木，同时发现以前认为的大牛也不过如此，那么内心就会慢慢的开始骚动… 我也是从工作3年多，突然开始更多的思考自己的职业规划是什么、什么是自己的核心优势、如何突破自己现状获得成就感、还自我否定觉得自己哪哪都不行，变的很焦虑。 甚至我都反问自己，到底有没有那么喜不喜欢设计？这事儿真的可以做一辈子么？开始了无尽的自我反问和迷茫中…总之，都是以前觉得假大空的问题，突然冲击着我的脑袋（是不是年纪大了都这样－ －）。 我当时的处理方式是： 开始找身边不同行业同学聊天，希望了解设计圈以外，别人是什么样的节奏；跟身边工作时间更久的同事聊，看他们之前有没有同样感受；读专业的、心理学的、经济学的书把自己眼界打开，找到更多的方向；每天下班后跑步… 差不多有两三个月的时间，我越来越意识到心态的重要性。同一件事情，不同的心态，过程和结果就会不一样。我开始尝试换一种心态对待不变的工作状态来获得成就感和自我提升。 1. 比如做设计，以前所认为已经做麻木、没挑战的设计需求，试着总结规律看能不能抽出来高效的方法论。 2. 意识到输出牛逼的设计效果已经满足不了自己，我就开始更关注数据所反应出用户的反馈，以及如何结合定性定量的分析来进行持续优化，来提升体验。哪怕这期间没有输出所谓的视觉稿，而更多的是沟通和梳理逻辑上的问题，我发现同样会给自己带来更多的成就感。 3. 以前觉得工作没挑战了、项目做腻了是不是要考虑换工作。慢慢意识到，不是所有地方都有那么多可挑战的事情要你去做，不是所有的好机会都在等着你去发现。而是要学会放平心态，利用大大小小的项目，学着把问题想的更有深度，解决方案更优雅，抽取的方法更高效，知识沉淀更到位，从而建立自己的专业壁垒。 渐渐的，状态就调整好了，走出了所谓的第二个迷茫期。 总的来说这次迷茫比第一次更痛苦，因为刚毕业的迷茫你知道自己哪里都不足，明确需要学习的地方很多，很快能找到方向。但工作3-5年后，考虑的问题会更多更复杂，需要一层层剥离和分析问题，来找到自己内心最想要的答案。 如何度过你的迷茫期？ … 继续阅读 →

规范、方法、一致性，真有那么重要吗？
2017-04-25 | 视觉设计

苏大牙牙牙 ：不可否认，被我们经常挂在嘴边的设计规范、方法及一致性对我们日常工作很重要。它可以提升操作一致性、提高工作效率、延续品牌定位等等… 但是，不知道你们有没有发现，之所以有了这些方法和规范，导致很多设计师习惯性处于舒适区，从而放弃独立思考。每天做着重复性的工作，复用着前辈制定下来的模版，套用着别人的方法论，抱怨着工作没有挑战。 我最近也在思考，一个遵从设计规范，按照所谓的系统设计方法，步步推导而来的解决方案，是否真的就是一个好的设计？ 规范，方法，一致性，重要的一面。 1. 规范 当我们刚从事UI设计时，自身对于用户体验设计的积淀还不够厚实的时候，遵循设计规范是最保守但也是最合理的做法，因为这种解决方案更加成熟和通用，也有了一定的用户认知。同时像公司内部的设计规范，有利于版本迭代的开发及设计效率，包括新人入职后更快上手工作，避免出错。 所以了解iOS 设计规范，安卓设计规范，或者是公司内部的设计规范等等，成为设计师必备的技能… 2. 方法 这里说的方法是指设计工作中的方法论。运用方法论，能够帮助设计师明确如何一步步的进行整个项目，更高效的推导设计，达成目标。从而说服合作的同学，而且看起来非常的有理有据。下面是我们常见到的一些导图例子： 3. 一致性 为了减少用户学习成本，不管从视觉还是交互层面我们都要遵循一致性。 包括同一个产品不同终端，要保持视觉统一性，才能加深用户对产品品牌的认知，这些也都没毛病。 下面是咸鱼，顶导航颜色采用黄色，为了各端一致性。 微云各端引导页面，采用线性插画的处理手法，来确保品牌一致。 以上说的都是规范、方法、一致性重要的一方面。 但是，我们会看到更多优秀的创新的设计正在一步步脱离这些条条框框，从而做出让人眼前一亮的设计。所以我在思考在接下来的设计中，需要做的几点来帮助自己成长： 1. 跳出规范 我们工作的前一两年，研读并遵循着平台设计规范，从而帮助我们在工作中做出不会出错的设计，同时提升工作效率和说服力。但是随着我们自身经验的累积和成长，需要对此产生警惕，如果我们一直局限在别人制定的规范里，不去思辨，很容易陷入十年如一日的工作状态中，很难做出创新的设计。 同时也可以看出很多优秀的设计作品，陆续跳出规范，不局限于规范制定的像“最大字号多少px”，“导航条多少px”，“上下间距多少px”等等… 而是设计出符合自己产品气质的界面。下面有几个例子： 下面是蜗牛装修APP的设计，可以看出： a.顶部区域并没有明确的模块区分导航区域，而只有滑动时，导航的分隔才出现。 b.字号和间距的大小，也让人浏览起来更加放松。 像VUE的处理，没有严格遵循平台设计规范所谓的列表的的高度，而是用红的线条区分模块，间距来区分列表的内容，反而更符合产品本身的气质。 下面是大家所熟知的Airbnb，它大胆的体验设计被设计师们追崇模仿，这里想说的是它对底导航和按钮大小的处理，也是跳出规范，更符合功能本身的重要层级。 2. 弱化方法 上面有讲到设计方法论如何帮助到我们的设计，使用过程当中，我们知道每一步应该怎么分解和运用。例如：市场调研、头脑风暴、梳理线上流程、研究了信息架构，并且还通过体验地图分析了行为路径等等… 但是往往最后的设计方案和前期的调研没有什么关系，而且复用到任何产品设计的前期都适用。所以，我认为这属于自我感动式的设计。感觉自己做了很多，但是真的往深入去问why why why的时候，很多设计师都会被卡住。 因此一定程度上我们要弱化已知的设计方法，少一些套路和形式主义，多一些深度解析的方式做设计。 比如，下面是facebook的总监讲述LIKE的设计方案： 他是这么阐述LIKE的设计方案的：这个设计的目的是优化LIKE的按钮，增强用户的互动意愿，以及提升LIKE的表现力。而他做的第一件事情就是理解什么叫增强互动，什么叫表现力，背后的产品目标是什么？是用户可以更多的表达。然后开始找如何让这个目标具体化。接下来寻找什么是被普通认知和广泛接受的reactions。 它通过各种途径去找用户最常用的表情是什么，最常搜索的表情是什么，最多的短评论是什么。设计师们希望可以从侧面寻找大家在表达过程中喜欢用什么reaction，然后找到他，并通过之前定义号的原则进行筛选，完成设计方案。 … 继续阅读 →

浅析地图相关产品设计（上）——地图的基本因素设计
2017-04-25 | 产品设计

现阶段，如果有人说想做出一个媲美于高德、谷歌、百度地图的地图类产品，估计不会被大多数人看好。再去研究一个地图本身没有太大的意义，但将地图的地点与生活中的需求联系起来就会得到非同凡响的影响。比如说现在依然大热的共享单车行业，就是将交通工具同地理位置进行结合，再一次让出行成为了热点。   反过来想一想，衣、食、住、行等民生行业，方方面面，都少不了对地理位置的依赖。以下是关于地图本身状态的思考脑图，然而难点不在地图（因为这一块现在市场上已经又相对比较成熟的产品），在于将地图同新的需求联系起来而产生的多种化学反应。今天先来谈谈地图本身的基本功能设计。     基本操作   在地图的操作中主要有，放大、缩小、上下左右的滑动，基于去寻找自己所要的地点信息去进行最直接的查找方式。   在地图的放大和缩小的功能上，Pinch（捏合手势）比相对于放置于地图上的“+”、“-”button来说，使用的更加频繁。有的地图APP，甚至在首页上默认不出现这样的button，比方说走简洁风格的Google Map，这样做显得画面更加干净，反而让用户沉浸在地图的查看体验中，未尝不是一种好的选择。当然，还有个便捷的放大操作就是双击需要放大的地点。     默认情况下，地图会先加载首屏的数据，当用户进行上下左右滑动到其他地方的时候，再进行加载其他区域的数据，这样能保证优先显示最重要的区域。   并且视觉中心是屏幕的中心，当用户在选择其他区域的时候不改变视觉中心点，避免频繁查看地点过程中，加载情况导致视觉一直变化给用户带去的眩晕感。放大缩小后，还可以进行考虑的就是，地点的聚合，缩小到一定程度之后，距离近的地点就变成一个具有更统筹一点的地理位置信息，一是因为点击区域变小不方便用户进行点击；二是方便对同一层级信息的归纳与管理。     关于地点   地点主要分为查找、选择、返回、新增、报错五大范畴，而与用户紧密相连的还有，人的定位以及影响范围的考虑。   查找一个地理信息，是最常用、最便捷的方式。模块主要是分为搜索和智能推荐两个部分。楼主会在以后的文章进行两部分说明。   选择地理位置的场景分为两种，一是用户一屏以内就可以发现有其他的地方可以选择，或者说看起来比较符合用户的需求；二是用户在移动或者缩小地图看到更多的区域之后有符合自己需求的地点信息，于是点击进行选择了。两者情况的共同点就是找到符合自己需求的地点，进行选择。     而其中的关键点在于随着比例尺的变化，推荐给用户的地理信息。比方说做饮食推荐的地图，就突出显示餐厅的地理信息与周围的标志性建筑，正常显示其它的信息。   返回到现在的地点也是常用的功能之一。当用户移动到其他地点的时候能够快速找回自己的出发点，这一点的功能有点像Web端的导航系统中“回到首页”的功能，当用户打开到足够多的层级或者说跳转比较强烈的时候，在网页上迷路，那么一键回到首页重新开始就是个不错的选择。但在这一点的操作上，国内的APP操作主要放在左下角，国外Google Map放在右下角，而iOS自带的Map则放在了右上角。不同的map培养了用户不同的操作习惯。还有一个小的细节就是，再次点击会进入3D模式的指南针界面。   新增、报错的使用场景都是在用户没有找到自己想要的地点下产生的需求，它需要用户额外去填充一些信息，对用户来说，付出的劳动力比较大，所以受众比较小。主要以运营或者组织方为主。     其他因素和Corner Case   切换模式，地图的产品主要有卫星图、2D平面图、3D俯视图三种模式。卫星地图是卫星拍摄的真实的地理面貌，所以卫星地图可用来检测地面的信息，你可以了解到地理位置，地形等，对抗灾或者地貌比较合适，在有些运动里面，比如说打高尔夫也需要地形图的参考，可能也会用卫星图。2D因界面的简洁直观，适用范围更加广泛。3D模式的模型图下，对于寻找建筑物和方位来说更有利。   … 继续阅读 →

每个设计师都该懂的栅格系统基础六要素
2017-04-24 | 基础知识

以前有很长一段时间，我一直搞不明白到底什么是栅格，听过很多解释之后还是云里雾里的，后来发现有很多小伙伴也都有这样的疑问，所以决定分享一下自己对栅格系统的理解。 首先我们必须要对栅格系统有一个基本的认知，我将这四个字拆分开成“栅格”和“系统”两个词来分别解释。 关于栅格 栅格是由网格演变而来的另一种说法，都是一个意思——格子，所以不要觉得栅格有多高深复杂，如果把他描述成格子，你还觉得它有多难理解吗？ 其实我们都是栅格专家，因为在我们几岁的时候，就已经接触了很多栅格，比如方格本： 再比如飞机格： 关于系统 我个人理解，系统就是规则，例如ios系统，它有它的规则：屏幕尺寸规则，代码语言规则等等，想在它的系统里做app，就需要遵循的它的规则。 栅格有了规则，也就形成了我们所说的栅格系统。 所以今天的重点来了，栅格系统（规则）到底包含哪些内容呢？ 我通过研究sketch软件的一些栅格设置选项来反推栅格系统包含的内容，得到栅格系统基础六要素，大纲如下： 栅格的最小单位 屏幕总宽度 列数 列宽 水槽 安全边距 1. 栅格的最小单位 最小单位是需要优先定好的，因为后面的所有规则都基于它来制定。 下图就是在sketch设置栅格大小的页面： 如果你用sketch却不知道上面这个界面是哪里调出来了，请出门左拐去百度一下！ 这里再简单介绍一下：pc端常用最小单位是10，移动端常用最小单位是3、4、5，不过这些也不是固定的，还是那句话，能解决工作上的实际问题就是正确的。 2. 屏幕总宽度 做界面设计会先依附于一个尺寸，由于内容的多少是不确定的，所以高度我们没有办法定死，但内容区的宽度是可以定的，sketch给我们的默认屏幕宽度是960，网页设计中最受欢迎的一个尺寸： 3. 列数 简单来说就是整个界面纵向被分为几栏，sketch默认帮我们分为12列，这是网页端的常用分法，移动端一般是6等分。 4. 列宽 当960宽度的界面被纵向12等分后，我们可以轻易的计算出每一份的宽度是80，而这80的宽度其实又包含两个内容，一个是列宽，一个是水槽，如下图： 每一条灰色区域都是我们所说的一条列宽，sketch的默认列宽是60： 5. 水槽（间隔） 灰色区域是列宽，所以红色区域自然就是水槽（间隔）了。 毕竟界面内容之间是需要间隔的，不可能都堆在一起，所以水槽的作用就是将内容更规范的区分开来。 6. 安全边距 做app界面的时候，我们都会设置一个屏幕安全边距，因为当信息帖在屏幕边上的时候，不仅会影响可读性，也会影响美观度。网页端同样也会有一个安全边距，它是如何来的呢？ … 继续阅读 →

UI设计师该如何正确地“把玩”APP？
2017-04-24 | 业界分享

苏大牙牙牙：作为APP狂热分子，定期去App Store或者其他渠道找新鲜的产品来玩儿，已经持续了很多年。但是光浮于表面的玩儿，还不够。因为只有了解产品背后的逻辑才能更全面的解读为何会那么设计。 下面分享下我通过自问自答的方式分析APP的方法，希望对你有帮助。 1. 产品层面 分析一款app，首先从产品层面入手，因为产品定位决定着后续的交互设计、视觉设计、运营策略等等… 通常可以从三个维度来分析产品定位： 1）干什么的（核心需求） 首先问自己它是干什么用的，解决了用户哪个痛点。尝试对产品有综合性和概括性的理解，然后用一句话来描述它。好的产品基本都可以用一句话讲清楚。 2）给谁用的（用户群体） 只有充分了解用户属性，才能分析一款产品有没有做出符合目标用户群体的设计。 下面是荔枝FM，用户群体以文艺小清新，90后为主。因此，它在内容层面：以清新，治愈型情感话题为主；视觉层面：更加文艺，清新，个性化；交互形式：更有趣味性。 同为音频产品的喜马拉雅，用户年龄段区间比较广。因此，内容层面：大而全，包含PGC＋UGC，目标是打造声音旗舰；交互和视觉层面：更普适性，中规中矩，不愿被风格化。   因为这样更能够被大众所接受。 所以，当你在吐槽一个产品的设计不够有逼格的时候，也要思考下，是否因为他们的用户群体不适合那么做。就好比你把“快手”的设计搞的很“”instagram”，反而会让用户有距离感，会感觉产品不是服务于他们的，而流失。 3）什么时候用的（使用场景） 一个好的产品，会更多的从用户的实际使用角度去出发，将各种场景元素综合起来，在合适的场景满足用户的需求，提供良好的体验。 使用场景可以分两个维度：1. 时间 2. 地点。 1. 时间 是否考虑用户在什么时候会使用自己的产品，白天、晚上、下班的路上，还是晚上睡觉前。针对用户时间来做设计的最普遍的例子就是夜间模式和自动调节亮度的功能，在不同的时间段（光照强度），针对产品做出相应的设计，以得到最优的用户体验； 2. 地点：用户在不同地点会产生不同的需求，同时，同样的产品，在不同的地点带给用户的体验也是不一样的，比如新闻资讯类产品，用户使用高峰期是早上上班路上，那么就要考虑用户在公交或地铁上的场景，当它一手扶把手一手拿手机，在大屏幕手机单手持握的状态下，是不是可以用更多“滑动”操作代替“点击”。 2. 交互层面 1）好找吗（交互框架） 好找，指的是交互的框架布局是否合理和流畅，能否让用户在合适的场景快速找到解决问题的办法。   比如，抖音app，用户来这主要就两件事，1.看别人的视频，2.自己录视频。 它在首屏就满足了这两个核心需求。1.首页默认“推荐”的视频自动播放，满足观看视频的用户需求；2.页面底部中间的“加号”就是拍摄的入口，满足录制视频的需求。 2）好用吗（体验&反馈） 好用，指的是解决问题是否高效，反馈是否符合用户预期。同样可以帮助用户解决问题， 肯定效率越高，用户越愿意用。 还拿抖音举例，图1，上下滑动切换视频（高效），屏幕右侧是互动相关功能（方便单手操作）。 图2，评论页面，半屏展示而非全屏跳转（更沉浸），避免打扰用户观看视频。 图3，当你在看别人有趣视频的场景下，想自己尝试录制，点击图1（标注2），音乐封面，进入图3，可看更多达人录制的同一音频的视频，同时点击底部“使用”可快速进入录制页面。 … 继续阅读 →

面试时，如何阐释设计思路？
2017-04-23 | 招聘

众所周知，作为设计师，面试的时候，面试官可能会让你拿出自己觉得比较满意的作品来讲讲设计思路，如果你没准备好，再加上一紧张，很容易导致思路混乱，最后连自己都不知道在说什么！ 怎么解决这个问题呢？ 答案其实很简单：那就是理清思路，做好充足的准备。   如果你暂时还没有思路，不妨先看看我的。 正好最近在做一款界面的重设计，目前做了两个页面及一组图标，现在就假设面试官让我说说这两个页面，我会怎么阐述呢？   我的阐述思路大纲如下： 1.我对这款产品有一定的了解 2.我是一个对流行趋势敏感的人 3.我是这样展现自己设计能力的 4.我对用户体验也有一些改进   当然我们需要看着页面来讲解，先来看一下改版前后的界面样式。 由于信息安全问题，我将底部的信息主架构进行了隐藏和改变，大家主要看整个设计思路的阐述，不要纠结细节。 原版界面：   优化后界面：   下面阐述开始： 1. 我对产品有一定的了解 在做任何设计之前，你都需要对这个产品有一定的了解，这是一个大前提。 我会告诉面试官，这是一个什么样子的产品，他的背景是什么，他的调性是什么，品牌理念是什么，最后得出我的总体视觉风格是怎样的。 比如拿这两个页面来说，这是一款企业内部员工的即时通讯工具，产品定义是“方便员工高效沟通的即时通讯工具”。 而作为白领的你，其实你是有一点小追求、小逼格的，所以简单来说，我们的品牌调性及视觉风格就是简洁高效、时尚、有逼格。   2. 我是一个对流行趋势敏感的人 这里开始就要谈视觉了，首先你要和面试官强调，你是一个紧跟流行趋势的设计师，对于IM页面的改版，你寻找了很多国内外优秀的竞品，对它们进行分享与总结，如Facebook的Messenger、国际版QQ、Snapchat等等，截图如下： 最后经过你的总结，得出对于本次设计有帮助的流行趋势有： 无线化分隔 简化“对话气泡”样式 聊天界面底部，直接将高频操作展示出来 ….. 有了这些参考做为基础，再结合自己产品的品牌调性，你就可以具体去执行了。   3. 我是这样展现自己设计能力的 这里就是最重要的部分了，除了参考国内外的流行趋势以外，你是如何展现自己独特的创意与视觉表现力呢？ … 继续阅读 →

浅谈APP首页弹框形式和价值
2017-04-21 | 交互设计

越来越多的APP被打开时，首页都会有弹框出现，然而不同APP的弹框也各不相同，形式风格内容花样繁多。本文主要介绍APP首页弹框的几种类型及其价值。 一、弹框的形式 按是否是模态弹框分类 模态，当一个模态对话框打开时，用户只能与该对话框进行交互，而其他用户界面对象收不到输入信息。多数APP首页弹框均为模态的对话框，用户必须先进行弹框内操作，对于用户体验来说，是有打扰到用户交互使用流程。 非模态，则是当用户打开非模态对话框时，依然可以操作其他窗口。 按是否可以关闭弹框分类 不可关闭，弹框没有明显的“关闭”按钮，常见于打开APP弹框进行签到、或者任务类型的领取，例如，网易蜗牛读书“免费领取1小时读书时长”弹框 可关闭，多数首页的弹框都是可以进行关闭的，常见于活动页的弹框展示，另外关闭的样式基本上是“×”或者“取消”按钮。“×”应用于有内容的弹框，位置一般在右上角、右下角或正下方；“取消”应用于系统提示框，比如是否开启消息通知，是否开启定位等。 按是否可以跳出弹框分类 不可跳出，弹框内容不可以点击跳转，这种弹框一般是纯图片或者弹框内用户即完成点击操作任务。 可跳出，点击弹框内容会跳出弹框，一般有两种情况，一种是业务类型弹框，点击会在app内进行跳转，另一种是系统提示，点击会跳转到手机设置内。 按是否自动关闭弹框分类 自动关闭，弹框在用户未操作的情况下，可实现自动关闭，一般设置3秒的倒计时，若用户在弹框内进行任何操作即关闭弹框，例如，微票儿。 手动关闭，用户如果想关闭弹框，必须进行关闭操作处理。 二、弹框的价值 系统操作引导 当APP首页加载需要获取用户手机权限，则会进行弹框显示。比如获取用户位置或者开启消息推送，目的是一方面通过开启消息推送，提高APP消息推送率、用户活跃度等，另一方面是通过弹框提醒，引导用户进行系统操作，来提高用户使用体验。 针对于系统操作引导这类的首页弹框，在满足业务需求的同时，还需要注重视觉的体验。如下图，明显可以感觉到ofo的弹框视觉效果更加友好。 任务领取或提示 任务领取，就网易蜗牛读书而言，打开APP在弹框内需要领取阅读时长，若没有领取的话，用户阅读的目的就完成不，所以为了提高用户使用体验，在首页进行弹框提醒。 任务提示，任务提示一般有三种情况，第一种情况是便捷操作提示，为了给用户操作带来便利性；第二种情况是优惠券发放，目的是通过打开APP即赠送优惠券的活动，来提高订单量；第三种是自动签到的提示，用户首次打开APP即完成签到，目的是提高用户活跃度和用户留存率。 版本更新提醒 当用户APP版本过低时，打开低版本APP就会进行新版本弹框提示。版本更新弹框内容主要是新版本上线的主要功能介绍，为了用户能准确了解新版本上线功能点。下图中，携程的版本更新弹框更值得学习大家学习，不仅显示新版本功能，还显示多少用户选择更新和建议wifi情况下更新需要的时长，一定情况下能引导用户选择更新（从众心理），另一方面提醒内容全面，用户感受较好。 获取用户反馈 打开APP即进行APP评价的弹框，目的是通过用户评价来获取用户的使用反馈。APP评价一般要考虑产品类型，比如电商产品，建议是用户下单完成后进行APP评价弹框显示，而不是首页弹框，这样不会打扰到用户正常下单流程。 活动页宣传 这类APP首页弹框目的很明确就是活动宣传，如果按照APP是否有活动页入口区分的话，ofo和网易严选是有活动页入口的，ofo在右上角活动列表入口，而网易严选则是在首页轮播图位置。摩拜则属于APP内没有活动页入口，所以进行弹框显示。既然ofo和网易严选有活动页入口，为什么还要进行弹框显示呢？可能原因ofo的右上角活动列表入口不明显，具体活动页入口有点深；而网易严选主要是1周年庆活动相对比较重要，所以既在首页弹框显示，又在首页轮播图位置显示，凸显活动的重要性。 当首页弹框是以广告宣传的形式，一方面要考虑APP是否还存在启动页，如果存在的话，用户至少操作2步才能到达首页，增加用户操作成本；另一方面要考虑如果存在启动页且为广告宣传，那么首页弹框是否还显示广告弹框，两次广告的展示会给用户造成一定的排斥。 三、关于弹框的细节 弹框出现频率 首页弹框出现频率应该是怎样的？按照自然时间计算（一月弹一次）还是按照间隔时间计算（弹出后间隔一个月再次弹出）  弹框出现位置 弹框按理是在首页进行弹出展示，要考虑当用户网络较差情况下打开APP，弹框未能加载完成进行弹出，那么在其他页面加载完成后是否还需要进行展示？ 弹框停留时间 当弹框是可以自动关闭的，那么自动关闭的时间应该设置在几秒之内？另外是否需要增加手动关闭按钮？ 弹框关闭按钮位置 若弹框存在关闭按钮时，那么关闭按钮的位置处于什么地方，更便于用户进行操作？ 弹框上线时间段 首页弹框在满足业务逻辑的情况下，要一直维持在线上吗？特别是特定时间内的广告宣传 四、总结 … 继续阅读 →

怎样设计体验友好的APP登录注册界面？
2017-04-20 | 交互设计

不要小看一个登录界面，它内里包含很多细微的东西，除去外观视觉，更多要注意的是交互的操作体验，比如一些动画、一些文案提示等细节都要注意，如果你是UI设计师，建议看看这次经验文章，附上了大量案例，也许能助你未来更好的去设计一个用户体验友好的APP登录界面。 下面通过几个关于登录界面的UX策略指南，让你更好的应用和实践。 给文本输入框增加提示 如果用户使用你的服务必须登录，那么信息字段是你必须要做的主要功能（即输入框中的提示语，如：输入手机号码，输入验证码。） 使这些字段清楚可视，并且不要强迫用户到处寻找，或花更多的步骤进到App. 一旦他们进到App, 登录界面是他们所应当见到的第一个事情。 奖励提示：相比于使用常见的“登录”“登陆”的按钮，可以更富有创造性，并要包含可直接输入区域。确保记住用户的数据，这样他们就不需要每次输入信息。 “注册”和“登陆”不应该放在一起。 更多地时候，我们看到注册和登陆按钮被放置的靠近彼此，但是这会对用户产生反作用。 这两个动作都包含了相同的动词，并且看起来也很相似，所以他们会混淆用户的选择。在有限的时间内进入问题，他们可能会感到沮丧并且离开。 基本上，任何界面上不应该有使用户“暂停”和“思考”的元素。 如果你想让他们的体验完美无瑕，分开这注册和登陆两个区域，并且使差别清晰可见。另外，你可以使用不同的动词或者简单解释不同的字段是什么。 在登录和注册部分，增加不同的输入字段。 除了动词“Sign”是事实之外，另一个另用户感到困惑的是，登录和注册部分通常有相同数量的输入框（用户名，密码，和邮箱）。 为了完全地区分，最小化新用户尝试直接登录的机会。用不同的输入字段。 让密码可被看到 当大多数用户的密码由于安保原因被打了马赛克，用户频繁遇见的另一个问题是打错他们的密码。 这甚至会发生在很有经验的打字员身上，特别是当他们在移动设备上登录的时候。 防止这种情况发生的做法是：在密码字符旁边包含一个“显示密码”的单选框或图标。 让他们知道什么是错误的 如果应用监测到一个错误的密码组合，和用户名，但是没有明确的报告给用户问题是什么，用户可能会多次尝试后，很生气的退出应用。 这是为什么你应该考虑通用的回复（例如“你的密码或邮箱不符合”），并且给他们立马回复怎么解决这个问题。 问下邮箱地址或电话号码，而不是唯一的用户名 为什么人们登录时人们很少记住“用户名”？如果使用用户名登录，你会面对很多可避免的困难：用户名必须是一个唯一的，这意味着人们会重复尝试输入一个系统里目前还没有的用户名，或者最终使用其真实姓名。 过了一会儿，用户想出了一个唯一的登录名，但是只过了一小会儿就忘记了，因为这个用户名对他没有任何的意义。 另一个事情可以促进登录，是提供给用户几个登录选项，并且给他们机会来选择和尝试用户名而不会沮丧。在这过程中强迫的一部分是允许他们使用邮箱地址和密码来注册。 需要一个“忘记你的密码”的流程 忘记密码发生在所有人身上，这也是为什么，你急迫的给到用户一个机会来恢复密码，那么就直接在登录界面这么做吧。 所要做的就是，在输入框下增加一个“忘记你的密码”的链接，并让系统能给用户的邮箱或电话号码发送验证码。 不要锁了用户的账号而不告知他们 为了避免强迫进入和暴力攻击，许多网页和应用在一系列的错误尝试之后关闭账户。 安全第一，但是你至少要尝试告诉用户，在多少次尝试后，在关闭账户前，他们必须离开。你也可以分享更多的细节，例如，在试错后的十分钟才可以再次尝试的事实。 登录样式灵感 如果在过去，都是在用相同的无风格和定制化的登录页。现如今，给你的应用，创造一个独特的登录页设计是非常重要的事情，尤其是你想要围绕你的应用和服务来创造品牌。 设计师和开发人员也有承认意识到登录表单的重要性。这是事实，特别对于移动环境下，用户界面相比于“桌面”网站，扮演了更重要的角色。 当为一个应用和移动站设计这个元素的时候，设计师花很多的精力，使它既好用又美观。 在这篇文章里，你会看到很多移动端用户界面设计的案例灵感，关于一个移动端登陆页面应被设计成什么样，给你一些线索。 Roostio Login … 继续阅读 →

你可能忽略掉的Sketch使用技巧
2017-04-20 | Sketch

Sketch毕竟没有什么学习曲线，颇易上手，相应的也时常导致新手在一开始就忽略掉一些重要的、高频的使用小技巧，而将一些稍许费力耗时的方式一路沿用下去。这篇内容所针对的便是这样的情况。几乎没有进阶的要点，只针对初学的同学培养正确习惯，还望各位老司机们见谅。下面进入正文。 关于对象、图层、画板的使用技巧 1.通过快捷键调整图形的形状 选中图形，按住 Command 键，然后通过上、下、左、右方向键即可按1像素为单位调整图形形状。同时按住 Command + Shift + 方向键，则可以按10像素为单位进行调整。 2.复制元素 选中某元素，按 Command + D 即可进行复制；复制出的新元素默认与原有元素的位置相同，且覆盖于原有元素之上。 此外，按住 Option 健，同时拖拽目标元素，同样可实现复制；保持复制出的新元素仍处于选中态，并连续使用 Command + D 快捷键，即可按照之前手动拖拽的距离为间隔单位实现多重复制。 3.智能选择 按住 Option 键，面向多个元素拉选择框，最终只有完全处于选择框内部的元素会被选中，而其他元素会被忽略。 4.分组与解组 选中多个元素，按 Command + G 将其合并为一组。选中某个组，按 Command + Shift + G 则可实现解组。 … 继续阅读 →

使用Photoshop绘制低多边形星空效果熊猫头像
2017-04-18 | Photoshop, 图像处理

低多边形风格介于抽象与象形之间，是一种表现力很强的插画类型，用于LOGO的设计也未尝不可。它的绘制过程也非常简单，尤其在AI中，利用三角色块一个个拼缀而成即可，设计师要做的是对色彩的选择和控制，以便能更好的表现对象的阴影和高光的关系。 虽说简单，其实内中的玄机自然很难参破，比如用哪一种色彩更恰当，似乎并不是吸取相片本身的色彩就可以解决的问题。因为吸色来源只是一个小点，而事实上一片色块的面积要大得多，纯色拼缀的做法到最后反而让整体效果看起来有点“呆”，色彩过渡不自然。 于是，有了我们今天这个“改良版”的低多边形教程，改用PS来绘制低多边形，好处就是PS的色彩处理能力显然优于AI。我自己将PS和AI做了这样的区分：PS是对“色”的处理，AI是对“形”的处理。当我们要在“色”的领域着力时就采用PS，而当我们主要处理对象是“形”，那么AI就是更好的选择。当然这个说法并不绝对，只是我个人的经验之谈。 言归正传，学完这个教程我们能掌握： 1、运用PS绘制低多边形的技巧，熟悉线段工具、多边形套索工具等低多边形中常用的工具 2、利用PS中的平均模糊法来对低多边形的色块进行填色 3、体会抽象的造型能力 绘制线条轮廓 STEP 01 选择一张可爱的熊猫照片，所选用的熊猫要符合正脸对着镜头的条件。因为我们这里计划绘制的是正脸的造型。利用钢笔工具“抠出”熊猫的左半脸，这时要注意钢笔工具保持直线条绘制。熊猫的外表虽然毛茸茸，但抠图并不需要精确，只要能感受到整个熊猫的轮廓即可。抠图成功后，增加一个背景，这个背景色只要能与熊猫进行区分，并不参与最终效果。 STEP 02 利用直线工具绘制低多边形，低多边形的每个角都要对齐，因此在绘制的时候要小心。且这时要细心观察原图中的色彩的细微差别，比如颜色明显不同的地方就需要绘制成为两片不同的多边形。这里绘制的形状也并不是非三角形不可，有时为了照顾整体的视觉，也可以出现一些四边形也是允许的。 在选中【直线工具】开始绘制第一笔后接下再绘制一笔前，记得将菜单栏下方的属性条中路径操作中的“新建图层”修改为“合并形状”。这样你就能保证所绘制直线都为一个形状，否则每条线条都就将独立成为一个形状图层，在图层处理时候将非常繁琐。 先绘制熊猫的外轮廓。直线工具中描边颜色设置为白色也好，或者其他颜色都没有关系。如果怕白色容易看不清，可以在熊猫的图层上方增加一个纯色的透明图层，以便突出白色线条，用完删除即可。 只要设置了合并形状，这时你所绘制的直线将是一个形状，在图层面板中也为一个图层。 STEP 03 接下继续在轮廓线上增加线条以完成对整个熊猫头像的“拼缀”，这一过程有点像我们玩的拼图游戏，注意原图色彩的提示作用。如果你想要表现更多细节，你的每块形状可以绘制得更小，比如熊猫的眼睛或者鼻唇的部分。 平均模糊填色 PS中的填色方式有很多，这里我们将用到一种非常特殊的填色方式，叫做平均模糊填色。由于我们开篇就聊过，以前我们曾用AI吸取图片色彩的方式进行填色，最终效果并不很理想，这里我们的改良方案就是采用将每一片色块进行平均模糊处理，这样经过模糊后，原有的细节消失为一片均化的纯色，这样就可以依循着低多边形的样式进行拼缀。 STEP 04 选中熊猫图层的同时，采用多边形套索工具绘制每一块低多边形，根据上一步所绘制的线条，绘制第一片形状。 STEP 05 对蚂蚁线内选中的区域填色，这时进入【滤镜>模糊>平均】，这块区域就完成了填色。这时再运用快捷键（Ctrl+D）取消选区。 STEP 06 重复上两步，将所有的色块都进行“平均模糊填色”。这一过程很像打磨一块钻石的感觉，当你拿着粗粝的毛钻进行打磨，就是要将其磨成不同的光滑的面，最终成就一颗闪闪发光的钻石。经过这类填色后，其色彩的过渡就非常自然。 STEP 07 暂时关闭线条图层，你会发现这些色块之间有些不完美的拼缀细节，弥补的办法依然是采用填色的步骤，重新将这些留在缝隙中没有进行“平均模糊”处理的细节再次选中进行模糊填色。 STEP 08 将熊猫的左半脸进行复制，复制后的图层进行水平翻转后，拼合在一起就是一个正面的全脸肖像了。 自由式调色 我们曾经说，PS是一个处理“色”的最出色的工具，因此，如果这时对填色不甚满意，就可以稍微进行调色处理。 STEP … 继续阅读 →

像素的魔力真的无与伦比
2017-04-17 | Photoshop

像素的魔力无与伦比！ 当风吹过，你的世界变得不一样了！ 风滤镜打造的神奇像素世界，你值得拥有！   大家记得以前我们推送过一个Jessica Andersdotter的作品吗？ 嗯，上面这两个就是Jessica Andersdotter的作品。 当时，有很多人在问，一直只是说用风，没有详细的解答，昨天找东西，突然翻到了Jessica Andersdotter的博客，也太久没有更新什么教程了，于是抽了点时间，大致的折腾了一把，跟着我们来试试吧。 我随便找了一个风光的图片，然后复制了一层，以防万一。 执行“滤镜>风格化>风”。 至于是用“风”、“大风”还是“飓风”，就看你自己把握了，方向也是。我这里的示例是用的“风”，方向从右。 大家可以看到，执行了风滤镜以后，大致是这样。 相信大家也看出来了，好像并没有什么大变化，那没关系，Ctrl+F，疯狂的再次执行风滤镜。至于执行多少次，大家自己把握，看了舒服就好，我大概执行了十几次，得到现在的效果。 颜色比较平淡，我加了一个曲线，增强对比度，如果不增加对比，层次感明显很弱，视觉冲击明显不够。 想更换颜色的话，大家可以随意，变颜色的方法太多了。 选取合适的部分，进行裁剪。 然后根据我们的意愿，甚至我们可以进行旋转，改变颜色。 是不是非常简单，下面，跟着老司机继续开车，我找了一张Martina Stipan的合成作品。 依旧是疯狂的执行风滤镜。 我想要做个极坐标，所以框选了一个正方形。 复制，并粘贴到一个新建文档中。 执行一个极坐标滤镜。 复制一层，并旋转一定角度。 添加蒙版，让两个图层完美过渡。 在百分百视图下，它是这样的。 那么，你说，本文是不是该完了？NO！跟着我们继续开车，如果在风后面，我们再添加了别的效果，会怎么样呢？跟着我来试验一下，我找了一张星空图。 跟刚才的方法一样，执行了风滤镜，曲线增强对比度后，我们得到这样的效果。 OK，到了我们乱入的时候了，我盖印了图层，并执行了一个凸出。 在百分百视图下，我们的效果是这样的，你觉得怎么样？   当然我们也可以让它变个颜色来看看。 那么，如果我们不要那个凸出滤镜，换成别的会怎么样呢？我执行了一个拼缀图滤镜，变这样了。 再增强下图像的对比度，是不是科技感特强？ 嗯，接着来，我找了一个有点酷酷的图片。 执行完风，它成了这样。 接下来，我执行了一个径向模糊滤镜。 看看，是不是挺有科幻感的。 … 继续阅读 →

不想当“将军”的设计师不是好设计师
2017-04-17 | 发展规划, 职场励志

之前写过一篇关于楼主Boss的文章《设计师跟Boss讨论产品是一种怎样的体验》，今天想来说说楼主那85后的，让楼主敬佩不已的上司。也来反思一下，如果想当管理者，到底应该拥有哪些品质？   工作能力   记得在高三填写志愿的时候，年少不懂事，第一志愿准备填写“企业管理”。以为，企业管理就是坐在办公室，下达命令，不用自己干活的人。而我当经理的父亲阻止了我，他说了一个道理，至今犹记。他说，首先你得懂干活，别人才能信你，如果别人说个事你不懂，你让别人怎么服你？也是这句话让我打断了当时的念头。   工作后回想这个观念，有对也有不对。对在，如果只是相当中层管理者，这样的观念是正确的。如果想当Boss，要学的应该是资源整合能力，以及将事情做精的极致思维，如果每样都学得最好，精力是完全不够用的。当然，这个是题外话。     而作为一个设计主管，我的上司J在专业方面有如下能力：   1.出色的设计能力。主导了公司所有产品（包括web、APP、平面宣传）的设计风格和规范的制定，定制了与开发合作的最快捷的方法，而且这些都是随着市场不停更新的。嗯，也许大家觉得这没什么。可楼主如果告诉你，楼主的公司是个跨国公司，所有产品都需要考虑跨国所带来的不同语言和文化，更难的是不止有一个产品线，是有多个，现在一直在扩展中的产品线。换个角度来想，如果是自己，能hold住全场吗？   2.会写代码。 对，J会写代码。楼主当初来面试的时候，J直接跟楼主谈起了GitHub，楼主一愣，能经常上GitHub的设计师可不是一般的设计师。后来又发现，J不仅会写HTML，DIV+CSS，貌似Framer也可以直接上手。你懂的~   3.英语好，知识面广。脱口而出的英文口头表达能力，和毫无障碍的阅读能力，让J在各大外网上快速地收集信息，并对团队所出现的问题及时反馈，找到合适的解决方案并分享给大家。有他在，像带着一本会翻译的百科全书。     工作态度 1.工作时间 在写Boss的时候，早上经常会看到Boss在国内办公室时灯会亮着，同时看到的还有J，偶尔还有其他高管在。起得最早最勤奋的其实是老板们。而还有一点，就是，J是公司出了名的工作狂。早上来的最早，晚上走得最晚，周末经常看到加班（别问楼主怎么知道的，楼主周末也偶尔来公司附近健身）。他的工作成果跟他的付出脱不了关系。   2.工作的完成度 J的工作总会让别人有意外之喜，而且能从他的作品中看出他付出了很多心血。比如说做一个demo的动效，一般人拿到手是想到的是表达页面之间的跳转关系，而J对自己的要求会是，流畅而精细的细节，体现出一个真正设计师所带来的设计感。100分的题目，他考到100分是因为试卷只有100分。   情商 1.人尽其才。 说到职场的情商，分为很多方面，可作为一个领导，将合适的人放到合适的位置，是比较基本却又十分重要的能力。看到每个成员的专业技能和人际关系的长处，再将他们放到合适的地方，要用心了解每个人的性格，并且了解公司的具体运转情况，才能在恰好的时间恰好的位置，让每个人运转起来高效而又快乐。当然，冰冻三尺非一日之寒，这样的能力也不是一日能练成的，其间，楼主也伴随着J一路成长过来的。     2.自己永远冲在最前面。 不管是大到什么项目，小到哪个软件的学习，J永远先扛下来，自己先试水，给人靠谱有安全感的印象。自己摸索完成后，不会插手你的成长，放手让你自己干，给予你自由成长的空间。   3.情绪稳定。 基本上没看到过他在谁的面前发过火，只有看到过情绪不太好的时候不说话，沉默。但这种情况只发生在下属工作没完成，以及完成没到位的情况，对于工作质量上的严格。在工作状态时，从来没有看到情绪上的大起大落，给人的感觉总是处于思考着的状态，沉着冷静。当然，严肃起来就意味着，情况严重了。   4.注重团队协作与建设。 对团队整体来说，每隔一段时间进行聚餐，集体看电影进行放松。也许大家觉得这样没什么，可是在互联网领域的创业公司，大家的主要精力都用在每分每秒的打拼上了，并不是说这个是没多少钱的福利，而是在繁忙的工作状态中抽出时间进行精神上的建设，让人感到比较温暖。 更重要的是，关心团队每个成员。不仅是工作能力上的提升，而且是生活上的关心。工作能力上，毫无保留地教你很多东西，希望你能做的比他更好。生活上，看到你不舒服，也会递给你一个你爱吃的水果。细心而又周到。 … 继续阅读 →