注册账号 | 忘记密码
表哥
在 B 端产品研发过程中，有真实用户可以与我们交互，是非常重要的。虽说有些 B 端产品我们自己也是用户之一，或者因为我们对此领域颇为了解，我们也可以猜测产品是如何运作的，但只有真实的用户对产品的帮助才会更大。新人如何做好用户研究？我总结了4个关键知识点！作为一名 B 端用户体验设计师，你是否经历如下困境：客户与公司的商务售前进行沟通，客户的痛点和建议会传达给产品经理，产品需求明确后，做出原型图给到设计师。阅读文章 > 不幸的是，对于 B 端产品来说，要获取用户非常难。当一个系统有多角色时，要获取用户就更难上加难了。因此，很多时候，产品团队只能通过碎片化的竞品参考与自我经验拓展的方式，来捕获用户需求，进而转化为产品需求，来完成系统设计与研发。还有一种情况，不知道你身上有没有发生过，在我身上发生过，模拟案例如下：一上班就被钉钉，一聊说是客户管理层提过来的需求，要快速解决。那是个啥问题呢？据说管理层中有一名老板，年龄比较大了，看不清目前系统上的字体，希望系统字体能变大一些。那我就问同事了：为什么会看不清字体？会不会是电脑设置问题，还是其他。希望字体变大？是希望字体多大？页面这么多，哪些页面是领导用的，是否可以对这些页面字体先变大？“字体变大”背后隐藏了一堆需要挖掘的问题，现在没办法开做。……同事说：“这我就不知道了，我也是一层层反馈过来的，现在需要你们改字体大小，给出解决方案。”我：“……？？”看到这里，我想你也知道，这种情况是很难接触到用户的，特别是管理层用户。那要怎么办呢？需求不清晰，就没法分解为任务去执行，这活就干不下去了。于是我通过设定「用户代理」，来完成对问题的挖掘。那什么是「用户代理」呢？原来我也没给这种方式取这么个名字，而且感觉这种方式其实是不推崇的。直到我看到了《敏捷软件开发》一书中有描述到「用户代理」一词，我才发现，其实我们很多时刻，已经用到了「用户代理」的方式在获取用户需求。在《敏捷软件开发》中提到：“我们期望和尽可能多的用户沟通，这些用户代表了产品的不同视角，当我们无法直接和他们接触时，我们需要求助于用户代理，他们本身可能不是用户，但是在项目里他们能够代表用户。”你看了这些话，是不是觉得打开了自己做产品时找不到用户的困境，感觉终于有方法可以离用户真实需求更进一步了。是的，我看到此番话时，也是这么感觉得，简直是救命稻草呀。接着书中又说：“选择合适的用户代理对项目的成功至关重要。必须考虑用户代理的背景和可能的动机。具有营销背景的用户代理和领域专家的用户代理处理用户需求的方式会存在差异，而了解这些差异很重要。”看来，用户代理并不是随意选择的，尽量要合适中再筛选合适的。例如，你要构建一个项目管理系统，你找使用项目管理系统用户的主管比找购买项目管理系统的 IT 主管就来的合适。但要是你为基金公司研发一款投资交易类系统，你找 IT 主管作为对接人帮你去获取用户需求，就比你问一个 C 端用户是怎么做投资交易的，就会来的合适些。可见，虽然「用户代理」可以帮助我们解决无法直接接触用户的难题，但如何选取合适的「用户代理」，也是需要方法的。书中讲了一些用户代理，但不全部适用于 B 端，我对照此总结了一些合适 B 端的用户代理类型（当然，不同的产品又会生产差异）。用户的主管定义：使用软件的用户的直接主管。优点：虽然主管不是软件的高频使用用户（且使用模式与用户也不相同），或者压根不使用软件，但他们是距离用户最近的人，让其成为用户代理，可以帮助我们高效收集用户需求。并且通过日常观察，也可以对用户使用软件的情况进行总结与分析。缺点：但因为主管日常比较忙，或者是由于在使用软件上，主管目标与实际用户目标不相同，可他又认为自己是了解用户需求的，甚至比用户本身了解的更清新，因此会导致对实际用户需求表述不准确，经常出现在用户原始需求基础上进行增删改的情况，这就需要我们去甄别。研发工程师定义：研发目标软件的工程师。优点：由于研发工程师在目标软件上有了较为深的研发经验，因此他们对业务的了解是非常清晰的，基于此，他们要是有机会和用户沟通，那么不太存在沟通障碍，至少知晓对方在说什么。缺点：但由于研发工程师的岗位属性关系，导致他们更关注技术层面的问题，不一定能对用户所述进行很好的转译，这就需要我们对自己选定的研发工程师先进行沟通，让他们知道我们要什么，如何去获取。售前与销售定义：售前和销售实际上是不太相同的，但由于他们跑在一线都能接触到客户方，且在一些公司销售与售前不分家，因此我就放一起了。优点：他们通常有机会接触到客户，那么为了将产品做好，也可以进一步试试是否可以接触到用户。通常他们对产品较为了解，至少对这个行业这类型产品是了如指掌的，那么就可以与用户进行深入沟通。缺点：售前与销售都有自己的 KPI 考核指标，因此就怕他们会加入对他们友好的销售性功能，从而偏离了初心。相仿用户定义：相仿用户是指同样使用该类型产品的用户，例如使用云效与 teambition 的用户是类似的，使用 ONES 和 jira 的用户是类似的。若 X 软件是我们生产的，但我们无法接触到自己的用户，可是能接触到 Y 软件用户（假设 X 与 Y 是同赛道软件），那么我们可以找 Y 用户进行调研。优点：撇去用户的喜好、经验、经历等要素，相对来说，与其没有用户，不如有相仿用户。我们可以对相仿用户进行调研，从而获取一些有效信息（至少不是自己臆想出来的信息）。缺点：相仿用户的喜好、经验、经历若我们完全无视，也不可能，毕竟一个人的曾经会影响他今后的思考与判断。那么，若他是 Y 用户，他给出的需求其实是来自对 Y 的体验的，因此，我们需要在这些需求中，甄别出对自身产品有效的需求。业务分析师定义：钻研软件业务，对软件业务极其精通的人。优点：业务分析师通常比产品经理还懂业务，因此，若他们可以成为用户代理，为用户发声，来表达用户在使用该软件时的所需，也是很不错的。我之前和其他部门一位业务分析师交流过（现在是资深业务专家了），由于其曾经一直和用户打交道，因此相对比较了解用户，他们的软件需求有部分都是直接来自于他。缺点：懂业务即是优点也是缺点，由于其认为团队中没有比他更懂业务和用户了，导致在某些需求决策上，他会非常相信自己的判断，认为无需和用户沟通，但这是大忌。领域专家定义：领域专家是指在某软件领域很有发言权的人，对此软件领域他很了解。他可以是高级用户、也可以是资深领域研发专家、业务专家、设计专家等。优点：专家长期在该领域内研究和工作，对软件的一些需求会比较懂，能提出自己的意见。缺点：但因为他们实在太资深了，他们给出的用户需求通常会非常专业，但这往往是用户不需要的。最后的话除了以上用户代理类型，你也可以进行补充。我们可以发现，不同的用户代理类型，各有优劣。虽然我们可以使用用户代理来帮助我们走出无用户的困境。但拥有真实的用户一定比用户代理来的更合适。用户代理是退而求其次的方式。同时，我们在选取用户代理时，需要和用户代理说清楚他们的职责，让他们知道自己在为哪类用户代言，促使他们做正确的事情。如果我们选用了用户代理的模式，那么我们需要尽可能快的发布产品，让真正的用户用起来。如此，我们便可逐渐打开与真实用户沟通的通道。好啦，知果今天的分享就到这里，我们下期见~欢迎关注作者微信公众号：「知果日记」本篇来源：优设网原文地址：https://www.uisdc.com/user-research-3
飞翔的企鹅
每年年底，QQ 都会迎来一年一度的年终盘点活动，帮助用户实现 QQ 社交记忆回溯。通过生成用户专属的社交形象，拉近用户和 QQ 之间的距离，体现品牌温度。拓展阅读大厂实战！2021 QQ 社交形象年度盘点设计复盘又到年底了，想必大家开始在朋友圈和微博中陆续看到各种各样的年度盘点报告。阅读文章 > 设计目标年度盘点活动不同于主题运营活动，是对 QQ 用户年度高光时刻的总结。在活动设计目标的设立上，我们希望塑造 QQ 温暖品牌形象的同时清晰展示 QQ 用户年度的社交记忆点，通过创造用户记忆点，激发用户分享。创意构思我们从 QQ 用户熟知的社交行为、场景出发，进行视觉元素延展。将用户的浏览过程喻作 QQ 社交记忆的探索历程。通过 QQ 元素等场景映射，唤醒用户的社交记忆，最终形成用户专属的社交形象。风格设定基于活动的目标我们衍生出以下设计关键词（见下图），简洁有品质是本次活动视觉风格的核心传达目标。1. 色彩为凸显回忆感知以及透传 QQ 品牌。在色彩的选择上我们使柔和的蓝黄渐变色系，背景色系就像天空会跟随活动节奏、故事内容而动态变化，利用色彩变化传达时光回溯的氛围感知。2. 质感考虑到整体的风格设定偏洁净明快的感受，我们多以玻璃、半透明 3s，哑光三类材质为主。选择透光性强与色彩融合度高的材质搭配使用，让画面更具轻盈、简约的品质感。视觉表现1. 信息传达年终盘点活动与主题运营活动不同，繁冗的氛围传达并不等同清晰的信息传达，在活动的设计上，我们希望一页只讲述一件事，弱化装饰，突出主体内容。2. 品牌透传场景内我们融合了 QQ 品牌调性的元素，如聊天 aio、消息气泡，QQ 空间等，加强用户代入感。3. 动效编排我们根据页面场景的展示内容类型，进行动画节奏上的编排。保持信息传递的效率，并在需要氛围强化的环节增强动画吸引力。营造灵动的内容浏览体验，提升动画张力。在动画的运动样式上，我们提炼出映射 QQ 社交场景的动态设计语言。通过模拟聊天气泡出现、新消息通知弹出、空间访客踩一踩等社交场景中的动画形式，透传 QQ 品牌调性，增强动画表现力。激发分享欲从设计层面，如何激发用户的分享欲？在本次活动分享中用户的专属社交形象扮演着重要的角色，接下来我们将介绍影响社交形象品质的三大设计因素。1. 形象设定我们选用 QQ 作为社交形象主体，根据用户不同的社交属性去赋予其色彩、材质的变化。在初步的生成方案上，我们尝试挖掘更多的组合可能性，从 QQ 围巾、嘴巴等部件进行材质变化。但三维的部件设计、审核成本高且组合起来多种情况形象差异性小。为此我们降本提效精简了生成逻辑，在鹅身上视觉强感知的场域进行差异化设计。2. 构成规则我们将社交关键词分为三大阶级并衍生出社交形象构成的梯度规则。从社交小白到社交天花板，不同强弱的社交属性决定着鹅身的变化。例如低阶的材质表现使用的是石膏、木纹，形容人们在社交上木讷、寡言少语，而高阶的鹅身质感、色彩，图案表现更加丰富。3. 隐藏款埋入在 QQ 形象设计上，我们根据不同的社交关键词进行了不一样的设计，包括样式、材质、颜色等，这些不一样的设计在隐藏款上尤为突出。例如针对社交关键词“一呼百应 KOL“，此社交关键词形容的是人气高，是众人的焦点，为了体现这种超高人气，QQ 形象通体采用透明材质，并在内部放置了很多不同的体现开心的黄脸表情。在隐藏款“自带光环的主角”的设计上，我们希望传递出受人瞩目的光感，结合我们的生活，光线经过玻璃后，通过不断折射反射，能很好的传递出多彩和绚丽感觉，所以这款 QQ 形象通体采用了玻璃材质，强化和传递出受人瞩目的主角光环。隐藏款之外，其他更多 QQ 形象我们也会根据社交关键词进行不一样的设计。形象展示金属鹅 Metal Q玻璃鹅 Glass Q树脂鹅 Resin Q形象延展应用除此之外，我们在春节贺卡活动中还复用了部分鹅身形象，并为虎年设计了专属的虎纹迷彩鹅。期待后续在运营活动中尝试更多的个性化 QQ 形象，刷新 IP，升华品牌。结语在当今社会强调本我的趋势下，活动千人千面的属性越发重要。将经典的 QQ 形象与用户社交特征相结合，传递具备独特性、品质感的品牌视觉表现，更能拉近 QQ 与用户的距离。我们相信在未来的年终盘点活动中，QQ 会带给大家更多的惊喜，敬请期待吧！欢迎关注作者微信公众号：「腾讯ISUX」本篇来源：优设网原文地址：https://www.uisdc.com/qq-social-image-design
在路上
我将分为 C4D 和插画两部分来介绍一下，在 Behance 和 Dribbble 上，小哈关注的宝藏设计师：往期回顾这10个顶尖大神的作品，是我每日学习的源泉！想学设计可以关注哪些设计师？阅读文章 > 这10个顶尖大神的作品，是我每日学习的源泉我将分为 C4D 和插画两部分来介绍一下，在 Behance 和 Dribbble 上，小哈关注的宝藏设计师。阅读文章 > C4D：1. Romain Braccini设计师 Romain 的这组作品以 36 个字母为灵感，构建了一个个奇幻有趣的画面。在 3D 作品里融合了插画的纹理，色彩梦幻，让观众耳目一新。更多作品：https://www.behance.net/blansable2. Omar. AqilOmar 是一位来自巴基斯坦的 3D 设计师。在他的作品里，让小哈印象最深刻的是用现代 3D 技术重构毕加索的经典作品，他的三维作品形式抽象、简洁，很有想象力。除了造型很富有创造力，材质的熟练运用也为作品增色不少。更多作品：https://dribbble.com/omaraqildesignhttps://www.behance.net/omaraqil3. Zhang 张小哈这是我的个人作品，我是一枚独立插画师、设计师，我喜欢在作品中探索二维与三维之间的关系，喜欢有创造力、想象力、有情感的表达，下面是我的部分作品，希望你会喜欢。更多作品：https://dribbble.com/zhangxiaohahttps://www.behance.net/zhangxiaoha想跟我学3D 插画的，可以关注我联合优设开的这门课程 https://pro.uisdc.com/detail/p_62b01daae4b07bd2d7b01ac4/6课程详情看这篇文章：[link https://www.uisdc.com/uisdc-course-c4d]4. Siddhant JaokarSiddhant 是一位来自印度的设计师，这组作品在简洁的生活物品上增加了插画风格的纹理，再赋予柔和的色彩，形成了独一无二的艺术作品。更多作品：https://dribbble.com/hyperthalamuscorphttps://www.behance.net/hyperthalamus115. Ângelo FernandesÂngelo 擅长做低多边形的三维建筑场景，他的作品光影柔和，细节丰富，充满了生活气息，让小哈不由自主想停留在他所构建的场景里。更多作品：https://www.behance.net/angelo_fernandes插画：1. Clément BarbéClément 是一位来自法国的插画师，他的场景插画十分成熟，造型简洁有力，躁点细腻，色彩舒适，纹理生动。更多作品：https://www.behance.net/clementbarbe2. GaspartGaspart 的人物作品生动有趣，活力满满。这组玻璃房里的人物，造型简洁，层次丰富，瓶子图形的限制和夸张的人物造型形成了很强的张力。更多作品：https://dribbble.com/Gasparthttps://www.behance.net/gaspart3. Lucas WakamatsuLucas 是一位来自巴西的自由设计师，他擅长绘制人物主题的插画。他的作品用色给小哈留下了深刻的印象，色彩明亮鲜活，让观众感受到了巴西文化的热情与活力。更多作品：https://dribbble.com/lucaswakamatsuhttps://www.behance.net/lucaswakamatsu4. Muhammed Sajid来自印度的 Muhammed 同时擅长绘制人物及场景插画，他的作品非常成熟，细节丰富，构图饱满，完成度很高，特别是场景插画里植物的绘制非常出彩。更多作品：https://dribbble.com/muhammedsajidhttps://www.behance.net/muhammedsajid5. FEBIN RAJRAJ 喜欢绘制自然场景，他擅长用色彩表现光影，作品造型虽然简洁，但意境深远。他的风格小哈非常喜欢，同时也具备了商业性，受到了许多客户的青睐。更多作品：https://dribbble.com/febinrajhttps://www.behance.net/febinraj本篇来源：优设网原文地址：https://www.uisdc.com/10-c4d-illustration-designer
张大湿
编辑导语：怎么样让设计出来的产品更加美观，更加符合大众审美呢？设计师有一些理论上的知识可以引用，本文作者分享了关于交互设计的七大定律法则，我们一起来了解一下。拓展阅读：值得反复学习的「交互设计5大定律」，一篇带你全部学完！缘起前段时间应邀给部门内新入职的校招设计师讲一堂设计法则的基础课，作为交互设计师，交互设计定律肯定是绕不开的一个知识点，但对于网上广为流传的《交互设计 7 大定律》，我其实一直都有些质疑，因为没搞清楚作者组织的思路，也查不到任何文档的介绍，我觉得如果就这样照本宣科的去讲交阅读文章 > 有时在一些设计师讨论分享会，或者和一些非设计师同事朋友交流，会碰到下述一些疑问……阿里巴巴 UCAN2019 大会主题《设计，让商业美而简单》。我个人很喜欢这个口号，这是我们 UX 设计师朋友们每天都在做的事情，也是我们价值的体现。那怎么样让我们的设计，能让商业美而简单，有没有什么方法、理论、技巧、原则的东西指导我们进行设计呢？下面七条定律和原则也许可以帮助你更好地做好产品设计：米勒定律拓展阅读：用超多案例，帮你认识无处不在的「米勒定律」今天给大家带来一个无处不在的定律，虽然它很常见，但它很安静。阅读文章 > 米勒定律是美国心理学家乔治·米勒(George A.Miller)对短时记忆能力进行了定量研究后提出：人的短时记忆能力广度为 72 个信息项，超过该范围就容易出错。提及到人的大脑短时记忆容量约为“7”，并在 7+2 与 7-2 之间浮动，因此这个神奇的记忆容量规律也称为“72 法则”。我们做个试验：读一遍下图中的随机字母，然后移开眼睛回忆一下，看你能回想起几个：再试试这个，同样重头到尾读一遍，然后移开眼睛回忆：你能记几个？结果会发现：通常会记忆起 5~9 个，即 72 个，这个有趣的现象就是 72 效应。但是，后来在《设计师要懂心理学》一书中又被提到，这一理论实际上缺乏足够的科学依据，不少学者通过大量研究，发现那个神奇的数字其实是“4”。如果人能够注意力集中，其处理信息的过程也不受干扰，那么其工作记忆中能保存 4 项左右事务；所以建议在给用户展示信息时，尽可能限制在 4 以内，合理利用分类与归纳减少信息数量。米勒定律及其所引发后人的研究结论，其实这一思考常常被运用到产品设计当中，如：示例一：现在很多手机号、银行卡号、身份证号等这种长字符内容，会进行分段显示，对比之下你会发现阅读起来会大大提升易读性。示例二：以前我们要输 6 位数字验证码要切换出去看短信，凭记忆输入，通常要切两三次才能全部填完，后来在技术支持下，直接提取短信中的验证码在键盘上显示点击即可，大大减少用户的输错几率及记忆成本。席克定律席克定律是一种心理物理学定律。它主要体现出两个参数：数量和时间；当所面临的选择数量越多，所作出选择决策的时长花费就会长。这定律更简单一点归纳就是：尽可能减少选项的数量，Don’t make me think！决策效率是一个产品导致用户流失的重要原因之一，用户迟迟不能做出选择，付出的成本越大自然选择放弃的几率就越大，所以我们要将做决定的选项在满足产品业务诉求的情况下，尽可能精简，以减少所需反应的时间。如何提高用户的选择和获取效率？这就考验对产品设计的权衡，哪些内容必须要保留？哪些内容可以精简？哪些内容可以前置后移？示例一：大家都还记得早前的电视遥控器吧，功能齐全应有尽有，可以回想下我们平时使用最频繁的是哪些？再看现在比如小米苹果等电视机的遥控器，把开关、音量、频道、菜单等最最频繁的几个按键外放，其他更多的操作藏在菜单中，没有过多干扰，大大减少用户做选择的时间。示例二：苹果的产品也都是义无反顾地遵循着席克定律，不遗余力地缩减给予用户的选择，无论是在软件产品和智能硬件产品上都是足够精简；如下图 App store 有之前精品推荐还是展示很多 App，后来改版直接通过这种大卡片样式把“精品”的 app 足够放大让你快速获取。示例三：Mac 版 QQ 客户端的登录框，输完账号密码直接登录很顺畅的完成登录操作，把更多那些注册、忘记密码等事项做收起处理，使得整个界面给人比较简洁清爽的感觉。费茨定律拓展阅读：用一篇超全面的文章，帮你读懂经典的费茨定律费茨定律由心理学家 Paul Fitts 提出，用来预测从任意一点到目标中心位置所需时间与该点到目标的距离和大小有关，距离越大时间越长，目标越大时间越短。阅读文章 > 费茨定律主要体现出三个参数：时间、距离和大小；任意一点移动到目标位置所需要的时间，与目标距离正相关，距离越长所需时间越长，与目标大小负相关，体积越大越宽所需时间越短。这定律核心要点更简单一点归纳就是：放大目标对象，减少目标距离。示例一：你会看到现在很多产品厂商，他们的产品宣传广告图，都是把产品图放大，然后才是宣传标题和内容。目标就是通过大图片，强烈的视觉冲击，先吸引到你的眼球，让你第一眼有印象，然后再展开看具体的细项内容。示例二：很多产品也会把比较密切的关联信息，距离放得比较近，方便用户做即将进行的关联操作，如微信：长按复制某项内容，复制后关联操作内容会跟复制项距离挨得比较近，将操作距离缩到最短；假设把关联弹窗操作信息放在统一居中位置，操作以及视角距离会拉长，相应地操作时间会拉长。示例三：QQ 手机端登录页面也是同样原理，次要的注册和忘记密码内容缩小放在次要位置，输入框内容放大，输入账号和密码后，紧接着点击登录按钮，展示顺序和操作也都相对比较流畅；假设把按钮放在下方，暂不考虑键盘交互的情况下，输入完账号密码后，登录按钮距离相对较远，关联操作不够连贯。泰勒斯定律泰斯勒定律又称复杂性守恒定律，指的是任何系统都存在其固有的复杂性，且无法被减少，我们要考虑的是，怎么样更好地处理它，让用户简单、高效地使用它。这一定律也时常在平时工作中，面对较为复杂的业务、流程、页面的时候，要去思考如何在不影响业务和功能的情况下，保证用户的使用体验；也不能为了所谓的页面简洁而删掉一些业务认为重要的东西，最终导致功能满足不了业务诉求。设计本身就是一个反复沟通的一个过程，哪些内容可以精简？哪些可以怎么处理？哪些强调弱化？这些都需要和业务产品方做反复沟通，达成意见一致，找到业务和体验之间的权衡点。在面对不可避免的系统复杂性，我们要做的是花费更多的精力，实现用户界面上的简化，不把系统的复杂性交给用户。示例一：比如抖音、UC 浏览器、淘宝等平台，会通过用户平时浏览的时长、点赞、收藏等行为，来进行数据分析智能推送用户关心的内容，从而使用户对平台产生更高的使用黏着度；通过一种技术的处理，减少用户界面上的操作，帮助用户更快达到其目标；示例二：苹果的 Keynote 和微软的 PowerPoint 对保存定义差异，Keynote 是系统自动保存，用户做到哪里随时关闭，会自动帮你进行保存。PowerPoint 是手动保存，用户做任何操作需要保存才能存档，否则中途死机或者软件出问题导致软件自动关闭，而你做的东西可能会功亏一篑。示例三：在做一个比较复杂的申请时，在内容上和业务方沟通后已没办法再减，如果全部内容在界面上放在一页去展示，会给用户直观上感觉内容很多，当我们可以把内容分拆一下，而且告知用户整个流程完成下来大概需要几步需要填什么内容，提前告知用户，然给用户心里有预期。奥卡姆剃刀定律奥卡姆剃刀定律也是关于本体论简化的原则，它提出：如无必要，勿增实体。即任何存在的东西，应该有对应的事实依据，否则我们不应该去考虑它。今天我们用到「奥卡姆剃刀」这个词语时，其实是在原理论上延伸开，泛指意指删繁就简，剔除问题中无用的杂项，倾向于简单的解决办法。为什么要将复杂变简单呢？因为复杂容易使人迷失，只有简单化后才利于人们理解和操作；简单的页面让用户一眼就能找到他们感兴趣的内容，使用户浏览更舒适，更能专心于你要表达的内容上，而复杂的页面会让用户找不到信息的重点，容易分散用户的视觉注意力。示例一：对比微信手机话费充值页面，和左侧其他平台的充值页，你会发现用户在话费充值这件事上，通过微信充值会非常明确而且快速完成任务，而左侧平台页面整体页面元素比较多，就会干扰用户完成主要的任务操作，当然这也取决于产品本身的定位和策略不一样，展示的内容也会不一样。示例二：iPhone 苹果手机当时把直接把仅有的一个实体 home 键拿掉，通过上滑操作来代替回到首页的操作，这也让后来其他的手机厂商都追随这样的设计一致做了调整。示例三：MUJI 的设计，也很好地体现了这个定律原则，通过“精选材质”、“ 修改工序”、“ 简化包装”重新审视了商品，制造出简洁而舒心的商品。接近原则接近原则是一个心理学名词，指对于彼此接近的事物，人们总会下意识地将他们建立某种关联性，并视为一个整体去看待。这个原则更简单一点归纳就是：把接近相似的信息元素组织起来。接近原则是非常常用和极其有效的一种设计技巧，根据人的认知习惯和心理模型来构建页面，能很好地帮助用户节省浏览和理解内容的成本。界面设计中的接近原则是对相似的信息及功能类别进行分组、布局；它在界面中的作用能够直接影响到用户与产品的视觉交流，借此引导用户的浏览及操作行为。目的都是在视觉上通过组与组的区分来划分功能与功能之间的关联性，让界面变得更清晰，并且帮助用户在浏览页面时，能够清楚地感知到各个信息组之间的关系，也就是信息的归类。示例一：现在很多表单的设计，比如系统设置、个人中心等此类多表单的页面，通常都会将相关联信息归类组合处理，能让信息的归类更加清晰，从视觉角度看页面更有层次感，让信息之间有一定的间歇，减少阅读的疲劳感。示例二：我们进行一些业务的申请，也常常碰到填单页面，如下图，信息就是这么多你全部罗列出来，从视觉感观上看，会给用户感觉要填很多内容；把相关联信息归类成手机号/国别/职业/学历这些个人自身的基础信息，邮箱/单位名称/单位地址这些归成另一类，在信息归类上就可以和上面区分开，让页面更有层次感。防错原则拓展阅读：这9个实用技巧，帮你完全掌握防错原则！TCC 推荐：大家好，这里是 TCC 翻译情报局，我是张聿彤。阅读文章 > 防错原则最早出现在 19 世纪 60 年代的汽车制造领域，是由丰田汽车的专家工程师新乡重夫创造的理念。防错原则其实是站在用户的角度，尽可能地提供相应措施，减少错误概率，令用户更安心更有效率地完成任务。要注意换位思考，从用户角度出发，站在用户使用场景，预测用户有可能发生错误操作。比起一个优秀的错误提示，更好的设计是在这个错误出现前就提前告知用户，最大程度的减少错误的发生。3 个维度帮助我们更好地做好防错机制：操作前，怎么把提示做得更清晰，让用户在准备操作时就能清晰知道在哪操作要做什么；操作中，实时告知当前位置，让用户知道自己进行到哪了；操作后，能及时给予反馈，一旦错误可及时调整；示例一：下图登录窗口，很好地诠释目前很多操作表单的使用样式。操作前，输入框提示语能让用户知道是哪里操作，密码框内提示输入的密码规则也写出来，提高操作效率；操作中，输入框高亮明确让用户知道当前所在位置，并且让用户更聚焦在当前内容；操作后，如内容有误，给出明确提示，让用户能及时调整；示例二：微信手机充值设计，输入一个通讯录存有，但输入疑似错误的手机号码时，页面会提醒用户是否输错，且给出用户可能想要的结果，通过系统辨识，帮助用户做内容校正，防止用户操作错误。最后誉为交互设计之父的阿兰·库珀(Alan cooper)说过一句话：除非有更好的选择，否则就遵从标准。这些被认定的设计定律原则，其实是最基础的理论知识，当我们了解它后，这会成为个人的知识技能储备，在平时设计工作中会给我们很好的参考和启发，帮助我们更有效地完成自己的设计。这些所谓的定律原则，当你全部理解之后，你会发现他们之间有些是相似甚至是重合的，如席克定律、米勒定律和奥卡姆剃刀定律，其实都是在强调信息要精简。所以我们要怎么做？不要去迷恋任何法则，不要纠结去背念这些定律法则的名字，不要觉得有了这些法则，把这些定律原则照本宣科地对照进自己的产品就能提升一个档次，设计水平就能得以很好地提升，这是不可能的。我们要去学习它理解它使用它，其中最重要的是真正地“理解”它，然后结合自身的产品情况及使用场景，更好地运用它。除了交互设计七大定律原则外，其实还有很多前辈总结的一些原则，如尼尔森十原则、设计心理学、格式塔理论等这些前辈们通过多年的经验总结出来的理论知识，都会对我们做产品做设计有一定思考和启发，提示我们平时多看多理解，在我们产品上就会得以更好的体现，从而把产品做得更好。拓展阅读：万字干货！15个著名的设计心理学原理和应用深度解析！“除非有更好的选择，否则就遵从标准”你是否有在听别人说某某原理法则时一脸懵 B 的时候？阅读文章 > 以上，感谢阅读！本篇来源：优设网原文地址：https://www.uisdc.com/7-interactive-design-laws
Hello 朋友们，我又来教大家一些非常实用的小技巧啦~上期文章：9个超实用的PS小技巧，看完就能用上！Hello，各位宝贝大家好，我是你们好久不见的小肥肥~我又来给大家讲一下稀奇古怪（但有用）的小技巧了，觉得有用请用力的夸夸我。阅读文章 > 上一期我分享了些稀奇古怪（但有用）的小技巧，这次我来分享 8 个字效小技巧，简单易学，每个技巧都能帮你快速做一张字效海报出来，快学起来叭！立体金属字效1. 先搜索一个材质球素材，找到合适的素材导入 PS。2. 使用圆形选框框选需要的材质球，然后 ctrl+J 复制出来，再 ctrl+D 取消选区并把原素材隐藏。3. 切换到混合器画笔工具，笔刷使用自带的第一个硬边圆，并调整到和材质球差不多大。4. 选中材质球图层，并按住 alt 点击材质球，吸取材质球样式后属性栏变成如下图。后面 4 个参数全部设置成 100%。5. 接着使用画笔直接写出文字内容。6. 如果觉得颜色太灰，可以按 ctrl L 色阶，调大颜色对比。7. 换个材质球也是同理。金属字效1. 新建一个 1500*2100 的画布。导入背景素材，并打上文字，色值为 616970。并对文字图层右键-转化为智能对象。2. 双击文字层进入图层样式，添加斜面浮雕，做出金属立体厚度感。3. 再添加纹理，做出金属表面的磨损质感。4. 再添加光泽，做出暗部的反光过渡。5. Ctrl+J 复制图层，并右键-清除图层样式。将图层模式改为正片叠底。点击「滤镜-模糊画廊-路径模糊」。添加一个向右下角的路径，并将模式改为后帘同步闪光，做出文字长投影的效果。6. 将投影层 ctrl+J 复制一层，加深投影效果。7. 在背景上新建一层，模式改为叠加，透明度 35%。然后使用渐变工具，渐变设置为黑白。在画布上拉出渐变，给背景添加明暗的过渡。8. 在字体上添加一层，并右键-生成剪贴蒙版。并修改好图层模式和不透明度。使用柔边黑色画笔，在字体右下角部分画一笔，做出文字的明暗过渡。9. 到这里我们的文字海报就完成啦，如果想要替换文字，可以双击任何一个文字图层缩略图，进入智能对象后，修改文字内容并 ctrl+S 保存。然后回到制作文档，文字就同步修改啦~纸张字效1. 先打上文字，色值为 ececec。并对文字图层右键-转化为形状。2. 选中文字层，ctrl+T 自由变换，右键透视，调整至下图效果。3. 双击文字层，添加图层样式。添加内阴影，混合模式为正常，颜色 ffffff，其他参数见图。添加内阴影，混合模式为正片叠底，颜色 000000，其他参数见图。4. ctrl+J 复制文字层，并 ctrl+T 自由变换，将文字拉高一点点并调整透视如图，完成后回车。5. 选中上面的字体层，按 5 次 ctrl+alt+shift+t 重复上一步，得到下面的效果。6. 选中所有文字图层，点击图层-排列-反相，效果就完成啦~彩虹字效1. 打上文字，还可以新建图层，用画笔画点小装饰。2. 选中装饰和文字层，并右键-转化为智能对象。然后点击窗口-动作，打开动作面板。3. 点击新建动作，然后 ctrl+J 复制文字层，并按 ctrl + [， 调整图层顺序。然后分别按 、将图层位置往右下角移动。接着点击停止动作。4. 然后选中文字图层，一直点播放动作。就可以复制出很多层文字，并产生角度立体感。5. 最上面的文字层，添加颜色叠加，色值为 ffffff，做出文字面。6. 剩下的文字层，每 5~10 层编为一组。共编 5~7 组，每组分别添加不同的颜色叠加。7. 将所有的文字组选中，再 ctrl+G 编组命名为「厚度」。新建一个图层，右键-生成剪贴蒙版，然后调整图层不透明度。使用柔边黑色画笔，将文字的暗部涂抹出来，效果就完成啦~条纹扭曲字效1. 先用椭圆工具，画一个超级扁的椭圆。2. 按 ctrl+T，然后按几下 shift+ 往下移动一段距离。回车后一直按 ctrl+alt+shift+t 重复上一步。得到一排椭圆线条。3. 选中所有线条层，ctrl+E 合并图层，并右键转化为智能对象。然后点击「滤镜-液化」，使用画笔涂抹线条，做出扭曲的感觉。4. 打上一个文字，调整好大小后隐藏。按住 ctrl 点击文字图层缩略图，然后选中线条层，点击生成蒙版。就可以做出线条文字的感觉。5. 选中线条层右键-栅格化图层，并选中蒙版右键-应用图层蒙版。6. 选中线条层 ctrl+J 复制。选中下面的线条层，双击进入图层样式，并去掉 R 和 G 通道。7. 然后使用涂抹工具，用大的柔边画笔涂抹文字，做出局部位移的效果，效果就完成啦！毛绒字效1. 先使用钢笔工具，画一条这样的路径，然后将画笔调小。2. 接着切换到钢笔工具，按鼠标右键-描边路径，选择画笔，勾选模拟压力点击确定，就会得到一条这样的曲线。3. 选中线条层，ctrl+J 复制，并 ctrl+T 旋转下角度。然后选中两个图层，ctrl+E 合并。4. 按住 ctrl 点击线条图层缩略图，出现选区后点击「编辑-定义画笔预设」。5. 导入牛仔布背景，并打上文字，右键-生成工作路径，然后隐藏文字。6. 新建图层，并选中刚才新建好的笔刷，调整好大小。并设置好笔刷参数。7. 切换到路径选择工具，选中所有路径并「右键-描边路径」。8. 最后再添加内阴影和投影，效果就完成啦。纸张描边字效1. 分图层打上文字。2. 选中任一文字图层，双击图层添加图层样式。注意两个描边顺序不要出错哦。第一遍描边：大小 17 像素，颜色 00995f第二次描边：大小 28 像素，颜色 ffffff。添加「图层样式-图案」，采用自带的第 9 个图案「花岗岩」。添加「图层样式-投影」，混合模式为正片叠底，颜色 00995f，其他参数见图。3. 图层样式添加完后点击确定。「右键图层-拷贝图层样式」，并选中其它所有图层「右键-粘贴图层样式」。4. 到这里效果就完成啦，如果想要修改文字内容，可以直接双击文字进行修改哦~弥散字效1. 打上文字，并右键-转化为形状。2. ctrl+J 复制图层，并双击下层缩略图，将文字改成红色。然后分别右键-转化为智能对象。3. 使用「滤镜-模糊画廊-场景模糊」。在文字周围打上图钉，并调整模糊程度，做出字体一边实一边虚的效果。4. 按住 alt 拖动滤镜，复制到另一个文字层上。5. 选中黑色文字层，并添加蒙版。然后选中蒙版，使用黑色柔边画笔涂抹，遮住部分黑色文字，漏出底下的红色部分。6. 选中红色文字，ctrl+J 复制图层，并 Ctrl+U 调整色相饱和度。7. 给紫色图层添加蒙版，用黑色画笔涂抹，漏出下面的红色文字，这样就得到一个彩色的弥散文字了。8. 使用上面同样的方法，再做出其他文字，并且调好透视角度，效果就完成啦。再加点简单的文字排版，就 ok 啦！在这里还想说，制作某个字体只能为作品锦上添花，想要制作出不错的设计作品，更重要的是掌握设计的基础原理，学会提取作品规律参考借鉴，综合运用理论知识构建画面哦。如果你想学 PS AI AE，系统设计入门和设计原理，这里推荐一下我正在讲课的「优设设计师就业衔接班」，带你一次掌握 10 种以上设计类型，比如海报设计、图标合适、矢量插画、电商合成、动效 MG。而且上手快，零基础和一定基础都能学会！按照行业标准训练，帮你掌握职场加薪技能，甚至直接拿着毕业作品面试！添加咨询师 VX，立即抢占名额「可乐：uisdc4」「大胖：uisdc5」以下是来自衔接班同学的字效海报作品：#60 天 PS AI AE！从设计入门到入行#30 节直播课程+15 天毕业作品辅导+就业推荐机会+优设人才培养！原价 1399 元 ！目前还有粉丝专享优蕙复制 id 添加咨询师 V 芯，立即抢占名额「可乐：uisdc4」「大胖：uisdc5」本篇来源：优设网原文地址：https://www.uisdc.com/ps-font
进入 2022 年之后，插画视觉风格的变化，似乎陷入了一种奇异的停滞状态。随着 NFT 兴起的粘土风，似乎随着 NFT 领域的不景气而淡出大众视野：怀旧情绪的蔓延则让 MBE、波普等画风又再度热了起来：最有意思的地方在于，有设计师盘点了 2021 年到现在这一年时间里，Dribbble 上点赞超过 550 的优质设计作品，发现在插画这一门类当中，最受欢迎也是最坚挺的门类，是带有强烈几何风格、人物角色略显夸张，使用描边线条和硬挺块面构成的，扁平插画：换句话来说，在竞争愈发激烈的 2022 年，扁平插画始终是插画和设计的基本盘！如果你想让自己在 2022 年更有竞争力，掌握新技能，工作更上一层楼，或者打算探索新风格，发掘更多自身的潜力，不妨看看这一期的插画课：更重要的是，过去一年时间里，缪缪老师也一直在探索独特的新风格，所以这次课程会新增了一节课，专门讲新画风的探索过程，分享风格探索过程中的思路、感悟、以及一些技巧和方法。另外，额外新增的课程中，还添加了插画/设计师的作品集优化和求职技巧的内容：本次课程结构和往期类似，但是新增内容更贴合当下需求，同时加量不加价：直播课总计 22 天，课程原价 499 元，新课上新价399元，直减100元！移动端扫描下方二维码报名，网页端右戳报名 https://pro.uisdc.com/detail这是一门高效出彩又充满可能性的插画课！让学员们津津乐道的缪缪老师，就是这门课的灵魂。她从零基础插画素人到 Dribbble 首推，仅用了半年时间，以非科班身份入行，到成为字节跳动的插画/UI 设计师仅用了 3 年时间：关于老师的专访：优设专访！从非科班到字节跳动仅用了3年多，她是怎么做到的？认识@Muriel缪旻含 的时间很长，直到最近才很偶然地聊到了她的过去。阅读文章 > 跟着她学习，能够绕开她踩过的坑，弯道超车，拥有这项技能！因为，在之前的成长经历当中，缪缪极富针对性地总结梳理出了一套自己的插画绘制思路和方法，而这些经验和方法赋予了这门课非凡的价值：1. 超快出稿的缪缪插画术！这是所有学员都津津乐道的特色！将看似庞杂的知识点和方法拆解为易于理解的要点、立马可以上手的知识模块，没有「冗长而令人劝退的准备」，立刻上手，治愈怠惰！老师会教你如何用几何图形概括人物，并在此基础上正确梳理层次，为了让你完全学会这个解构方法，课程内专门配备了帮你提升绘画效果的黑白稿练习！2. 兼容性超强的软件知识支撑！在这门课，你能一次性学会四种流行风格的插画绘制方法！每种都超能打！无论是应用最广的扁平插画、噪点插画还是层次丰富的渐变插画、个性化插画，这门课全都满足你！只要掌握了这四个主要的插画风格，无论是闪屏页、启动页、空白页还是网站配图等等，所有职场需求通通不在话下！而在实际的作品输出中，学员们自然延伸出来的风格比课程本身教授的还要多！3. 特别到位的学习体验！无论你是有一点插画基础，还是纯粹的小白，都能够从这套课程中感受到，来自缪缪老师无微不至的服务：4. 带你走向原创的技巧课程新增了原创风格探索的经验分享，将会在最后一课深入探讨个人风格的探索过程、方法，以及注意事项，给想要进一步塑造独特风格的同学全方位的建议！5. 2022 年作品集求职全解析这个内容也会添加到本期最后一课当中，帮你理清设计师从作品集处理到求职面试过程中，需要注意的绝大多数问题，并且针对 2022 年的行业变化，提供针对性的建议！下面是本期课程的完整大纲：直播课总计 22 天，课程原价 499 元，新课上新价399元，直减100元！移动端扫描下方二维码报名，网页端右戳报名 https://pro.uisdc.com/detail下面是缪缪老师的作品这是为 Modelones 的圣诞礼盒所绘制的插画：下面就是学员晒作品的环节了学员参加 OPPO 壁纸比赛作品：学员 Yukki 作品，荣获靓屏奖学员 糯米拌饭 作品 ，荣获星屏奖学员 Yolanda 作品 ，荣获星屏奖学员参加 Bejoin 比赛作品：下面是学员的课程作业：学员香菜作品学员 BabeZoe 作品学员 iamzz 作品学员 zMMMMc 作品学员 可口 作品学员 孟景 作品学员 裴钰 作品学员 阿拉萍萍 作品学员 陛下 作品学员 喵大人 作品学员 这么大个柿子 作品学员 乔伊畅 echang 作品学员 妖妖 Veronica 作品学员 yolanda 作品学员 iamzz 作品学员 阿文什么都没有 作品学员 Mnemosyne 作品学员 芳芳 作品学员 33 作品学员 六日 作品学员 闪闪惹人爱 作品学员 孟景 作品学员 Nikko 作品学员 大栗 作品学员 shirlly 雪梨 作品为保障学习体验，名额有限。想学习的同学要抓紧啦：直播课总计 22 天，课程原价 499 元，新课上新价399元，直减100元！移动端扫描下方二维码报名，网页端右戳报名 https://pro.uisdc.com/detail本篇来源：优设网原文地址：https://www.uisdc.com/uisdc-miumiu-course
低阶设计师向外 高阶设计师向内关于设计师成长，是一个周期相当长复杂度相当高的话题，而复杂的问题解决办法往往很简单。我们通常被表象所吓到，然后望而却步。面对复杂问题时往里深探一步就能发现，解决问题的方法其实并不复杂。设计师的成长阶段大致分为这么 4 个：初级、高级、资深、专家。每个阶段都有对应的能力要求。低级别的设计师要往外看，而更高级别的设计师，更要往内看。设计师成长路线何为往外看？何为往内看？往外看是指要多和外界做对比，对比能力的不足，对比方法的不足，要通过不断的比对中找寻自己薄弱环节，不断优化迭代自己的知识库。而我所说的“高级别”往内看并不是与往外看对立，而是往外看之后的往内看，更高级别设计师经历的问题多，掌握的知识广，要学会整理这些过程中的所思所想，完成从碎片化点状知识到体系化知识库的转变，才能实现“能力跃迁”。更多设计思维：这 10 位顶尖的日本设计师，有哪些私藏的设计思维？优秀的设计师是怎样构思设计方案的？阅读文章 > 能力跃迁可以把设计师成长比喻成“原子模型”：电子围绕质子高速旋转，而电子是分了轨道的。根据能量守恒定理：低轨道的电子向高轨道跃迁需要吸收能量。这里有一个有意思的现象，电子轨道跃迁是需要吸收到一定高的能量后，突然跃到更高的轨道，哪怕能量欠缺一点都不能跃迁成功。设计师成长也是这样，成长路径并不是线性的，每个设计师的成长都会遇到瓶颈期，那是因为所吸收的能量还没达到“能力跃迁”的临界点。体验设计师能力图谱结构化思维打开能力跃迁的大门越往高级别走，就要学会向内看，学会解构、重构、整合来放大内部能量。初级别设计师的成长是能量吸收的过程，高级别设计师的成长是能量释放的过程。如果你有一个自我成长的心，我这里给大家一个通往新世界的门，它的钥匙是“结构化思维”。什么是结构化思维？结构化思维的定义：以事物的结构为思维对象，以对事物结构的建构为思维过程，力求得出事物客观规律的一种思维方法。结构化思维最早提出于最著名的国际咨询公司麦肯锡出版的《金字塔原理》一书，由麦肯锡第一位女性顾问巴巴拉•明托写就，这是一本帮助你搭建思维框架的指导书。金字塔原理结构化思维是一种透过结构看问题的思维方式。复杂问题之所以复杂是问题的“信息熵”过大，显得混沌，没有章法。结构化思维看问题其实就是降低“信息熵”的过程，让无序变得有序。结构化思维之所以厉害，是因为结构化思维是一种顺应大脑思维惯性的一种思考方式。学习本身也是一种大脑熵增的过程，熵增必然带来混沌，所以学习也是痛苦的，逆天性的。而结构化思维是熵减的过程，刚好抵消熵增带来的混沌与痛苦，因为我们的大脑更喜欢记录有规律的事物，不愿记录无序的信息碎片。掌握这种思维习惯，能对今后的职业生涯乃至人生有很大的帮助。举例想要记住第一串数字并不容易，但是找到规律，拆解为下边的结构记忆起来是不是容易的多呢？结构化思维的本质结构化思维分为三个阶段：解构-重构-整合第一阶段：解构解构是探寻事物本质结构。事情的产生与发展必定会包含多种因素的相互作用，多种因素之间形成的特定关系共同构成了事情本身。因此解构就是寻找事情构成因素以及因素之间关系的过程。解构还要求所拆解的维度必须是穷尽的，互相独立的。如果拆解维度不能穷尽所有情况，那这个拆解就是无效的，最终得出的模型会因此造成不可逆转的偏差。如果拆解的维度不是互相独立，必定会让建构出的模型变得错综复杂，起不到相应作用。举例市场看似复杂，但概括起来讲就三种类型的因素组成：B（商家）、C（用户）、G（政府）。这三种因素的两两组合便成为各种各样的商业模式：B2B、B2C、C2C、B2G。商业模式第二阶段：重构重构是构建思考模型的过程。能把事情的本质构成元素拆分出来并不难，通常通过观察学习思考就能得出，但是要完成从元素到模型的构建需要不断的融合与迭代。如果把 10 件事儿构建出 10 个模型，那等于没有构建。重构应该是找出 10 件事儿的共性，融合构建为 1 个模型。举例用户增长模型 AARRR 便是结构化思维的产物之一，它把产品的用户生命周期分为五个环节：用户获取，用户激活，用户留存，用户付费，推荐传播。AARRR 模型源自于漏斗思维模型，告诉我们在这五个环节中，增加每个环节的漏斗转化即可实现产品商业价值最大化。有了这个模型基本能解决所有产品的用户增长问题，不用再重复造轮子，也能让我们所掌握的用户增长知识更加系统清晰。因此构建的模型具有很强的普适性，如果你在构建模型中发现，你的模型只能适合某一种特定场景，那这个模型大概率比较初级，需要融合更多场景进行迭代升级。AARRR 模型用一篇文章，让你掌握能让用户快速增长的AARRR 模型AARRR模型因其掠夺式的增长方式也被称为海盗模型，是Dave McClure 2007提出的，核心就是AARRR漏斗模型，对应客户生命周期帮助大家更好地理解获客和维护客户的原理。阅读文章 > 第三阶段：整合整合是对各种模型做系统化梳理的过程。这个阶段是发挥创造力的重要一环，如果你已经养成结构化思维习惯并且你所掌握的知识体系更加系统之后，你会发现很多事情都是相通的，看似不相干的事情也是可以拿来类比。很多体验设计师耳熟能详知识也是这样而来，比如说原子化设计理论，把组件思维用原子模型来类比；比如说色彩心理学，让色彩与人类心理活动产生联系。最终我们会发现同一模型不但可以解释同类事物的现象，也能解释看起来完全不相干的两类事物的现象。原子化设计理论上万字干货！设计师必读的原子设计完整指南「我们不设计页面，我们设计构成元素的系统。阅读文章 > 结构化思维解决「流程问题」1. UX 体系化设计模型UX 体系化设计模型用流程匹配流程这个模型是我们之前做的一款 UGC 产品中沉淀出来的，后来经过迭代优化逐渐适应了所有稳定迭代的产品需求。团队协作中沉淀工作流程能让效率提升的同时，也能让团队内外更快达成共识。工作中我们常常理解为是人与人的交流和协作，但是我认为这样理解是不够系统的。每个设计师都有不同的出身不同的经历，在不同公司也会有不一样的工作流程，所以很难做到人的标准化，但是我们可以很容易做到流程的标准化。设计师应该把更多精力放到创新创造上，而不应该因为流程的问题苦恼。所以除了 UX 体系化设计模型，这两年我们还在工作中尝试把团队协作流程标准化（协作工具包：SOP、需求管理表、体验设计服务范围、产品设计邮件模版），来解决设计师与各类型团队协作的流程问题。结构化思维解决「效率问题」1. Fontwork《轻风体》设计Fontwork 是 UXD 内部的字体设计团队设计一款中文字体是相当复杂的事情，需要字体团队成员高度配合，每个成员对字体特征把握需要高度一致。中文字库中常用字有 3600 多个文字，BG2312 国标字库包含 6763 个文字。要想给中文设计一款字库少则半年，多则数年。这么庞大的工程，协作方法显得尤为重要，高效的协作路径会让制作周期大大缩短。归纳提炼字体智能部件字体设计之前一直被方正汉仪等字体大厂所垄断，作为刚成立的 Fontwork 字体设计团队，并没有过多字体设计协作方式的储备，并且这本来就是商业字体设计公司的核心技术壁垒，不可能对外开放。因此我们只能从为数不多的能查阅到的字体设计基础资料、国标文件中提炼字库设计的协作方法。在第二款字体（轻风体）设计中我们总结之前的经验，优化协作方式，提炼出部首 191 个、独体字 286 个、合体字 162 个，并制作成智能组件库。另外我们在字体任务管理和分发上也比之前更加科学，最后字体设计变成了拼字游戏，设计速度大大提升，总体效率比第一款提升近 6 倍。轻风体拼字过程结构化思维解决「视角问题」1. 升维分析降维打击观察视角不同，得出的结论自然不同。现实中的很多冲突矛盾都来自不同的观点，不同的观点背后其实是视角不同。低维度视角看问题往往容易陷入局部困境，过于关注局部利益，忽略整体利益。如果冲突双方各自站在自己的利益角度去争论，事情很难达成共识。只站在高纬视角看问题也不可取，高维视角下会忽略各种细节，但很多时候一套方案并不能解决所有问题，与其做一个平平无奇的普通方案，不如集中力量去寻找解决关键问题的优秀方案。我们既需要升维视角分析问题，也需要用降维视角高效解决问题。省钱会员卡省钱会员卡用户分析模型在省钱会员卡项目中我们对用户进行分级：强需求用户、潜在型用户、弱需求用户。我们更应该关注对潜在型用户的挖掘，因为强需求用户不需要我们做太多，只要在相应环节呈现他们需要的内容就能让这类用户进行转化。而对于只是出于好奇心、比较心理、误点进入来的弱需求用户我们再如何增强活动吸引力度和内容感知度都无法对其进行转化。因此我们主要对潜在型用户做了研究分析，结合产品能力，确定设计原则（视觉影响感知，感知影响行为），引入 CST 法则（抓住感知-强化兴趣-触发行为）。蓝领客线下店服务设计蓝领客线下店 MOT 关键时刻服务设计得出的方案绝不应该是细致入微面面俱到的。用户视角下商家应该不计成本的为我提供优质服务，而商业是要盈利的（政府等提供社会基础能力建设的非营利机构除外），势必会要求把成本花在正确的环节，带来更高的价值转化。要让一个商业模式良性发展我们必须综合这两方视角。蓝领客线下门店服务设计中。我们对线下找工作的流程进行梳理，分为 6 个环节：约面试-找门店-到门店-面试培训-送去工厂-上岗回访。为了让我们的设计聚焦在每个环节的关键转化时机，我们引入了 MOT 关键时刻服务设计方法。通过桌面研究+实地调研，我们对用户在每个环节的做了详细拆分，汇总出几十个影响转化的关键瞬间，然后筛选聚焦 7 个瞬间，最后集中各角色（产品、市场、商家、用户、设计）共创解决方案。结构化思维解决「沟通问题」1. 线性思维沟通，要讲的清楚听的明白。团队协作不可避免要提到沟通成本，沟通成本过高会抑制团队活力，激化内部矛盾，降低协作效率。线性思维能帮助我们提升沟通效率，降低沟通成本。大脑更喜欢接收和理解有因果关系的线性信息，而非跳跃式的信息，跳跃式信息会让大脑短时间内信息过载（宕机），失去信息接收能力。2. 总-分-总总-分-总，是有目的的表达。人们的专注力常常会受到干扰，因此沟通的前提（第一个总）很重要，如果前提是对方关注的重点，对方肯定很想知道你要讲的具体内容（分）是什么，在最后再结合你的观点对结论进行升华（第二个总），达到高效沟通的目的。PREP 框架PREP 框架PREP 框架就是线性思维与总分总结构二者结合的万能沟通框架。写在最后以上是我对设计师个人成长的一些思考和方法的沉淀，希望对大家的职业成长有所帮助。也同时希望大家能把结构化思维变为自己的思考武器，解决你一直苦恼的问题。欢迎关注「58UXD」的微信公众号：本篇来源：优设网原文地址：https://www.uisdc.com/structured-thinking-2
相信很多同学都会好奇，腾讯、阿里这些大厂的设计师平时都是怎么工作的，这群设计师都拥有什么样的特质，让他们能够成为国内设计的引领者。从本质上来说，同属互联网行业的工作是没有太多的差异性的，你设计一个 APP，大厂的设计师也是设计一个 APP，而让大家产生区别的往往就是工作方式和工作习惯。作为在腾讯这么多年的设计师，今天给大家讲讲大厂的设计师都有哪些好习惯。拓展阅读：你和优秀设计师差的不仅是软件操作，还有这28个优秀习惯！大家都希望自己成为一名优秀的设计师，也在不断探索如何成为优秀设计师。阅读文章 > 分析分析是大厂设计师非常爱做的一件事情，每每接到一个新需求都要做许多不同层面的分析：产品背景、用户、数据、需求拆分等等一系列的内容。首先，要明白为什么要分析？主要是大厂做事情之前都喜欢问一个“why”。基于这个“why”就需要有一系列的分析来进行支撑，比如产品提了需求，那我们肯定要问为什么你会认为这是用户喜欢的？是有什么数据支持吗？基于这个问题，我们就需要去做数据方面的分析。我们把这些分析简单分成 2 个方向：产品向和设计向。产品向：1.需求背景；2.产品卖点；3.优化方向。设计向：1.用户分析（调研）；2.设计趋势分析；3.竞品分析。方案收集这个行为一般出现在我们输出设计之前，我们会去收集一些常见案例以及一些突出案例，包括竞品的一些案例。痛点一（特别在视觉设计师有所体现）“收到需求后，就马不停蹄的绘制起了自己的方案，给到需求方看的时候，才发现牛头不对马嘴，跟需求方想要的方案完全不一致。也有可能所设计的方案连上级这关都过不了。”这个案例的话，我们需要解决的是一个沟通的问题，通过提前收集一些设计网站的案例，先和需求方进行沟通，找准方向，清晰表达自己的想法，提升沟通效率和默契。痛点二（在紧急需求时）“我们输出了设计方案，但无论怎么修改，我们的上级都不满意，导致我们的设计输出无法及时提交给需求方，导致设计延期”这个案例的话，我们需要解决的是我们的专业度的问题，我们在接到需求时，为了避免中间跟上级来回调整的时间浪费，因此我们可以收集一些相关案例，提前和上级去确定我们的方向，寻求上级的同意，这样我们在输出方案的时候就能沿着上级所认可的方向发力，避免被推翻重来。草稿草稿的方式特别能够体现设计师思考的过程，我们在想方案的时候，都尽量通过草稿的方式记录下来，当我们绘制到一定个数方案之后，我们再从中选择 2-3 个较优的方案进行设计输出，提高设计输出的精准度，这实际上也是自我脑暴的过程。痛点一（特别是图标类的设计）“我们在设计一个图标或者 logo 的时候，很多设计师都会重复出很多方案，可能从方案一到十，都没法确认下来，最后还是得重新再来。”这个案例最主要的不是你专业能力的问题，而是缺乏一些做事的方法。比如我们设计一个图标一般会从图形表意和造型美感 2 个维度进行入手，所以首先要解决的是表意的问题，而图标的表意往往是有很多种，我们可以通过草稿“穷举”的方式把我们所能想到的都画出来，然后和上级或者需求方进行勾兑，确认方向后，再进行软件绘制，在这个阶段我们再进行造型美感的优化，可能也会有 2-3 种方案的输出，这样能够大大降低被拍死的可能性。痛点二“很多设计师经常会反馈设计的时候没有想法，明明有个想法在脑中，但到了实际做的时候却很模糊；还有设计师说我做了很多个方案，但却拿不出手。”这个案例主要是想说，通过草稿绘制的方式可以帮助我们把很多碎片的想法进行记录，这样我们在实际画稿的时候可以有一个依照，让我们下笔更加胸有成竹。多方案设计永远不要只做一个方案，有可能你会在这个方案里面一直沉沦，不断修改。痛点经常有一些年轻设计师跟我说，他设计的方案老是翻来覆去的修改，最后做了十几稿，最后还是要继续优化。这个问题涉及到的是我们输出方案以及汇报呈现方案的一些技巧。通过多方案的输出是基本可以解决 80% 关于这类痛点的问题，这里给大家分析下多方案输出的一些方式和方法多维度呈现方案：在输出方案的时候尽量有多个角度的思考，这样除了体现你思考的全面性之外，也能够有更大的机会命中。维度的跨度尽量大一些，比如我之前在做一个游戏中心的项目，除了常规的平台向方案，我还输出了机甲风格和游戏漫画风格。控制呈现的个数：我们可能会在做方案的时候有很多的想法，同时也会输出很多个方案，但是并不需要把所有的都给需求方发过去，自己可以有一轮筛选，并且整理出 2-4 个较优的方案。标注好推荐方案：在输出的方案中一定要标注出推荐的方案，除了是给产品有个参考之外，更多是表达你作为设计师（自己的）想法，如果作为设计师自己都没想法，那么就会变得被动，产品想让你怎么改就怎么改。给出自己的想法除了可以大大推进自己的设计落地，更多也是帮助产品进行多角度决策。写明方案优缺点：我们输出的每个方案都应该标注好有什么缺点，帮助产品进行决策，更大的好处是佐证你推荐的方案为什么被推荐。体现专业性专业性不仅仅体现在你设计的图上，还体现在你设计稿的呈现方式。痛点“很多设计师，常常会在一些需求群里面，直接就把自己设计的稿子发出来，然后就是你看看。”看到这句话，是不是像极了平时的你？这样做会显得非常不专业。因此有几点建议：为你的设计稿设计一个专属的输出呈现模版，尽量简洁以呈现作品为主；尽量把你的设计输出呈现模版推广到你的团队成员使用；在模版上展现你输出的标题、时间、人员等等关键信息；请加上你的业务 logo，获得需求方的好感。设计总结给大家分享一句话：“项目结束，但设计未结束，项目是短暂的，但设计可以被延续。”而这个延续就需要我们在实战中的大大小小的项目不断的复盘-总结-沉淀。其实不管做什么类型的工作都是非常需要的，道理很浅，但做与不做就会有很大的差距。这里可以抛出一个问题：你认为大厂设计师的设计思维、理论体系、设计系统性是从哪来的？（大家可以在评论区说出自己的想法）大厂的设计总结一般会分成三种：项目设计总结（常见的设计总结文章）理论体系文章（通过项目设计中提炼出的可复制方法论）项目完整复盘（利弊分析，一般不对外分享）最后这些习惯有些是工作需要慢慢养成的，但有些是设计师自己驱动养成的。当然，大厂不是唯一的标准，这些归纳只是希望可以帮助大家有所提高，也希望通过大家的努力可以更靠近大厂，到大厂学习更加系统化的设计方法论。注：本文图片来源网络！欢迎关注作者微信公众号：「ID设计站」本篇来源：优设网原文地址：https://www.uisdc.com/designer-6-good-habit
落霞与孤鹜
不知道你是不是跟曾经的我一样，在刚入行 1-2 年的时候，过方案稿的时候对自己的设计提案并没什么信心，怯怯的说不出个所以然，经常被评审的产品、开发等上下游问懵了，然后现抓理由缓解尴尬，会反复修改，找不到感觉。只怪自己当时嘴太笨了？表达力不到位确实是一方面原因。但更深层的原因是想的不到位，我们对产品了解的不够，没有明确的方向，一直在盲目的尝试。自己也缺乏设计策略，缺乏分析和判断力，缺乏多方换位思考的能力。有理有据的设计才能让人信服。设计就像打怪升级，历练的越久，经验值越高，对于怪的判断就更清晰，打法就越明确，熟悉各方队友的思路和队友配合的越默契。本文将讲解设计前、中、后的结构，总结设计师在什么样的阶段采取什么样的策略能提高过稿率。（一）设计前关键词：了解、共识、体验1. 了解产品，量体裁衣在设计前我们一般通过需求评审会跟产品经理和项目经理沟通了解产品需求设计的前因后果、设计目标，以达到双方：信息对称、理解一致、设计目标一致。我一般会从三个角度了解：（1）“聊”解产品、体验产品在设计前，第一件事一定不是根据“我”的主观理解判断直接去做，磨刀不误砍柴工，越了解产品越能避免后续因理解偏差和信息不对称造成的的反复修改。不会提问的好设计师不是一个好裁缝。我一般会从产品侧、受众侧、限制条件三个角度去提问了解。这一层的问题能够帮助我们快速了解产品抓住设计重点，减少一些产品经理或甲方爸爸们遗漏交代的条件。下面是我的会涉及到的一些问题罗列：除了通过产品经理描述（功能蓝图的绘制者），我们也要亲身站在用户视角体验去用一用竞品，搜集一下竞品用户反馈，可以站在他人的肩膀上扬长避短。分别带入不同的角色去使用查验自家产品的已有版本，发现产品需要优化的体验点。（2）时间节点评估了解双方的时间节点、合理的安排设计策略，更好的提升效率。减少双方时间规划不一致，过度压缩设计时间、环节遗漏等情况发生。预留设计的时间段=产品上线时间-开发介入时间设计主要流程节点：风格确定+主要优先级界面+设计规范+次要界面+切图标注+设计验收非紧急项目：我们可以根据不同上下游的时间段，整体规划设计时间段。使用这种方式能让各方的思考修正更完善，减少了上游思考不全导致的下游联动调整。紧急上线项目：我们需要采取更机动灵活的方式，边设计边开发，规划好界面设计优先级，将设计规范前置。（3）设计体验目标达成一致设计目标评估=产品阶段+ 具体矛盾+可用时间如果你经常出现设计交付延迟，或产品认为你的设计结果没达到他预期时，一定是没有预期沟通好此版本的设计目标，在时间、条件有限的前提下，一方想要尽善尽美。产品目标和设计目标都是一步一步成长的，一口吃不成胖子。在不同阶段，分析解决产品的主要矛盾和问题，对症下药。这就需要设计和产品方、业务方提前达成一致的设计目标，首先要确认产品处于什么阶段：从 0-1 的萌芽期、还是发展期、成熟期、衰退期。不同的产品生命周期应当对应着不同的优先级的设计目标，比如初创期的目标更强调主要功能完备，架构流程流畅；达到可用的目标。发展期 or 成熟期目标：易用、视觉优化升级品牌化等。结合上方的时间节点评估，避免产品期望在短时间内期望达到精装房，而实际设计师在限制时间内只能完成简装房；或者产品提出含糊的优化需求，他期望优化流程架构、而设计理解为给房子进行涂装等方向错误。双方的设计预期目标没有达成一致性。过了“望闻问切”的设计需求评估分析阶段，已经有了较为深入的了解，可以针对产品目标、制定设计目标。在交互设计输出后，视觉设计可以转战第二阶段大展拳脚！这方面篇幅较长，我们将在下篇详细说明，敬请期待哟同一个设计稿，如何让过稿率提高70%？本文作者介绍了进行设计评审时可以提升评审效率，帮助设计师和与会者更好地进行沟通，并顺利推进项目的一些方法，希望对您有所启发。阅读文章 > 本篇来源：优设网原文地址：https://www.uisdc.com/design-review-up
问题欠下的债迟早都要还。互联网快速迭代虽然能提前满足用户需求，验证业务模式，但也带来 BUG 增多，管理混乱的问题。比如随着人员流动，没留下迭代记录。新同事提的需求却不知道离职的老同事曾经做过效果不佳，又重复做了一次，浪费资源。即使想到去查数据，每个人对埋点的命名规则都不一样，又得求研发工程师翻代码，查一次历史数据身心俱疲。如果通过制定流程规范让大家来写文档留下记录又拖慢了开发速度，于是我在思考如何能快速留下记录，后续回顾的人也方便查看。58UXD 出品的这篇数据分析基础也非常实用：凭什么说设计方案有用？先掌握基础的数据分析思路！“凭什么说你的方案有效果？阅读文章 > 思考1. 可视化结构化作为交互设计师我知道研发工程师看交互说明文档喜欢看图不喜欢看字，我自己也讨厌看长篇大论的报告。这份文档结构要清晰，最好能可视化，看起来一目了然。考虑到数据的呈现，我决定采用表格。2. 形成习惯不费力如果在这件事上耗费太多精力得不偿失，要形成习惯，在固定的节点花较小的代价来做这个事情。为此我根据团队的版本开发流程，决定在功能上线数据分析后撰写《上线数据分析表格》。数据分析需要查询埋点，在功能开发后期，研发工程师需要处理埋点，因此在此时记录《埋点记录表格》是最佳的。成果经过一段时间的摸索，我总结出了一个管理埋点和数据的模板和方法，来和大家分享。1. 埋点记录在完成设计方案后填写如下表格。修改点是设计方案，目标、预期结果来源于 Google 发明的 GSM 模型，若读者不了解可自行寻找资料学习。设计师和产品想法不一致怎么办？试试谷歌的GSM模型！我们为什么要使用 GSM 模型常规工作中，需求往往由 PM 发起，UE 团队到底如何跟 PM、FE 等团队成员协同，达成目标共识，是我们值得讨论的。阅读文章 > 搞清楚预期结果（指标）后，自然就知道需要什么数据。根据需要的数据思考需要哪些埋点，再梳理现存埋点，最后通知研发工程师新增还缺失的埋点。上线后数据分析在版本上线分析数据后填写如下表格。前三列与之前表格相同，实际结果根据埋点的数据分析结论填写。为了让之后来回顾的同事一目了然，建议用绿色表示结果符合预期，红色表示不符合，黄色表示待观察。如果上线之后有遗留问题需要后续优化或者有下一步计划，可填写在后两列中。或许有同事看完表格后想深究，我们可以把具体详细的数据列在上线表格下方。最后补充版本号和上线日期就得到一份完整的埋点和数据文档，如下图所示。建议把文档命名成“版本号+上线日期”，便于识别。制作为模板后，每个版本花半天时间就能完成分析记录。清晰简明的文档让后续回顾某个版本的修改点和数据变得简单。需要模板可点击如下链接获取： https://fd0bvliidp.feishu.cn/docs/doccn52pJfYmUxrl4eIiqyF4mYf欢迎关注作者的微信公众号：「龙爪槐守望者」本篇来源：优设网原文地址：https://www.uisdc.com/burial-point-and-data
标题排版在画册设计中有着很关键的作用，标题排得好可以让整个版面的气质提升不少，反之亦然，而很多设计师在排画册的标题时，通常都是单纯选择一个笔画较粗的字体，把字号拉大与正文对齐，这种标题的排版太过常规，容易导致整个版面缺乏设计感，比如下图。其实画册的标题也能排出许多新意，本篇文章，葱爷来给大家分享几个可以给画册设计加分的标题排版技巧。更多排版案例：有哪些容易上手，而且特别出效果的版式设计技巧？排版的技巧有很多，而且随着设计的发展，每过一段时间都会有一些新的技巧流行起来，葱爷今天要给大家分享的这 7 个技巧，也是近几年比较流行，且容易上手、容易出效果的排版技巧。阅读文章 > 描边字错位组合上图是某院校招生画册的“学院简介”排版，由于太过讲究对齐，缺少变化，所以显得不够灵活，我们可以把标题的中英文词汇拆开进行错位排版，错位时要注意左右的平衡，另外，三行错位比起两行错位的变化会更丰富一些。单纯只是做错位处理，效果并不怎么好，因为没有层级关系，所以可以再加上字号大小的变化，突出重点词汇，弱化次要词汇。这样层级丰富多了，但是众多很粗很黑的字体挤在一起略显压抑，把其中部分词汇改成描边后，整体就变得更透气、更有设计感一些了，注意描边要细一点，以避免描边的笔画重叠在一起影响识别性和美观性。标题排好以后，再根据标题调整一下内文、页眉、页码的排版，内文通常会对齐标题中的某个字词，但一边对齐就好，不需要两端都对齐，页眉、页码可以作为装饰来排版，填充一点颜色可以让版面变得更活跃。彩色标题叠加灰色图片还是拿前面的那个案例举例，把学校图片换成一张没有去底的矩形照片，然后把它处理成黑白色照，移动至版面上方，标题使用蓝色压住图片的左上角，这时标题就不是孤立的几行文字了，而是与图片形成了一个整体，这种排版方式在网页设计中比较常见，用于画册的标题排版，效果也是很不错的。图片做出血处理显得更大气，左下角的页码与标题左对齐，可以加强版面的整体性和关联性。手写体搭配黑体同一个标题我们通常只会使用一种字体（不包括英文），但有时候也可以试试用两种字体搭配来使用，比如手写字体搭配无衬线字体，这两种字体在风格上完全不一样，对比非常强烈，能够给版面带来新意。由于该中文标题过于简短，所以搭配上英文会更丰富一些。正文刻意与标题进行了错位排版，当然，同时也保持着某些对齐关系，图片的排版同样如此，与正文错位，但与标题左对齐，整个版面既灵活又很有序，符合学校画册的调性。文字叠加色块加色块是标题设计中常用的手法，但如果只是用一个色块把标题包住，那么效果是比较普通的，很容易像促销折页的做法。所以我们可以只把色块作为标题的一个装饰元素，用一个小小的色块放在标题后面，使其视觉上更丰富、更突出。图片的刻意错位很关键，如果图片与正文两端对齐，那么英文标题、正文、图片、页码都是沿着一条直线对齐的，整个版面就会变得生硬很多。文字加色块还有另一种效果也不错，即把文字色块合并在一起做成补丁效果，首先把文字错位排版，然后分别给每一行文字加一个色块把文字框住，色块与色块上下相连。搭配上序号和英文标题，丰富标题的对比关系，使其更美观、更有设计感，色块可以根据需求适当超出文字的长度。正文的排版我做了一点改变，把第一段单独拿出来作为引文使用，刚好这段文字在内容上也正好是起到提前说明的作用，这样处理后这个版面也变得有了一些新意，标题十分显目。手写体跨版在画册设计对于有些版面，可以排得大气一点，比如把原本可以 1P 排完的内容排成一个跨 P，这时标题也可以拉大跨版排列，这种做法可以加强文字的大小对比，也会有更多留白空间。为什么用手写体呢？宋体和黑体不行吗？其实也可以，不过由于汉字的笔画比较复杂，宋体和黑体又比较方正，所以拉太大排列时会显得不够灵活，如果是英文则会好一些，所以在排版的时候我还做了倾斜与裁剪处理，并且搭配了英文进行错位排版，不然会显得过于单调。标题与正文左右排版在竖版的画册中，我们通常喜欢把标题排在正文的上方，而如果把标题与正文左右摆放，那么又会有种不一样的感觉。但不要把标题与正文水平对齐，那样的话标题的空间就过小了，会显得很压抑，而是要把标题放在正文的左上方，并保持某些对齐关系。如果把这种排版方式看成是分栏网格，那么它属于不对称网格，即正文栏应该比标题栏更大一些，以保证有足够大的空间排列正文内容。标题栏可以有大量留白，页脚可以与标题形成呼应，丰富版面的细节。扭曲标题这种标题处理手法在海报设计中比较常见，其实国外很多画册也这么做，效果很酷，冲击力很强。用中文来做这种效果行不行呢？也可以，不过不适合太严肃的画册，用在设计类和时尚类的画册中会比较合适，比如前面列举过的设计书籍的排版。由于文字较多，所以进行分行错位处理，然后在顶部菜单栏中选择对象-封套扭曲-用网格建立，把网格参数设置为 3 行 5 列。移动网格的锚点使文字呈波浪形，如下图。拉拽锚点左右两边的手柄使波浪形变得柔和一点。波浪效果做得差不多后，按快捷键 E 调出自由变换工具面板，并选择自由扭曲工具，把标题扭曲成如下效果。再调整一下细节，然后把它放在版面中，把内容篇章的序号处理成描边样式与标题叠加在一起，可以起到装饰的作用。扭曲的标题搭配上鲜艳一点的颜色，效果会更时尚，对于这种版面，正文也不要排得过于规矩，所以，我刻意把版面中的两张图片做了错位处理。打散排列通常我们会把标题文字集中排放，但对于设计和时尚类画册，我们可以打破传统的做法，把标题做适当的分散排版，效果也很不错，当然，标题文字如果太少就不合适了。另外，为了使标题更特别 ，给文字加上下划线效果会更好，并且下划线可以根据需求适当延长，以加强这些分散文字的关联性，甚至还可以加上英文做装饰。正文的排版与标题文字左右两端保持对齐。结语设计是一个不断尝试、调整的过程，排标题同样也是如此。另外，标题的排版固然是很重要的，但是想要整体效果得到比较大的改善，正文、图片、页眉、页脚、页码的配合也很重要，永远要把整体的大效果摆在第一位。欢迎关注作者的微信公众号：「葱爷」本篇来源：优设网原文地址：https://www.uisdc.com/8-title-typesetting-skills
本文将讲解设计前、中、后的结构，总结设计师在什么样的阶段采取什么样的策略能提高过稿率。上篇回顾：如何快速提高过稿率？我分3个阶段帮你完全掌握（上）不知道你是不是跟曾经的我一样，在刚入行 1-2 年的时候，过方案稿的时候对自己的设计提案并没什么信心，怯怯的说不出个所以然，经常被评审的产品、开发等上下游问懵了，然后现抓理由缓解尴尬，会反复修改，找不到感觉。阅读文章 > 过了“望闻问切”的设计需求评估分析阶段，已经有了较为深入的了解，可以针对产品目标、制定设计目标。在交互设计输出后，视觉设计可以转战如第二阶段大展拳脚！关键词：方向、分析、输出1. 按流程输出避免返工按照流程输出的好处：能够达成方向的共识，提升设计的效率。避免或减少我们再输出了全部页面之后，相关决策人提出风格不符合推翻重来或反复加入自己的主观审美争论不休。我们部门的会将视觉设计主流程按节点拆解为：阶段 1：确定风格好的开头时成功的一半。若大方向若不对，后面的努力都是白费。产品在 0-1 探索阶段或 1-2 视觉升级版本的阶段，我们需要花费较多的时间去确定风格。有些产品不理解这步的必要性催着设计立即执行，设计师有必要科普下情绪板的指南针作用，磨刀不误砍柴工。合理利用设计工具：能够与相关决策者以较小的时间和实践成本达成风格共识。设计师也在着手设计前做到成竹在胸，围绕着“关键词”作为方向锚点进行设计，降低后续方向跑偏的风险。后续可以在评审作为设计考核的判断依据。（1）因果正向推导：情绪板找大感觉情绪板一般是根据我们自身产品、人群定位——分析关键词——寻找代表性图像——指导设计。找到大的感觉方向，再去推导设计结果。从“为什么why”去推导“是什么what”。在使用情绪板时，除了图片罗列，我还会为提取风格的名称或关键词作为标题、列出根据关键词（视觉映射、感觉映射、具象映射），提取归纳共性的色彩、质感、形状等。包括适用的场景、优势劣势、风险成本机会等角度分析，帮助产品理解。如果时间充裕，可以邀请用户或相关决策者共同参与情绪板的关键词、和图片筛选。网上有很多制作情绪板的方法这里就不展开了。情绪板经常被吐槽？简单4步帮你做出用得上的情绪板！几乎大部分 UI 设计师在作品集里都会放入“情绪板”这个模块，但是这个模块的利弊其实都很明显，大家都想通过展示情绪板来告诉面试官我是如何定义色彩和产品的视觉风格调性的，但是大部分设计其实在做界面之前都没有做过情绪板，而是反套的。阅读文章 > （2）果因逆向推倒：竞品分析、拆解竞品分析往往是根据已有的设计结果去拆解：界面带来什么样的大方向感受？拆分页面结构&设计元素“形、色、字、质、构、动”如何配合实现？有什么样的创新和可借鉴的地方？为什么要采取这样的设计策略，他的目标用户、承载的内容、和产品定位是怎样的？从“是什么(what)”去推导“为什么(why)”。两者都有必要性，“情绪板”我们根据实际情况可以采取抽象自然的物像，也可以配合更具体的元素拆分。通过对竞品的拆解，也会让我们减少设计上的“撞衫”和创造“方轮子”，思考为什么大家都用“圆轮子”的合理性。（3）产品拟人化一个前辈告诉我的小技巧，觉得挺好用推荐给大家，把产品拟人化：把你的产品和典型目标用户群里对应起来想成一种类型的人，他有什么样的外形特征，有什么样的品味，他有怎样的行为模式，带入同理心他与别人会如何对话交流。这个形象越是和目标用户重合丰满，界面设计风格和文案一致性就保持的更好，目标群体的自我形象认知和产品形象认同感就会更吻合。阶段 2：2-3 套主视觉风格视觉提案一般选择 1-2 个界面，如主页、详情页等界面，或者出现用户密接频次最多的操作页进行主视觉风格尝试。以 2 套及以上方向差异性较大方案为佳。阶段 3：全部页面视觉输出评审在风格确认后，第三节点全部页面的输出要保证重要界面易用，次要界面可用。多花时间和精力放在产品优先级高、用户操作频次高的界面优化上。阶段 4：视觉基础&控件规范梳理其实在做完典型页面后，已经可以开始着手基础规范梳理及简单常用控件规范。全部页面完成后对控件规范进行补充整理。规范的制定，可以让设计、开发协作更规范高效。阶段 5：标注切图现在我们基本上已经能够通过协同软件进行自动标注。但弹性控件，图片大小屏适配、操作热区等，一些设计师自知而开发不一定知道的规律、准则我们也需要主动用文字标注出来，避免因理解不统一造成的开发翻车，最后设计也跟着连坐。切图时提前与开发预沟通，可能需要采取一些较为特殊的切图形式。学习“盒模型思维”，用开发的盒模型思维去切图标注，元素间距、点击热区。关于盒模型：6000 字干货！写给设计师的开发沟通指南前言“这个做不了、很难做的啊、我没时间啊、改这个有什么意义吗？阅读文章 > 阶段 6：开发跟进验收设计不是交出去的那一刻结束的，提前通知产品、开发为设计效果还原验收预留时间和还原度程度要求，保证我们的“孩子”能安全落地。一般会在第一轮验收时以文档形式：设计图和实现图差异对照标注，问题清晰说明并给出解决方案（如间距调整：XX 间距上移 10px），标出优先级 p0\p1\p2，对于反复提交无法达成一致的问题搬个小凳坐过去可能更高效。推荐截图工具 MAC 软件「xnip」 https://xnipapp.com/非 Mac 端推荐这款：设计神器！提高工作效率的截图软件Snipaste@短腿僵尸木：只要你是一名办公室职员，不管是否是设计师，都需要用到截图软件。阅读文章 > 2. 如何找参考没想法时，如何获取灵感呢？考验“搜商”的时候到了，我一般会从以下方向去搜索：（1）同类产品同业务类型的产品（2）同形式同表现形式的，如卡片式、邀请函形式…（3）同风格调性同风格的如科技风格、美漫风、酸性风、像素风、孟菲斯风格….感觉关键词：高端、文艺、小清新、传统..（4）跨界突破：跳出自身行业、产品类型限制。同行互相看很容易审美趋同，比如这段时间 UI 设计很流行用磨砂玻璃图标、3D 建模。开始新鲜流行的东西，过一段被大量使用就泯然众人，同类产品我们看的越多，越容易被反复强化思维定固住。看同行业的作品没想法，完全可以跳出行业类别，熟悉的事物形态，去看其他行业的优秀作品，摄影、服装的肌理、舞台、工业造型、海报设计…，重组融合固有元素。说不定会有新灵感，跳出趋同化。（5）同目标人群比如我们的目标人群是年轻潮人，我们想要打造年轻化的界面。除了用撞色、动感图形等表达年轻人的潮、酷等特征。我们也可以下载年轻潮人常用软件和常看的综艺节目，了解年轻人的喜好、表达方式、行为方式、搭配审美等，针对提取到的特定人性特征，采用更个性化、标签化、流行等元素，表达采用年轻人的口头禅。找到参考之后，不是要照抄，而是要站在巨人的肩膀上学习，用“形色字质构”的分析法拆解表现及原因，再结合融入到自己的设计中，新瓶装旧酒。3. 谁说视觉设计不需要动脑！想的越清楚，对产品 PRD 及用户深入思考，了解功能，并在设计稿中得体的表现出来，更大发挥设计的价值。你也可以理直气壮的说：人、功能、场景、风险项我都考虑到了，我这样设计都是基于什么样依据的得出的。从这些的角度可以更全面的思考设计：（1）带入不同的角色把自己当成用户，带入不同的「用户角色」：新用户、老用户、普通用户、专家用户的操作经验，是否需要操作新人指引、专业名词用户是否易于理解？重点内容该如何强调？图标的示意是否是可被理解的？带入不同的「协作者角色」：产品希望突出的重点是？开发的实现成本？运营的包容性怎样？…（2）从场景出发：场景要素：用户、需求、事件、环境状态、载体状态、人物状态产品组成：形态、功能、内容用户通常会在什么样的时间、地点、满足什么样的目的以什么样的方式使用产品？早、中、晚使用高频时间段是？使用的环境是否会有干扰被打断？是否有多线程任务需要进度提示？…（3）从功能完成出发如何引导用户操作主线任务；如何引导用户分流至支线任务；如何引导用户视觉动线、关注点。目标达成需要增强设计氛围感还是信息降噪？信息间的层次该如何区分？如何避免用户误操作？等等4. 至少 2-3 个方案（1）自我突破多出方案多去尝试，经过长期验证，我发现最优秀的设计往往不会在第一稿时出现，往往是在自己的能力圈内的保守方案，越做越有感觉，越能打破原型图的布局束缚，长期看对自己的设计能力也有提升。没法每次都做到 100 分尽善尽美，但可以每次都尝试做更好，每天进步一点点，瓶颈期的时候才会逐渐突破。（2）差异化输出方案之间的差异性最好大一些，保留保守的方案和大胆突破创新方案，我习惯在提案时标注分析每个方案的特征，和方案的优劣点，书面化梳理思路。这对日后整理作品集也会有帮助，帮你想起来当时为什么这么想这么做。（3）更多的选择出多个方案也可以在评审时，分散下产品的注意力在选择上，而不是集中火力对一个方案的挑剔上，多次提出不同的修改意见。甲方总是贪婪的，想要看到更多的可能性，有对比才更方便做决策，那就提前把更多的可能性展示出来。5. 选择好看的图片 or 真实的图片结论是：好看的图片 or 真实的图片全都要！之前发现很多设计师，只选择用好看理想的素材图片去提升整体的设计调性。好看的图片确实清晰、疏密得当，美观干净，在提案的时候能让我们的设计锦上添花。但如果项目落地是涉及到用户可以自由选择上传图片这类 UGC 内容，图片的质量就不是我们所能够把控的。那各种情况都可能发生：杂乱的图片、透明的背景、纯白纯黑的背景都会使得可读的文字信息或操作图标识别性变差。如果我们在设计时也用真实情况的图片去验证，寻找更好的解决方案，根据实际情况去添加蒙层、为白色文字加上投影是不是就可以避免这类影响体验的情况发生。同理在输入条件不可控的前提下，尽量多用真实数据或素材去更全面验证设计的合理性。例：用户可自定义背景的复杂情况影响图标即文字识别小结：设计中关键词：多分析、多尝试、多验证，意在笔先。下篇分享下提案的一些经验总结吧～希望与大家多多交流，共同进步同一个设计稿，如何让过稿率提高70%？本文作者介绍了进行设计评审时可以提升评审效率，帮助设计师和与会者更好地进行沟通，并顺利推进项目的一些方法，希望对您有所启发。阅读文章 > 本篇来源：优设网原文地址：https://www.uisdc.com/design-review-up-2
6月第1波设计干货合集来了！这次的合集中有好几个图库网站、图标库乃至于专门下载免费素材的设计网站推荐，简单来说，就是大家日常永远不够用的那些「优质设计素材」，在结尾我还附赠了一个颇为有趣的、设计感十足的小游戏，希望大家能够劳逸结合。对了，上个月的干货合集也记得看看：第一波！2022年5月精选实用设计干货合集五一假期结束了，给大家贡献一波设计干货吧！阅读文章 > 第二波！2022年5月精选实用设计干货合集五月的第二波设计干货合集紧跟着就来了！阅读文章 > 第三波！2022年5月精选实用设计干货合集五月第三波设计干货合集来了！阅读文章 > 第四波！2022年5月精选实用设计干货合集五月第四波设计干货合集来了！阅读文章 > 下面我们具体看看这一期的干货：1、定制矢量插画动画的图库工具https://designstripe.com/crayonCrayon 是一个实用性非常强的工具，如果你有 SVG 格式的矢量素材，可以上传到 Crayon 上将它改成动画，如果你没有素材，可以直接在 Crayon 的素材库中寻找你心仪的插画，然后将它制作成你能用的动画，非常方便！2、超多高素质图标的 Figma 图标库https://www.untitledui.com/icons这个图标库有胆子自称为终极图标库，肯定是有两把刷子的——从设计的素质上来说，这套图标库是高度统一的 Figma 原生图标库，不是从别处移植来的，从数量上来说，它涵盖 3500 多个不同的图标，怎么着都能覆盖日常的需求，风格上来说，现代而清爽，涵盖多个不同的常用样式。这种用心制作的图标库，一定要收藏。3、免费插画素材下载网站https://freeillustrations.xyz/这个名为「免费插画」的网站就非常直接，它专门为你搜罗各种免费的插画素材，有的是个人项目，有的是商业项目，需要稍微注意一下这些免费素材的适用范畴。4、免费3D风插画素材包 Salyhttps://www.figma.com/community/file/890095002328610853这是一套完全免费的 3D 风格的插画素材，你可以在 Figma 当中直接适用。这套素材包含有30+ 插画，而且还在不断的更新和新增，你可以根据自己的需求对这些插画进行调整。5、合理又友好的开源配色库https://reasonable.work/colors/Reasonable Colors 是一个开源的配色系统，用于构建可访问性良好且美观的配色方案。这套配色系统中每组颜色都严格遵循 WCAG 的用色对比度标准，确保两个颜色之间的对比度足够大，可用性较强，但是又不会显得突兀，这套配色系统对于绝大多数的网站和 APP 而言都足够用了。6、在线3D设计渲染和应用工具https://www.vectary.com/Vectary 是一个新近出来的 3D 场景设计工具，或者说是包含工具的设计服务，它内置了大量的免费场景、模型以及素材，你可以直接借用这些元素来快速搭建场景，也可以完全从零开始设计。这个工具并非完全收费的，用户可以免费使用部分服务，并且最重要的是，你可以借助官方插件，在 Sketch 和 Figma 当中调用它。7、设计感超强的视频灵感库https://www.showreelz.com/对，这个名为 Showreelz 是一个灵感库，其中搜集了大量素质超高、设计感足够强的视频内容，可以给你制作视频、寻找设计灵感提供有效的参考！8、配色有趣的益智小游戏https://eightcolors.net/其实严格意义上来说，这并不是一个设计工具，仅仅是一个配色非常有趣且好玩到停不下来的在线益智小游戏，越往后的关卡颜色越多，图案也越复杂，通过方向键和Shift 键来挪动位置和小圆点，拼合出底部给出的图案，非常适合摸鱼的时候玩玩……本篇来源：优设网原文地址：https://www.uisdc.com/2022-6-design-resources-vol1
近期整理我在 ACCD 学产品的笔记时，考古出了一波阿森特（ArtCenter）教我做人系列。笔记上记录了许多以前导师们关于做人、做事、做设计的语录，放出来「回锅」共勉。有些是导师课上对所有人说的课堂语录，有些是单独沟通时的私下语录，觉得有趣的都记了下来，毕业一年之际回看那些话依然蕴含了很多哲理。其中一些在四年时光中做到了，一些刚开始领会，一些已经遗憾“如果更早知道”。Consider some of the lessons learned, or at least noted.所有语录均记录自我在 ACCD、PENSOLE、INSEAD、PDX、品牌项目期间的导师们，但我的笔记里没有明确给每一句话标注，以及有些语录有原作者…特别声明：翻译、解读和 Typo 均出自我个人，尤其是 typo。编者注：艺术中心设计学院(Art Center College of Design)，简称ACCD，于1930年成立，是一所世界知名的大学。语录合集：讽刺语录海报！设计师对客户的70 条神吐槽（一）以下 70 张讽刺海报出自 Mark and Paddy，这是一家爱尔兰的广告公司，所有吐槽均来自真实的甲方客户。阅读文章 > 讽刺语录海报！设计师对客户的70 条神吐槽（二）以下 70 张讽刺海报出自 Mark and Paddy，这是一家爱尔兰的广告公司，所有吐槽均来自真实的甲方客户。阅读文章 > 讽刺语录海报！设计师对客户的70 条神吐槽（三）以下 70 张讽刺海报出自 Mark and Paddy，这是一家爱尔兰的广告公司，所有吐槽均来自真实的甲方客户。阅读文章 > 语录将大致分为：「一堂必修」、「学习工作设计的态度哲学」、「做设计和做事的具体执行」、「演讲和沟通法则」、「一些自我和工作管理的启示」。先发第一集，有兴趣的小伙伴可以持续关注。第一集：一堂必修The first lesson you don’t want to miss.一些“学艺先学礼”，以及“如果从一入学就知道或开始的事情”。1. You are here to learn, not here to prove. 你是来这里学习的，不是来这里证明的。这句话来自第四学期 Jin 的 Viscom 课堂，听到这句话时就有一种茅塞顿开的感觉，但依然到现在也不能完全做到这一点。对于很多人，我们经常会有要证明自己的骄傲，承认不会和寻求帮助确实不简单。但是学校和社会的每一个新阶段，都需要不断的学习，只要想想这句“不是来证明的”，很多自我较劲都可以释怀。2. Enjoy the pain.享受痛苦。这句话在入学前就听 Karen 说了（那年我们的系主任，现在的校长），当时天真的我一笑了之，后来发现是我天真了。这几乎是学校的普适价值观。学不会苦中作乐，痛苦就只是痛苦。我的快乐是边干活边唱歌。（对不住我的同学们 ）3. Get your Instagram, Facebook, Linkedin ready, and purchase your website domain. (Before you get famous)准备好你的 Instagram、Facebook、领英等社交账号，购买你的网站域名。（在你成名之前）这是产品系第一学期入学 Meeting 时，系主任 Karen 和几位导师围坐在桌前，围着我们这届 7 个新生说的第一个建议。社交账号是多数时候的第一张名片，在疫情下更甚，Ins、FB、领英三管齐下搜索就可以大概勾勒出一个人的画像。ACCD 产品系的每个学生最晚在第四学期都需要拥有个人设计网站，如果名字的域名和品牌重合就会非常昂贵，通常越籍籍无名时购买就越便宜。聊天时甚至有同学（是谁不点名）畅想说应该每学期在 ACCD 新生入学时就把潜力股们的名字域名统统买下来，等他们开始做网站或出名了再高价售出。声明：非投资建议，本人概不负责，学弟学妹早点买域名吧。4. Check your email.查邮件。一些信息差就来自查邮件，群组消息，和社交媒体。邮件和各种群、社交媒体里的活动，机会，实习，讲座，被夹杂在各类信息里很容易忽略，有时候看到信息的瞬间就已经赢了。很遗憾我的 FOMO（Fear of missing out)在记得要查邮件这件事上毫无体现，甚至几天前刚刚又上了这一课。所以在我写到这里时，去日历上标注了一个每天 5 分钟的日程提醒自己查邮件，希望能有所改观。5. Take courses from other majors.多上其他专业的课。学校里几乎很多 ACCD 学校导师都会提这件事，交叉学科学习真的很重要，多学习其他专业更容易构筑起自己的多元文化模型。在学校里有一个学期我尝试了一些方向，于是选了广告、交通、产品、娱乐，还有商业相关的课程。除了在几个系的思维模型之间撕扯，可以发现每个系都有自己的角度和局限。去别的系体验一番可能会发现自己的潜力，或者碰壁之后会发现还是本专业可爱，找回热爱好方法。毕业前的最后一学期我修了一堂纯艺的文化课，那节课关注对时事的调研和思辨并最终落地到自己的艺术作品。课堂上大家愿意包容开放地去讨论当时全球的疫情、政治、文化事件，探讨、谈论自己的理解和感受，还有墨、非裔的二三代移民同学会分享自己祖辈的逃亡、迫害、移民等经历。这是我在之前偏重设计和商业的课堂氛围里从没感受过的一种人文关注，很庆幸毕业前有这样的经历，以及庆幸有这么一群人在共情世界上的发生并尝试做些什么。6. Utilise the resources here, you don’t get free access when you leave here.珍惜在学校的资源，离开后就没有免费权限了。这句话的背景来自图书馆老师对学校调研资源的讲解，毕业后很多昂贵的调研网站就要花钱了。事实上很多关于学生身份所带来的便利和福利，在毕业后都会消失。不论是校园、城市里针对学生的出行、学习、软件、金钱资源，调研时调研对象的开放友好程度，Coffee Chat 行业前辈愿意帮助你的程度…都和学生这个身份脱不了关系。所以要珍惜这个时效性，毕业后偶尔想做些事情，都会恍惚自己不再拥有作为学生的“免费特权”。7. Start networking.现在就要开始人脉社交。结识人脉是在 ACCD 第一堂课开始以及去到每一个地方都被不断提醒的事情。人脉会形成信息差，很多工作学习机会，是多一个 Linkedin 好友或者邮箱就多一分概率的事情。很多行业信息也来自口口相传，不论是同辈还是前辈，都需要有意识地沟通交流，眼界和知识量都是在交流中促进的。第一学期在校内环境时感触还没有么强烈，产品课期末的嘉宾到来时，我们更多是在为 Final 结束松一口气。直到第一学期结束的假期我去到 PENSOLE 做球鞋设计，我才发现社交不是嘉宾提问我回答。PENSOLE 是 Sneakerheads 的天堂，每天有各个运动品牌的设计师来串门。当时感觉像意外闯入了高年级学生的生活，才发现他们每个人都准备充分，简历、作品集、手绘草图，倒背如流的个人介绍和项目内容，不经意地问起对方设计师所在品牌或项目，浅谈一下自己对该品牌该项目的了解和对球鞋的热爱，适时地表达自己正在寻找实习… 当时我在干嘛，在记笔记。如果能从第一学期就开始做这件事，到高年级的时候就不是开始攒人脉，而是开始使用人脉了。另一方面人脉是相互的，在我们热切地想和行业前辈建立联系的同时，他们中许多人其实也很想和新生代建立联系，所以不必拘束，可以作为晚辈主动迈出这一步，不用觉得自己在索取。默念三遍：只要我变得厉害，对方就有用得到我的地方。哈哈哈人脉不止要建立，还要定期维护。一个学姐兼好友 Anna 曾给我分享了她的人际维护 Excel 表格，里面记录了每个行业人脉背景，需要的邮件 & Coffee Chat 周期，和之前聊天的内容，当时我大为震撼，但是想一想确实很多诸如此类费脑的工作确实交给 Excel 比自己记忆高效多了。8. You need to talk.你得沟通交流。进入陌生的领域，可能大家都会经历一番挣扎。这是第一次在 PENSOLE 时 D’Wayne 对我说过最多的一句话，也是我上的最重要的第一课。他说你在台上是个很好的演讲者，但你不能只在台上说话，台下也要交流。其实当时是我最初生牛犊不怕虎的时候，毕竟面对行业大咖我也不认识对方是谁… 困住我的不是害羞内向，而是在当时我对球鞋和嘻哈文化一窍不通，当其他高年级的Sneakerheads主动上前侃侃而谈时，我还在尝试跟上他说的什么是小众潮牌然后搜索，当时连名称都拼不全… 当然我深刻认识到开不了口的根本原因，还是输入不够。好在当时经过几天调整我也找到了自己的方式，虽然无法主动上前开启话题，但我的优势是墙上贴着的草图常会吸引来转悠的设计师们，尤其发现我才第一学期会提起他们的兴趣，在球鞋行业资深了太久的设计师们太少遇到完全陌生的小白，而格外热情主动。他们太想要告诉你这个领域有多棒了，所以我做的就是端住这碗热情，让对方疯狂输出然后我努力记笔记。9. Go say hi.去打个招呼。这是嘉宾在我作品前徘徊，我却在远处啃着披萨踌躇要上前去说什么时，导师 Kevin 在身边的提示，当然最后他充当僚机和我一起走了过去…后来才发现这件事其实是个很简单的流程：当有人在贴在墙上的作品前驻足，你要做的不过是去打个招呼，说一句“Hi，这是我设计的”，绝大多数嘉宾接下来会让你介绍一下项目或者夸你一波，你再问问对方的工作和背景，记住名字回头加 linkedin 即可。学校内外的项目和活动中，通常都会有一个披萨或鸡尾酒派对，如果对方是主办方或者演讲者，从活动或演讲内容开启话题也不错。不用想太多，怕露怯或者闹笑话。（而且社交场合真的很需要笑话，能在人群中担任一个笑话也是让人钦佩的角色 hhhhh）事实上就是非常娴熟社交的人极少，能做到真诚、想说和敢说就很厉害了。10. Whenever someone invites you to their company, bring your laptop.有人邀请你去 TA 的公司，带上你的笔记本电脑（里面的网站和作品）。发生在导师 Emily 邀请去她的工作室，我真的只带上人就去做客了。然后她认真地给我普及了我这个道理…毕竟当对方邀请你时，大多是对你感兴趣的，带上电脑你们总能在坐下喝咖啡的时候聊聊作品，看看简历，对方也许就会给你提供一个机会，或者至少可以给出一些建议。11. Study before you go.去哪之前要先调研。去 PENSOLE 前 Karen 和 Kevin 在动员会说的。承接上一段，前几学期我总有只带着人和热情去某个地方的毛病。直到后来才逐渐意识到，如果不做足充分的准备，会让本就短暂的时间失去很多价值。那些机会不会重来，提前了解信息才能让这段经历变得更有意义。12. I‘m an open book. Ask questions when you are here, you don’t get that opportunity afterwords.我很愿意坦诚交流。当你在这里时多提问，离开这里就不会再有这样的机会。这也是在 PENSOLE 时 D’Wayne 说的。在学校、公司面对面的时候，对方会把自己的时间承诺给你，你可以提很多问题当面交流，一起吃饭或者咖啡，但当你离开后，即使非常熟悉，也会很多天才会发一条信息，几个月才会写一封邮件。当你再想提问聊天时会担心打扰对方忙碌的日程。所以有想问的问题，一定要珍惜在那里的机会。13. There’s no such thing as getting all A*s in college but that’s fine.大学里不是所有课都一定能拿 A 的，但这并没什么关系。第一学期导师 Arnie 说的，其实他说之前我还没意识到大学里会有人在意成绩这件事情…心态上对于成绩，我一直是一个只要不影响奖学金，60 分很好，80 分万岁的人。但现实却是有时会被推着卷，有时忍不住卷，有时不得不卷，有时太菜了卷不过哈哈哈哈。但是回头看，学生时代拿来卷的很多时间其实可以分摊给许多更有长期意义的事情，多睡觉健身，多看新闻，多旅游，学习投资理财和了解这个世界的参差…都很有意义。14. Don’t beat yourself up.别逼坏自己。这句的背景好像是导师在宽慰一个同学的耿耿于怀。和上一句一起，有很多投入和强求在回头看时都没有必要。我始终觉得 7 分力对我是最舒服的状态，可以保持松弛和平衡，也对得起这份时光。如果七分力之后得不到就不强求，因为生活中可能有更好的选择在等你，别 force 自己进某条轨道。毕竟精力有限，如果一件事情太用力，可能另一件就使不上力了。15. Some students don’t shine until they are 6th term, or even graduate.有的学生到第六学期才发光，有的学生可能毕业后才发光。第一学期时同届原本就只有几个人，还是有人中途离开了。所以第一节产品课的期末，导师说了这段话来鼓励感受到挫败的学生。ArtCenter 一直是中途淘汰率很高的学校，高压、快节奏和同辈压力也容易为学生带来焦虑。别太早做了放弃的决定，后来会发现最初的艰难其实不会一直那么难，只是那时我们还不知道。16. Don’t underestimate yourself. You never know.别妄自菲薄。不试试怎么知道。这是每次提及我的新计划和新尝试时，导师 Kevin 会说的一句话，不试试怎么知道自己不行呢。（当然不排除试了可能会发现真的不行。 ）但试过了不亏。17. You can always learn from an internship.实习总是能学到很多东西。这是给导师 Pascual 助教时，他在产品课堂对第一学期学生说的。ACCD 非常强调行业经验，我原以为在校期间多实习是大学生的共识，直到毕业遇到更多其他学校的学生才发现不完全是这样。实习确实是最低试错成本的尝试，即使是非常不对口的实习也可以帮助排雷。那些都是叫做产品设计的实习，不同的行业、公司、领域都不一样，毕业前找到适合自己的岗位就依赖实习了。18. Never work for free.别免费干活。每一届新生的入学第一课都会强调。学校不让免费实习，强调“你们的工作值得报酬”。如果想问不给钱给学分行不行，答案是不行，没有薪水凭证的实习 offer 学校根本不批学分。19. Don’t use all capital in the email title.不要在电子邮件中使用全部大写的英文标题。在英文邮件中这代表愤怒。20. Don’t text before 9 and don’t text after 9.不要在 9 点前发短信，也不要在 9 点后发短信。和行业前辈发消息的礼貌，注意不要打扰到他们休息。21. Don’t ask the questions you can search on Google.别问可以在 Google 上找到答案的问题。别浪费别人时间。22. Build your personal brand.打造你的个人品牌。这也是学校里从第一学期开始就强调的东西，打造自己的个人品牌，名片简历，社交账号，给人留下的印象，专业和领域，设计风格和个人影响力，都很重要。毕业进入互联网才意识到对于整体个人品牌，自媒体等社交平台是非常重要的入口。23. Reputation is everything.你的声誉是一切。声誉特别重要，在学校的声誉会一直延续到行业，说不定就碰到校友同学。24. Don’t get burned out.别让自己过度疲劳。当自己对所有的工作学习都提不起劲，心情抑郁甚至出现躯体反应很可能就陷入了过度疲劳。高压中要有意识观察自己的状态，预防出现。如果真的进入过度疲劳了，那不如给自己放个假重新找回工作学习的意义。25. Sometimes it doesn’t work.有时候就是不起作用。导师说的是模型，但有时候是模型，有时是设计，有时是努力，有时是生活。不是每件事全力以赴就会有回应的。遇见过的每个再优秀的人，都一定有过特别挫败的时光。二八定律解读挫败这件事大概也成立，有时候人的努力就像在空谷呐喊，十次尝试里能有两次回应就已经很好，别轻易放弃。但是和自己和解是必修课，越早及格越好。26. Someone can be your student one day and be your boss another day.有人可能有一天是你的学生，某一天就成了你的老板。第一学期的第一节产品课，导师就说了这句话，告诉我们刚有一位以前的学生促成了他的一次合作。特别励志。27. Go visit when you are here.当你在这个城市的时候，把握机会多走走。这是跨专业上交通设计课时导师说的，当时他想让大家在紧张忙碌的周末中抽出一个下午去看复古车展，那会课堂里的学生都是国际生，加州对于很多人是一段旅程，于是他展开了一下自己以前没能在生活的城市多看看的遗憾。但这大概成为了疫情后最戳心的一句。那些以昨天太忙今天太累推脱的说走就走，在疫情后变得如此珍贵。28. Clean up.清理自己留下的东西。有时候长大了会忘记幼儿园学的道理。 在学校里偶尔大家离开教室会忘记把东西收拾干净，有时候是通宵后的教室忘记在课前收拾好。所以也会有导师要求班级里课前东西都要收拾干净，否则整个班都没有准备好。在 PENSOLE 也没有清洁工，所以 Studio 的值日工作也由大家轮流。29. Don’t be late.别迟到。在 ACCD 基本上导师们都比较强调这件事，对此也有很多传承下来的治理手段…温和一点的通常只是扣分，或让请客全班咖啡 or 甜甜圈；Harsh 一点的今天点评直接忽略。之前在学校一间 Lecture 门口发现一张纸，好像是电影系的导师贴的，上面写着“如果你正看着这张纸，那说明你迟到了，今天不用麻烦进来了，下次请早。”PENSOLE 有一个 Hall of shame 墙，上面是迟到学生的大头照和迟到做的俯卧撑个数。（运动圈的事果然还是运动方式解决。）总而言之，别迟到。至于后来听别的学校学生聊大学旷课的经历… 不存在的，随意不来可以，直接重修就好。30. Learn from each other.互相学习。善者，不善人之师。不善者，善人之资。别人就像一面镜子，能反射出自身的问题和优势。能在一个课堂里互相学习是很幸运的事情（尤其是疫情期间）。同龄人的影响甚至可能大过导师的影响，一群人会走得更远。31. No Lone Ranger here. Help your teammates.这里没有独行侠。帮助你的队友。这是在 PENSOLE 的强调，品牌赞助项目通常需要团队协作，需要对品牌的投资负责。而你的成功非常依赖你的队友。第一次在 PENSOLE 时如果不是 CMF 队友 Chase 的通力合作，我们应该也没有机会一起回去做助教。32. Take notes. 记笔记。记笔记不光能帮助自己学习，也是一个基本的礼貌，很多老师如果遇到学生不记笔记，可能就直接不讲了，因为他觉得他付出的时间没有价值。33. Don’t pull all-nighters.别通宵。—— 每一位导师34. Work effectively, you don’t need to stay overnights.高效工作，不是非要通宵的。—— D’Wayne Edwards35. Go get some sleep.去睡会吧。—— 导师和Model shop工作人员36. Don’t pull all-nighters. Sleep for 2hours, and you can function better.别通宵，至少睡两个小时，你会运作得更好。——Nathan Allen37. There was a trend to work overnight. But that should never happen.在学校有长久以来通宵工作的倾向。但那根本不该发生。——Kevin Beard38. Don’t drink too much coffee.别喝太多咖啡。—— 导师和学姐学长39. It’s probably better to eat them than breathe them in.这些灰尘吃下去也比吸进去好。（做模型要戴好防尘面罩，别尝）—— Nathan Allen40. Don’t sleep with the respirator.但别戴着防尘面罩睡觉。—— 保安，我每每戴着防尘面罩在沙发补觉说的。真的很舒服而且空气清新，但鉴于有窒息风险还是不建议。以上一些在校关于睡眠和呼吸的经典建议。别的学校会告诉你不要熬夜，但 ACCD 比较保守，一般建议不通宵就好。41. If you don’t appreciate the time here, you are wasting someone else’s opportunity.如果你不珍惜在这儿的时间，就是剥夺了另一个人可以来这儿的机会。D’Wayne 说的。PENSOLE 对于参与的学生均不收学费，所以如果选进了项目但是浪费在这的时间，就浪费了另一个人本可以参与的资源。42. You can leave ArtCenter but ArtCenter will never leave you. 你会毕业，但是这里留下的印记永远不会消失。Kevin 说的。每个人的学业时光一定都会留下各自深刻的痕迹，别辜负这段时间吧。欢迎关注作者微信公众号：「乱炖设计哲学」本篇来源：优设网原文地址：https://www.uisdc.com/design-quotation
这是我第一篇HMI系列的文章，对于车载的热爱，我的想法就是多去分享一些行业知识，接下来让我们一起追光吧 ～拓展阅读：写给新人的车载 HMI 设计入门指南汽车 HMI 是怎样的领域？阅读文章 > 本篇来源：优设网原文地址：https://www.uisdc.com/hmi-design-system
前言“少即是多”是经常挂在嘴边的话题，在设计过程中，设计师们都会想尽一切办法去简化交互流程、组件元素及各种设计属性，让用户使用起来更简单。当产品简化到一定程度，就必须要面对其不可简化的复杂性。诺曼曾说过 “复杂是世界的一部分，但它不应该令人困惑 ”，如果复杂性是合理的，我们应该学会如何去管理复杂，考虑好复杂的问题在流向用户后以何种方式处理，筛选控件就是用户自行处理复杂信息的方式之一，只要是符合用户行为做出的设计，将应有的复杂以筛选的形式呈现给用户，让其自行决定，用户反而会乐意接受。筛选控件的使用频率非常高，本文根据笔者对各类筛选控件的拆解及自身经验进行总结，整理了在移动端中常用筛选控件的类型、使用场景以及设计思路，帮助大家在设计中选择适合自己产品的筛选控件。拓展阅读：用一篇超全面的文章，帮你掌握B端系统筛选控件的知识点最近的工作一直在和筛选打交道，为公司 B 端系统做了一次设计调整，去解决目前系统中筛选功能交互繁琐的问题。阅读文章 > 现实生活中的筛选在日常生活中，我们天天都在跟筛选打交道。设想一下，当你走进超市，在没有任何分类指示的情况下，看到琳琅满目的商品是否会不知所措，答案是肯定的，且不论超市规模大小、商品的多少，相信没有任何一个人愿意在不清楚的情况下花时间去找一个很可能不存在的商品，即便这点时间会很短。道理还没说完，大家都感觉自己很懂，可依然逃脱不了如今在各种形形色色的应用中找不到自己需要的功能而苦恼，那么这些应用又是谁设计的呢？答案就是「大多数人」。换言之，如果我们能通过标识牌、平面图指引（模糊查找），询问服务员、记忆指引（精准查找），就容易很多，这些指引路径就完全充当了筛选功能，至于通过什么方式，只能根据人们自身或现场条件自行选择，能满足自己的需求即可。在功能繁多、交互流程复杂的互联网产品中也是如此。筛选功能的重要性1. 筛选的定义在我们设计筛选控件之前，需要清楚了解什么是筛选，东施效颦不是什么明智之举。筛选，即用户根据自身需求、通过一个或多个特定条件，在已有的内容中快速找到满足自己当前条件的信息，单独呈现的同时、并将未满足条件的信息暂时作隐藏处理，以便用户完成自己的目标需求。筛选也可以称之为过滤器，是搜索框架的一部分。这里需要说明一点，筛选不同于搜索，它是系统结合用户提出的条件，对内容进行规则性的查找，准确的说，用户属于被动，筛选出的结果在产品侧「精准」、用户侧「模糊」；而搜索则是用户通过明确的目标主动进行精准查找，要么直接找到自己想要的结果，要么对结果不满意，搜索出的结果在产品侧「模糊」，用户侧需要「精准」。说直接点就是，搜索直接查找出结果，筛选只是缩小查找范围（并非绝对，也可以对搜索结果缩小范围）。2. 为什么要使用筛选在电商应用中，如果有目标的用户更多使用的是搜索，那么没有目标的用户更多使用的则是系统推荐或商品分类，不管是哪种类型的用户，前面虽然已经进行过一次范围缩减，但下一步还是逃不掉要面对的海量商品，这时，不给用户提供选择上的便利，用户很可能因浏览商品耗时过长、选择性困难等原因扭头就走，即便离转化仅一步之遥，也无法避免用户流失的问题。增加筛选功能就能很好解决这个困局，用户通过筛选、设置接近于目标需求的条件，缩短查找路径，就能从海量的商品信息中快速找到符合条件的内容，大大降低了用户的查找成本，节省了很多查找时间，用户体验得到很大程度的提升，由此可见，为什么要使用筛选，不言而喻。3. 什么时候使用筛选1）系统定义筛选需求方向性的筛选：用户通过系统提供的多种类型进行频道切换，还会存在多少子级，可定义为一级筛选。例如订单列表（待支付/待发货/待收货/待评价），优惠券（未使用/已使用/已过期）等，用户从已有的类型列表中选择自己所需。2）用户自定义筛选需求精细化筛选：当系统已提供方向性的筛选，用户依然可从分类筛选出的结果中进一步细化。例如针对单个类型的商品列表自定义价格区间、发货地、品牌…等，也可称之为二级次筛选，相比一级筛选，其筛选的结果会更精细化，也更接近于用户的真实需求。（PS：系统定义筛选条件后，配合用户自定义二次筛选条件以及排序功能，则更容易满足用户需求）常见的筛选样式1. Tab 筛选Tab 式筛选条件大部分在操作前、操作中、操作后基本都会一直显示，有横向 Tab 和纵向 Tab 两种，如新闻、视频类型的应用大多使用横向 Tab，通过将不同的内容以大的方向、区块进行分类，便于用户随时切换、筛选出不同的内容；纵向 Tab 更多则是在电商类应用中出现，且会存在多个子级，例如我们在京东购买「鼠标」，则需要在 tab 分类中依次找到「电脑办公>外设产品>鼠标」进行筛选。Tab 类型主要以大的维度进行筛选，所筛选出的结果可能模糊且信息量极大，如果想要结果更加精准，则需配备其他类型的控件进行二次筛选。2. 弹窗式筛选操作中以蒙层的方式弹出，其他时候均为隐藏状态。弹窗类型的筛选最大的优点是占用空间小，仅需一个入口，能在有限的弹出空间中从多个维度展示筛选条件，用户选中或自定义对应的筛选项，即可快速筛选出自己想要的信息。3. 折叠式筛选介于 Tab 式与弹窗式之间，筛选条件初始为隐藏状态并提供一个入口。点击后展开，期间不影响当前页面的任何其他操作且一直处于展示状态，需经过再次点击才会将筛选条件隐藏。4. 高级筛选基于自定义筛选条件过多，为满足用户个性化需求，点击后会跳转到新页面操作多个条件进行筛选。相比前面提到的 Tab、弹窗更为复杂，对筛选的要求较高。高级筛选适合用在颗粒度很细的场景，为的是避开其他视觉元素的干扰，让用户更专注于当前页面较为复杂的筛选条件，降低因受其他因素影响而出错的情况。例如：在选择汽车时，需要对服务、价格、级别、排量…等各种情况作出非常细致的选择，这时用高级筛选就再合适不过。5. 筛选、排序组合筛选、排序组合方式算是商品列表中的标配了，尤其在空间资源有限的移动端设备中，能最大化的将多个控制条件一次性展示给用户，在筛选出结果后再使用排序功能，便于更快找到想要的商品。例如美团、饿了么将筛选与排序控件形成组合，极大的提高了用户筛选的效率。筛选的几个维度1. 单维度单维度的筛选不管是设计还是操作都相对简单，无需操作确定/下一步按钮，触发筛选条件后会就会更新信息列表，大家最熟悉的订单系统（待支付、待发货、待收货…）即是单维度筛选。另外，单维度具备短、明、快的特点，为方便用户识别，单个标签一般不超过 5 个文字，且语义明确，用户不用任何思考就能快速理解。2. 多维度当产品中的属性过多，使用单维度筛选不仅会降低筛选结果的精准度，还可能会导致用户因反复/重复无用的操作而产生挫败感，已无法满足用户的需求。这时，需采用多维度筛选帮助用户缩小查找范围，让其快速找到符合自己需求的内容。多维度筛选条件一般以按钮（单选/多选）、输入框为主，有些还会以滑块来控制数据范围。设定好筛选条件需通过重置、确认操作按钮，用来清空筛选条件或进入下一步。在移动端，因屏幕空间有限，一级筛选数量最好不要超过 9 个，如果太多，建议进行整合或并入二级筛选。3. 多等级（单维度/多维度）在多级筛选控件中，可以把当前筛选条件的上一级看成是筛选分类菜单，每个等级中可包含一个或多个单维度/多维度的筛选条件，移动端最多不超过 3 个等级。从表面看，多级筛选与多维度筛选的本质是一样的，但多级筛选会存在下一级或再下一级，而多维度会将所有筛选条件平铺在空间中。当单维度、多维度筛选还是无法满足用户需求，多等级就能作为最好的延伸。筛选功能设计准则1. 迎合用户需求在设计筛选之前，需要思考用户为什么要使用筛选、在什么样的场景下使用筛选、以及如何满足用户的心理预期等，有了清晰的用户需求，设计出来的筛选才能更好的帮助用户满足其需求。以「饿了么」用户点餐为例，使用点餐服务的用户类型虽然很多，不过主力还是来自于办公室白领、宅男/女这两大用户群体，有目标的用户会从搜索、收藏、订单记录等入口直接去购买，但绝大多数用户因长期点外卖的原因，“吃什么”就成了最大的问题，这时如果用户还要“吃”，就必须得使用筛选功能，从 Tab 分类（模糊）到弹窗式筛选（精准）再配合排序功能满足自己的点餐需求，得出结论：一群不知道“吃什么”的白领、宅男/女用户；需要使用筛选功能解决自己“吃什么”的问题；问题很快得到解决后，对结果及使用体验非常满意。上面的案例可以看出，用户想要在海量的信息中找到自身所需，从表面上看，最直接、真实的需求就是找到满意的商品去下单。站在产品的角度并非如此，最应该解决的应该是效率的问题，这才是筛选的终极目标，不管用户花多长时间，笔者相信都能找到想要的，但所花费的时间成本越少，满意度就会越高，其产品的可信度、使用粘性、用户体验也随之提升。2. 不同产品不同对待筛选并非千篇一律，不要一上场就来一波大众化的筛选条件，很多 APP 首页设计就是最好的例子，什么都不考虑，直接导航栏+轮播图+金刚区+内容推荐…传统的一套流程走下来，结果可想而知。设计筛选功能时，不同类型的产品需要根据其产品定位、用户目标以及使用场景来定义筛选条件，用户需求是用来设定筛选条件范围的决定因素。例如：购物类产品需要结合商品的销量、评价、价格及知名度等，而新闻类产品侧重于用户偏好、点赞量、热度值来提供筛选，方便用户快速找到感兴趣的内容。3. 根据需求排列优先级在满足上述两个条件后也不能将筛选项一股脑的挨个排出来，即便是在同一个页面内，也需要结合当前内容的属性对筛选条件进行优先级排序，将用户高频使用的条件按先后顺序依次排列，不重要的也可将其隐藏于某个入口。以淘宝为例，在「手机」商品列表，筛选条件中首先看到的是品牌，其次是内存、容量…，我相信很少人不在乎手机品牌吧；而在「钢钉」列表中，依次是价格排序、销量…，品牌条件隐藏在了高级筛选中，试问，如果是你购买钉子这种实用性的商品，是在乎价格、还是品牌呢？总结筛选功能旨在满足用户查找需求，通过缩短用户选择商品的范围，节约查找时间，快速将符合条件的信息呈现出来，并让用户在这一过程中产生愉悦的使用体验，以发挥产品的最大价值，从而增强用户的使用粘性。至于在设计中该使用何种筛选控件则取决于用户需求和使用场景，设定符合需求的筛选维度及条件，且根据内容属性做灵活变动即可，切记筛选的核心需求是通过简单易用的方式来帮助用户提高操作效率。欢迎关注作者微信公众号：「能量眼球」本篇来源：优设网原文地址：https://www.uisdc.com/filter-control
大家好，我是和你们聊设计的花生~关于设计师必逛的灵感网站，除了 Pinterest、Behance、追波、优优教程网、站酷、花瓣这些经典酷站，我还向大家推荐过色彩灵感网站 Designspiration 和纯文字图形海报灵感网站 Typo/graphic Posters。色彩控必看！堪比 Pinterest 的色彩灵感网站 Designspiration提到设计灵感网站，Pinterest、花瓣、Behance、Dribbble 这些大家都非常熟悉了。阅读文章 > 创意满满！超7000张海报的灵感网站Typo/graphic Posters大家好我是花生~ 今天向大家推荐一个专注于文字排版和抽象图形类的海报的设计灵感网站 Typo/graphic Posters。阅读文章 > 今天继续为大家推荐 5 位值得关注的顶尖设计师个人网站，在里面我们不仅能看到优秀的设计作品，还能更深一步了解其背后的设计逻辑并学习作品呈现技巧，对我们提升设计思维和审美水平非常有帮助，一起来看看吧~王志弘个人网站「网站直达」 https://wangzhihong.com/work相信很多设计师在学习文字排版的时候，都看过或者临摹过王志弘的设计作品。作为书籍装帧设计的大师，王志弘大胆将中国、中国台湾地区、日本和西方文化元素融合在一起，形成古典与现代相结合的独特设计风格，也成为很多设计师学习借鉴的灵感来源。如果想全面了解王志弘的书籍装帧设计作品，那去他的个人网站是再好不过的选择了。在个人网站中，我们不仅能收集作品的高清图片，还能通过点击项目名称旁的小箭头，跳转到王志弘 Instagram 官方账号，那里会有关于作品信息的背景介绍和更多的作品细节图片，可以帮助我们更好的了解其作品设计的主题和背景。ACST Design 设计工作室「网站直达」 https://www.acstdesign.asia/ACST Design 是一家独立的设计工作室，创始人是知名台湾设计师汤承勋。汤承勋非常擅长书籍装帧设计，他的作品曾获得包括红点设计概念奖、NEU/NOW Festival、台湾视觉设计金奖、亚太设计奖、国际设计奖（IDA）等多种专业设计大奖。汤承勋的书籍设计包含很多巧思，也会对书籍主标题字体进行额外设计，使其能更贴合书的内涵气质，其作品无论是文字排版还是字体设计，都非常具有参考学习的价值。佐藤可士和个人网站「网站直达」 http://kashiwasato.com/读过《佐藤可士和的超级整理术》这本书的小伙伴估计对这位日本设计师很熟悉了。佐藤可士和是日本设计界具有代表性的创意大师，经手的设计项目范围极广，从产品概念到宣传、互动规划设计、视觉开发、空间设计、设计咨询都有涉及，作品斩获大奖无数。他主要负责过的项目包括优衣库、日本 7-11 便利店、洋马、三井物产、本田轻型汽车“N 系列”的品牌化项目，国立新美术馆标志设计和标识规划，东京都交响乐团标志设计等。佐藤可士和个人网站收录了大量已落地的商业设计项目，在其中我们不仅可以看到各个行业和各种不同形式的设计作品，还能了解这些品牌项目的设计背景和设计理念，对想进一步提升设计审美和作品专业性的小伙伴是一个相当棒的灵感资源库。以上就是今天的推荐，希望能为大家日常找灵感参考提供有用的新渠道，觉得有用的小伙伴记得赶紧用起来~如果大家有关于文章或者设计的任何问题，欢迎在评论区提出或者加入优设官方设计交流群（入群二维码见下方 Banner）和大家一起交流。本篇来源：优设网原文地址：https://www.uisdc.com/5-top-designer-sites
项目背景我们给用户提供的是一款专业资料查询阅读的 App，用户最看重的是资料覆盖是否全面，内容是否严谨。这就辛苦了公司的数据生产团队，必须非常及时和高效率地拿到一手原始资料，进行翻译编辑校对等工作后发布给用户阅读。为了保证效率和质量，公司自行开发数据生产后台，数据团队成员在此协作数据生产。具体逻辑如下图所示：主编是最高权限角色。负责创建数据生产任务，并且对最终生产的数据质量进行把关后发布给用户。编辑负责领取数据生产中的编辑任务，完成任务后提交给审核。审核对编辑生产的数据进行校对，如果不符合可打回编辑修改，符合数据可提交给主编进行终审。随着数据生产后台的迭代，功能越来越多。原来的页面框架已经承载不了，因此我决定重新梳理，系统优化体验。拓展阅读做B端后台产品很复杂？送你一份完整的设计流程和规范！毕业两年来一直都做着 B 端产品的 UI 设计工作，参与过的后台产品设计面对的主要客户有公司内部、各大企业以及政府机构。阅读文章 > 找到重点B 端系统逻辑很复杂，为了能系统的优化体验，我试图用某对象有若干属性，属性有不同的状态。状态不同操作不同，不同操作有不同的权限这个框架来梳理。这个框架梳理到接近完成时我放弃了。仅仅是鸟瞰全局就花了很多时间，如果再接着梳理细节，还不知道要花多久才能正式开始设计。于是我转换思路，评估不同页面的体验问题严重程度，从难到易逐个击破。评估的方法用某个页面哪个角色执行哪些任务，任务频次、重要程度如何。根据评估结果，显然「条目编辑页」和「工作台页」是最应该优化的。梳理任务下图就是「条目编辑页」的老版本界面。根据不同的角色功能略有不同，但总体来说都是用户依次切换条目，并根据每个条目提供的参考资料等对内容进行编辑或审核。别急着马上找页面上明显的问题，为了彻底消灭体验问题，首先应该梳理不同角色在页面上做的操作。如下图所示，编辑角色选择未编辑的条目查看任务说明后编辑内容和设置参考文献，之后保存草稿表示完成该条，接着继续选择未编辑的条目进行操作，直到所有条目完成后提交子任务。审核和主编角色的审核流程基本一致，区别在于主编能自由打回到前面环节的任一角色。审核和主编在选择待审核条目后，查看内容和任务说明，对于不合格的条目能自行编辑或者填写审核意见，待子任务全部处理完成后提交。如果审核和主编在首次审核提交后有不合格的条目，那编辑得再次修改提交，审核和主编也要再次审核。和首次区别在于需要查看或者撰写审核/申诉意见。根据以上流程图，将角色和核心任务抽象后，可以简化为 5 个步骤（选择子任务在前一个页面完成，不算在内），如下图所示。如果把步骤放在页面上，除了左侧主菜单占用太大面积，整个操作动线依次从上到下从左到右似乎没什么问题，但真是如此吗？确定问题我们之所以用电脑而不是手机来做数据生产管理系统，是因为在电脑上有更大的屏幕来呈现内容，键盘鼠标精准快捷地操作也能提高效率。如果我们仔细分析每个步骤用户的需求，就发现并没有合理地利用电脑大屏幕的优势。对于步骤 1 选择待处理条目而言，因为用户要处理完所有条目后才能提交，因此最好能一目了然的知道哪些条目需要处理，哪些不需要。可以非常方便地选择待处理的条目，用列表呈现更好。对于步骤 2 查看附属内容，绝大多数都是在对条目主体内容进行编辑之前查看，处理过程中偶尔需要打开看一眼。因此不需要一直展现占据空间。应该提供隐藏，这样能给真正需要展示大量信息的步骤 3 处理主体内容留出更多空间。优化方案经过以上分析，最终得到「条目编辑页」的优化方案。去掉全局导航，提供返回工作台按钮。给用户长时间处理条目的沉浸环境，也给真正需要展示的内容留出更多空间。提供工具栏。不同的角色有不同的操作，后续可能会增加其他操作。弹性的工具栏区域可以满足以后的扩展。条目改为列表。显示每个条目的状态，帮助用户一览全局，快速选择应该操作的条目。附属内容可显示或隐藏。将更多空间留给主体内容。优化后的「条目编辑页」与 Keynote 的界面神似，我在设计前并没有想到去参考办公软件。只能说制作幻灯片的步骤抽象后和条目编辑的步骤几乎一致。另外如今的网页早已不是纯粹展示信息的地方，随着前端技术发展，大多数 SaaS 其实和本地软件的交互、功能一样复杂。所以网页和本地软件的边界也越来越模糊。「工作台」的优化相对来说更简单。根据产品规划，很长时间内我们都不会增加新的大模块。左侧导航优势是利于扩展，但占用的面积过大。改成顶部导航后，留给主任务与子任务列表的空间更大，利于各种角色监视任务进度，或者选择某个任务去执行。结果反馈该优化上线之后得到了数据生产团队的夸奖，并且上线之后一年功能迭代没有调整整体框架，说明我制订的框架扩展性不错。在经历这个项目之前，我好久没有做 B 端产品的设计。为了锻炼我的 B 端设计技能，我特地没有去网上看相关的设计经验文章，或者找竞品分析。学习别人的思路和方案难免也被别人的框架给固化。要知道不是每次都有竞品可以分析，总会涌现出新的平台和产品类型，有能力应对新平台没有竞品的情况，才是真正厉害的设计师。通过这个项目我掌握了不同角色的任务分析，用户任务的抽象，根据步骤的需求和内容类型决定模块的大小和控件。相信这些技能以后也可以复用在其他新型 B 端产品的设计。欢迎关注作者的微信公众号：「龙爪槐守望者」本篇来源：优设网原文地址：https://www.uisdc.com/data-production-background
大家好，我是和你们聊设计的花生~2022 年高考已经进行到第三天了，大部分地区的高考已经结束，再过半个月就能开始查询高考成绩并填报志愿了。大学四年是我们步入社会前学习专业知识技能、提升独立自主能力的重要的时期，那么对于想读设计系的大学生来说，做好哪些事情能让自己在这 4 年更好地学习专业知识技能，为毕业后找工作做好充分的准备呢？针对这些问题，我采访了优设的一些小伙伴，他们都是从设计专业毕业的，如今在优设从事各种与设计相关的工作。一起来看看这些设计专业的学长学姐对准备读设计系的大学生有什么样的建议吧~尽早确立发展方向设计软件优优教程网有非常多免费设计教程和资源，需要的小伙伴戳下方链接「优设自学路径」 https://uiiiuiii.com/knowledge「优设免费教程」 https://uiiiuiii.com/all「优设免费神器」 https://uiiiuiii.com/tools主动学习 大胆试错重视理论课程的学习优设网上有非常多关于设计史及设计理论的知识，大家利用碎片时间进行阅读也会收获不少 https://www.uisdc.com/zt/design-history尽早找设计相关实习多积累设计作品有关作品集和设计比赛的相关推荐：含金量高！适合大学生参加的 9 个设计类比赛拿下这些认可度高的奖项，对我们的奖学金评定、工作才是有好处的！阅读文章 > 提升审美审美提升必备！这3个顶尖设计师的个人网站你收藏了吗？大家好，我是和你们聊设计的花生~关于设计师必逛的灵感网站，除了 Pinterest、Behance、追波、优优教程网、站酷、花瓣这些经典酷站，我还向大家推荐过色彩灵感网站 Designspiration 和纯文字图形海报灵感网站 Typo/graphic Posters。阅读文章 > 提升沟通表达能力关于设计中的沟通技巧和方法，优设也有对于的专题 https://www.uisdc.com/zt/communication以上就是优设小伙伴们对准备读设计专业的学弟学妹们的建议，希望对即将步入大学的小伙伴门有帮助。如果你也有对设计专业大学生的建议，欢迎在优设问答区写下你宝贵的建议~「问题」高考临近，对于准备/初入大学的艺术生，你有什么建议？「链接」 https://www.uisdc.com/talk/121207461718.html本篇来源：优设网原文地址：https://www.uisdc.com/the-university-4-years
大家好，我是灰色执照~在日常工作中，我经常使用各种各样的图表工具，但是它们几乎都只能生成平面的图表。很多时候，我希望我的设计可以更加的“立体”。除了加动效，我能想到的就是制作成立体图表了。在时间紧任务重的情况下，我真的需要一个快速制作立体图表的工具。往期神器合集：可视化神器第二弹！一秒生成三维饼图的免费工具NB PIE大家好，我是灰色执照~ 很开心又和大家见面了。阅读文章 > 数据可视化神器！帮你一秒生成三维地图的免费工具NB Maps大家好，我是灰色执照。阅读文章 > 很遗憾，找遍了整个互联网，似乎没有看到称心如意的工具。打开 C4D 或者 Blender 自己建个模？学习成本和时间成本都太高了！既然互联网上没有，那我就自己开发一个好了。我对它的要求只有两个：1、使用要简单。2、生成速度要足够快。经过一段时间的努力，全新的产品 NB 3D Charts 正式发布了。访问下面蓝色链接就可以使用了：https://www.pslkzs.com/chart/charts.phpNB 3D Charts 是一款在线绘制立体图表的工具，它可以很方便的绘制：折线图、柱状图、条形图、饼图、环形图、金字塔图、漏斗图、汉若塔图、散点图、气泡图……图表的种类真的是非常的全面，原本我以为一个礼拜我就能完成这些工作，没想到马不停蹄的开发了 50 天！图表的类型越做越多，每天和各种数学公式打交道，我都快要累吐了。好在结果是令人满意的，开发好的 NB 3D Charts 使用起来非常方便，效率很高。由于生成的图表都是立体的，你通过拖拽鼠标就可以非常方便的调整角度。可以生成各种常见的动画效果，例如数据的移动效果饼图的上升效果饼图的选中效果所有的设置项都是所见即所得的，线条变圆滑，只需要调整一个滑杆~分组柱状图变成堆叠，只需要点击一个开关调整滑杆，多边形的金字塔就变成了圆锥形在编辑数据方面，NB 3D Charts 也是非常方便，界面的右侧有个一表格。你通过点击加号就可以添加点；点击垃圾桶图标就可以删除点；如果想要多根线条，右上角还有增加一组数据的加号，修改具体的数据值有点像是操作 Excel。当然，你也可以把数据放到 Excel 里面，直接导入就行了。添加好数据，设置好样式，就可以下载透明背景格式的 PNG 图片了。部分图表还可以生成 GIF 动画或者 PNG 序列帧。由于文章篇幅有限，我就不一一介绍了，大家赶紧去试试吧：https://www.pslkzs.com/chart/charts.php哦，对啦，如果有你需要的图表类型我没有开发，你可以在评论区向我提出建议，我尽量满足大家的要求，争取让这个工具变得更加全面和强大。好了，今天的文章就到这里了，我是灰色执照，一个很难让你不爱上的男人~欢迎关注作者微信公众号：「灰大设计」本篇来源：优设网原文地址：https://www.uisdc.com/nb-3d-charts
广告
08-04 22:43 1137
02-19 17:41 663
表哥
飞翔的企鹅
在路上
张大湿
落霞与孤鹜
