设计工具

刚开始接触交互设计往往会面临自己的想法找不到合适的方法输出。所以完成基本工作同时也在积极寻找、学习适合自己又和工作环境相匹配的工具。与团队成员配合的时候没有人会在意你是用什么工具，成员们只想看到设计师产出的输出物。这个时候针对不同任务类型和团队大小找到合适的工具可以让设计师迅速输出团队想要的结果输出物，事半功倍。

承接上一篇文章《初级用户体验设计师可以向其他合作伙伴学习什么？（运营 & PD 篇）》，今天写写前端 & 开发们值得我们这些初级用户体验设计师去学习的地方。

不知不觉，我已经正式在交互设计的路上越走越远，了解得越多，就觉得交互设计需要学习和掌握的知识越多；同时犯的错也会越多。然而犯错并不是一件坏事，怕的是犯过的错误不能够被积极地思考，我们不能及时把错误化作成长。根据目前我的一些浅薄经验，总结出了交互新人往往容易犯的一些错误，以及关于错误的一些思考。

字体作为界面设计的一个元素，对用户的阅读体验起着至关重要的作用。本文是 UI 设计师 Viljami Salminen 分享的用户界面字体设计的基本规则和技巧。一个优秀的设计师懂得：网页上的文字不仅仅作为内容而存在，它还是用来交互的界面。
– Oliver Reichenstein
Helvetica 真的弱爆了。它不是为小屏显示而设计的。像「milliliter」这样的单词显示效果就很差。
– Erik Spiekermann

微交互，听起来很生疏的这个词，实际上却出现在我们每天的日常生活中，甚至可能早上起床后我们做的第一件事就是一次微交互操作的典型案例。

本篇是系列小结的第二篇，简单总结一下自己对如何提高交互文档质量的一些思考。

最近Herman Miller的设计总监接受了 fastcompany 的采访，和另外几家公司的设计师一起，畅想了未来 5 年设计界的 25 个趋势。

2016马上就要过完啦，我们来回顾下今年用户体验都发生了哪些大事，并通过回顾过去来展望2017年的用户体验将会有哪些趋势。“可用性”这个词本身变得不那么重要了。它不那么需要我们了。“聊天机器人”是我们行业中最热门的术语之一，如果你还没有，我们很有信心你将很快建立一个。但对话式界面的未来是什么样子？但后退一步：是不是每一个界面都是用户和机器之间的对话？未来的交互不是由按钮组成的。公司不只需要一个界面，而且设计师也不只通过设计工具来完成他们的工作。苹果手表和Alexa可以让用户不碰手机的情况下使用Uber。虽然这可能听起来很简单，但它为人们对技术的期望设定了基调：完全连接和无处不在的体验。作为设计师，我们如何将所有的拼图连接在一起？我可以向Alexa请求Uber乘车，在我的Apple Watch上接收预估时间，与Messenger上的朋友分享费用，并在我的手机app上评分吗？技术应该尽可能不被注意到。——Amber Case，Calm Tech从《黑客帝国》，到《她》和《黑镜》，人类总是幻想生活在虚拟现实的世界。随着数字世界变得更加真实，我们需要采取的行动来实现这些体验。设计VR不应该意味着将2D实践转移到3D，而是应当寻找一种新的范例。 ——Jonathan Ravaz我们一直在听的问题：设计师应该写代码么？设计师画原型吗？设计师应该写文案吗？至少有几十篇文章试图回答这些问题，所以我们现在可能更接近一个确定的答案：这些都可以。今天，UX设计师可能会身兼数职。当我们开始为我们的自动化生活进行设计时，我们首先需要自动化我们的工作。我们将与机器人一起设计。多样性和伦理是今年用户体验中最重要的两个主题。许多设计师之所以从事UX，是为了更好的改变人们的生活。我们可以找到这么做的关键点么？设计并不是一件附属品。我们的工作影响着人们的生活。设计可能失败，但设计师不能。如果你的公司只是为了赚钱，也许你应该找一个更好的公司。这不是你的错，但这是你的责任。—— Alan Cooper，Ranch Stories talk

什么是合格靠谱的体验设计？在逻辑层讲一个通顺的故事。什么是触动人心的体验设计？在感官层唤起人的体感记忆。什么是经典不衰的体验设计？在知觉层建立起认同和反思。你的设计逻辑性和方法运用很强大，很擅长做工具型的产品设计，但在设计的创新性和情感体验上还需要进一步加强。任何游戏化的设计都必须认识到：外在奖励会显著降低玩家的内在动机。游戏化的经验很简单：不要盲目地将外在动机附着在内在动机上。

