文章 设计师 控件 就在上周六，刷微博时一条微博引起了我的关注：这则消息很快引起了轩然大波，有网友在评论质疑消息可靠性后，很快博主贴出了Figma 官方发给大疆的通稿，并表示向大疆朋友确认了消息属实。在这则英文通稿里，Figma 明确表示，由于大疆出现在美国的制裁企业名单中，所以 Figma 依照美国法律，不再为大疆提供软件服务、技术或数据。在此之前，Figma 官网也出现了一个完全关闭俄罗斯服务的投票，赞成票数高达9800多：截图来自公众号：超人的电话亭虽然官方表示制裁结束后会解除封禁，但这一政治立场明显的举动，无疑推翻了人们对它所有的信任。更为讽刺的是，Figma 官网赫然写着：我们的愿景是让每个人都能接触到设计。对于 Figma ，优设早在17年就有过评测，作为一款即开即用且实时协作的设计软件，它的出现让人眼前一亮。之后优设网陆续发布过不少 Figma 的教程和插件，即使经常被吐槽网络不行，但疫情带来的工作方式的转变，让它依旧成为不少设计团队的主力工具。不过可以肯定的是，这次制裁表态让 Figma 永久失去了中国市场。身边不少喜欢Figma 的设计师都表示立刻停止续费。与之相对的，是一众对标 Figma 的国产软件大放异彩。在确认制裁消息后不久，国产设计软件「即时设计」就发布紧急公告，承诺所有企业和设计师不仅可以自行通过即时设计官网自行导入文件，还可以通过企业微信联系「即时设计」进行批量迁移，也可以直接导出为 Sketch 文件，收获了一大波好评。老牌软件厂商蓝湖的新产品 MasterGo 也紧急上线了 Figma 文件导入功能：虽然国产软件研发时间长度不如Figma，但在使用体验上，丝毫不亚于Figma，在细节上甚至更胜一筹。与 Figma 相比，你不用担心看不懂英文，也不用担心网络崩溃，而且还有很多针对中国设计师的功能，比如你可以在即时设计上直接管理素材、复用大厂的设计组件库等。这两个软件优设网之前也都有过详细的介绍，感兴趣的可以看：即时设计：为什么都在推荐这款设计工具？它究竟比 Figma 好在哪里？编辑推荐：过去的几个月里，「即时设计」这款存在感爆棚的新形态国产设计工具吸引了太多设计师朋友的关注，也让很多人对于“它和国外的 Figma 到底有哪些差异？阅读文章 > MasterGo：蓝湖放大招了！憋了一年的免费设计神器「MasterGo」正式发布！Sketch 从发布至今，已经成为 UI 设计的主流工具，但包括我在内的不少设计师，越来越意识到，Sketch 不方便的地方太多了，特别遇到大型迭代项目，沟通的成本极高，顺手举例：1）多人负责一个需求时，需要用最传统的方式，一个人修改完打包好源文件，再发给另一个人，效率极低。阅读文章 > 但无论云端服务多么稳定，我们依然建议大家准备一个移动硬盘，随时将重要的设计文件存在本地。有条件的设计师，可以直接搭建NAS。这件事发生后，有网友发现 Adobe 也早在3月5号就宣布全面停止在俄销售。原本以为设计无国界，没曾想覆巢之下无完卵，这则消息更引起了设计师们的焦虑。取代 Figma 简单，但 Adobe 深耕设计行业多年，PS 甚至成为了修图的代名词，如果哪天这把达摩克利斯之剑落到中国头上，对设计行业的影响可想而知。好在也不是所有设计软件都选择了战队。知名3D设计软件 Blender 就发布公告 —— 不会禁止俄罗斯用户使用，将捍卫艺术家和开发者的自由。可以预见的是，未来中国崛起的过程中，肯定会迎来愈加频繁的制裁，所以之后优设网也会针对国外各类软件，推荐对应的国产版，给大家一个保底的Plan B。不过风险中也藏着巨大的机会，正如优设网专栏作者龙爪槐守望者在设计圈里提到：这件事情会让很多企业重新评估使用国外工具风险，从而选择购买和采用国产软件服务，因此 ToB 产业会更加繁荣，建议设计师多储备相关知识技能，应对未来的行业变化。围观完整设计圈 https://www.uisdc.com/group早在2020年，优设网就有意提高了B端设计类文章的数量，因为目前C端的体验设计已经卷到不行了，而B端依然是一片蓝海。由于两者的设计思路迥异，如果想转B端，建议先把优设网的B端相关文章都尽可能阅读一遍，做好笔记。在这里也推荐一个完整的B端设计自学系列：超详细！总监出品的B端设计规范指南（一）：布局在 C 端设计中，不管是给车载客户端、手机客户端、电脑客户端设计界面，都有比较具体的规范需要我们学习和遵守。阅读文章 > 超详细！总监出品的B端设计规范指南（二）：字体[link https://www.uisdc.com/b-side-design-specification]第二篇，我们就要回到 UI 整个类目里最麻烦，也是最重要的规范类型——字体。阅读文章 > 超详细！总监出品的B端设计规范指南（三）：配色B 端设计也是 UI 设计的一种，它的输出环境只存在于电子屏幕中，所以统一使用 RGB 色彩显示模式即可。阅读文章 > 超详细！总监出品的B端设计规范指南（四）：控件第四篇我们全面认识一下B端的控件设计。阅读文章 > 超详细！总监出品的B端设计规范指南（五）：控件下面，就回到我们之前停摆的控件讲解，继续认识控件有关设计的内容。阅读文章 > B 端设计指南（六）：数据图表怎么设计？基本的控件单元完成后，下面就要开始介绍 B 端设计的另一座大山，图表的设计了。阅读文章 > 总监出品的B端设计指南（七）：常用图表的设计和应用上期介绍了图表设计，这期继续分享图表设计和应用的相关知识。阅读文章 > 关于Figma 的消息暂告一段落，之后的文章我们会详细聊聊，有哪些国产软件可以作为Adobe 平替，敬请期待~本篇来源：优设网原文地址：https://www.uisdc.com/figma-disappear
地图 工具 工作 大家好，我是灰色执照。先说重点，一款可以自动绘制三维地图的网页工具开发好了。你可以调整颜色、修改地图的厚度和角度、更换字体的样式。弄成你喜欢的样子后，就可以下载透明背景的 PNG 地图图片了！我简单的介绍一下工具的部分功能：1. 可以生成各个角度的透明背景图片拖拽鼠标，地图可以调整不同的角度。滑动滚轮，地图可以放大缩小2. 可以录制成你视频，拖入 AE，在周边加上图表，就变成可以演示的效果了。3. 可以调整地图的高度。4. 可以调整字体的大小，甚至可以让字体旋转过来5. 可以调整地图和地图边界线的颜色、透明度。6. 给地图每个板块输入相应的数值，地图还会以“柱状图”的形式显示。在左侧可以设置每个地区的数值，比如每个省的 GDP 不同。应用后，地图就像柱状图一样，根据数值生成不同的高度。如果你是数据可视化设计师，你可以只设计界面的四周，然后把设计稿上传为背景，这样你就可以免去设计你的主视觉了：NB Map 的功能其实还有很多，由于篇幅有限，我这里就不一一介绍了，大家自己去体验一下吧。工具的入口如下：https://nbcharts.com/map/map.php我还特意录制了一个功能很全的高清视频教程，已经放到 B 站了。 .video_pc { width: 100%; height: 585px; } @media (max-width:767px) { .video_pc { height: 50vw; } }当视频无法加载时请刷新页面，或前往PC获得最佳体验。几年前，我的工作从 UI 设计师转变成了设计数据可视化方向。工作中，我需要在界面的正中央绘制一个立体感觉的武汉市地图。那是我第一次接触数据可视化，没有任何经验。我清晰的记得我用了整整一个下午，使用 PS 的钢笔工具勾画地图的每个边界。那一个下午，我累得眼睛都疼了。当时我的心里只有一个想法：类似的工作应该交给工具来批量完成！多年以后，我虽然学会了编程，但是我的工作并不涉及三维方面的内容。所以也就没有太把这件事情放在心上。直到今年过年期间，趁着国庆 7 天假期，自学了一下三维方面的一些编程知识（甚至还研究起了 C4D）通过 1 个月时间的努力，一款自动绘制三维地图的工具开发好了。代码部分的内容其实不多。更多的是整理 400 多个省市区的数据。处理这些数据非常的繁杂，很多时候都想过放弃，但是想起我曾经用钢笔勾画的那个下午，咬咬牙又坚持了下来。“我一个人累一下，却可以方便无数个人。这波绝对稳赚不亏！”开发这款工具主要是想帮助那些真正有需要的人。有可能他们从事和设计无关的工作，没有接触过 PS、C4D、Blender，他们只是想在 PPT 里面加入一个地图来示意一下，也可能他们是平面设计师，想在海报里面加入一个地图；还可能一个初入行的 UI 设计师想做一个更好看一点的可视化界面…无论你是谁，都可以方便的使用这个工具来完成你的工作。准确的说，开发这款工具更多的是想帮助几年前刚跨入可视化行业的我自己~你们的下午由我来守护。你们去喝茶、去聊天、去享受午后的阳光，让地图绘制的工作交给我开发的工具来完成吧。工具是免费的，大家放心使用~后续我将给这个地图增加材质功能，如果你使用 NB Map 的过程中有什么其他需求，欢迎你在微信群里向我提出。最后，感谢微信群里为 NB Map 提供地图背景的每个设计师。超详细！从零到一带你制作可视化地图（一）今天分享下在做可视化中一些地图的获取方法、常见的一些效果的实现方法以及跟开发如何对接的一些经验分享给大家，欢迎大家沟通交流。阅读文章 > 欢迎关注作者微信公众号：「灰大设计」本篇来源：优设网原文地址：https://www.uisdc.com/nb-maps
互联网 科技 工具 2022年3月，互联网世界卷入了乌克兰与俄罗斯的争端站队当中，互联网产品APP原本作为中立隐形在世界运转幕后的工具，现在走到台前，一脚把曾经视为上帝的用户踹下了神坛。特别是，在战场之外的中国的大疆公司，因为美国制裁大疆，设计软件Figma的公司随即停止了对大疆的服务。令人震惊的也许是这场争端，但同样是这种互联、公开、共享的现代精神的失守。我们是否能够继续相信互联网？特别是现在它似乎不那么互联，还有点卡？1.0 我们在面临不可抗力2022年冬奥会世界地球村的和平序曲刚刚落下帷幕，随之而起的就是乌克兰与俄罗斯的干戈，许多知名的互联网公司都在公开抵制俄罗斯，断绝与俄罗斯的合作与提供的服务，其中包含的内容有视频、搜索引擎、设计软件、电子货币等等。我们在签署任何合同里，都有一条关于遇到不可抗力，合同可以中止的条款。目前我们所见证的这场互联网公司集体退群，就是我们所见证的第二次不可抗力条款的实现，第一次是新冠疫情，一场席卷全世界的瘟疫。第二次是乌俄争端，一场全世界都在关注的国际事件。2.0 互联网只是你的房东最近的设计界新闻，由于美国制裁大疆公司，Figma 作为美国企业也必须遵循这个法规停止为大疆提供软件服务，把文件数据打包还给大疆。这个新闻绝对是最近设计界的爆炸性新闻，并且一下子火速反向把国内的同款平替软件“即时设计”和“MasterGo”推向了大众面前。为什么这件事值得讨论？这件事给我们带来了什么视野？首先介绍一下什么是Figma，此处引用官方的介绍：Figma是一个向量图形编辑器和原型设计工具，主要基于网页进行工作，通过macOS或Windows的桌面应用程序，可启用离线编辑功能。适用于Android和iOS的配套软件称为Figma Mirror，可以在移动设备上查看Figma原型。Figma的功能集着重于用户界面设计及用户体验设计，并强调即时协作。这个软件在这两年来火遍了所有设计师的圈子，因为它的在线实时协作，让所有人都可以基于互联网同时做一个设计项目，不用层层对接，省去了各种沟通的麻烦，可以说是互联网的分享与沟通精神的高光产品了。但这款富于互联网的分享与沟通精神的高光产品，此时拒绝了大疆，把大疆踢下了它的网线。于此同时，国内的同款平替软件“即时设计”和“MasterGo”顺便截胡了对Figma失望的互联网用户。但对于大众仍然需要警惕的是，这两款软件大概率不会对用户说不，但它们如果愿意，是可以像Figma一样，把用户清退的。此处并不讨论谁对谁错，就讨论国际竞争与贸易当中的互联网与人与社会的关系。从互联网发明以来，就有着许多关于互联网技术的不稳定性的担忧，无论是从技术性上的有待发展，还是从人为的角度被错误使用，或者是仇恨使用的担忧。关于这些观点，有很多书籍和电影在讲述这个观点。目前最为著名的，应该就是动画电影与真人电影《攻壳机动队》。在华丽的视觉效果背后，透露了一些让人不安的现实与未来：1、在科技时代，所有赋予给你的机器与网络的便利，都是建立在稳定时期的经济繁荣，一旦这种稳定被打破，所有给予给你的便利，会马上收走，甚至让你的生活变得更糟。2、科技本身是好的，但如果掌握科技的人不怀好心，所造成的破坏，比科技带来的好处还要大。3、所有的云端，你所认为永远的家，只是租给你的，平台的拥有者就像房东，房东可以随时把你踢下互联网的网线，你自己拥有的实体的身体，物品才是你真正的永远的财产。互联网与科技所承诺的东西，经常包含着“永远”“稳定”“靠谱”“你的好帮手”之类的字眼，并且现在的元宇宙的概念，不仅是想当我们的帮手，还想要当我们的房东，让我们住进去。如果说我们一直沉浸在科技时代与互联网时代所带来的物质丰裕与工具方便的自由的狂喜当中，那么这次互联网公司的集体跳票，甚至中国的很多企业都是在美国的长期制裁当中，就是给我们的梦醒时刻：你并不拥有互联网，互联网只是把服务租给你，你在此建立的一切资产与时间在不可抗力面前，只有随时退租的份。目前的比特币等基于算力计算的代币，在逃离中心管控的路上，像末日狂花一般给了希望在互联网隐居的居民一个选项，毕竟平台需要一个中心才是平台，一个没有中心的系统，谁要把谁弄下线呢？逃离银行，逃离管控，逃离机构。3.0 当你学习的速度赶不上发布新产品的速度此处引用介绍《别想摆脱书》的第二章《永久载体最暂时》这个章节聊的是几位从事文艺工作的大师，谈论科技与书籍与影像的关系，这里面承认了科技给人带来的方便之处，但更多的是在谈论这份方便背后的代价和隐患。对谈者当中，曾经担任电影电视学校校长的卡里埃尔所经历的技术迭代，虽然是二十多年前的事情，听起来依旧像是现在的人所面临的难题。这里引用原文：我还记得第一次看光盘播映，内容与埃及有关。我们惊诧万分，全然被征服。所有人都为这次革新而倾倒不已，它似乎解决了我们这些图像和档案专业人员长期以来遇到的所有难题。然而，制造这些奇迹般产品的美国工厂 在七年前就关门了。DVD问世时，我们以为总算拥有了保存和共享图像的理想措施。在此之前，我一直没有建立个人的电影资料库。有了DVD，我以为自己终于拥有了“永久载体”。但完全不是这样。现在又出现了极小的磁盘，可以像存电子书那样存入大量电影，但必须同时购买新的机器。那些美好的老DVD 也不得不丢开，除非我们同时留下老式的播放器。我们还能读一本五个世纪以前印刷的书，却无法看一张只不过数年以前的电子录像带或老光盘。除非把旧电脑都留在地下室。今天我们如何建立个人的电影资料库，应该选择哪种载体？我们不可能在家里收藏传统的银胶片拷贝，那需要一间放映室，一个专用的观影厅和大量储藏空间。录像带会掉色，清晰度会下降，很快就模糊了。CD 的时代已经过去了。DVD也不会长久。何况刚才也说过，将来我们不一定有足够的能源去运行所有这些机器。想想 2006年7月纽约那次电力大故障吧。假设范围扩大，时间延长。没有电，一切都会消失，无可弥补。反过来，当人类的一切视听遗产都消失了，我们还可以在白天读书，在夜里点根蜡烛继续。20 世纪让图像自己动起来，有自己的历史，并带有录音——只不过，我们的载体依然极不可靠。多么奇怪：我们的过去没有声音。当然，我们大可以想象鸟儿的歌唱、小溪的流水声一如既往……我在读到这些观点的时候，感觉三十年过后，我们的现代人依旧在面临同样的问题，并且完全没有一点点的改善。互联网井喷的这几年，我的设计软件已经迭代了四五遍了，各种在当时惊为天人的新的设计工具时，现在已经没有多少生存空间了。上大学的时候UI设计的工具是PS，毕业的时候是sketch，工作的时候是XD，现在的Figma之类的即时工具又要拳打之前的所有软件。同样的体验还有建模软件，maya，犀牛，3dmax，C4d，Blender等等。在这个互联网浪潮当中，学习了一些，忘记了一些，又重新捡起了一些，如此往复循环。4.0 被科技勒索是什么感觉？每次面临迭代的时候，我已经过了技术狂喜的阶段，而是在想，这次的工具更新，究竟有比原来的设计工具改善多少吗？如果每一次迭代，都需要整个行业来重新学习与适应，那它所带来的便利是否与这份麻烦互相抵消了？在这场技术崇拜的狂欢当中，是无数设计师在你追我赶追求与学习新技术，生怕错过一场发布会，一个新软件，一个流行色，一个新趋势，就被同行认为是抗拒新科技的老顽固。在看教程学技术的速度赶不上新东西的发布速度的时候，感到自己十分窘迫，并没有感觉到科技给我带来的福利，我只是感觉到我在被科技勒索，勒索我的时间与精力，但我并没有创作更多东西，也没有学到更多东西。这里引用卡里埃尔的原文：然而，每次新的科技产生，必会力证自己超越以往所有发明与生俱来的规则和限制。新科技期待自己睥睨一切，独一无二。好像它会自动带给新用户一种天然的能力，无需他们学习如何使用，随时就可以上手似的，好像那种天分是本来就有的，好像它随时准备着肃清以往的科技，把那些胆敢拒绝它的人变成过时的文盲。我一生都见证着这样的勒索。实际情况恰恰相反。任何新科技的新语言，都需要漫长的接纳过程，我们的脑子越是被前一种科技语言格式化，这个过程也就越是漫长。1903-1905年间出现了一种新的必须认知的电影语言，许多小说家以为可以从小说创作直接转入电影编剧。他们错了。他们不知道，这两种写作对象——小说和剧本，事实上运用着两种迥异的写作方式。科技绝不是一种便利。它是一种强求。还有什么比为电台改编一场戏更复杂呢！5.0 我们还能怎么做我们的生活已经是架空在科技与互联网之上的生活，前面所说的并不是要求大家退回以前的不方便的时候，只是心里要有数，这个平台，并不会永远租给你，当那个时刻来临的时候，要做好准备。或者现在就应该做好准备，所有的数据备份，不仅要储存在各种网盘和网页当中，还要存在本地空间，准备好靠谱的硬盘，重要的文件全部备份。众多储存方式，不以外界变化为转移，才是靠谱的储存吧。我是设计师冬粉，希望我的文章可以给你带来一些关于互联网的思考，再见。为什么都在推荐这款设计工具？它究竟比 Figma 好在哪里？编辑推荐：过去的几个月里，「即时设计」这款存在感爆棚的新形态国产设计工具吸引了太多设计师朋友的关注，也让很多人对于“它和国外的 Figma 到底有哪些差异？阅读文章 > 蓝湖放大招了！憋了一年的免费设计神器「MasterGo」正式发布！Sketch 从发布至今，已经成为 UI 设计的主流工具，但包括我在内的不少设计师，越来越意识到，Sketch 不方便的地方太多了，特别遇到大型迭代项目，沟通的成本极高，顺手举例：1）多人负责一个需求时，需要用最传统的方式，一个人修改完打包好源文件，再发给另一个人，效率极低。阅读文章 > 本篇来源：优设网原文地址：https://www.uisdc.com/figma-and-the-internet
泰国 维度 泰语 泰国是东南亚的第二大经济体，仅次于印尼。它是一个多民族的国家，主要有泰族、华族、老族、马来族、高棉族，以及其他少数民族。其中泰族占全国总人口的 82% ，华族占 12% 。但由于外来移民者与泰国社会融合的程度比较深，因此一般都把他们看作为泰人。泰国拥有 6900 万人口，整体人口结构上偏年轻化，35 岁以下的人口占比有 51.87%，其中互联网用户就高达 5700 万人，是总人口的 82%，活跃社交媒体用户高达 5100 万。互联网消费潜力大、人口年轻化是泰国的其中两个标签，国内不少公司也将泰国作为东南亚出海的新赛道。出海泰国之前，我们需要先了解泰国本土的文化和风土人情，才能避免踩坑。那么，如何了解泰国文化？该从哪里入手呢？其实从根本上说，泰国的文化就可以用一个词来概括，即宗教。因此，我们在理解泰国文化的时候，只要以宗教为切入点，也就抓住了泰国文化的本质与核心。接下来我会分享几个差异点，希望能够和大家共同探索讨论，如有不足之处还请大家指正。（以下是本文的目录一览）往期内容回顾：如何做东南亚的本地化产品设计？来看阿里设计师的系统总结这几年，出海东南亚一直是热门话题，不少国内企业斥巨资出海东南亚。阅读文章 > 7000字干货！东南亚本地化产品设计差异：印尼篇印尼是东南亚人口最多的一个国家，人口超过 2.65 亿（还是 2019 年末的数据，现在应该近 3 亿），其中 30 岁以下人口占比超过 50%。阅读文章 > 文化差异首先借助于 hofstede 的文化维度理论，帮助我们在脑海中建立起大致的文化场景，对目标用户的文化差异进行分析，解读泰国文化和中国文化的差异与共性。建立文化场景，如上图所示，主体国家是泰国，对比国家是中国。对泰国和中国进行文化维度分析。（说明：这里的分数高低并不是指好坏，而是指文化的差异）1. 文化维度分析权利与距离权利距离维度是指“不同国家人与人之间的平等程度”。在这个维度中，泰国得分是 64 分，中国得分 80，在权利与距离维度都是属于高权利距离国家。泰国是君主立宪制国家，泰国人民对皇室有依赖和崇拜，这种阶级观念体现在：遇到国王出行，当地人看到国王都要下跪；泰剧中仆人们经常跪坐在地上，不允许比主人的地位高，这种深深的等级观念一直保留在人们心中，所以在泰国文化中，地位和权威至关重要。个人主义与集体主义个人主义与集体主义维度是指“衡量某一社会总体是关注个人的利益还是关注集体的利益”。在这个维度中，泰国和中国的分数都是 20 分，属于集体主义国家。泰国文化中有深厚的宗教文化作为基础，传统文化中认为人是家庭和宗教中重要的组成成员，因此泰国人很注重群体的关系和人与人之间的关系，与个人独立完成任务相比，他们更愿意以团队的形式来开展学习和工作。男性化与女性化男性化与女性化维度是指“ 社会性别的角色是偏男性化还是女性化”。在这个维度中，泰国分数是 34 分，属于女性化维度国家；中国是 66 分，属于男性化维度国家。在泰国的“ladyboy 文化”中不难看出，泰国在男性化还是女性化的维度上倾向于女性，因为“ladyboy”使得泰国名扬四海，并为泰国带来了大量的外汇收入和旅游收益，利益驱使人们更加认可了这一行为，女性的地位不断的提高。不确定性规避不确定性规避维度是指 “人们在面对不确定或未知情况时的规避程度 ”。在这个维度中，泰国得分是 64 分，属于不确定性规避程度高的国家。中国得分 30 分，属于不确定性规避程度低的国家。泰国是个即保守又开放的国家，保守在于传统的宗教制度与严苛的法律规范（例如：不尊重国王和王室是违法的，也是社会禁忌。任何人诽谤或侮辱皇室成员都将面临 3-15 年的监禁）人们不能表现出诽谤或批评王室的行为，也会躲避被宗教定义为不圣洁的、不道德的事物。开放在于，对待第三性别者有很强的包容度，这种社会的理解和包容与泰国从古至今一直受到外来文化的影响是一脉相承的，也是泰国社会文化包容性、宽容性的具体体现。长期取向与短期取向维度长期取向与短期取向维度是指“ 人们对时间的基本取向“，长期取向的国家会培养和鼓励人们追求未来回报，而短期取向国家的人们更倾向于短期的收益。在这个维度中，泰国分数是 32 分，属于短期取向国家。中国 87 分，属于长期取向国家。泰国人在时间观念上表现得比较淡薄，喜欢享受生活，有种“慢慢来”的性子，满足于现在的安逸自在。且消费观念趋向于短期取向，他们中有不少人有着“今天花明天钱”的提前消费思想。自身放纵与克制维度自身放纵与克制维度是指”人们控制自己的欲望和本性的程度“。在这个维度中，泰国分数是 45 分，因此无法确定在这方面的偏好。中国分数 24 分，属于克制维度。但在长期与短期取向中，泰国属于短期取向的国家，存储率低且偏好于提前消费。泰国人愿意为超前消费和高消费买单，其中 30 岁及 30 岁以上的人是泰国借贷率和消费力最强的消费群体，因此个人认为在这个维度上还是偏向于放纵维度多些。基于 hofstede 的文化维度可以帮助我们大致了解到当地的文化环境，但是光有这些远远不够，有条件的可以去当地做市场调研，获取更详细的信息。2. 关于宗教带来的差异化泰国被称之为“万佛之国”，约 95%的人信仰佛教，对于许多泰国人而言，佛教更是一种生活方式，佛教的许多原则，例如宽容、冷静、功德，都是贯穿泰国文化的价值观。在很多皇家仪式和学校教育，以及生活习俗中，都会以佛教作为规范，佛教思想可以说是泰国的精神文化基础了。关于手势例如泰国人最常见的礼节动作就是”双手合十礼“，这也是佛教的礼节，这个动作在泰国日常生活中随处可见，不仅可以表达问好，也可以向对方表示感谢之情。在做泰国的本地化设计中，可以融入这一形式，比如说 IP 形象的表情和贴纸就可以增加这个动作，更能够获得当地人的喜爱。下图是泰国麦当劳餐厅门口的麦叔叔形象，融入了当地的文化特色。另外，也要注意在设计上不要出现“把手放在人物头上”的画面，因为在佛教国家中，头部是身体最神圣的部分，一定要避免出现这种文化禁忌。关于动物泰国人最喜爱的动物 — 象，也跟佛教有深厚的渊源。大象的形象在泰国随处可见，在一些插画上、雕塑上都有大象的元素。在泰国，从皇室到普通人，都对大象有着深厚的感情，象文化也是泰国的本地特色之一。因此，在视觉设计上不妨加入象元素，更能够获得当地人的青睐。关于艺术风格泰国既受到了印度佛教文化的影响，又有中国文化的渗透和融合，形成了自己独特的文化艺术。其中佛教文化为当地的艺术风格奠定了深厚的基础，纹理图案是其中的一个重要组成部分，它涉及到了建筑、雕刻、绘画和服饰等各个方面。莲花是泰国纹理艺术的主体和起源，也是每个泰国人都喜爱的花卉（莲花是佛的象征），莲花纹在泰国的艺术文化中占了非常重要的地位，有很多的纹样都是莲花纹的变形和衍生。除了纹样，泰国的建筑风格也非常有民族特色和佛教色彩，例如多层斜的山式屋顶、高高的塔尖，就是它的一大特色。如果想要有比较强的地域风格的设计，在插画设计中就可以融入泰国纹样、泰国建筑和大象的元素，为设计增添一抹本地化色彩。关于节日说到节日，其实泰国大多数庆祝节日也都与佛教有关，例如最出名的宋干节（又叫泼水节，是泰国的新年）、水灯节等，节日期间在网站 banner、APP 的启动页上放节日海报，用官方账号在 FB 和 INS 上发祝福语和节日海报，更能体现企业的人文关怀。也可以在注册登录页面加一些节日氛围的小元素，增加一些趣味性。在视觉设计时，需要加入能吸引用户和当地文化产生共鸣的元素，例如宋干节的泼水文化、水灯节的莲花灯和孔明灯，其中莲花灯是泰国水灯节的传统特色，在海报上融入本土文化元素更容易获得当地人的认同和喜爱。设计差异1. 色彩泰国的七彩文化 — 色相的选择泰国人喜欢五彩斑斓的鲜艳色彩，早在泰国的大城王朝时期流传着一个习惯，用颜色来代表日期，星期一为黄色，星期二为粉红色，星期三为绿色，星期四为橙色，星期五为淡蓝色，星期六为紫红色，星期日为红色，7 天的颜色各不相同。在曼谷王朝时期也延续了这个颜色文化，皇室成员穿着衣服的颜色从星期一到星期日都是不一样的， 如果更改颜色就会自贬身份，被看作是平民，直到泰国改君主制为君主立宪制，再加上西方服饰的流行， 这一习俗才逐渐淡化。七彩色已经深深影响了泰国人民，人们喜欢用颜色来代表事物，例如泰国的几大银行几乎都可以用颜色来区分: 泰国汇商银行的标志背景是紫色，泰京银行是蓝色，开泰银行是绿色， 大城银行是黄色。在设计时，可以根据行业属性或是产品自身的特征等，选择合适的主色调。泰国整体没有特定的色彩偏好，每个人对色彩的喜爱度也不一致。但如果要用一个颜色来代表泰国，我会使用金黄色，因为泰国是一个佛教国家，也被称为“黄袍之国”，宗教色彩往往在人们心中有着神圣的地位，代表一定的意义。另外，七彩色虽深受泰国人喜爱，但是在使用时还是要依据场景而定，因为不同的颜色有不同的含义。例如红色，泰国人在日常生活中忌讳使用红笔签名， 只有人去世后才可以用红笔在死者的棺材上写上其姓氏。因此，不要在海报中出现名字使用红色的字体。明度和纯度的选择下图是泰国本土的 banner 风格，背景的色彩比较厚重。Local 的设计更偏爱使用高纯度、中低明度的色彩，高纯度的色彩更有前进感，产生色彩刺激，能在第一时间抢占用户的注意力。语言差异1. 语言本地化泰语的微妙含义泰国的官方语言是泰语，泰语本地化比较复杂，因为在不同场景下的词语用法也是不一样的，例如大家常听到的那句“萨瓦迪卡”， 但实际上，“萨瓦迪卡”是只限女性说的。真正的泰语中的“你好”的说法是“Sawadee”（萨瓦迪），而“ka”（卡）是泰语中的尾音，尾音用来辨别男性和女性，ka 代表女性说话者，krab 代表男性（ 所以各位广大男性同胞，去泰国切记不要用错词语噢~ ）。泰语有一些微妙的用法和双重含义，在做泰国语言本地化时建议找经验丰富的翻译者或当地人，才能避免一些错误。泰语单词之间没有空格泰语不使用空格来分隔句子中的单词和短语，单词之间的错误断开会使句子变得不可读，阅读体验很差，而且计算机无法自动正确的检测单词。另外，虽然泰语不使用空格来分隔句子中的单词，但在不同的场景下仍需要空格。比如：完成一个短语、从句或句子并想开始一个新想法时，需要添加一个空格。逗号、冒号后面需要加一个空格。泰语中的间距规则有点复杂，为了避免出现错误，建议找本地经验丰富的翻译员或泰国当地人来进行翻译和做后期的项目文案检查。偏爱非正式口语风格泰国用户更喜欢阅读简短的文本，尤其是在移动设备上，使用非正式的口语风格进行文本翻译会更能赢得用户的喜爱。另外，可以考虑使用简短的单词或图标来达到简单的翻译效果，当译文长度超标时，可以考虑用图标表达。2. 语言适配换行注意事项泰语文本通常比英语长 15%，涉及到文字换行的标准时，不要限制字符的个数，而是限制文字的长度，不同的语言字符代表的字节是不一样的，计算长度而不是字符数量对开发同学来说会更容易些。因为在计算机中，1 个英文字符是 1 个字节，泰语一个字符是 3 字节。但泰文的结构比较复杂，泰文由单个字符组成，有上下标，如下图中的 3 个字符。第一个是一个字，是 3 字节。第二个是第一个字穿鞋子（加了下面的标），是 6 字节。第三个是第一个穿鞋带帽（上下都有标），是 9 字节。所以，泰语的一个字符可能会有 9 个字节的情况，如果某些场景的输入框中需要限制字数，对于泰语版本，可以适当把字数增多些，避免出现句子无法编辑完整的情况。行间距的适配将文本翻译成泰语时，要注意字符的长度可能会影响到原本的设计展示效果，比如原先是一行的英文，翻译成泰语后会需要换行。同时也要注意换行后的行间距，泰语的书写方式比较特殊，如果行距太近，可能会掩盖上下行的元音字符，因此，需要留出足够的空间来提高可读性。在 Lazada 的 design system 中，我们会单独为泰语设定不同的行距规范，来保证语言本地化后依然有舒适的阅读体验和页面展示效果。3. 字体建议与英语类似，泰语也有自己的 Serif 和 Sans Serif 字体版本。衬线字体在泰国的官方文件中很常见，因为这种字体更易于阅读，也不会将一个字母与另一个字母混淆。而对于无衬线字体，一般在品牌设计中更常见。另外推荐一个泰文字体的网站 thaifonts，里面的字体可以免费用于个人和商业， 有需要的同学可自取。区域格式差异1. 日期和时间格式泰国主要使用两个历法，一个是泰国阳历，而另一个则是泰国阴历 (用于传统活动和佛教宗教活动)。泰国官方日历是阳历，除了年份是使用的佛教年份系统，其他都与公历相同。计算方式是：中国公历+543，例如今年是 2022 年，对应泰国就是 2565 年。佛教年份系统在泰国被广泛使用，例如泰国官方媒体平台、产品生产日期等场景。下列是泰国常见的书写格式。关于时间系统，我们使用的是 12 小时制和 24 小时制，但泰国的时间系统是 6 小时制和 24 小时制。泰国的官方场景使用 24 小时制，而日常生活中，泰国人更喜欢 6 小时制，将一天分为四部分，每个部分计算六个小时。每个部分都有一个分类词，以确定它属于一天中的哪个部分，就像在英语中的 am 和 pm 一样。其中 chao 等于早晨，bai 则表示下午。黄昏和凌晨之间使用的词是 dtii 和 thum，详细介绍可以参考 wiki2. 数字格式泰国人使用两种不同的数字系统：阿拉伯数字和泰语数字（ 跟我们的大写数字一样的性质 ），泰国人常用的是阿拉伯数字，泰语数字只在必要的正式的场景中使用，例如政府或法院的法律文件、钱币，有时也用于家庭地址标签。关于“万”以上的数字，泰国人会使用缩写，例如 10,000， 泰国人会用 1หมื่น 这个词来表达，这些词通常用于新闻标题、海报标题等场景，能提高阅读速度，吸引用户注意力。不过在正式的场景，例如在交易场景中还是会把所有金额都展示出来，不使用缩写。在泰语本地化项目中，可根据自己的业务场景来选择使用哪种数字系统，为泰国用户提供最佳的阅读体验。3. 货币格式泰国的货币符号是฿ ，货币名称是THB ( 泰铢 ) 。4. 名字格式泰国的名字格式是名字+姓氏，大部分泰国人有两个名字，他们的官方名称和昵称。泰国人只在正式场合和法律文件中使用自己的官方名称，在日常生活中，大多数人都会使用昵称，这是因为泰国人的全名都比较长的缘故，例如 Parfun VAIYASINGHA。我曾经问过几个合作的泰国同事，为什么泰国的名字普遍都很长？这是一个有趣的现象，他们说泰国的姓氏一般都是独一无二的，如果没有亲缘关系，姓氏不会和别人重复，为了确保自己的姓氏是独特的，人们会添加更多的单词让其变得更长，这样就不会被其他人使用。在产品设计时，如果在某些正式的业务场景中需要展示用户全名，必须考虑泰国用户的名字长度问题，在页面上预留足够的展示空间，不能显示省略号。5. 地址格式泰国的地址格式是从小到大展示，从门牌号到国家。关于门牌号，有两种类型。一种是普通的门牌号，如某某街道 128 号；另一种是格式为“ xx/xx ” 的门牌号，在公寓或小区中比较常见，前面数字代表编号，后面的数字代表房间号，如 10/703，读做 10 栋 703。支付方式差异1. 常用支付方式泰国常用的支付方式有信用卡支付、银行转账、电子钱包、COD 等，在移动支付这块，泰国与新加坡用户对于二维码类的支付意识要领先于东南亚的其他国家。2. 主流的支付平台Visa 和 Mastercard 是泰国最常用的信用卡，其中 Visa 的市场份额占比 54.8% 。在 E-Wallet 中，泰国用户常用的是 Truemoney、AirPay、Line Pay、mPay、GrabPay、PromptPay 等平台。银行转账也是泰国受欢迎的在线支付方式，大约 78% 的泰国用户拥有银行账户。其中最大的是曼谷银行、暹罗商业银行、Krung Thai Bank 和 Kasikornbank。选择合适的支付方式，为泰国用户提供快捷的支付通道，保证“最后一公里”的转化率。网速差异1. 泰国 VS 中国网速下图是 2021 年 12 月份的数据，泰国的下载网速 32.08Mbps, 在全球排名 56。中国的下载网速是 104.44Mbps, 全球排名第 4。虽然泰国的 3G/4G 网络覆盖率相对较高，但流量资费仍是大多数人消费时考虑的一个重要因素，而且泰国目前的设备仍然以中低端为主，内存和运行内存较低。因此，在做出海设计时，需要优化好内容，给用户提供良好的使用体验。多语言场景需要注意图文分离注意不要将文字直接嵌入图片或视频媒体中，需要分别以较小的个体进行存储，便于替换。交付给开发同学的图片也必须压缩一下，不能超过 1M，不然会影响加载速度。使用 Iconfont图标建议使用 Iconfont，Iconfont 所占的资源小，可以减少请求次数，不会影响加载的速度。而且开发可以直接通过 CSS 的 font-size 和 color 来修改图标的大小和颜色，且不失真。重大更新！阿里妈妈矢量图标平台iconfont+全新上线！编者按：矢量图标平台 iconfont 一直是国内最良心最受欢迎的人气图标下载平台，这次重大更新，包括全面升级的帮助体系、支持彩色图标上传下载、查看图标详情页、搜人功能、打赏设计师等，亮点多多，值得收藏。阅读文章 > 社交工具差异1. 常用的社交工具泰国是个社交性非常强的国家，人们喜欢通过社交平台表达自己的想法和展示生活，通常使用 Line、Facebook、Instagram 等社交媒体进行交流, 其中泰国有 5100 万用户（超过 70%的人口）在使用 Facebook。如果想站外引流，可通过 Facebook 和 Instagram 上的活动与用户进行互动，很多泰国的本地企业也会通过 Facebook/Instagram 或 Line 的官方帐户与用户直接沟通。法律差异1. 产品设计注意事项泰国禁止赌博，禁止出现性或色情内容。为了避免法务风险，营销活动设计需要注意不能使用老虎机、扑克牌等元素。另外泰国皇室和佛寺也是高度敏感的内容，推广题材要避开这些，不要违反当地的法律法规。以上几点就是在做泰国本地化设计时需要注意的差异，后期会继续更新国际化与本地化设计相关的文章，感兴趣的伙伴可以关注我的专栏：8 点的四月，谢谢~~参考：https://www.statista.com/statistics/1093839/thailand-share-of-online-payment-methods/http://www.thai-language.com/ref/numbershttp://www.thai-language.com/ref/spacinghttps://fortumo.com/blog/mobile-wallets-spotlight-thailand/https://www.hofstede-insights.com/country-comparison/https://baike.baidu.com/item/%E6%B3%B0%E5%9B%BD/202552?fr=aladdin#6_1https://blog.csdn.net/dinko321https://en.wikipedia.org/wiki/D7000字干货！东南亚本地化产品设计差异：印尼篇印尼是东南亚人口最多的一个国家，人口超过 2.65 亿（还是 2019 年末的数据，现在应该近 3 亿），其中 30 岁以下人口占比超过 50%。阅读文章 > 本篇来源：优设网原文地址：https://www.uisdc.com/thailand-product-design-differences
自己的 专业 作品 针对初入职场的设计师，如果没有进入一个靠谱的团队，会发现在职场中只是掏空自己的专业存储，没有获得任何提升。几年下来除了获得表面的工作年限以外，在专业技能和项目经验上面都处于原地踏步。工作中我们都有可能遇到学不到东西的处境，如果恰巧被自己遇见了，我们应该如何做出调整呢？今天黑马哥就和大家一起聊一下这个职场话题，希望可以为大家解惑，仅代表个人经验和观点。聊聊这些居安思危还是虚度光阴不能靠团队就要自我驱动专业广度还是专业深度业务转化沉淀作品想跳槽得了解行情选择适合的至关重要先有储备才可能绽放小结居安思危还是虚度光阴初入职场时通常都是干劲十足，这份干劲能持续多久就千差万别了。有人居安思危，几年后实现了自己的进阶目标；有人虚度光阴，幡然醒悟时已经落后一大截。无论是初入职场的设计新人，还是职场老司机，都要时刻保持清醒的头脑，阶段性的对自己进行专业体检。只有知道自己的不足，才有可能通过调整去改变。在工作中不能满足于按部就班的需求，如果只是掏空自己的专业存储，而没有获得有效的项目经验和专业提升，长此以往容易导致后继乏力。在一家公司通常的职业周期是 1-2 年，如果发现工作内容高度重复或者闲余时间过多时，就要及时做出调整。检测自己的作品沉淀情况和专业的提升程度，也可以分析一下行业的招聘信息，看看自己所具备的能力是否能够匹配行业需求。根据分析的情况制定提升计划和目标，以便满足行业更高的要求。不能靠团队就要自我驱动当我们知道自己的不足时，却无法在工作中得到提升，按部就班的干活儿却学不到东西。工作中学不到东西应该算是很普遍的现象了，就算有直属领导，他也是做不完的需求，手把手教新人的可能性很低，主要还是要靠自己成长起来。没办法靠团队和项目提升自己，就要靠自我驱动了。提升专业的方法很多，主要在于自己是否够主动、能坚持、会变通。1. 通过阅读查漏补缺如果能够明确知道自己哪方面的能力有所欠缺，可以购买一些对应的专业书籍进行知识点的查漏补缺。现在无论是工具类还是技法类书籍都很多，就是要边看边练习，也要做读书笔记，不然容易边看边忘。练习是对知识点的运用，读书笔记是对内容的强化加深。2. 通过日常输出强化执行力工作中得不到发挥或者闲余时间过多时，要多去做一些全案设计练习，不然设计技法会生疏，设计趋势的把控能力会减弱。可以是往期项目的复盘、公司业务的设计重组、改版练习等，勤于动手才能不断进步。3. 串联零散知识点查漏补缺现在关于设计的自媒体很多，微信公众号也是五花八门，获取设计知识点的渠道变得越来越多。信息过剩带来的问题就是过于零散，观点很多难以把控，导致大家收藏了很多却没有吸收转化。只有对零散的知识点进行串联才能起到查漏补缺的作用，针对一些关键的内容要单独做笔记，同类型的知识点分类笔记，便于后期进行分析。只有分析总结后的方法论，才能属于对自己来说是有效的信息。4. 进阶学习效率较高针对在职的设计师来说，专业提升适合做进阶探索，能在更短的时间突破高级/资深的能力，可以缩短我们走弯路的时间。关于学习都是一种投资未来的方式，在力所能及的范围内学习提升，也是可取的形式。5. 组团互相激励效果更佳有时候独自练习会比较枯燥，容易坚持不下去，能有几个设计师一起组团练习，相互激励效果会更好。也能通过互相指点来发现更多问题，有时候当局者迷旁观者清。专业广度还是专业深度中小型公司讲究专业广度，面面俱到，容易杂而不精。大一点的团队讲究专业深度，各有分工，需要的是细分精专。（不代表所有）根据自己的当前实际情况和未来的职场目标，我们要明确选择是先专业广度还是深度。如果你很幸运，刚毕业就去了一线团队实习，由于设计师比较多，大家所负责的模块比较细化，你需要短时间打造出一个深度技能，展现出自己的设计价值。如果一开始就在中小企业摸爬滚打，通常需要掌握的技能很多，针对 UI 设计师来说，可能整个产品设计的所有环节都需要完成，有的公司连产品经理都没有，完成需求就是过关斩将，不断攻破进而不断尝试。作为多年经验的设计师来说，广度和深度都是具备的，所以路漫漫其修远兮，要妥善的做好计划，才能距离目标越来越近。业务转化沉淀作品初入行业的设计师总是盼望自己多几年工作经验，而真的工作经验很长的时候，就很焦虑了。工作经验并不只是数字的增长，要能拿出与之匹配的专业能力和作品沉淀，否则也是举步维艰。一些工作多年的设计师依然拿不出啥作品，把问题归根于公司没有好的项目，这是懒惰的借口。我们无法改变环境的时候，就要改变自己去适应环境，这样才有机会更换环境。公司只要有业务运转，就会有项目设计的需求，只是需求还没有被提上日程。我们可以主动去整理需求转化为作品，基于公司业务转化沉淀作品，也是作品输出的形式之一，还能不断强化设计的执行能力。公司没有品牌可以打造一套，没有官网可以自己设计一套，设计不够规范可以重新定义，只要自己想做，总能找到基于公司业务输出的机会。如果等着领导安排才去做，注定是积累不出太多作品的，只有化被动为主动才能沉淀更多作品。想跳槽得了解行情在公司如果学不到东西，虽然我们可以通过自我提升来进行弥补，不过这也仅限于短期内，长期如此还是需要尽早规划。跳槽在我们的职业生涯中是很正常的变动，只是需要做好充分的准备，不可盲目而为之。跳槽前我们需要准备好简历和作品集，也要对行情有一定的了解，不然容易陷入求职苦战。要对行业的招聘需求进行分析，然后再针对分析结果对自身专业进行体检，看看匹配度是否很高。作品集往往是求职成功的关键，要紧跟设计趋势，也要时刻更新自己的作品输出，不能总是拿几年前的设计充数，这样注定是徒劳无功的。关于是在职看新机会寻求跳槽还是离职重新找工作，我们需要结合行业情况做出判断，可以先试探性投一些简历，结合反馈情况选择是在职还是离职。也要结合自己的生活情况，毕竟生活成本的开支也得不受影响。通常求职周期在 1-3 周左右属于正常，超过一个月需要谨慎对待，一定是某个环节出了问题。大部分因素都与作品质量有关，只有专业能力突出了，才能获得更多机遇。选择适合的至关重要在职场中遇到一位好的领导实属幸运，可以让你少走很多弯路，对于专业的提升也是事半功倍的作用。与其选择一家好的公司不如遇到一位好的领导，所以有时候选择适合的至关重要。对于应届生来说，能进一线的团队自然是好事，行业背书是一个不错的起点。如果进不去的情况下，就要选择有人带的团队，初入行业靠自己摸索是很慢的。领导的专业背景也是我们考量的因素，项目的发展潜力和行业属性是判断的一个方向，选择自己喜欢的行业才会自发研究。在当前公司学不到东西的因素是哪些，也是要有个分析总结，避免同样的问题在下一份工作中延续。带着清晰的目标去找工作，才能更加高效，选择最适合自己的，对经验的积累和专业的提升都有较好的辅助性。先有储备才可能绽放与其羡慕别人不如正视自己，别人的高薪和机遇并非偶然，只有先储备到一定程度，才有可能在行业中绽放自己。作品需要一个一个界面去打磨，专业能力的提升也离不开按部就班的努力，要给自己制定阶段性的目标，沉淀更多专业输出。找工作除了在招聘平台投递简历，被动的等待机遇以外，我们也要主动去铺垫机遇。多在一些设计平台发布自己的作品和文章，让更多的同行关注到自己，HR 也会通过设计平台筛选优秀的设计师。只有做好了这些漫长的铺垫，机遇才会聚集到你身边。作品的沉淀不局限于视觉层面，经验总结和体验输出也是沉淀，具备完成项目的能力很重要，但是能将能力转化成方法论也很重要。特别是当我们求职资深岗位时，团队的要求不局限于个人的执行能力，辅助团队整体能力的提升也是至关重要的。小结工作中学不到东西时不要焦虑，与其去埋怨环境的不如意，不如调整心态储备能量。埋怨和盲目跳槽都无法解决问题，唯有自我驱动才能靠自己提升专业和沉淀作品，储备到一定程度之后，绽放就不会太远。遇到问题先分析原因，再找到变相的方法，如果靠自己无法解决，就要去学习进阶。专业的提升易早不宜晚，工作年限越高要求就越高，这是成正比的关系。不能只是年限的增长，与之匹配的能力非常重要。新人来收！9 个毁掉设计职场路径的坏习惯初入职场时，我们总是非常积极，哪里不会就会想方设法的去提升。阅读文章 > 欢迎关注作者的微信公众号：「黑马家族」本篇来源：优设网原文地址：https://www.uisdc.com/work-and-study
波兰 风格 海报 平面设计的故事讲到这里已经是个分水岭，我们即将进入“后现代”时期，在英文中“后现代”（Post-moderm）与“后现代主义”（Post Modernism）的含义内容并不相同。两个名词经常会被混淆，误说，误用，我们后面会进行区别说明。在此之前，先跟大家先温故知新，史太浓就过去近 200 年的现代设计发展划分出几个阶段，让大家不会迷惑，以后侃大山能技高一筹。「后现代」与「后现代主义」在 1851 年英国水晶宫（Crystal Palace）诞生之前，设计（其实当时没有“设计”这个概念，只为方便叙述）还属于古典时期，但自第一次工业革命诞生，设计改革蠢蠢欲动，那时候主流风格以“新古典主义”（Neoclassicism）及“维多利亚”（Victorian style）为主。用一篇文章，帮你了解新古典主义设计运动上回我们聊过了英国的“维多利亚风格“（Victorian style）跟法国的“第二帝国风格“（Second Empire style）在设计上的表现。阅读文章 > 用一篇文章，帮你了解设计史上的「维多利亚风格」导言维多利亚风格在设计艺术史中是个相对特殊的存在，这个风格主要特指英国19世纪维多利亚女皇统治时期的一种艺术风格。阅读文章 > 新古典主义风格建筑19 世纪初的维多利亚风格家具1851 年到 1919 年期间，欧洲各国分别产生了工艺美术运动、新艺术运动、装饰艺术运动（装饰艺术运动的历史定义在 1925 年，其实早就诞生，详见下文。通过3位顶级大神，带你了解工艺美术运动史上一回我们谈过了现代设计诞生的社会与文化条件，而第一个被视为有现代设计特征的运动是 19 世纪下半叶在英国产生的“工艺美术运动”（The Arts & CraftsMovement）。阅读文章 > 用一篇文章，帮你了解装饰艺术风格上一回我们谈到苏联的“构成主义“（Constructivism）平面风格，这是一场以人民为名义发起的运动，具有社会主义与功能主义特色，然而无法否认的是同时也有固化的形式主义。阅读文章 > 这个阶段属于现代设计萌芽阶段，是过渡性时期，这些运动都展现出现代设计混合古典动机的形式。三种运动风格之间的对比1919 年到二战之前，属于现代主义时期，以德国包豪斯、荷兰风格派、苏联构成主义为代表，三者你中有我，我中有你，大家比对一下作品就清楚。三种现代主义风格的对比设计史必修课！解读包豪斯：没有风格，只有问题包豪斯（Bauhaus）属于我分享得比较多的一个主题，原因很简单，作为一名设计师，对包豪斯的了解属于必修课。阅读文章 > 你可能不知道风格派，但你肯定见过他们的设计前面我们详细谈过苏联的“构成主义”，其发展曾通过一些关键人物启发过今天的主题“风格派”。阅读文章 > 用一篇文章，帮你了解影响深远的苏联「构成主义」上一回我们谈了 1914 年在英国诞生的先锋画派“漩涡主义”（Vorticism），这个画派就像如今的“快闪店”，来的快去得快，一战前忽然诞生，一战开打后快速消亡，留下为数极少的作品。阅读文章 > 二战之后直到 20 世纪 70 年代，属于国际主义时期，以“国际主义建筑风格”及“瑞士平面设计风格”为代表。堪称商业设计万金油的国际主义是如何发展至今的？国际主义（InternationalStyle）在当代是非常重要的风格，它属于商业设计中的“万金油”，放之四海而皆准，世界各国人民似乎都可以接受它，未必最好，但挺合适。阅读文章 > 瑞士平面设计风格随后就是“后现代”时期至今，大家注意这种划分是粗线条的，因为我在「世界现代设计史」系列中详细论述过设计发展是“共时性”的，不是“历时性”的。共时性的意思是两个主体（或两个以上主体）会彼此存在很长一段时间的交叉，比如装饰艺术运动跟包豪斯几乎同期发展，而工艺美术运动与新艺术运动也是并存很长的时间。历时性最典型的例子是政权交叠，一般而言一个政权取代另一个政权都有明确时间。（特例不谈），而这种情况在文化发展领域中几乎不可能。因此这些时间点取自比较典型的事件，方便大家梳理，比如 1919 年其实是包豪斯诞生元年，我们就粗暴的将其划分为现代主义诞生。那么话题回到“后现代”与“后现代主义”的区别上，“后现代主义”在学术界其实特指国际主义风格之后，20 世纪 70 年代开始在建筑领域中发展起来的一个明确的设计运动。以罗伯特文丘里（Robert Venturi）及菲利普约翰逊（Philip Johnson）等人为代表，针对国际主义的“少即是多“（less is more）而提出“少即是烦”（less is a bore）概念，无论设计形式或者思想观念都非常清晰。罗伯特文丘里文丘里的后现代主义风格建筑“后现代”则主要指“现代主义”风格之后的多种风格，而在这个语境中，其实“现代主义”是将国际主义也包含进去的，因为国际主义在形式上基本是现代主义的复刻。这两个概念经常被混淆，后来学术界想到另一个说法来取代“后现代”，就是“现代主义以后”（After modernism）。“现代主义以后“的平面设计作品但其实有些概念以讹传讹久了就变成约定俗成，所以有时候为了避免再三解释，史太浓在某些文章中，也直接将“后现代主义“等同”后现代“去表达，这次是借此机会补充说明，大家知道怎么回事就可以了。我们接下来讲述的故事是平面设计的“现代主义以后”的部分，这个时期最大的特点就是风格大爆发。能盘点出名字的风格就有复古、波兰海报、折衷、迷幻、新浪潮、观念、解构主义、孟菲斯、新简约主义、新现代主义等等。“现代主义以后“的平面设计作品这个部分跟之前任何一个设计发展阶段相同，风格之间的发展都是“共时性”，所以史太浓的讲述也没有严格时间标准，而是穿插进行，并非全部都讲，而是挑选有代表性的或者将几种类似风格合并一起讲述。首先登场的是“波兰海报风格”。诡异的风格波兰海报风格（Polish poster Style）的黄金时期是 1950 年-1980 年，最大风格特点是诡异，其次是象征、隐喻与阴暗。波兰海报风格作品在表现手法上，往往喜欢融合 20 世纪以来各种现代艺术流派。比如立体主义、超现实主义、表现主义、抽象主义及野兽派（以上风格详见我的个人主页）等，设计的艺术水平都非常高，属于“现代主义设计”与“现代主义艺术”大融合的典范。波兰海报风格作品这种风格的形成要从二战爆发说起，话说波兰是二战中最早的受害国，1939 年 9 月 1 日，纳粹德国军队以闪电战方式突击入侵波兰，17 天后苏联军队也从东边夹击，波兰很快丧失独立主权，国家开始长达 6 年的苦难。二战结束后，波兰国土满目苍夷，经济崩溃，工农业水平降到历史最低点，而且人口死亡极为严重，惨不忍睹，此后波兰成为一个社会主义国家，开始异常艰难的国家重建。二战后满目苍夷的波兰波兰战后的平面设计应用主要是为政府部门创作宣传画，也就是现在常说的「海报」。当时波兰政府为了培养艺术设计方面的人才，在两大历史悠久的波兰学院中建立新的艺术设计教育体系，分别是华沙艺术学院（The Warsaw Academies of Art）与克拉科夫艺术学院（TheKrakow Academies of Art）。如今的华沙艺术学院克拉科夫艺术学院这两所学院入学要求都非常严格，毕业也相当不容易，教育体系很完整，综合以上因素可以说能顺利毕业的学生已经是国家一线水平的设计师。他们毕业后由国家统一分配工作，参与国家指定的设计项目，其中表现优秀者还会被招纳到政府组织的“波兰艺术家协会”（The Polishｕｎｉｏｎof Artists），波兰海报风格曾出现过的大师基本都是此协会成员。波兰海报风格作品在二战后的第三世界国家（亚洲、非洲、拉丁美洲以及其它地区中的发展中国家）中，政治宣传画是政府与人民及国际社会重要的沟通工具，所以海报设计在这些国家中具有非常高的地位，这也是形成波兰海报风格的时代背景。波兰海报风格作品任何一种风格的诞生都有核心人物，所谓的开路者，他能凭借自己的探索形成一种生猛的风格，慢慢会有人不断跟随，将风格持续发展升级，比如工艺美术运动的威廉莫里斯(William Morris)，装饰艺术运动的卡桑德拉（A.M.Cassandre）等。波兰海报风格作品而波兰海报风格的形成跟其国家承受过的苦难密切相关，所谓：艺术源自生活。其中最主要的先驱人物名为特列波夫斯基（Tadeusz Trepkowski）。关键人物1914 年生于波兰首都华沙的特列波夫斯基一生只活了 40 岁。特列波夫斯基他属于一名自学成才的设计师，没入读过我们前面谈及的学院，据说曾经在市立的装饰艺术学校学习过几个月的课程，后来因为家境贫困而终止。在他 16 岁那年，也就是 1933 年参加波兰一个海报设计比赛获奖，随后进入设计行业，为一些工厂设计制作海报，在 1937 年再次获得巴黎国际展览会的海报大奖，某程度印证了“天才都不是教育出来的”这句话。他的设计风格都喜欢强调视觉形象的简单性，他认为简单是一种力量，他在 1953 年设计出著名的反战海报，名为《不》，名字也那么的简单。特列波夫斯基海报设计海报中是一个被摧毁的城市轮廓，然后有一个正在投下的炸弹轮廓叠压在上面，整个海报只有一句标语放置于右下角，就是“不“（NIE），一目了然，被视为当时世界上杰出的反战海报。后来他大部分作品都是应政府需求而设计，几乎都表现出一种自己感受战争伤痕的压抑感，这种风格让波兰大部分设计师及观看者产生共鸣，由此成为波兰海报风格的发展基调。特列波夫斯基海报设计1956 年“匈牙利十月武装暴动事件”爆发，此事与波兰密切相关，而且匈牙利与波兰两国从中世纪开始就“哥俩好”，有非一般友谊。当时波兰政治气氛也因此非常微妙，比如对当时的苏联驻军产生强烈不满及不安。这种不满与不安也折射到海报设计中，一位名为佛兰西斯克（Franciszek starowiejski）的设计师基于特列波夫斯基的风格再发展出一种更加沉重、阴暗，带有隐喻的海报设计形式，作品看上去甚至可以用恐怖来形容。创作中的佛兰西斯克佛兰西斯克经常喜欢采用一种超现实主义手法绘制超自然写实的主体图像，比如人体器官、骷髅头、变异肢体等元素，有些看上去还会让人产生厌恶、恐惧、恶心等不安情绪。佛兰西斯克的海报设计为避免让大家产生这样的感受，史太浓只展示他一些相对温和的作品，希望挑战感官刺激的朋友可以自行通过其英文名移步在谷歌检索。这里介绍的是佛兰西斯克在 1962 年为波兰华沙剧院设计的海报，海报主体是一条蛇在两个圆环之间缠绕而上。除了代表剧院的戏剧化形式，后世认为可以解读出一种对波兰民族经常被剥夺自治权的绝望，这些非作者自述的概念我们参考一下就好。佛兰西斯克的海报设计由于佛兰西斯克这种极端表现的海报设计形式引发广泛讨论，所以大家一直误以为波兰海报都是如此，其实不尽然，也存在一些设计让人看起来积极并且充满希望。比如一位名为亨利克（Henryk tomaszewski）的设计师就发展出另一种灿烂、生动，充满朝气的海报设计形式。创作中的亨利克亨利克跟特列波夫斯基同岁，但活得特别久，活到 2005 年 91 岁才因为疾病去世。他曾经是华沙美术学院的教授，所以也是桃李满天下，培养了不少波兰平面设计师，对波兰海报设计发展起到重要的促进作用。虽然波兰海报风格主要从政治宣传画中发展，但还有大量海报是关于舞台剧、马戏团表演、电影与音乐会的，亨利克的海报创作大部分是这些类型。亨利克的海报设计波兰在二战之后文化生活比较沉闷，无线电广播节目也很单调，所以在 1962 年开始，政府提倡马戏，因为这种表演形式轻松，可以为大家带来欢乐，相关海报设计的需求因此大增。亨利克在设计这一类文化海报时候喜欢采用明快的色彩计划，活泼生动的手绘形象，而且善于使用达达主义那种拼贴手法（collage）创作。亨利克的海报设计其中还有一个绝活就是通过手撕纸张创作主体图像，蛮有保罗·兰德（Paul Rand）那种轻快感，也有西班牙超现实主义画家胡安·米罗（Joan Miró）那种童趣，看上去很舒服。亨利克的海报设计结案陈词因为应用广泛，作品优秀，海报设计成为波兰人民生活一个重要组成部分，波兰也比世界上任何一个国家重视海报设计水平。所以在 1964 年时候，波兰举办了第一届“华沙国际海报双年展”（The Warsaw InternationalPoster Biennial），发展到如今这个展览的奖项就等同“海报设计界的奥斯卡”。如今的华沙国际海报双年展而且波兰还有不少海报博物馆，保存了大量波兰海报设计师的经典作品。据说波兰的平面设计具有比其它国家更高的专业地位，平面设计师如同律师，医生一样，享有相当高的社会地位，这些可以说是历史发展的必然结果。今天的故事讲到这里，感谢各位，我们下期再会！用一篇文章，帮你了解二战中的平面设计史上回我们聊到了平面设计在美国的发展，二战前后全球的设计发展（不止平面设计）以美国地区戏份最重，其中原因深刻也简单，就是“江山代有才人出，各领风骚数十年“（原诗“各领风骚数百年”）。阅读文章 > 欢迎关注作者的微信公众号「设计史太浓」：本篇来源：优设网原文地址：https://www.uisdc.com/polish-poster-style
官网 都是 花瓣 大家好我是花生。Figma 封禁中国企业大疆（DJI）企业账号的事这两天在设计圈持续发酵，个中详情大家相必都有所了解。究其根源，此次封禁并非 Figma 本意，而是在美国政府制裁名单这样的政治因素影响下，作为美国企业的 Figma 不得已为之。但事件已经发生，并对中国的设计行业造成了较大的冲击。虽然目前制裁的只有大疆，但是很多中国企业为了规避风险，纷纷选择将 Figma 上的文件迁出。幸而国内的同类对标产品即时设计、MasterGo 等对这次事件反应迅速，纷纷上线 Figma 文件导入功能，帮助企业和设计师应对难关。即时设计和 MasterGo 针对 Figma 事件发出的公告Figma 封禁大疆事件引起设计圈的普遍忧虑，担心未来会有其他设计产品受政治因素影响对中国用户进行封锁，这样的担忧不无道理。今天为大家盘点梳理 5 款我了解到的中国大陆本土或者已明确表态不受政治因素影响的办公和设计类工具，它们可以很好的替代现在的一些知名设计办公产品，且都是免费使用的，希望为你的工作提供更多的选择。C4D 与 BlenderC4D 由德国公司 Maxon 的研发运营，是当下最热门的 3D 软件，它集 3D 建模、动画、模拟和渲染于一体，功能强大。C4D 相对于 Maya、3D Max 等 3D 软件要更简单易学，且搭载了 VRay、Arnold、RedShift 等多个渲染器，能在较短时间内渲染出极具质感的作品，几乎可以达到以假乱真的地步。C4D 渲染作品，来源：Behance @Danny Liu说到未来最有可能超越 C4D 成为最热门产品的 3D 软件，无疑就是 Blender 了。Blender 是托管在 blender.org 上的开源项目，供所有人永久免费使用，而且支持中文简体。它的程序轻便，只有 200 多 M，但建模、渲染、动画、模拟等功能一应俱全，比 C4D 更加简单易学。Blender 渲染作品，来源：Behance @林 溢鑫推荐 Blender 作为 C4D 的替代， 一是 Blender 的确好用且免费，二是 2022 年 3 月 9 日 Blender 在其官网上发布了关于俄乌战争的声明，声明中表示 Blender 将捍卫艺术家和开发者的自由，坚持为每个人服务的原则，不会对俄罗斯地区的用户访问 Blender 进行封锁。开源的特性加上官方这样开放坚定的态度，我们可以放心选择 Blender 而不必担心它会受政治因素影响。网站链接：https://www.blender.org/从准备入门到跨过门槛：3D神器Blender 教程来了！@嘉文钱：大家好，我又来了我发现最近的几次更新，都是因为我开始熟练了新的「玩具」比如上次的 Procreate以及这一次的 3D 制作神器「搅拌机」为什么我要学做 3D？阅读文章 > Eagle 与 Billfish相信不少设计师都已经选择 Eagle 作为自己收集这整理灵感的资源库了，它可以接受图片、视频、音频、字体、文本文档、PSD、Ai、BLENDER 等 40 多种类型的文件，搭配浏览器插件使用实现拖拽保存图片，非常便捷。Eagle 实行买断制，试用期 30 天，购买后激活序列码即可解锁终身使用。Eagle 是一款本地软件，本身没有云同步功能，需要搭配其他云盘使用。Eagle 程序主界面及其功能想使用免费素材管理工具的设计师，可以试试Billfish ，这是苏州长嘴鱼软件有限公司开发的一个素材管理工具，它的功能与 eagle 一样非常全面，而且完全免费。目前 Billfish 处于一个高速发展阶段，未来能否在云同步等功能上更加全面并超越 eagle 还是非常值得期待的。网站链接：https://www.billfish.cn/Billfish 官网非常活跃 Billfish 论坛，在上面你可以与开发人员直接沟通Pinterest 与花瓣Pinterest 和花瓣都是设计师非常熟悉的设计灵感网站了，或许很多设计师还是感觉花瓣没有 Pinterest 优秀，但是放在特定的背景下看，有花瓣这样属于我们自己的设计资源网站还是非常珍贵的。2022 年 2 月花瓣发布了最新一版的 UI：下线了体验不佳的广告，网站整体视觉更加透气高级；升级了搜索逻辑和算法，帮助用户更快更精准的寻找素材；上线了花瓣 Pro、10W+可商用源文件等新功能。从 2011 年成立至今，花瓣网经历了数次更迭改进，内容和功能都越来越专业强大，相信未来发展也会越来越好。网站链接：https://huaban.com/Pinterest 主界面花瓣网 2022 年 2 月更新的最新版 UINotion 与 wolaiNotion 是一款号称“第二大脑”的笔记工具，能实现笔记、知识库和任务管理的无缝衔接协作，在云笔记领域非常热门。Notion 可以嵌入图片、网页、文档、视频等多种类型的文件，并将内容以块（Block）的形式呈现，可以通过拖拽实现内容自由排版；拥有无限层级，互相之间可以嵌入和链接，非常灵活。但是 Notion 没有汉化版本，它的程序界面及官网教程都是英文，即便 B 站上有很多博主出了详细的使用教程并免费分享知识库模板，但是设计师想自己熟练使用还是难度的。网站链接：https://www.wolai.com/其实国内就有一款完全对标 Notion 的云笔记工具——wolai。wolai由上海我云网络科技公司出品，它的功能与Notion并无差别，且使用界面和官网教程都是中文。wolai官网上提供现有模板供免费下载，如果想自己搭建知识空间，可以跟随官网上详细的教程指引进行操作，非常友好。对想自己构建完整知识框架但又无法熟练运用notion的小伙伴，wolai绝对是不二之选。wolai 官网wolai 官网上的帮助中心，内容相当细致丰富Microsoft Office 与 WPS Office作为办公软件界的王者，Microsoft Office 的地位和功能毋庸置疑。但还是那句话，放在特殊背景下，自己有的才是最好的。作为 2022 年北京冬奥会协同办公产品，WPS Office 在领域深耕已经三十多年，针对我们国家自己用户需求发展出的功能越来越全面强大，针对企业和政府开发的服务也越来越完善，在某些方面来说相比 Microsoft Office 并不逊色。Microsoft Office 与 WPS Office 高低之以持续多年，但时移世易，它们的竞争关系或许已经翻开新的篇章了。网站链接：https://www.wps.cn/WPS Office 官网及其应用矩阵总结自俄罗斯和乌克兰的战争爆发后，西方国家在政治、经济、艺术、文化、商业等方面对俄罗斯实行的种种制裁和封锁，早已令“无国界”这个词面目全非，设计行业也不能幸免。2018 年美国制裁中兴通讯事件也给我们留下了深刻的教训，依靠别人终究不安全，唯有自己拥有才最可靠。在不同领域有用中国自己的同类产品可以进行替代一个必然的趋势，设计行业也不例外。今天即时设计、MasterGo 能很好的代替 Figma，这是值得庆幸的。相信未来会有更多优秀的国产办公设计工具出现，让我们不必再担忧设计行业也被“卡脖子”。今天推荐的 5 款可免费使用的办公和设计工具，希望对大家有帮助，如果你有其他觉得不错的国产设计工具，欢迎在评论区分享哦~更多相关知识Figma封禁大疆账户！国产软件的春天来了？就在上周六，刷微博时一条微博引起了我的关注：这则消息很快引起了轩然大波，有网友在评论质疑消息可靠性后，很快博主贴出了Figma 官方发给大疆的通稿，并表示向大疆朋友确认了消息属实。阅读文章 > 5个经典的付费英文字体，我们都帮你找到了免费可商用替代款！大家好我是花生~现在一提到字体资源，大家最关注的点肯定是能不能免费商用吧？阅读文章 > 本篇来源：优设网原文地址：https://www.uisdc.com/5-commonly-used-software-replacement
字体 西文 灵感 大家好我是花生~ 今天和大家分享个字体设计灵感网站——Fonts In Use。学过字体设计的朋友都知道，中文字体设计中有一种方法叫做「西文中用」，即借用具有特色的西文字体，将其笔画拆解出来，用作中文字体的新笔画进行字体设计。西文字体设计历史悠久，优质出色的西文字体不计其数，是非常好的设计灵感来源。如果对西文字体笔画化用得当，能取得相当惊艳的设计效果，很多优秀的字体设计师也非常推荐的这种设计方法。更多字体设计方法：实战篇！超多案例帮你掌握字体设计36计（下）在《实战篇！阅读文章 > 既然「西文中用」的设计方法这么好用，那么去哪里找那些有特色的的西文字体呢？这就是我今天给大家推荐 Fonts In UseE 原因。Fonts In Use 网站内包含了种类丰富且优质有特色的西文字体，是一个非常好的字体设计灵感网站。FONTS IN USEFonts In Use 是一个按可以按主题、媒介、行业以及各种排版风格和技术进行字体索引的公益性网站，由 Sam Berlow、Nick Sherman 和 Stephen Coles 于 2010 年创立，目的是为了记录字体排版印刷设计的发展，并提升相关行业的印刷素养和欣赏能力。现在网站有 2 万多种字体印刷排版参考，是由运营者和用户共同上传发布的。对想要用「西文中用」方法来进行字体设计的设计师来说，Fonts In Use 的以下功能可以帮助我们快速选择合适的字体。按主题风格进行字体筛选借用西文字体笔画进行字体设计的时候，需要注意的一点就是所选字体的风格一定要符合我们的设计主题，否则就算最后设计出来的效果不错，也会因为风格不搭而无法适用。比如如果要设计的中文字体是有关美妆的，在选用英文字体作为灵感时就不能选择线条很粗或者有粗壮衬线的西文字体，因为这样的字体哪怕质量很高，最后化用的结果肯定也不会符合美妆优雅潮流的气质。Waters Titling Pro 这种罗马碑文体就很适合用来设计具有历史厚重感的中文字体FONTS IN USE 站内有按主题/行业进行字体筛选的功能，分类包含艺术、服装、运动、电影、儿童、食品等各个方面。设计师如果想找某种特定主题的字体设计灵感，可以直接选择对应的类别，这样找灵感的速度和准确度都会提高很多。Fonts In Use 内有关服装的字体推荐Fonts In Use 内有关食品的字体推荐便捷的字体下载渠道Fonts In Use 会将一张图片上的所有字体信息都列出来，包括名称、设计师、下载渠道等。如果你看中了其中一款字体，点击图片右侧的字体列表，就能跳转到对应的字体详情页，在那边你可以找到字体的下载渠道。Fonts In Use 站内字体下载渠道总结Fonts In Use 站内提供 2 万多款涉及不同行业领域的字体印刷排版的参考，类型全面丰富，且提供细致的筛选功能和便捷的下载渠道，不仅适合用作寻找字体设计灵感，对不同主题排版选择合适的西文字体也有极高的参考价值。「FONTS IN USE 官网」 https://fontsinuse.com/更多字体设计的干货知识：https://www.uisdc.com/zt/font-design7个技巧让你的字体设计拉满细节感！前不久一个朋友把自己设计的字体发我看，说总感觉差点意思，但又不知道问题出在哪里，就觉得没有网上看到的字体那么专业，我看了一下，发现主要问题是没有细节、缺少变化，所以显得有点粗糙。阅读文章 > 本篇来源：优设网原文地址：https://www.uisdc.com/fonts-in-use
用户 功能 工具 相信这几天设计圈和产品圈的同学都在讨论 Figma 封禁大疆的团队帐号这个事儿，经过多轮文章和视频的洗礼，这个事件的始末和性质相信大家已经掰开了揉碎了看明白了。担心也好，警醒也罢，各位心里都有数了，受到影响的大疆和其他企业应该也已经转向 plan B，我这边想先聊点别的——关于Figma 是如何借助两波风口起飞的，两位创始人的创业经历，以及 Figma 与拜登设计团队、Adobe 的过往交集。（看过银河系漫游指南的同学应该都知道这是啥意思）首先，别慌。就此时此刻而言，绝大多数的国内 Figma 普通用户不会受到影响。1、暂时，对于绝大多数人不会有太大影响如果你只是一个普通的 Figma 用户，就目前而言，很大概率对你是完全没有影响，至少使用免费套餐的普通用户而言，你不会因为 IP 地址是中国大陆而被禁止访问，即使是购买了 12美元/月专业用户，也无需在注册购买的时候注明公司和企业。换句话说，Figma 不知道你是谁。而往下看你会注意到，在专业用户之上，还有 Organization 和 Enterprise 两个套餐，后者应该是最近新增的。而真正可能受到影响的，是购买后面两个套餐的企业用户：如果你仔细查看目前 Figma 对4类用户提供的服务的列表，你会发现，绝大多数的设计功能和常见的协作和管理功能，其实基础和专业用户两个套餐都是不缺的，而主要的差异，存在于下面的部分：这当中基础和专业用户套餐中所不包含的功能，绝大多数都是特别进阶和细分的功能服务，比如协作中的定制工作空间、语音通话、分支与合并，设计系统部分的共享字体、组织、多团队设计系统共享，开发当中的私有插件，等等等等，绝大多数国内正在使用 Figma 做设计的设计师同学有几个人真正深入用到这些功能？而这些功能有哪些是彻底完全无可替代的？对于使用免费版和专业版 Figma 帐号的同学，起码现在不用担心，没有影响。不过，既然我说「绝大多数」，也就意味着影响还是存在。对于拥有多个大型设计团队，并且基于 Figma 进行设计、开发协同的大型企业和公司而言，团队和企业账户下的「管理与安全」部分的独享功能，可能是都有需求的，比如大疆。包括插件管理、中心化帐号、用户帐号自动加入、链接和文件管理等等这些功能，也正是涉及到复杂协同环境的大型设计团队所需要的，而他们也是这次事件中受到威胁最大的部分，而真正受到实质性影响的，则是出现在 600 个企业名单上的一部分国内企业。当然，Figma 制裁国内企业这件事情虽然并未涉及到我们全体，而我上面所探讨的不同套餐和用户受到影响的差异，也是「现在」这个时间节点的状况，这并不意味着后续不会发生变化。不过我们大家都很容易在这种事情上「感同身受」，出于本能未雨绸缪准备备用方案也非常正常。好在国内设计软件服务蓝湖、即时设计等守望相助，提供了 Figma 的文件导入服务，在短时间内解了受影响企业用户的燃眉之急，也为准备迁移设计平台的用户及时提供选择，远哥在这篇文章当中提供了相关的介绍和入口，我这里也暂时不赘述了：Figma封禁大疆账户！国产软件的春天来了？就在上周六，刷微博时一条微博引起了我的关注：这则消息很快引起了轩然大波，有网友在评论质疑消息可靠性后，很快博主贴出了Figma 官方发给大疆的通稿，并表示向大疆朋友确认了消息属实。阅读文章 > 说完「目前」的状况和影响，，接下来把时间跨度放大，来看看这次事件的 B 面。2、Dylan Field 与 Figma 先重新审视一下 Figma 是怎么走到这一步的，很重要。正如同我们所知道的，Figma 目前的主要竞争对手 Sketch 和 Adobe XD 都是本地软件，而 Figma 恰恰相反，它是一款可以直接在网页运行的、天生带有多人协同属属性的「轻量级」设计服务和工具。在成长性和功能拓展上，Figma 明显超出两位竞争对手。当然，这种特质和它背后的始作俑者的的确确有着直接的关联。在维基百科中文版中，对于 Figma 和它的 2 位主要创始人的介绍是这么写的：「迪伦·菲尔德（Dylan Field）和埃文·华莱士（Evan Wallace）于 2012 年开始着手开发 Figma。这种基于Web的设计工具是菲尔德和华莱士在2011年就读于布朗大学期间所构思的。2012年，华莱士从布朗大学毕业，而菲尔德则退学接受了泰尔奖学金（Thiel Fellowship），该奖学金提供了10万美元用于寻求创业想法。随后，两人移居到旧金山，全职投入Figma的工作。Figma从2015年12月3日开始提供采用邀请模式的免费预览程式，于2016年9月27日首次公开。」这两位联合创世人中，Dylan Field 的个人经历更容易查到，而恰恰是他的个人成长经历，能够帮我们管窥 Figma 这个工具成长到今天这样的一些缘由。图片来源：维基百科1992 年出生于加州彭格罗夫 Dylan Field ，6岁的时候开始学习代数，从小对计算机感兴趣并且参加过 国际青年组织 FIRST 所举办的机器人竞赛，甚至在 Windows XP 的广告中作为演员露脸，中学时代长期和学校一位「在数学方面非常专业的看门人」一起玩，并且开始对设计产生兴趣。而升入高中的时候，Dylan 很自然地选择了一个位于索诺玛州立大学内的附属技术高中，这所学校除了常规的教学内容之外，还会额外提供大量科学、技术、工程和数学类的学科知识，而这个阶段 Dylan 和朋友一起制作机器人和网站，甚至参与了社交媒体方面的研究，而正是这样的契机使他得到了通往布朗大学的推荐信。《社交网络》进行中的黑客马拉松2009 年，Dylan 正式进入布朗大学学习计算机科学，在大学期间，他组织过黑客马拉松（著名电影《社交网络》中有展现过扎克伯格搞黑客马拉松的场景），在 LinkedIn 实习，并且两度进入 Flipboard 实习，大三第二次去实习的时候，他的身份是技术产品经理。而正是在 Flipboard 实习阶段，让他开始怀疑自己继续在大学进修计算机和数学的计划，并且在他遇到同样毕业于布朗大学并且从事图形学的 Evan Wallace 之后，决定创办自己的公司。Dylan 的个人成长经历和所具备的技能，大学和实习阶段在互联网初创公司的经历，以及当时正在快速演进的互联网技术，为后面 Figma 的出现铺陈出重要的底色。从各种意义上来说，Dylan 和 Evan 所创建的 Figma 抓住了上一个10年当中，2个关键的风口。3、第一个风口，HTML5 和 SaaS2009 年 5 月 28 日，彼时以扁平化管理而著称的 Google 的内部孵化并正式上线一个在当时看来极为实验性的产品，Google Wave 。Google Wave 从根本上了来说是一个在线实时协作编辑的软件框架，而在当时的用户眼中，看起来是一个集成了邮件、实时通讯、多人协作、实时开发等大量功能，可以嵌入各种各样媒体、服务功能的复杂集合体。彼时 Google 还未正式退出中国大陆，我曾经在大学阶段有幸体验过 Google Wave，当时常与朋友在 Google Wave 的协作文档中聊天，添加简单的媒体链接，分享信息。无法忽视的是，Google Wave 的诞生上线和 2008 年 HTML5 第一版草案的公布不无关系，当时想要体验 Google Wave 需要使用最新版本的 Chrome 浏览器，而这个时间节点恰恰是 Chrome 和 Firefox 浏览器开始普遍支持 HTML 5 的时候。同在 2009 年，Node.js 和 AngularJS 正式发布。（这一年，一直热衷于网络技术和设计的 Dylan Field 前往布朗大学上学）Google Wave 在 2010 年正式宣布暂停研发并于次年彻底暂停服务，用户仅能阅读自己的内容，直到 2012 年 Google Wave 彻底在 Google 删除，并完全移交给 Apache 软件基金会。Google Wave 存在的时间非常短暂，但是在它关停之后，它在实时协作编辑开发上的探索，直接反哺了 Google Docs 和 Google Drive，而这两项服务为谷歌此后拓宽了市场，甚至成为了 Google 如今占领教育和低端笔记本市场所用的 Chromebook 的一个重要先决条件：Pixelbook 2013 原型机，A面顶端两侧的 LED 灯在正式版中被移除了。更重要的是，Google Docs 这项服务，是 Figma 最终定型的重要参考，而两者在基础的思路和特性上，几乎是沿着 Google Wave 的这条脉络，一脉相承。从2009 年到 2012 年，Google Wave 大胆的尝试给彼时很多软件开发商和服务供应商打开了新世界的大门，围绕着 HTML5 所延展出来的技术、服务与工具如同雨后春笋般涌向，越来越多的 SaaS 服务开始选择使用浏览器这样的轻量级瘦客户端交付给用户，让复杂的渲染和计算留给位于云端的服务器来处理。2012 年刚刚成立 Figma 的 Dylan Field 和 Evan Wallace 并没有明确他们要创造的产品会有什么功能，具备什么样的服务，但是他们确定一件事情：「我们的产品应该直接立足于浏览器，它是一个免费、简单且充满创意的工具，要让任何人都可以借此发挥自己的创想。」随后，Figma 正式开始开发。4、第二个风口，去 Adobe 化的 UI 设计做 UI 设计这个事情在很长一段时间里面，靠的主要是 Adobe Photoshop。一方面 Adobe 和苹果早在90年代初就已经是深度合作的关系，甚至 Adobe Illustrator 干脆就是在 Macintosh 上研发测试的，Adobe Phtoshop 最初也是如此。另一方面，在很长一段时间里，UI 设计也需要 PS 来作为视觉呈现的支撑。在 2000 年前后，以 MacOSX 1.0 DP3 为分界点，正式引领整个 UI（GUI）设计圈子向着拟物化设计进发。具体参看《Mac视觉史》第三篇：Mac 视觉史 vol.3：浴「水」重生的 Mac 视觉美学世间所有的相遇都是久别重逢。阅读文章 > 这些高度拟物化的肌理材质，渐变的光影，丰富视觉层次，使得设计师不得不选择 PS 作为 UI 设计的工具。加拿大设计工作室 Teehan + lax 作为非官方为设计师提供的 iOS 6 的 PSD，当时苹果官方还没有在 HIG 当中提供 UI Kit。这种追求高光阴影和肌理的拟物化设计在 2010 年前后抵达了高峰，彼时著名的设计社区 Dribbble 和国内论坛 iconfans 内聚积着大量热衷于「抄现实」的拟物化 UI 设计高手。2009 年的 Dribbble 网站我真的找不到更清晰的当年的网站截图了然后，设计方向开始发生转变。虽然微软早在 2002 年的时候就开始在自家 Zune 播放器上尝试扁平化设计，但是直到 iOS 7 （2013年）和 Material Design 出现，市场份额极小的 Windows Phone 7 的Metro 设计风格延伸到桌面端的 Windows 8 上之后，扁平化设计的趋势才彻底盖过 拟物化设计。而移动端用户数量爆发式增长（2013年移动端流量正式超过桌面端流量），和同时期这种设计风向的改变，是让 UI 设计领域开始去 Adobe 化的重要前提。Sketch 1.02010 年问世的 Sketch 最初的目标，是希望在 Mac 平台上给用户提供一个足够轻量、足够快速的矢量图形编辑工具，实际上当时 Sketch 的创始人 Pieter Omvlee 对于未来的走向也没有清晰的思路：「当时我在特温特大学（荷兰）刚刚开始我的计算机科学研究。当时的想法是制作一个简单的绘图应用程序。那时的独立应用场景要小得多，似乎有一个我认为可以填补的空白。……上线后，我们被功能请求淹没了，保持专注一个方向是一个极大的挑战。每个人都想把 Sketch 拉向他们需要的方向。而真的迎合这种需求，风险在于你最终会得到一个怪物，一个可以做很多事情但没有办法掌握的应用程序。」当时有用户认为它是臃肿庞大的 Adobe Illustrator 的优质替代品，而此时 Sketch 的开发团队已经开始将 Symbol 作为核心功能提供给用户，只是当时更加粗陋，仅仅类似于 PS 的智能对象（真正的 Symbol 功能是到 Sketch 3 的时候才具备），不过，包括布尔运算在内的基础的矢量图形工具都已经基本具备。此后，随着扁平化设计的崛起，快速迭代的 Sketch 吸引了越来越多的使用 PS 绘制 UI 的用户，它逐渐成为一个现象级的 UI 设计软件。原本轻量级的软件体量，明确的功能，轻松兼容日渐复杂的 UI 设计需求（比如对于 x1 x2 x3 尺寸界面的轻松导出），快速而便捷的画板等等。Sketch 3与此同时，处于阵痛期的 macOS 平台对于 App Store 的软件分发机制有更多干预和要求，很多软件受不了对于功能和用户关系的干预而独立，其中就包括 Sketch。用户对 Sketch 的认可也使得它有了底气通过自家网站来进行许可证分发，此时正是 2015年，而这一年的年底，Figma 正式推出了第一个 Beta 版本。在这个扁平化设计风行、追求轻量高效设计工具的阶段，Sketch 和 Figma 选择的方向，其实是殊途同归的。和最初的 Sketch 一样，Dylan 对于 Figma 的未来形态并没有明确的远景，并且一度考虑制作成为一款3D软件。从 2012 年到 2015 ，Dylan Field 和整个 Figma 团队都面临着极大的压力，Dylan 本身对于 Figma 发展方向的不明确、领导经验的缺乏和融资上的挑战，使得很多员工在这个过程中离职，甚至影响到 Figma 的发展，最终是「团队中其他成员对 Dylan 进行了干预」，才在一定程度上扭转了管理上的问题。图片来自：维基百科2013年，Dylan 在寻求种子轮投资的时候，投资人 John Lilly 直接拒绝了他的请求，并且直言不讳地他说：「我想你压根不知道自己在做什么。」虽然 Dylan 最后从 Flipboard 的董事 Danny Rimer 以及别处为 Figma 拉来了 380 万美元的种子轮投资，但是他对 John Lilly 的话念念不忘，并随后主动联系 John 寻求解答，而 John 则随口跟他说，「你可以去找 Adobe 的 CEO Bruce Chizen 请教」。而 Dylan 真的就这么做了。在「部分功能」上对标 Photoshop 的 Figma 最终 于 2015 年正式发布 Beta 版之后，John 看到了产品，并且讶异于 Dylan 敢于从前辈（某种程度上算是未来对手）那里寻求解答的品质，而决定带领 Greylock 为 Figma 领投了 A 轮总计 1400 万美元的投资。随后，在 2016 年上线了正式版，2017 年开始推出付费的套餐，而此时在 UI/UX 设计领域，Adobe XD、Sketch 和 Figma 的竞争关系雏形已经形成。得益于和 Sketch、Adobe XD 截然不同的部署模式，借助浏览器即可使用的 Figma ，让用户更容易触达，在对标 Sketch 的功能特性的同时，以更快的速度培养出自家的插件生态和用户社区，这确保了 Figma 本身的生命力足够强健。Adobe XD 1.0而和 Sketch、Figma 同期发展的软件和服务还有很多，在 UI/UX 设计这个领域，它们共同蚕食了当初属于 Photoshop 的份额，即使有 Adobe XD 后续补位。这种去Adobe 化的趋势还体现在其他分支领域，比如基于模板的软件服务 Canva，手绘领域的 Procreate。同时 Figma 每年获得的投资也逐渐提升，随着疫情到来，远程办公需求大涨，2021 年6月获得 E轮融资 2 亿美元的 Figma 的市值已经直逼 100 亿美元大关。值得一提的是，据 Forbes 报道在 2020 年美国大选过程中，约瑟夫·拜登竞选团队的设计素材也曾使用 Figma ，并且在 Figma 上管理了所有的视觉资产。聊到这里，我们也给大家拓展一下当年奥巴马竞选时的视觉设计：连任当选有何秘密？聊聊奥巴马背后的视觉设计！为总统做设计，大概是所有的设计课题中最为复杂的了，奥巴马在2008年顺利当选美国总统，如果要列一个答谢名单，排在最前面的，并且要给予最重要的感谢的肯定会有在他背后的视觉设计团队。阅读文章 > 而 E 轮融资的 2 亿美元当中，有不少国际投资者，而此刻 Figma 超过 80% 的用户都在美国以外，这一切都使得 Figma 在如今复杂的国际形势下，需要「站队」。其实我们换个角度来重新审视 Figma 站队的逻辑也不复杂，中国用户时至今日依然需要借助第三方的插件来实现 UI 界面汉化（比如 Figma.cool），可见 Figma 用户群体当中，中国用户的比例之低，在如今的国际形势下，被 Figma 「做出取舍」，也遵循着屁股决定脑袋的基本逻辑。Figma.cool/cn不过到了这一步，并不是最终的结果。5、后 Figma 时代的中国 UI 设计软件Thiel Fellowship 的一位高管是这样评价 Dylan Field 的：「他毫无疑问在技术上是有天赋的，同时身上有一种奇妙的融合感——他有将工程和艺术融为一体的直觉。」作为 Figma 领导者，Dylan Field 目前已有的访谈内容当中，很少会体现出他的个人政治立场——当然这不代表着他没有。只是在这次大疆帐号被 Figma 封禁这件事情上，资本和美国当局的政治立场的影响，不应当被我们忽略。但是与此同时，即使疫情发展到今天这样，全球化影响下，各行各业很难彻底断开，起码短时间内做不到，即使最极端的情况发生，彻底的决裂也很难一蹴而就。那么说回 Figma 这样的 SaaS 服务/软件 本身吧。在知乎上，我注意到了这一条回答：这从侧面印证了一件事情，类似 Figma 这样的 SaaS 软件服务，尤其是将大量的服务和功能放在服务器端的专业软件，在开发成本和难度上，是并不低的。与此同时，从 Figma 到 Notion，各类基于浏览器的 SaaS 服务又在疫情之下，前所未有地得到资本的青睐。那么可以确认的是，Figma 这样「有难度」又「有价值」的方向，是未来趋势，也是需求所指的方向，而这件事情本身，与政治无关。那么对于这个方向，国内的设计工具的状况又到底如何呢？国内老牌设计协作平台蓝湖自不必说。2021 年于10月23日，蓝湖对外宣布获得10亿元的C+轮融资，投资人为GGV纪源资本、红衫中国，充裕的资金是专业软件开发的底气。他们对标 Figma 的产品 MasterGo 在这次事件中挺身而出，为准备从 Figma 迁移出设计素材的设计师和团队，提供了直接的入口。而位于中国境内的服务器显而易见会比 Figma 更加稳定，部分在 Figma 中收费功能，在 MasterGo 中是直接免费的。我们之前提到过的「即时设计」其实也是 2016 年就开始了他们的征程，他们是定位则是「为互联网公司的产品经理、UI设计师、研发工程师提供实时协作的云端设计工具」。「即时设计」在2018年1月、2019年1月获得了数百万天使轮融资和千万级Pre-A轮融资，而在2021年密集获得了四次融资，总计数亿人民币，投资人包括高领创投、SIG海纳亚洲、源码资本、蓝驰创投、靖亚资本，以及美国对冲基金Coatue Management等。在这次事件当中同样为国内设计师提供助理的 Pixso 则来自万兴科技，Pixso 敢于对标 Figma 的底气在于，万兴科技在 2020 年控股了国内著名原型设计工具墨刀。2021年，集线框设计、PRD文档撰写、原型交互设计、视觉设计、UI设计、设计交付、设计规范管理、任务管理、团队管理等功能于一体的 「摹客DT」获得 沣扬资本和凯泰资本分数千万元的投资，而他们的方向也是「打造更懂中国设计师的设计工具」，同时希望能够做「世界的摹客」。与其说 Figma 这次的事件是一次「危机」，倒不如说是对国内 UI/UX 设计类软件的一针「疫苗」——伤筋动骨自然是不止于，但是在很大程度上激发了国内同类型 SaaS 软件获得融资，进一步推动研发，让国内乃至于国际用户拥有更多的选择，甚至推动其他创意工具的研发团队，在「可能存在类似风险」的领域进行软件、工具和服务的研发。6、最重要的事情总而言之，这次事件对于绝大多数的设计师而言，并没有根本上的影响。软件工具必然会越来越强，硬件性能也同样处于快速的发展中。设计师和设计行业的从业者更需要考虑的，可能是软硬件高速增长下，自身技能和能力的成长。7、最后的话曾经 Google Wave 埋下的种子生长出了 Google docs 和 Google Drive，它们在多年后成为了Chrome OS坚强的后盾，从教育市场借道，让 Chromebook 逐渐占领了美国的入门级笔电市场。而借由Google docs 的灵感诞生的figma，则翻身逆袭了 Sketch，在UI/UX领域扶摇直上，在SaaS 市场上一骑绝尘。这是前瞻者的成功也是天才的胜利，但更是资本和市场对于这一方向试错后的成果。Figma 这次操作背后可能同样有资本和某些个人的影响，但是它更重要的是印证了发展方向的准确性，甚至可以说，它是促使国内创新工具的本土化的的一针催化剂。在更长的时间尺度上，这次的事件最多是一城一地的小得失，后面的日子还长呢。起风了，各位。图片来源 ivankristianto参考来源：https://en.wikipedia.org/wiki/Dylan_Fieldhttps://en.wikipedia.org/wiki/Sketch_(software)https://www.stateofdigital.com/google-wave-is-back-called-google-drive-and-gives-google-more-grip/https://web.archive.org/web/20160628174909/http://www.businessinsider.com.au/sketch-leaves-apple-mac-app-store-2015-12https://web.archive.org/web/20201020042828/https://www.wired.com/story/figma-updates/https://www.forbes.com/sites/alexkonrad/2021/08/10/how-figma-became-designs-hottest-startup-valued-at-10billion/https://www.36kr.com/p/1490187765032840本篇来源：优设网原文地址：https://www.uisdc.com/dont-panic-and-use-figma
干系 组件 项目 在日常工作中，大家是否都会遇到一些事情或者一些项目的推进，需要其他人甚至是其他部门人一起协作帮助。有些比较“亲切”的同事，会很认真听，边听边赞同你的想法真棒，让你感觉似乎你已经接近了成功，但是后续你向他要产出，他跟你说没时间，没做。此时你充满了无奈又全都是无可奈何。或者有些不太好沟通的同事，直接对你的消息已读不回，你又无可奈何。举个真实的案例：小 B 是酷公司某产品的推广负责人，对该产品的流量和转化负责。小 A 是一位设计师，发现了该产品的使用体验很不好，但是又是一个很重要的产品。他预判，从该产品入手做一些优化改版是一件杠杆很大的事情。小 A 自己搜集了一些资料，做了一个初步了解，然后给出了一个初步解决方案，就约了小 B 沟通。过程中，小 B 很支持，并且对小 A 表示感谢，双方也对未来一些产出内容和产出时间节点达成意见一致。N 天后，小 A 在企信上问小 B 做的咋样了，明天就到时间了，约个地方碰一下吧。小 B 说最近比较忙，都没开始做。小 A 很无奈，但是又无可奈何，该项目最后不了了之。小 A 是一个好设计师，工作之余主动发现问题，并且主动尝试去落地解决问题，但是为什么最后没成功？小 B 做错了吗？他可能真的一直在忙自己原本规划的事情，真的没有时间跟你一起去做这次改版。那么，到底问题在哪儿呢？本次课题以跨部门沟通为主，侧重“如何说服别人跟我一起干”这一方向，通过体系化的学习和分析，识别职场中频繁发生这一现状的本质原因，以及有什么手段，能够在今后的工作过程中尽量避免这一现象的发生。本质沟通的本质是“双赢”。当你开始一场跨部门沟通协作的时候，先想想自己能够给同事带来什么，就算是别人的本职工作，你也应该多考虑自己能够做点儿什么来触动对方。有时候，我们没有办法去要求同事完全按照我们的想法去做事，我们却可以通过沟通，让同事心甘情愿帮我们去做事，而“双赢”就是最厉害的武器。跨部门沟通协作障碍要实现双赢，跨部门沟通协作涉及的因素有很多很多，比如权力、利益、责任、目标等。而且，在职场上，凡是牵扯承担责任、或者互相之间有利益冲突的时候，每个人都会本能的想：这事对我有好处吗？我值得投入做吗？会不会要我背锅了？影响跨部门沟通的 5 大因素：目标不一致，无法说服对方与你一起干；利益不一致，对方没有动力与你一起干；责任不明确，可能出现甩锅现象；流程即合作过程的方式，没有共同确立一个好的合作方式，有可能花了时间效果不佳；找错干系人，可能会让你推动项目时无法得到最有力的资源；这五大障碍中的任何一项没有处理好，都可能导致沟通失败。只有在沟通前做了充足准备，对这些影响因素都有了规划和解法时，才可以找别人进行沟通。方法基于上面总结的 5 大影响跨部门沟通的因素，我重新梳理了各因素之间的关联关系，总结了自己的方法，希望能体系化的将“跨部门沟通-如何说服别人跟我一起干”形成一个可复用的方法模型。1. 提前思考好我们推进该项目想要最后达成的目标是什么；2. 提前识别干系人是谁。干系人通常是指项目组内部成员，也包含公司内部的领导或者其他项目内部成员；如图所示，权利/利益矩阵是根据干系人权力的大小，以及利益对其分类。这个矩阵指明了项目需要建立的与各干系人之间的关系种类。首先关注处于 B 区的干系人，他们对项目有很高的权力，也很关注项目的结果，我们应该“重点管理、及时报告”，让 B 区干系人满意。其余的 ACD 则是按图示的方法去管理。3. 要让合作方认可我们的目标，并且愿意跟我一起干，我们得分析合作的共同利益在哪儿，用利益捆绑责任，用角色划分流程；了解对方 OKR，找准对方想要什么，建立共同利益诉求点，把我认为重要的，也让对方认为重要，这一步至关重要。在双方都认可，有真实合作意愿后，共同分析合作过程中是否有阻碍因素，资源有哪些，各方负责的职能范围是什么，用利益去捆绑各自的责任，并且在节奏规划，关键节点的内容产出都达成共识，建立合作流程的意见一致。4. 过程中注重额外的情感沟通及心怀感恩之心；除了正常的工作合作交流，也可以尽可能创造其他非正式交流的机会，建立更信任的合作关系，比如一起约个饭，一起喝个下午茶。并且怀有一颗感恩的心。无论对方是否是份内的工作，无论对方动机是什么，他给了我帮助，我们就要认下这份人情，并且在适当的时机下进行回馈。我的实践项目：MUYA 复杂组件的落地推进；目标：创建 MUYA 复杂组件库，通过复杂组件的利用，提高设计和研发效率，统一产品规范；干系人：小 A：MUYA 组件库项目负责人；小 B：业务线前端负责人；沟通过程：1.分别了解小 A 和小 B 的 OKR。小 A 是 MUYA 组件负责人，除了基础组件外，他还负责组件落地到业务中，即我发起复杂组件项目能与他的 OKR 绑定。小 B 的 OKR 有对研发效率提升的目标，即业务组件项目与他的目标不谋而合。2.既然已经识别了他们俩是我推进项目的主要干系人，并且该项目与协助他们完成 OKR 起到了正向帮助。我分别与他们先进行了线下沟通，用当前存在的问题以及我提供的解法向他们表明我的计划和目的。用该项目能带来的价值和收益说服他们，分析能带给他们各自的价值点，用“双赢”将我们捆绑在一起，分别确立我们就是研发和设计的负责人。3.召开复杂组件项目 kickoff 会议，叫上所有干系人。确认了一期要做的所有内容，各自的职责，对应的节奏和时间节点。结果和进展：复杂通用组件和业务组件都分别进入了两个前端组各自的 SP，稳步迭代中，计划 2 月完成一期所有复杂组件内容的开发。复盘1. 项目干系人管理中，没有很好的识别各类干系人。比如我只找到了 C 类干系人，却忽视了 B 类这一最重要的干系人。所以在项目初期，小 B 遇到困难存在情绪时，我有点推进受阻，一时不知该怎么办。2. 我的 mgr 也是我推进项目的一个重要资源。她帮我识别了最重要的 B 类干系人应该是两个前端组的大 boss，mgr 帮助我与该 boss 进行了沟通，让我的项目能够得以继续顺利进行。3. 在情感沟通层面我也做的一般，没有找到其他非正式途径去深入沟通，这块可以做的更好。结语跨部门沟通是一门很深很难的学问，需要我们有更多的实践和经验总结。用我归纳的「跨部门沟通法」也许可以帮助初期的小伙伴进行简单的跨组沟通协作，了解一些基本的方式方法和注意事项。如何在设计中构建共情？收下这份6000+的干货总结！编辑导语：同理心对于任何人来说都是难得可贵的，它在人际交往中有非常突出的优势。阅读文章 > 欢迎关注公众号「酷家乐用户体验设计」本篇来源：优设网原文地址：https://www.uisdc.com/cross-department-communication
插画 风格 人物 大家好我是花生。插画元素现在在设计中应用范围越来越广，它能以直观的视觉呈现阐释产品功能，提高产品信息的易读性，且更具亲和力。在各种插画风格中，矢量扁平风的适用性最强。它线条简洁理性，元素风格容易统一，非常适合辅助传达产品信息，在 UI 设计中运用极广，且现在发展呈现出标准化的趋势，这也表明矢量扁平风格的插画会成为一种长期流行的风格。Alibaba Cloud Design 在其设计规范中就为绘制插画制定了详细的设计规范对设计师而言，矢量扁平风插画相对来说是比较容易上手的。它不需要你有扎实的绘画功底，只要了解风格特征和绘画基本技巧，就能在 Ai 中绘制出一副质量不错的扁平风插画。之前我们也向大家推荐了不少免费的插画资源，但授人以鱼不如授人以渔，今天向大家介绍一位在 YouTube 免费上教授矢量扁平风插画绘制的大神——Cosmin Serban。他是一位资深的illustrator插画师，在YouTube上分享了多个扁平风人物的绘制过程和技巧，非常适合想要入门学习扁平风插画的朋友。Cosmin Serban 的视频主页今天推荐 Cosmin Serban 的免费课程《Flat Character Design: Illustrator Tutorial》。在此课程中，Cosmin Serban 想告诉观众扁平人物真的很容易绘制，从寻找灵感、找参考、分析绘制规律、动手操作、完善细节一共只需要 5 步，所有步骤视频中都详细的展示了。课程传送门 https://www.youtube.com/watch?v=dyWpgmyelio&t=14s ，我将在下文中对关键步骤进行翻译解释，帮助大家更好的理解课程内容。5 步画出好看的扁平风人物插画第一步：寻找优质灵感如果入门就要从练基础手绘能力开始，估计没有多少人能坚持下去。所以 Cosmin Serban 推荐设计师从侧面切入——找到自己喜欢的风格作为灵感参考，分析插画的特点和规律，在模仿借鉴的过程中去学习插画的绘制技巧，这样学习速度更快效率更高。毕竟快速画出一副插画的成就感还是很强的，有了这样积极的反馈大家学习的动力也会更足。Cosmin Serban 在教程中的借鉴的灵感来自于 Olga Semklo 创作的人物插画。Olga Semklo 是一位非常擅长扁平风插画的插画师，作品构成简单却充满美感，适合新手借鉴学习。Olga Semklo 的 ins 主页： https://www.instagram.com/semklo.design/第二步：寻找照片参考为自己要创作的插画确定一个主题及大概的人物形象，然后在 Pexels 等免费可商用的照片网站上找到合适的人像参考，如果有植物等其他装饰元素的话也可以一并先将参考元素找好。Cosmin Serban 为自己确定的参考对象是微笑着的男性形象。第三步：分析灵感的插画风格找到优秀的插画灵感后，不要马上就开始照着画，因为这样做你得到的结果只是“画完了”而不是“会画了”。在开始画之前，要先仔细分析一下灵感源的风格并总结规律，这样在之后画的过程中思路就会更加清晰，也能学会如何将对方的绘画技巧延展运用到自己的创作中。第四步：实践操作参考资料都找好了，对绘画风格也有了一定的把握，接下来就可以开始正式创作了。用 Ai 绘制插画的一大好处就是我们可以借助各种形状快速拼接出想要的轮廓，这对没有手绘基础的设计师来说非常方便。在绘制的过程中要注意遵循我们总结出来的风格规律，比如眉毛是长条状，鼻子和嘴巴用短线表示，阴影设置等。按照风格将人物的形象逐步组建出来即可。第五步：细节完善当主体人物画好之后，我们可以为开始为其上色，配色你可以借鉴优秀的插画或者色卡。然后就是加上背景和一些装饰元素，也可以为人物的衣服加上一些装饰图案。这样一套流程下来你就有了一副自己创作的扁平风人物插画了。总结Cosmin Serban 在《Flat Character Design: Illustrator Tutorial》中为我们介绍了一种快速学会在 Ai 中创作扁平风人物插画的技巧，只要你熟悉了这种方法并勤加练习，就能实现按主题自己独立创作出扁平风人物插画。再次总结一下这个过程：1. 确定灵感参照。找到自己喜欢或者比较常用到的优秀扁平风插画作为风格参考，刚开始最好选择画面元素简单一些的，熟练了之后可以再升级难度；2. 找实物参考。从免费可商用的图片资源中找到符合自己主题的人物或者元素参照，也可以从自己的生活中取材；3. 仔细分析灵感插画的风格并总结规律，为之后的绘制提供风格参考标准；4. 遵循既定风格，在 Ai 中逐步绘制，有能力话也可以画好草稿然后导入 Ai 中勾线；5. 上色，完善细节。以上就是今天的推荐，Cosmin Serban 还有很多其他的优质免费课程，感兴趣的小伙伴可以去他的 YouTube 主页学习。「Cosmin Serban YouTube 主页」：https://www.youtube.com/channel/UCR-vujr17AbIWWp3lL8sdpg更多扁平风插画资源：这5个顶尖插画师的线稿作品，是我每日学习的源泉！关注优秀插画师，学习借鉴其绘画技巧是插画进阶必不可少的过程。阅读文章 > 非科班出身的我，发现这些插画基础知识才最有价值Hi，我是彩云。阅读文章 > 本篇来源：优设网原文地址：https://www.uisdc.com/vector-character-illustration-tutorial
菜谱 厨艺 美食 大家好我是花生。今天我们聊的网站，也是和设计师密切相关的事情——做饭美食网站。没错，世间万物，唯有美食与爱不可辜负。身为设计师，虽然大家平时 PS、AI、AE、C4D、Sketch 等设计软件玩得飞起，但是放下鼠标键盘，拿起刀铲锅碗的时候是不是就觉得有点力不从心了？这也不能怪我们厨艺不精，毕竟平时早出晚归，到公司上班就是点外卖，很难抽出时间来做饭。但是天天吃外卖也容易腻 ，总还是想自己做饭来调剂一下生活。如果问大家的厨艺都是从哪里学的，90%的人估计都是从网上学的吧。抖音、B 站这些视频网站上的优秀美食博主不计其数，他们分享的做菜教程专业详细，非常适合新手跟着学。我就一直在 B 站上关注一位专业厨师出身的美食博主「美食作家王刚」，我的厨艺可以说是王刚老师这位“云师父”一手带出来的，虽然目前厨艺还停留在番茄炒蛋、青椒肉丝、可乐鸡翅、水煮肉片这种初期阶段，但是有这么好的学习资源，假以时日成为厨艺大神也不是不可能。可能大家对王刚老师都非常熟悉了，看过他的视频或者已经跟着他的视频学过做菜。这个一手在 B 站带出「宽油警告」「没有 XX 的同学可以用 XX 代替」梗的男人，在全网的粉丝已经突破了 2000 万。王刚老师的美食教程非常干货，虽然每个视频不到 5 分钟，但步骤讲解都非常详细，切菜、炒菜、装盘一气呵成；处理食材、放油下料、颠勺关火动作干净利落 ，让人看着都是一种视觉享受。每个教程结尾还会贴心的放上技术总结，帮助大家更好地掌握做菜技巧。王刚 B 站做菜视频的弹幕王刚老师分享的做菜教程已经很多了。为了方便大家查找菜谱，2019 年的时候王刚老师在微博上发布了一篇索引文章，按主食材将菜品分类，每道菜品的名字就是一个链接，点击后会直接跳转到相应的教学视频，虽然一定程度上缓解了微博用户的需求，但是并不十分方便。2019 年 4 月发布的菜谱索引文章最近，王刚老师推出了自己的官方美食网站「宽菜谱」，将自己发布过的所有菜品教程都整理到了一起，实用程度堪称一本「设计师厨艺自救指南」。「宽菜谱」网站首页我去看了一下，网站风格和王刚老师的视频风格一样，朴素但干活满满。网站提供了近 300 道菜品的制作教程，每个教程都带有教学视频、食材配料清单、图文步骤和技术总结，非常细致，看完之后不怕学不会。网站按食材、菜系、烹饪手法、难度等不同标准进行对菜品分类，查找起来非常方便。如果你是新手小白，可以直接按难度查找，选择 1~2 星的就可以了。这种类型以家常快手菜为主，食材易得，料理过程简单，出菜的时间也短。「宽菜谱」上 1~2 星的部分菜品如果是会做菜的朋友，想在逢年过节、亲友聚会的时候上一些硬菜，或者进一步提升自己的厨艺，那就可以直接选择 4 星以上菜品。「宽菜谱」上 4 星以上的部分菜品要是不知道想做什么菜，可以直接看官网首页的「时令菜谱」和「推荐菜谱」，大厨的推荐应该是不会有错的。如果冰箱里只剩块猪肉的话，那不防看看「食材大全」里面猪肉对应的菜谱有哪些，照着做就可以了。除了菜谱，「宽菜谱」里面还有各种烹饪相关技巧，如教你如何开锅、如何磨刀、如何挑选新鲜食材、如何处理肉腥味等，对我们提升厨艺也非常有帮助。以上就是今天的推荐，收下王刚师傅的这份「厨艺自救指南」， 祝大家厨艺大涨，吃饭香香，身体棒棒！「宽菜谱」网站： http://kuancaipu.com/可免费商用！发现一个提供超多高质量美食大图的新图库！现代人在动筷刀叉前必定先拿出手机，帮眼前的美食拍张照，上传到社交应用，俗称的「相机先食」现象，非常有趣。阅读文章 > 如何设计手工感美食海报？来看这个实战案例！写在前面首先我们做的海报分为商业海报以及艺术海报，当然，对于我们而言，我们都是为企业或者客户做事，基本都是属于商业海报，所以我们就要明白商业海报的一些特性商业海报是指宣传某种商品或某种商业服务的海报。阅读文章 > 本篇来源：优设网原文地址：https://www.uisdc.com/kuancaipu
定律 信息量 信息论 简单讲讲为什么我相信大部分从别的领域（工业设计、UI 或者其他领域）跨界进入交互设计的人，都至少拜读过一次“交互设计的 7 大定理”、“7 个交互设计的法则”、“值得反复学习的 5 大定律”这类型文章。每篇这类型文章包含的定理都不太一样（比如美即好用法则或者格式塔理论等等），但是下面这三个常驻成员，是每篇文章都一定会提到的：费茨定律（按钮大小和鼠标距离影响用户反应时间）席克定律（选项越多，用户反应时间越长）米勒定律（神奇的数字 72 法则）用超多案例，帮你学会经典格式塔理论的7个视觉原则格式塔理论为界面设计准则提供的相关的基础理论和原理支撑，一起来了解下吧！阅读文章 > 用超多案例，帮你认识无处不在的「米勒定律」今天给大家带来一个无处不在的定律，虽然它很常见，但它很安静。阅读文章 > 这些定理朗朗上口，似乎很可靠、很有道理、运用在工作中的例子也很丰富。但是我必须要开门见山的说：对于没有受过心理学或者社会科学训练的、不了解交互设计的基本工作方式和研究方法的同学来说，不要让“交互设计定理”作为你入门交互设计的第一印象。这倒不是因为这些定理都是“错的”，相反，费茨定律从 50 年代提出以后，很长一段时间都是信息学和心理学交叉理论中的顶流，受到了后续很多实证研究的验证；而米勒定律截止 2014 年已经被引用超过 2 万次，不可为影响不深远。之所以说不建议交互新人上来就学习“定理”，是因为以下三个原因：1. 过于简化国内目前讲“定律”的文章，几乎没有能把这几个定律究竟在说什么讲得通透的。一般原理部分一笔带过，马上进入案例部分，去解读这几个原理在界面中的具体运用。用一篇超全面的文章，帮你读懂经典的费茨定律费茨定律由心理学家 Paul Fitts 提出，用来预测从任意一点到目标中心位置所需时间与该点到目标的距离和大小有关，距离越大时间越长，目标越大时间越短。阅读文章 > 比如这篇讲费茨定律的文章介绍费茨的公式是 T=a+blog2(D/W+1) ，其中：T 是「移动到目标区域所需的时间」；D 是「距目标区域的距离」；W 是「目标区域的大小」；a、b 都是常量，代表指点设备的物理特性，受操作人员和环境等因素而变化。这个公式里有一个数学运算符“log”，这个 log 是怎么来的呢？为什么是以 2 为底数的呢？（D/W+1）代表什么呢？为什么要这么计算呢？好的建模或者好的公式对于阅读者来说是有意义、可以理解的，数字不会莫名其妙的发生复杂的作用，一代顶流费茨定律当然也不例外。假如作为设计师和研究者，我们并不理解这个定理作用的原因，就开始运用它或者用它来解释一些情况，相当于只是因为这个公式出名、有个英文名字就先入为主的认可了它，再去寻找那些设计上符合这个定理的蛛丝马迹，这是犯了“以果证因”的错误。也许有人会讲我们做设计好像没必要接触这么精深的数学，但实际上 50 年代这两个研究发展之初，模型也好、数学运算也好，都是比较浅显易懂的，读到最后，上面所有提出的问题都能得到解答。2. 历史局限费茨、席克定律进入交互设计师必读清单的历史源远流长，早在人机交互界面诞生之前，计算机科学方兴未艾，学界便提倡作为计算机科学的研究员——软件开发者，也要通晓心理学的一些常识，从而能自主地提升自己设计的软件的可用性。从那时起，以费茨、席克定律为代表的心理学研究成果就进入了交互设计或者人机交互领域的视野。这一方面说明人机交互从心理学借鉴研究成果的传统从很久以前就开始了，另一方面也说明：费茨、席克定律东西都是 50 年代就提出来的古董学说。就像设计有迭代和流行风潮一样，心理学研究也有风潮和迭代。老的理论被新的研究证据证明或证伪、被新的研究视角挑战，这都是在学界不断发生的事情。比如上面提到的米勒定律，其实它从一开始提出来就不是很严肃、也没有很有力的推导过程，当前心理学相关领域的研究也倾向于认为人的短期记忆受多种因素影响，最终可能并不能以某个“数字”来作为阈值进行解释。这就是学界的不断迭代的一个体现。因此，作为应用者，我们需要在接触一个理论的结论时，具备评估这个理论的能力，充分了解它的历史局限性，从而自行选择接纳或者抛弃它。但这个能力对于交互新人来说，未免要求太高。2. 太“安全”这是我个人认为最主要的一个原因。对于那些不了解交互设计的人来说，“定理”这个词显得太权威、太让人有安全感了。实际上社会科学的研究方式和自然科学是有差异的，影响人的感受（比如用户体验）的因素非常复杂，大多数时候你很难找到像自然科学里那样明显的、可观察到的、直接的因果关系，心理学或者社会科学的结论都是现实生活中情况的高度抽象。所以设计师很少会单纯因为有一个什么定理，而就能去支撑一个设计。换句话说，自上而下地参考定理虽然能给交互设计提供有力的理论支持，但并不是交互设计师工作的常规方法。基于具体场景进行设计，然后抽象提炼出一定的规则（设计方法），也就是自下而上的工作方式，才是交互设计的初学者首先应该掌握的技能。说完了为什么不建议学交互先学定理，本篇文章我们将以费茨、席克定律为例，来讲解作为设计师与研究者，我们应该怎样去看待这些心理学的研究成果。费兹和席克定律1. 信息论的源起要了解费茨、席克定律究竟在讲什么，我们需要回溯到 50 年代的学界。彼时克劳德·香农刚刚提出信息论，创造性地将热力学中“熵”概念与信息通信领域结合，提出了“信息熵”的概念。在信息理论中，香农提出：“事物之间传递信息的过程，就是逐渐降低事物的不确定性的过程”。比如说假如马戏团里有一个魔术师手里攥了一个号码牌，这个号码可能是 1、2、3、4 中随机一个数字，并让一个观众猜一下是哪个数字。此时由于魔术师和观众之间还没有进行任何交流，也就没有信息的互换，因此魔术师到底攥着什么号码这件事情总共有 4 种可能性或者不确定性。但假如观众开口问魔术师：“请问你手里这个数字大于 2 吗？”魔术师回答“对。”那么此时他们之间就进行了一次信息的传递，并且魔术师手里号码牌数字的可能性被缩减到了 3、4 之间，事件的不确定性降低了。这位观众再次问魔术师：“请问数字大于 3 吗？”这次无论魔术师回答什么，观众都能确切地知道他手里的号码牌数字了：通过 2 次信息传递，事件不再具有任何不确定性。请注意上面的观众问的 2 个问题，都可以用“是”或者“否”来回答，这样的问题叫做“是否”型问题。那么一个数字最少可以被多少个“是否”型问题猜出来呢？比如，当魔术师手持 1、2 两个号码牌时，观众只需要 1 个“是否”型问题就能猜出来；当他拿着 1-8 八个号码牌时，则观众需要 3 个“是否”问题才能猜出来，以此类推，最终可以算出：因此，香农将 a 命名成了一个新的数据传输的单位“bit”，可以翻译成“位”，由它来衡量当所有事件发生概率相等时，一次交流传递的信息量。它同时也是我们所熟悉的二进制最小单位。比如回到我们之前的案例，观众猜魔法师手里 1-4 号码牌之前，有 2 位的信息不确定性；而当观众知道了确切的 1 个号码之后，信息不确定性=log2（1）=0 位，因此可以说这次信息交流总共传递了 2 位的信息，也可以说观众排除了 4 件事情、2 位的信息不确定性。值得注意的是，当观众提出第一个问题的时候，将不确定性从 4 削减成了 2，第二次询问则从 2 削减成了 1，以此类推，所以实际上这个公式可以写成：上面讨论的这个例子中，魔术师手里 1-4 号的号码牌出现的概率是相同的，但假如他们出现的概率不同呢？我们先从一个抛骰子的例子开始。假设这个魔术师先拿出了一个公平骰子，此时 6 个面的出现概率都是 1/6。假如魔术师抛出了一个 1，当观众知道骰子的一瞬间，观众同时排除了 6 件事情的信息不确定性：骰子抛出了 1、并且骰子没有抛出 6、2、3、4、5。此时假如魔术师换了一个灌铅骰子，它扔出 6 的概率很小，只有 1/12，扔出 1 的概率很大，有 1/4。这时我们扔出 1 时，排除的信息不确定性就没有公平骰子扔出 1 时那么多了：因为扔出 1 是一个相对大概率发生的事件，我们对它其实已经有了预估。按比例，它排除了这些不确定性：将这种现象进行归纳，香农提出了计算概率不一致事件的信息传递公式：最后我们可以发现，当事件发生的概率不一致时，事件传递的信息量将会小于事件发生概率一致的信息量。因此，事件发生概率一致时的信息量叫做最大信息量，是信息量可以传递的最大值；而事件发生概率存在差异时的信息量叫做平均信息量，平均信息量总是小于最大信息量。另外，信息传播中总是会不可避免地存在干扰，就像打电话时信号不好会有嘶嘶声一样。因此，在信息论中还会区分信息发出时的预期信息量，和信息被实际接收到时的信息量。2. 席克定律坚持到这里的人可能也能感觉出来，信息论就是那种虽然说不上来哪里有道理，但就是莫名让人感觉很有道理的东西——当时的其他学科也这么觉得。50年代成为了各种学科和信息论进行各种跨界研究的高峰期，甚至出现了很多沾点边就开始生搬硬套的理论。心理学家开始思考：既然物体的信息传输（电脑电话、光纤电缆）可以应用信息论，那么人脑作为一种比较高级的信息处理系统，是不是也可以用信息论去分析呢？没错，从其他学科借鉴思路的确是研究的常用手法。我们接下来一起看一下，当自然科学和心理学交叉时，这帮科学家是如何去论证思路合理性的。William Edmund Hick 和 Ray Hyman 是最早尝试将信息论与心理学进行结合的心理学家，他们在 1952 年提出了 Hick-Hyman Law，也就是我们熟悉的席克定律。席克首先援引了 19 世纪心理学的发现：当施加给被试者的刺激属于一个较大的集合时，被试者需要更长的时间去作出反应。这个事情可能不太好理解，举个不恰当的例子，都是猜拳，人们在玩“石头剪刀布”就比玩“十五二十”的反应时间短，因为前者只有“石头、剪子、布”3 种可能性，而“十五二十”共有“五、十、十五、二十”4 种可能性。当然后者还并不只是单纯的外界刺激，这就更复杂了。这种发现给了席克与海曼将「反应时间」与「信息量」联系起来的灵感。在此后的数十年，席克与后来的心理学家设计了许多场包含不同控制变量的实验，每次实验的有效样本量大概在千人左右。比如：1953 年海曼的实验中，设置了 8 盏名字不一样的灯，他们分别叫“邦, 波, 毕, 博尔, 拜, 毕克斯, 贝弗,贝特”，被试者需要在灯亮起后，准确的喊出灯的名字。实验者则记录下被试者反应的时间。实验中，使用了不同的灯数、灯亮起的概率也有差异。根据上文我们对信息论的已知了解，事件的数量以及事件发生的概率，都会对信息量造成影响。因此这个实验实际是创造了不同的信息量，来考察信息量和反应时间到底有没有关系。最后的结论是：信息量和反应时间呈正相关，甚至具有线性关系。换句话说，反应时间是信息量的一个函数。所谓“线性关系”，也就是说信息量和反应时间之间的关系会是一条直线，既然是直线，就会有斜率和截距，也就是说：3. 费兹定律既然心理学家已经建立了反应时间和信息量的线性关系了，那么顺着这个思路，我们有没有什么办法建立物理移动距离和反应时间的关系呢？之前我们已经说过，信息传播是降低不确定性的过程，因此费兹认为，物理世界内的距离移动也可以被描述成降低不确定性的过程。用这样的思路可以做如下类比：其实说到这里我相信有些朋友就已经看出些许问题了。用目标宽度来类比事件发生后剩余的不确定性是比较好理解的，以踢足球和打高尔夫球为例，踢足球只要球进球门就算赢了，球门的目标很大，因此进球时球所在的位置还是有很多的不确定性：可能是贴着门框的一记险球，也可能是正中球门。但高尔夫球的球洞很小，几乎和球差不多大，所以进球时球所在的位置不确定性很小。但为什么要用移动距离 x2 来类比事件发生前存在的不确定性呢？其实费兹自己也承认这个数的选择说不出很多道理，因此后续产生了许许多多的后续研究，都围绕着如何来优化这个数字的计算方式。包括文章一开头介绍的（D/W+1），也是其中一种计算的优化思路。但无论如何，讲到这里费兹定律的初始版本已经呼之欲出了：现在你知道文章一开头说的几个数字都代表什么意思了吧？应用与争议席克定律和费兹定律（特别是费兹定律）在人机交互领域的运用非常广泛，并且曾经直接催生许多我们现在还经常看见的设计，以下稍微举两个和费兹定律在时间上有因果关系的设计：1. 环形菜单读懂了费兹定律以后就很容易理解这个菜单了，环形菜单的所有目标距离移动的起始点都是一样近的，所以使用这个菜单花费的反应时间短。2. 移动放大也就是将鼠标移动到对应操作时，操作会对应的有一个放大效果。用费兹定理解释，也就是增大了目标宽度，降低了移动距离，从而降低了用户的反应时间。3. 争议就像我上面讲到的，使用一个理论的基础是，我们要对这个理论有作出评估取舍的能力。虽然费兹/席克定律这一套逻辑严密，但并不是无懈可击。在这里我无意展开一些关于具体细节的讨论（比如说费兹定理是从信息论挪过来的，所以是一开始只讨论单维度的“移动”，不能完全适用于二维空间甚至三维空间；或者席克定律中定义的“线性关系”其实存在漏洞，目前的研究倾向于不认为反应时间和信息量只是简单线性关系；又或者 50 年代的实验在控制变量上其实也有不谨慎的地方等等），我们只讨论一开始将信息论应用在心理学的这个立论基础，其实一直受到了多方面的批评：人和电缆那能一样吗？虽然信息论适用于评估硬件的物理特性，但人毕竟是一种更加复杂的信息处理系统，把人当电缆一样去分析，实际上没有说明人认知事物的过程到底是怎么运作的，只是观察了它的输出结果。而且其中其实也忽略了许多情景因素，没有多少“人味儿”。最后说一句我一开始写文章时，并没有预料到会抖落出那么多推导过程和细节，这也从侧面说明，把一个事情讲通透、讲清楚是很费事情的，有些时候我们直觉上觉得有道理的事情，究其根本其实很值得商榷。再重复一遍，运用科学研究的成果时，需要注意科研是高度抽象化、脱离日常生活的理论世界，和我们日常做设计时复杂多变、多种因素协同作用的现实场景具有很大的差异。不要盲从，要有自己的判断。交互设计入门指南（二）：九大经典定律坊间多为流传七大定律，但实际随着体系的不断完善，有很多新的理论产生，个人总结了九大定律。阅读文章 > 万字干货！15个著名的设计心理学原理和应用深度解析！“除非有更好的选择，否则就遵从标准”你是否有在听别人说某某原理法则时一脸懵 B 的时候？阅读文章 > 欢迎关注作者微信公众号：「白话说交互」本篇来源：优设网原文地址：https://www.uisdc.com/interaction-design-laws
菜鸟 互联网 设计师 看了很多文章，依然搞不懂B端设计？阿里设计师带你解密一线操作人员的人机交互终极法则不同于 C 端消费产品单一的用户群，B 端产品系统面对的使用场景和用户群更多、也更复杂。好的B端产品能够帮助人高效地完成工作任务，从而达到实现经济效益的目的。然而作为设计师的我们肯定都清晰地感受过：理论上的交互原则碰上真实的使用场景，会因为各种原因导致无法匹配。今天我们给大家邀请到了菜鸟的体验设计师@魏元春 ，为大家带来一场结合实例的交互分享课。嘉宾介绍：菜鸟网络体验设计专家，曾负责菜鸟仓储WMS体验设计、菜鸟LEMO极简PDA系统设计，现负责菜鸟直送终端配送体验设计。曾在IXDC、全球服务设计共创节分享服务设计相关课题。分享内容预览：产业互联网背景（消费互联网与产业互联网的差异）产业互联网设计挑战&机会为产业一线操作者设计（设计思维和案例分享）以下为小部分内容展示，干货请期待直播现场！如何报名：扫下图微信二维码联系管理员@招财，获免费听课机会：本篇来源：优设网原文地址：https://www.uisdc.com/2022-sdc-108
原则 尼尔森 的是 之前写过一篇《零基础如何成为交互设计师？聊聊我的学习三步法！》，通过该方法，我们可以对交互设计有个整体的了解，比如，知道了交互设计师的工作流程、需要掌握的技能、交互设计师的日常产出等等。零基础如何成为交互设计师？聊聊我的学习三步法！背景介绍我是从测试被动转交互的（转岗原因不是这次的重点，就不在这里描述了），以前工作的公司是家小公司，没有所谓的交互设计岗位，所有我对交互设计一窍不通，以至于画了一段时间的线框图之后，依然没有找准个人定位，走了不少弯路，浪费了不少时间。阅读文章 > 可是，纸上得来终觉浅，绝知此事要躬行，在我们了解那么多的理论知识，知道了交互设计师需要掌握的众多技能后，又该从哪里开始，该如何快速掌握这些理论，并应用于实际工作之中呢？还记得上高中那会，有一种英语练习题叫做“各个击破”，比如我在“完形填空”方面比较薄弱，那么就买一本完形填空的练习题，每天晚上睡觉前练习 2~3 篇；又或者我在“阅读理解”方面比较薄弱，那么就买一本阅读理解的练习题，用同样的方式去练习，这种有针对性的练习就叫做“各个击破”，我当时的英语成绩就是通过这种方法提升上来的，练习效果可谓是立竿见影。既然这种方法效果很好，我们可不可以把它应用在“交互设计技能”的掌握上呢？答案是肯定的。下面，我就以交互设计原则为例，讲述一下，在了解了这些设计原则之后，怎么做才能更快的掌握这项技能，实现各个击破。首先，总结“设计原则全家桶”交互设计原则有很多，为了能够更快、更全面的掌握这项技能，我们需要将设计原则进行汇总，整合为“设计原则全家桶”（总结方法我就不在这里赘述了，感兴趣的同学可以查看上文）。这里我汇总了四个常用的设计原则，古腾堡原则、格式塔原则、尼尔森十大可用性原则、交互设计 5 大原则（这里简单说明一下，本来是交互设计 7 大原则，其中“接近性原则”在格式塔原则中已包含，“防错原则”在尼尔森原则中也已包含，所有我把这两个原则去掉了，一来可以简化原则，二来可以减轻记忆负担）。我们可以通过提取关键词的方式，把这些原则的“主要内容、在设计中的应用”通过“关键词+图片”的形式提炼出来，然后汇总为“设计原则全家桶”。（全家桶相关文章见文末）其次，强化练习“设计原则全家桶”就像是武功秘籍，有了武功秘籍，我们还需要勤加练习才能掌握，可是，该怎么练习呢？如果手上有项目的话，可以通过项目实战进行巩固。如果手上没有项目，我们该怎么进行巩固呢？我的方法是，找几款常用的产品，然后对这些产品进行分析，分析这些产品，都应用了哪些设计原则，它们是如何应用这些原则的，有没有不符合设计原则的地方，不符合设计原则地方背后的设计目的又是什么？下面，我以淘宝 APP 为例，来简单说一下该如何强化我们学习到的这些设计原则。我们先来看下淘宝首页都应用了哪些设计原则？顶部导航栏只有“订阅、推荐”2 个 tab 页面，底部导航栏有“首页、逛逛、消息、购物车、我的淘宝”5 个版块，这两个导航栏应用到了交互设计 5 原则中的“米勒定律”，也就是 72 原则。签到、会员码、搜索栏等，应用的是“格式塔–主题/背景原则”，即当主题和背景重叠时，人们倾向于把大的元素当做背景，把小的元素当做主题。所以“签到、会员码、搜索栏等”被看做为主题，而后面灰色的部分被当做了背景；同样的，我们再看常用功能栏，后面的白色卡片会被当做背景，而中间的功能图标被当做主题。再看下面的产品展示区，应用的是“格式塔–闭合性原则”，因为手机屏幕有限，无法展示全部的内容，所以最下面仅展示了部分图片，以提示用户下方还有更多的内容。继续向上滑动，可以看到这里的图片摆放样式采用了“格式塔-对称性原则”，而且这里对展示样式进行了优化，采用了瀑布流的样式，可以防止视觉疲劳，展示效果更胜一筹。点击首页上方的搜索框，进入搜索页面，搜索框下方展示了历史搜索数据，且按用户的搜索信息倒序排列，最后搜索的内容展示在最前面，很明显这里使用的是“尼尔森-灵活高效原则”。再来看产品详情页，该页面使用了“古腾堡原则”，最重要的两个信息（产品信息、购买按钮），一个展示在左上，一个展示在右下；其他信息分别展示在中间、右上及左下方位置。同时这里也使用了“交互设计 5 大定律中的费茨定律”，把“购买”按钮放在距离用户手指最近的位置，并占据底部导航栏三分之一的面积，这样的设计，既方便了用户的操作，又提升了产品的购买率，一举两得。淘宝关于其他原则的应用示例还有很多，比如淘宝首页的“下拉刷新松手刷新正在刷新”，应用的是“尼尔森–状态可见原则”；用户购买商品后发现不合适，可以申请退货或换货，应用的是“尼尔森–用户可控原则”；淘宝客服功能，可以在线为用户答疑解惑，应用的是“尼尔森-的人性化原则”，等等，这里我就不再一一举例了。强化练习的目的就是为了加深记忆，形成条件反射。以后，不管是做竞品分析，还是自己设计原型，就能快速想到这些设计原则。遵循这些原则，即使我们没有太多的实战经验，也可以设计出符合基本规范的原型图，减少低级错误的可能性。最后，实战练习武功秘籍我们已经练习的差不多了，可是威力如何还需要进一步的检验。如何检验学习的效果呢，那就是通过项目实战。《刻意练习》中作者说“人的学习受到情景的制约或促进，你要学习的东西将应用在什么情境中，那么你就应该在什么样的情境中学习这些东西。比如，你要学习编程，就应该在 GitHub 里学习，因为你以后编程就是通过 GitHub”。同样的，我们想掌握交互设计原则，那么就需要在交互设计中学习，也就是结合实际项目进行实践。这里我通过一个实际案例，来简单介绍一下，在实际项目中该如何应用这些原则。现在有个功能优化的需求，给“党费缴纳”增加一个“待缴费用户查询以及发送短信提醒”的功能，那么我们在设计原型的时候会应用到哪些设计原则呢？先看原型图，下面这两个页面应用到了“状态可见、接近性、相似性、奥卡姆剃刀原则、一致性原则，以及古腾堡原则”。其中，查询记录为空和查询记录不为空，应用到了“尼尔森–状态可见原则”；查询条件（快速查询、精确查询）和下面的查询结果，应用的是“格式塔–接近性原则”；查询结果中，人们倾向于把“选择框、姓名、联系方式”联系在一起，这里应用的就是“格式塔–相似性原则”。快速查中的“近一月、近三月、近半年”快捷操作按钮，应用的是“奥卡姆剃刀原则中的减少用户操作次数，给出合理选项原则”；再看有查询结果的这个页面，这个页面和手机通讯录页面是不是很相似？所以这里应用的是“尼尔森–一致性原则”；还有右下角的「发送短信提醒」按钮，应用的是“古腾堡原则”。我们再看下面两个页面，这两个页面主要应用的是“尼尔森–状态可见原则”，当点击用户前面的按钮时，左下角会实时显示“已选中 xx 项”，然后点击「发送短信提醒」按钮时，会弹出“发送成功”的 toast 提示。上面考虑的都是正常的情况，假如用户未选择任何选项，直接点击了「发送短信提醒」按钮，这个时候该怎么处理呢？这时“尼尔森–容错原则”就派上用场了，增加一个“请选择您要提醒的用户”toast 提示就可以啦。总结《刻意练习》的作者告诉我们，“1 万小时定律”是个伪命题，学习需要讲究方法，同时也是有方法可寻的。通过“总结归纳强化练习项目实战”的方式，我们就可以将交互设计必备的技能在较短的时间内各个击破。设计原则全家桶参考链接：用超多案例，帮你掌握交互设计心理学的古腾堡原则写在前面在平时的设计过程当中，你是否有这样的疑惑？阅读文章 > 近万字干货！带你全面了解格式塔原则好的设计师理解心理学在视觉感知中的强大作用。阅读文章 > 用超多案例，带你学会经典的尼尔森十大交互设计原则Jakob Nielsen（雅各布·尼尔森）的十大交互设计原则。阅读文章 > 万字雄文！超多案例帮你读懂交互设计7大定律在交互设计领域，有很多经过时间检验过的定律及法则，来作为设计的指导原理，它能够帮助产品设计者对界面上的各种视觉元素进行合理评估，从而发现一些使用过程中的可用性问题，还可以根据这些法则从界面的维度来改善操作效率和使用满意度。阅读文章 > 用超多实例，解析「交互设计七大定律」在设计中的应用（上篇）交互设计之父阿兰·库珀说过这样一句话：“除非有更好的选择，否则就遵从标准”。阅读文章 > 本篇来源：优设网原文地址：https://www.uisdc.com/master-design-principles
数据 用户 商品 Nathan Yau 在《数据之美》中写到，可视化并不仅仅是一种工具，而更像是一种媒介，能最大化帮助我们挖掘数字背后的信息，让数据“开口”讲故事。可视化设计将信息和数据转化为用户能够理解的图表、图形和地图等元素，通过色彩、样式凸显其中的变化，帮助用户更高效的获取信息、判断趋势、识别变化等。那么在可视化设计中怎么让用户能更好的看清看懂数据或信息、让用户快速感知数据变化、让数据于用户所处的情境相呼应是微交互思考的方向。应用于当前状态表达，帮助快速判断「医鹿-新冠疫苗热力图」随着新冠疫情的反复， 新冠疫苗集中接种导致的排队情况比较突出，用户查询适合接种点的需求比较旺盛，希望可以快速找距离近，有苗可约、排队时间短的接种点；该热力图给用户提供一款可以快速查询附近可约苗、少排队的接种点工具，并通过人流量可视化来高效辅助用户选择合适的接种点。「雪球股票」在 list 页面中，每条 item 的背景颜色会随着实时的涨跌情况闪现红色或绿色，在 list 页做到实时状态前置。通过可视化中变化的凸显，帮助用户快速达成目标，在最少的时间内获取更多的信息，并引导用户进行更深层次的探究。应用于复杂商家后台设计，帮助提效「饿了么商家端」数据指标形象化：利用动效描述数据指标含义，帮助商户更好解读。例如下方案例：对于加购转化这个数据指标的解释，设计师利用动态的加购商品示意图来演示对应操作的界定。「饿了么商户端」数据切换和页面联动：借助 C 端页面展示 B 端数据，做到一一对应且更有画面感。「饿了么商家端」利用集合符号所见即所得拖拽标签圈选人群。将商家后台系统复杂的人群圈选操作变得更加简便且更容易帮助商家端的运营人员理解复杂运营规则。利用 3D 可视化，多维度展示商品「淘宝」商品卖点的用户参与式互动表达 ：利用不同的手势滑动屏幕控制序列帧图片。例如案例左一图中为了让用户更直观地了解摄像头长焦模式下的拍摄效果，用手势操作结合画面变化模拟了真实长焦影像的效果。其他两个也是利用 3D 模拟工作原理，用户可看到宠物洗澡机可拆卸演示以及烤箱的微蒸烤箱技术实现效果。「淘宝」3D 化商品外观展示：720 度及任意缩放查看商品 3D 模型以及不用款式和颜色的切换查看，增加线上商品的真实感和功能细节查看。超全面的数据可视化设计指南：风格篇各位数据可视化设计师们大家好，鉴于平时有很多同学对我们的可视化大屏的设计知识点有很多不理解的地方，阿勇决定花一些时间去详细剖析一下关于这方面的知识，全部都是多年工作经验所得，绝对有料。阅读文章 > 欢迎关注作者的微信公众号：「AlibabaDesign」本篇来源：优设网原文地址：https://www.uisdc.com/micro-interaction-visual-design
用户 窗口 侧边 不知道大家对交互设计中的控件持一个什么样的态度，反正我自己入行的时候其实是挺“怕”这玩意的。这些东西好像都来头不小，让我一个不小心就犯很多体验错误。但现在来看这样的心态其实很不必要，因为尽管控件设计有很多约定俗成的规则，但严格来说控件的应用不该讲“对”和“错”，只讲一致性与更好地贴合场景。面对控件时态度放松一点，也能让人更好地去思考未来改进的可能性。另外，由于市面上已经存在很多比较基础的、移动端场景下或者 UI 角度的弹窗文章，所以这一篇我将着重讲一讲 PC 端那种特复杂的大弹窗怎么做，内容比较多，所以会分两期。初识弹窗想象一下你去一家意大利餐馆吃晚饭，正餐刚端上来你正吃的高兴呢，一个服务生空着手走到你旁边戳戳你：“这位客人，外面有个人叫你，你站起来跟我过去一下。”你不得不（很不情愿地）暂停吃饭，站起来跟他走了。同一个吃晚饭的场景，假如这次服务生端着托盘走了过来，你一抬头，他“啪”一下把托盘上的罩子打开，盘子上放着一个小纸条，并且示意你拿起来看看。在交互设计中，假如把全页面的跳转类比成那个叫你“站起来跟我走”的服务生，弹窗就是那个端着托盘的服务生。他用一个新的任务或信息（托盘里的纸条），打断了用户原本的任务（吃饭），但是并没有把用户从桌子上拽起来，完全离开当前场景——也就是饭桌。因此可以这么说：网页与移动端设计中，弹窗本质上是一种对用户注意力的引导形式。它弱于全页面跳转、可能具有打断性，要求用户从原来的场景中抽出一部分精力来应对它。什么是弹窗？既然弹窗是引导注意力的一种形式，那是不是所有引导注意力的控件，都能叫弹窗呢？在 PC 应用程序设计的时代，所有的任务都是在窗体或者窗口 （window）上面完成的。因此实际上不存在所谓“全页面”和“弹窗”的差异，只有“这种窗口”和“那种窗口”的差异。比如在我的这篇文章里出现过的两种“弹窗”，在 windows 7 中同属于 dialog box 类；而除了这种窗口（弹窗），当时还定义了 wizard、property sheet 等多种不同的窗口样式。每种窗口都有一个主要的解决问题与标准样式。PC 设计从应用程序进入网页时代后，用户不再在多个窗口之间跳来跳去，而是在一个网页窗口下完成任务。因此在网页状态下，设计师模仿继承了“窗口”的样式与交互形式，产生了我们熟悉的“弹窗”。随着网页/移动端设计的不断发展，我们也发现，其实不用完全依照应用程序设计窗口的那一套来做弹窗或者做触达，因此网页/移动端产生了很多独有的设计样式。这些样式虽然起源于窗口，但更灵活多变、和传统意义上的“窗口”有一些差异。由于中文表达的含糊和不清晰，现在国内设计界倾向于把这些形形色色的触达/操作形式全部都统称为“弹窗”，但细究起来，我们甚至可以画一张九宫格：你是弹窗原教旨主义者吗？我在这里无意于给“弹窗”这个概念正本清源，但为了下文能够更有指向性，我们这里只把“层级高于页面的”、“容器大概是个方形”的控件纳入接下来“弹窗”的概念范围。并且由于 callout/tooltip 的一些变体和 menu 菜单不太好区分，为了方便，这期就不讲这些比较小的非模态控件了。同时我也认为，大家日常工作中特别是做控件的时候，可以去思考一下控件的具体定义，以防沟通起来鸡同鸭讲。为什么弹窗？还是承接上文那个吃饭场景，那个端着托盘的服务走后，你急急忙忙放下刀叉，把字条从托盘里拿出来：展开一看发现上面写的是——气不气人？你可能当场就想跳起来大骂服务生：这点事情需要这时候来打扰我吗？同样的道理，既然弹窗只是一种形式，那么是否选择这种形式，必然是由其实质内容（也就是场景与任务）决定的。我基于我自己的经验把弹窗的作用分成三种（当然你也可以分得更细，比如 IBM 就把他们的弹窗组件分成 5 种）：触达弹窗：这个弹窗是由系统触发的，而非用户主动触发的，一般用作信息通知，可能附带简单操作信息展示弹窗：用户主动触发，一般用来收纳全页面上放不下的信息详情操作弹窗：用户主动触发或受用户的操作触发，可能用来承载复杂操作（比如表单）在决定要设计一个弹窗时，至少要思考三个关于弹窗内容的问题：是否急迫：假如这是一个触达弹窗，用户是否需要马上处理/查看弹窗上的内容/任务？具体情境：假如这是一个操作或信息展示型弹窗，用户在处理这个内容/任务时，是否需要对照或查看其他内容？这个内容/任务是否反复发生/需要反复处理？生效方式：假如这是一个操作弹窗，用户是否需要对照自己处理的结果，再次对内容进行调整？1. 是否急迫这个问题决定了你需要占用多少用户注意力，是否要选择“弹窗”作为你的触达方式。就像我们上面提到的，触达弹窗不是由用户自己触发的，因此这个弹窗肯定不在用户预期之内，这意味着用户有很大可能性不会去看这个弹窗。对于触达弹窗来说，假如这件事情不那么急迫，不需要用户马上进行处理、或者用户根本处理不了，那么你可以考虑用以下方式弱化、降级触达：降低视觉音量：模态弹窗变成非模态弹窗，或者设置弹窗消失时间主动触达降级为被动展示：将触达弹窗变成用户主动点击查看由于触达本身是个很大的话题，我们这里不做赘述。未来讲触达的时候再细讲。2. 具体情境对于操作或信息展示弹窗来说，这个问题决定我们选择组件的层级、以及是否需要阻断用户和页面其他内容的交互（也就是模态/非模态）。想象这么一个场景：假如你是一个中学老师，你正在给每个小朋友写期末评语。学校提供的写评语系统长这样：你发愁了：班上有 50 个孩子，每个人的期末评语得按照他们的平时表现和期末成绩来写。为了写这个评语，你得打开期末成绩 excel、打开学生档案，再打开百度搜索评语模板，一边复制、一边粘贴：再来一个场景：假如你是一个第一天上岗的客服，用户来找你咨询：“这件衣服有几个码呀？我能穿上吗？”你一愣，“等等哦，我给你去查查”，然后打开了商品链接一通翻找。等你找到了，关闭商品页正准备回复呢，这时候客户也消失了。这就叫完成任务时，需要“对照或查看”其他内容。这种情况下假如设计一个模态弹窗，的确好像起到了“引导注意力、让用户专注当前任务”的效果，但也严重影响了用户完成任务的能力。对此，我们一般有以下几种方式来解决：尝试不用弹窗，而采用侧边栏来承载信息或任务使用各种形式的非模态弹窗，来让用户在完成任务的同时，可以自由行动、甚至允许暂时中断任务比如第二个案例里，我们可以尝试用侧边栏承载商品信息，这样客服就不需要离开当前聊天页面，而可以直接通过侧边栏获取商品规格，直接给到顾客及时的反馈。而在第一个案例中，也许我们可以尝试在学生的单人信息页上打开侧边栏，或者做成停驻窗口（docked window）的形式。这样即使在输入中，用户也可以去查阅完成任务所必要的信息，降低任务的完成难度。这个案例之所以我们不使用侧边栏，而采用了层级高于页面本身的面板来完成，主要还是考虑到写“期末评语”这个情景比较偏向长文本输入、一次性提交后不再支持编辑，所以相对于页面内输入，面板感觉起来比较“郑重”。这个就纯属个人习惯了。3. 生效方式这个问题在操作型弹窗非常多见。设计师用 Mac 的多，不知道平时打开系统偏好设置的时候，有没有注意过不同的菜单，右下角一会有“应用”和“复原”按钮，一会儿又没有。很明显，这两种弹窗的生效方式（或者叫生效模式）是不同的。有提交按钮的弹窗，在你没有真正点击“提交”之前，所有的修改都只是暂存，并没有真正生效。而右边这种没有提交按钮的弹窗，在你与弹窗内容区交互时，就已经即时生效了。windows 给这两种模式起了名字：前者叫延迟提交模式 delate commit model，后者叫即时提交模式 immediate commit model。我们大部分在网页端能见到的常规模态操作弹窗，都应该采用有提交按钮、需要再次确认的延迟提交模式：它的潜台词是，你可以仔细思考一下你键入的内容、选择的选项，随意修改到符合你的想法之后，再提交生效。相比起效率，这种模式更加关注准确性，填错了可能造成一些后果。但假如你的任务本身操作量不大，但是变更很频繁，比起准确性、更关注效率，那么就应该思考是否可以采用非模态弹窗或者侧边栏+即时提交模式，来创造相对高效、轻量的体验。比如 windows edge 的这个侧边栏，虽然也是设置，但采用了非模态面板+即时生效。5000字干货！从5个方面帮你完整掌握弹窗设计方法！前言产品经理：我觉得这里要加个弹窗，你去设计吧。阅读文章 > 欢迎关注作者微信公众号：「白话说交互」本篇来源：优设网原文地址：https://www.uisdc.com/popup-design
是一个 干货 水印 大家好，3月的第2波实用设计干货合集来了！越来越多的设计服务和功能开始选择借助在线网站来承载，它们专注于做好一件事情，同时，更好的运用机器学习来解决某一方面的问题，比如这次合集所推荐的免费图片修补工具，3D 快速建模工具，去水印的工具，免费的服装样机编辑器，都是这样。如果这里有你需要的工具，不妨看下去：1、免费的用户历程编辑器https://wireframepro.mockflow.com/buildcustomerjourney/在设计产品的时候，可能需要在设计之初就清晰的梳理出用户使用产品时的整个历程，而这个过程随着不同的产品的不同功能而有所差异，这个 CJM 编辑器会提供常见的3种用户历程，以此为基础你能够优化调整成为自己产品所需要的用户历程表，提供给团队或者用来演示。关于用户历程的设计，这篇文章有更详细的介绍：九个步骤搞定！用户历程图终极制作指南（附模板）编者按：这篇文章来自资深设计师 Taras Bakusevych ，他对于产品和体验有着非常深入的理解，这篇文章深入梳理了如何制作用户历程图才是合理和便捷的，是一篇相当给力的用户历程图终极设计指南：用户历程图（Journey Mapping）可能看起来是一个复杂的东西，尤其是当你尝试阅读文章 > 2、免费的图片元素擦除工具https://www.magiceraser.io/帮你节省修图时间的新工具喜加一！Magic Eraser 是一个借助机器学习成长起来的修图工具，主要的方向是帮你将图片中某些元素去掉，Magic Eraser 借助大量的图片训练拥有了自动修补的能力，修补完成之后你就可以下载修补之后的图片版本了。3、免费超强协作式 3D 建模设计工具https://spline.design/免费好用的 3D 设计软件越来越多了！这个名为 Spline 3D 的工具是一个实时协作型的 3D 设计软件，借助它本身的服务器的算力，你可以直接在浏览器中使用，也可以借助本地的客户端直使用，Spline 3D 有 Mac、Windows 和 Linux 版的客户端。4、免费去水印工具 WatermarkRemoverhttps://www.watermarkremover.io/这是一个完全免费的去水印工具，它提供网页版和 Android 版，两者本质上是一样的，它主要还是借助服务器端，经过深入训练的 AI 来帮助用户将图片上的水印直接去掉使用。WatermarkRemover 可以做到自动检测水印、多类型水印一次去除，以及多色水印直接去除，可以说相当给力了。5、3D 头像库 HeadZhttps://headz.design/HeadZ 是一个风格非常可爱的 3D 素材库，包含有完整的头部组件，并且它直接是对标 Apple 的 memojis ，这个 3D 头像库里面除了包含各种肤色各种造型的男性和女性角色，还额外增加了宠物，有两款狗和一款猫（包含各种不同的毛色和表情）。在这里获得免费的 Demo ：https://threedeeshop.gumroad.com/l/iUhgPl6、免费服装样机的在线编辑器https://mockover.com/mockups/t-shirt/Mockover 是一个非常好用的在线样机编辑工具，它带有 2D/3D 属性编辑功能，借助机器学习，可以轻松地在任何来源于网上的服装类型的服装上，添加和编辑图文元素，它内置了智能蒙版、智能填充、智能填充等功能，可以帮你实现不同的效果，进行更细致的设计。7、PPT 模板平台 RRslide https://library.rrslide.com/RRSlide 提供了一整套素质超高、漂亮又足够丰富的 PPT 模板库，你可以在这里获得特别多视觉效果惊艳的素材，3D 元素、表单、信息图表等等等等。从根本上来说，RRSlide 是一个收费服务，但是它本身提供试用，并且还有相当一部分素材其实是免费的，所以值得尝试一下。8、简单优雅的衬线字体 Cramble Cramble 是一个干净现代的衬线字体，它的衬线笔触有着明显的喇叭口，整体的风格又带有一点复古气息，而且字体提供多种不同的字符变体，用来应对不同的场合的需求。这款字体目前所提供的版本是免费的，但是仅限个人使用，可以在文章开头结尾的百度云链接中获得。9、活力十足的渐变色彩素材这是一组用色活力十足的渐变色彩背景，其中包含 20 张高素质的渐变背景素材，适合用来作为纯背景，也适合用于包装或者其他的设计场景下的辅助素材，这些图片全部是 300dpi 的高清 JPG 图片，分辨率高达 4500×3000 px，完全免费，可以商用，并且可以在文章开头结尾的的百度云链接中获得。往期干货：第一波！2022年3月精选实用设计干货合集大家好，3月的第1波实用设计干货合集来了！阅读文章 > 文件名 如何下载使用 文件大小 提取码 下载来源 3月干货第二波93mbrtt 点此复制 登录下载 本篇来源：优设网原文地址：https://www.uisdc.com/2022-3-design-resources-vol2
用户 操作 破坏性 TCC 推荐：大家好，这里是 TCC 翻译情报局，我是张聿彤。尼尔森十大原则由毕业于哥本哈根的人机交互学博士 Jakob Nielsen 发表，Jakob Nielsen 对人机交互有很多研究，他提出十大可用性原则，用来评价用户体验的好坏，每个产品设计者都可以根据这十大原则进行自查。本文中主要介绍了防错原则的具体应用示例，接下来让我们一起看看吧。用超多App 案例，帮你掌握尼尔森十大原则谈到我们生活中的那些产品和服务，它们常伴于我们左右，影响着我们的生活，与我们处处相关联，同样的这些产品也会影响我们的感受，我们常常在使用时会感到喜悦，也偶尔会在使用另一些产品时会感到不舒服，这些感受都是由产品和服务的体验直接决定的。阅读文章 > 错误预防错误预防是用户界面设计的 10 条启发式评估可用性的原则之一。据统计，犯错误的频率和严重性与系统的整体可用性呈负相关。尽管无法确保用户始终按照我们希望的方式使用我们的设计，但仍有一些方法可以防止（ 或减少 ）用户误操作，而且当涉及到破坏性操作时（ 例如，从系统中删除文件）尤为重要。对话框是系统和用户之间的“ 对话 ”。模态对话框会打断用户本身的任务流程，并要求他们采取行动或向他们提供有关当前工作流程的紧急信息。在执行破坏性操作之前，用户通常会看到一个确认对话框。破坏性操作的确认对话框示例一个确认对话框，询问用户进行确认，他们想询问用户对刚刚操作进一步确认（ 以防止用户误操作 ）。这些行为被称为肯定性破坏性行为；由用户发起的破坏性操作，其中出现模态对话框以确认操作，并确保用户完全理解操作所带来的后果。在某些情况下，用户或系统可能会意外启动破坏性操作。例如，在填写尚未提交的表单时离开页面可能会导致数据丢失。当用户在没有保存数据的情况下意外离开页面时触发错误预防模态对话。如何改进破坏性操作的模态对话框？1. 在执行操作之前提示在执行具有严重后果的操作之前（例如破坏用户的工作 —— 删除文件 / 帐户等），应使用确认对话框，这在无法撤销的行动之前尤为重要。2. 重申用户的请求确认对话框必须重申用户的请求，并说明如果请求得到确认，系统将执行什么操作，这使用户能够更加清楚地了解其操作的结果。将用户的行为描述成一个问题，是一种吸引用户注意力，并让他们停下来考虑自身的上一步操作的方式。下面的示例证明了这一点。重申用户请求的破坏性操作确认对话框示例。3. 帮助用户理解操作为了实现这一点，微内容 [2] 很重要。应该避免是/否以及那种含糊的选项（ 参见下面的一个反面案例 ）并且按钮的文本应该着重强调即将做出的选择（ 例如，删除帐户 ）。此外，在对话框中添加一些辅助解释会很有用，但主要消息应该在按钮文本中，因为急躁的用户更有可能忽略那些辅助的解释只关注按钮的文本。( [2] 微内容是一种用户体验文案，以短文片段或短语的形式出现，通常没有额外的背景支持。)糟糕的微文案会让用户感到困惑，并可能导致用户犯错并非常沮丧。4. 将按钮差异化例如，在一个按钮上使用了红色，可帮助用户识别出来这是一个破坏性操作。在这里颜色与主按钮的文案相匹配，并明确了按钮的用途，但是，由于可访问性和文化差异，仅依靠颜色是不够的。尤其是世界上大约 4.5 % 的人口患有某种形式的色盲，仅使用颜色来传达意义可能会让我们的很大一部分用户被拒之门外。因此，按钮标签需要具有足够的描述性，以便在没有颜色的情况下独立表达含义。为了使警告信号更引人注意且更易于理解，还可以在屏幕上显示一个代表破坏性操作的图标。5. 不要过度使用对常规动作使用确认性对话框会影响用户对破坏性动作对话框的认知。如果用户看到了太多确认性对话框的模态窗口，他们可能会习惯它们，并且不再注意他们。结果就会导致确认性对话框失去了错误预防的能力。6. 保证简洁确认性对话应该简短，以便于浏览，但是，在某些情况下，用户可能希望在提交之前了解有关其行为后果的更多信息。在这些情况下，可以使用渐进式披露 [3] 的交互方式。( [3] 渐进式披露 ：渐进式披露不直接给用户提供大量的信息和选择，而是将这个过程分解成几部分，让用户集中注意力在当前的事件上，从易到难地引导用户，这样不仅可以确保用户不会被新信息淹没，还可以分解用户不想做的任务。)渐进式披露能使用户自主决定是否要了解更多当前行为的后果用一篇文章，帮你了解交互设计方法论「渐进式披露」大家好，我是 Clippp。阅读文章 > 7. 避免默认选择我们要避免给确认性对话框提供默认的选择，因为本来我们的目的就是通过这种模式让用户仔细检查他们的操作，从而预防用户犯错。8. 撤销破坏性操作理想情况下，我们应该允许用户撤销破坏性操作，很多时候在一瞬间你就意识到自己犯下了一个可怕的错误。许多 APP 允许用户撤销此类操作，或者使用撤销空间，或者让用户在最终完成操作之前编辑这些操作。这与启发式评估可用性的 10 条原则中另一条的核心观点相吻合 ，即用户的控制性和自由度。这可以减少用户的焦虑，并能帮助他们挽回重大错误操作造成的损失。当用户知道他们可以撤销操作并从错误中恢复时，他们会感觉对产品有更多的控制权。Google 的 Gmail 有一个可选的“撤销发送”功能已经有一段时间了，它为用户提供了 20 秒的缓冲时间来撤销他们的操作。9. 通过输入确认操作如果无法实现撤销按钮，我们可以提示用户在文本字段中输入文字确认执行破坏性操作（ 例如需要用户手动键入删除/确认/等 ）。提示他们输入以确认，强迫他们停下来并阅读模态文本，从而做出有意识的决定。虽然有可能意外地按错按钮，但不可能意外地输入动作，因为这需要深思熟虑，下面给出一个例子。提示：在非常关键的删除操作中也应谨慎使用这种方式，因为如果经常使用，可能会惹恼用户。“键入以确认”模式可确保用户做出有意识的决定以上便是针对破坏性操作预防模态对话框设计的 9 点建议，可能不能做到万无一失，但关注每一个细节，一定会让你的设计得到提升，进而提升产品的用户体验，如果你有别的建议和技巧，欢迎在评论区分享~从这3个方面，帮你掌握二次确认的设计思路二次确认的主要作用是防止误操作，以及警示操作带来的后果，避免用户无意之间执行了本不想做的操作。阅读文章 > 欢迎关注作者微信公众号：「TCC翻译情报局」本篇来源：优设网原文地址：https://www.uisdc.com/error-prevention
首页 容器 官网 vivo 官网 APP是什么？vivo 官网 APP（下简称官网）作为 vivo 手机内置的应用，是提供 vivo 产品 / 服务 / 权益 / 资讯 / 社区的线上官方阵地，也是陪伴 vivo 用户「购机」至「换机」周期的重要角色。因此，官网的产品体验和设计品质，很大程度上决定了用户对 vivo 品牌的认知，保证官网设计品质，是保证 vivo 品牌正向认知的关键一环。vivo 官网 APP 首页为什么改版？随着业务的发展迭代，官网开始出现设计不统一、品质下降等问题，在首页表现得尤其明显，因此设计师发起了官网的设计升级，先从首页入手，提升首页界面的统一性和品质。基于用户&业务视角看「品质」优化首页容器是关键官网首页定位「精选」，聚合产品、权益、服务、社区等内容，满足用户需求。从用户视角看，首页存在 2 种场景：1. 头部搜索、金刚区为「明确目的场景」；2. 头部以下内容区为「无目的场景」。前者提供功能入口，满足用户明确的需求；后者展示内容，满足用户闲逛的需求。明确且固定的「功能入口」，经过长期认知培养，转化趋于稳定，优化空间较少；而时常更新的「内容」在呈现上的好坏，影响用户对 vivo 品牌的印象及浏览欲望，决定首页留存和转化。因此优化「容器」，使内容更好地呈现给用户，是本次设计升级的核心。从业务视角看，今年官网首页的内容运营将围绕「人-货-场」概念，通过分析用户（人）特征，将信息（货）推送给相应的用户，「场」是最后呈现信息的地方，即「容器」。业务方希望用更精简的容器规则去满足不同的「人-货」需求，做到「少样式」对「多场景」，构建内容展示标准，用更精简、易理解的样式，让用户聚焦到信息本身。乱，多，不全是首页容器的核心问题走查首页，发现如下 3 个问题：1. 容器样式乱首页容器样式多且乱，无章可循。需结合产品定位及功能诉求，梳理容器设计，定义标准。2. 信息冗余无效信息多，如「独立显示芯片」这种言之无物的信息，又如社区帖子密集的信息，都造成了信息过载。3. 信息展示不全首页经常出现信息不全的状态，对品质影响极大，用户无法获取有效信息。头部品牌的官方商城设计都崇尚「简洁」美学了解自身问题后，我们对各行业头部品牌的官方商城进行分析，以此了解行业设计趋势。1. 简洁的直观印象纵览他们的首页，扑面而来的是「简洁」，这是最直观的印象。2. 简洁从何而来深入分析其设计，可发现简洁背后 3 个核心共性：有限的容器：限制了基础容器样式的数量，最多不超过 3 种。有限的信息：限制内容在首页展示时的信息数量和信息容量。明确的优先级：图片是界面视觉焦点，辅以简洁的标题 / 价格 / 标签等文字信息，多数品牌去掉冗长的卖点。3. 简洁背后的意义「简洁」是美的，但信息精简、色彩素雅等特点也常被定性为「气氛弱」、「吸引力低」，尤其在销售领域。那为何这些品牌会将「简洁」的设计美学引入商城界面设计呢？这背后隐含消费者的认知心理。在追求功能性及性价比的消费领域，商品满足消费者物质层面需求，购买动机是功能、卖点、价格等利益点，因而在传统快消电商界面的设计中，更注重利益点、界面气氛对消费欲望的刺激。而在追求高品牌溢价的消费领域，商品满足精神层面需求，如身份&价值认同，购买动机围绕商品的设计品质、是否符合自己的社会属性等方面，过分强调利益点及界面气氛反而会影响品牌调性，使品牌优势被减弱。这类品牌商品的展示更聚焦在商品本身，「简洁」的设计美学就与品牌目标相得益彰。用「至简」的理念重塑vivo 官网 APP 首页用户认知规律、业务诉求及行业趋势的分析结果，都直指关键词「简洁」，它带来了逻辑严谨、规则明确、标准统一的有序体验，隐于简洁的表象之中，让用户更沉浸地体验内容。这种追求简洁表现、有序体验的理念，我们称之为「至简」，它将指导官网首页改版。1. 容器样式梳理基于「至简」理念，经过梳理和方案尝试，首页的基础容器被优化为 3 类：广告容器即传统意义上的 Banner，本次改版统一了首页所有 Banner 的规格、元素组成、文案排版，包括头部 Banner / 新品 Banner / 穿插 Banner。产品容器即展示产品的容器，新版的产品容器统一了信息架构的逻辑，文案限制在 3 阶之内，提供了「组合型」和「横排型」两种形式，对应不同的场景。组合型容器提供 2 种规格，拥有同样的信息量，根据业务需求自由组合。横排型容器提供 1 种规格，根据业务需求选择「横排」或「横滑」。内容容器即展示品牌、社区内容的容器。该容器统一使用上图下文的信息架构，可随场景进行不同形式的拓展。2. 信息展示优化梳理完容器类型后，对信息展示做进一步优化，解决「信息冗余」和「信息展示不全」的问题。产品信息以热销产品楼层为例：信息布局不合理导致手机型号展示不完整；可配置副标题但文案较多；通过颜色强调价格但价格并无优势。新版的信息做了如下优化：优化信息布局为手机型号腾出更多空间，保证展示完整；精炼副标题的核心卖点，转用限制字数的标签进行强调；不强调价格，引导用户关注产品及卖点。社区、品牌信息以社区楼层为例：首页社区楼层通过精选内容为官网社区引流，其定位是「入口」，旧版首页将社区内容直接平铺，露出了过多的信息，不符合定位的同时，也在首页造成信息冗余的问题。因此新版首页做了大幅度精简，只露出最核心的「标题/来源/互动情况」 信息，在有限的界面里露出更多的社区帖子。3. 视觉规则优化基于容器的优化策略，进一步制定了详细的视觉规则。官网首页由不同大小的容器组成，为了更科学地定义容器规格，引入了栅格。字体上，使用 OriginOS 的定制字体 — 汉仪旗黑，保证可读性及统一性。在设计界面时，在准确体现信息层级的前提下克制使用字号。如容器的文案展示，仅使用了 2 种字号，保持极致的统一和简洁。图形语言同样值得考究。官网的内容信息优先级更高，图形是辅助角色。因此图形设计更关注语义是否明确、元素是否统一、形式是否简洁，而不过分追求差异化。基于 vivo 品牌及产品体现出来的圆润亲近属性，对官网的卡片圆角、图标、标签、按钮等元素做了统一的设定，保证整体的协调一致。色彩体系也从 0 到 1 构建起来。过往迭代中，颜色使用仅凭执行设计师的个人感受，没有标准化。对此，基于 vivo 品牌蓝为官网重新定义标准色卡，包括常规色阶、材质色阶及灰色阶，系统指导颜色使用。基于新的容器规则及整体视觉规则，首页刷新后效果如下图。是结语，但不是结束本次 vivo 官网 APP 的首页改版，从预研、推动、落地到验证花费近半年时间，付出了相当「复杂」的努力。而我们的「复杂」，是为了给用户提供「至简」的设计品质和产品体验。但这并不是结束，首页改版后，将基于全新的设计语言，对全局界面进行翻新，全面提升官网设计品质。赋能 vivo 品牌，我们在路上。用3个国民级应用优化案例，分享我的改版思路以大厂的主流产品为优化实操对象，其实是一个很大的挑战，发现并优化其中存在的问题，对于理解用户体验设计有着巨大的帮助。阅读文章 > 欢迎关注作者微信公众号：「VMIC UED」本篇来源：优设网原文地址：https://www.uisdc.com/vivo-app-redesign
广告
广告
张大湿
表哥
落霞与孤鹜
在路上
飞翔的企鹅