图片不仅仅是装饰，更是强大的设计工具，可以帮你进行视觉传达，让你的产品脱颖而出。

设计是拉开产品差异化的关键，而影响设计的因素是众多的，事物总是处在不停地发展变化中，比如蝴蝶效应，某个因素的改变就可能带来连锁反应。设计也是如此，需要顺应发展变化。

互联网时代，企业对设计的要求越来越高，也越来越多样，那么成为一名优秀的设计师应该具备哪些技能呢？

此文意在帮助设计师快速而统一地完成界面布局。尤其对尺寸固定的移动界面有帮助，但对响应式web设计也有帮助。与一般的设计指南相比，此文更适合一边设计一边阅读。

随着新工具的发布，现有工具版本的更新迭代，2016 年显然是设计类工具蓬勃发展的一年。在本文中，我挑选了一些在 2017 年值得我们关注的设计工具。这些工具在设计工具类的社区中都拥有着大量的人气，所以挑选出来与大家一同分享。Have Fun！注：本文版权归原作者所有，仅用于学习与交流。

精美的动画对于提升产品体验有很大帮助，如促进用户理解功能，缓解用户情绪，调动用户积极心理，为产品提供亮点等等。诸如此类的文章相信各位已经看过不少了，不少人已经开始越来越重视动效在产品中的应用了，还没有看过的同学不用急，谷歌官方的动效指南讲解得很详细，建议只看这个就够了，配合一些动画理解起来更容易。说明：

1.优化直播间分享面板，增加特效

2.当用户点击分享按钮时（*包括传统直播间主播面板的分享按钮和上方分享按钮，手机直播间的分享按钮*），从下方弹出分享面板，逐个弹出分享icon，并淡入显示分享奖励。

3.用户关闭分享面板时，分享icon从右到左依次下落淡化消失
相关参数：

1.分享面板减速弹出，运动时间225ms
2.分享icon从左到右依次弹出，运动时间225ms。带有奖励图标的，当对应分享icon弹出后，分享图标淡入显示（时间225ms），第二个图标比第一个迟100ms开始运动

eg：如图第一个为qq图标，当用户点击分享按钮，分享面板弹出后，qq图标开始弹出（时间225ms），100ms后第二个图标（qq空间）弹出，当qq图标完全弹出时，淡入显示分享奖励图标，时间225ms。
3.分享icon从右往左依次收回，分享面板收回，所有运动的时间减少30毫秒，如分享面板收回时间195ms，分享icon收回时间195ms。

andorid端动画曲线采用系统自带：AccelerateDecelerateInterpolator（在动画开始与结束的地方速率改变比较慢，在中间的时候加速）

iOS端动画采用系统自带：kCAMediaTimingFunctionEaseInEaseOut （在动画开始和结束的时候速度稍慢些）
具体效果可参考附件视频

Skacks会彻底改变你对Sketch布局方式的理解。Sketch用户终于可以在不用CSS的情况下，直接使用Flexbox的排版技术。小提示：

– Stacks能产生一致性。

– 一致性使设计清晰。

– Stacks能使设计清晰。我们Anima的使命是让设计师能掌控自己的设计。我们正在打造一款设计工具，让设计师定义和构建UI与UX设计中所有零零碎碎的元素，并且最终能自动生成本地代码，1:1还原设计。这就使设计师不依赖团队的其他部分，比如开发人员的优先关注点就与设计团队不同。

工具固然重要，但我们不应该被它牵制。“因为刚入行，所以不知道怎么去做好这个岗位，只能先从工具入手，然后看看公司的产品，再去用 Axure 绘制一遍。 ”

毫无疑问，我被问到最多的就是关于设计规范体系的建立。所以在过去几年里，最多思考的就是如何设计、建立完整的设计体系，像Marvel, Bantam 和 Modulz这样的产品，下面我想分享一些我学到的方法。

我们常说产品的用户体验设计很重要，但究竟怎样才算好的用户体验呢？以下5大UX设计目标层层递进，帮你在最短的时间内明确用户体验设计方向，成为一名合格的UX设计师。“我能否以最简单，快捷，直接的方式得到我想要的东西？”最好是“别让我思考”。“我是否享受使用该产品的过程？”“该产品是否有足够的吸引力让我愿意长期使用”，甚至“成为我生活的一部分，让我戒不掉？”“该产品是否能调动我的力量，让我主动加入产品宣传推广的队伍。”