囊括工作全流程！腾讯设计师自用的17款效率神器合辑优设网

有效的设计积累让我们事半功倍。养成随手记录的习惯，逐渐形成自己的素材库，不仅能够让我们在需要的时候能够快速检索灵感，偶尔回顾也总能有新的感受。

1.字体识别神器：WhatFont

当你想知道一个设计精美的网站设计使用了什么字体时，可以安装一款叫做WhatFont的浏览器插件，开启时鼠标hover到文字上即可快速识别出字体、字号、字重、行高和颜色。对于不习惯使用控制台的朋友来说非常简单实用。

插件最新的版本停留在2017年，不过在大部分网页上都是可以正常使用的。同类产品还有FontsNinja等，除了识别字体还可以收藏和管理字体，可根据你的需要进行选择。

2.用户体验设计档案:UXArchive

该网站收集了来自世界一流的科技公司的产品用户体验流程。例如，你正在设计“忘记密码”体验，需要参考时通常都是打开不同的App一个一个体验和截图。而通过这个网站，你可以根据场景快速浏览其他公司的示例，对比不同的解决方案。

3.灵感速记:Flomo

Flomo是一款非常轻量的笔记工具，用类似发微博的方式快速记录一些知识片段。相比剪藏已有的内容，Flomo更注重主动创造和记录。产品的功能目前非常简单，但背后的「卡片笔记法」理念很有意思，提倡先快速积累卡片，然后通过标签和关联让结构涌现，积累知识的复利。感兴趣的朋友可以了解他们对于“知识管理”的思考。

当我们进入到产品设计工作中时，了解用户往往是最重要的前提和基石。大公司的团队往往有专职的用户调研团队来协助产品设计，但对小型一点都团队可能用户调研这个流程是全部归到设计师角色里的。而且即使有专门的用研报告，直接观察用户的行为和描述往往是最直观的，也更容易洞察到问题和机会。这里介绍两种我们常用的低成本的方法。

1.用户反馈什么:七麦

2.用户谈论什么:微博

1.MeshGradient网格渐变工具

一款Figma插件，Illustrator里强大的Mesh功能在Figma里也能用了。做好的渐变还可以保存下来多次复用。

2.RunnerPro

如果你主力使用Sketch，习惯键盘操作，熟悉各种指令名称，而且有完整的组件库，那么RunnerPro将会是一个很好的Sketch助手。它的使用方式就像在Mac中使用系统聚焦搜索，通过一个搜索框即可快速完成组件插入，指令运行，插件安装，以及快速前往某个画板。

Runner的组件搜索支持中文，但对于多个关键词的模糊搜索还是对英文支持比较完整。

3.Blush插画插件

一个由PabloStanley设计的免费可商用的手绘风格的插图库。任务造型有数十种选项可供选择，可以自定义角色的头发、裤子、肤色等等，无需打开Illustrator即可创建独一无二的插图。适合用来做运营插画，拼用户故事版，PPT配图等。需要搭梯子访问。

另外也有越来越多的设计师开始用Figma的原型功能直接做PPT了，顺应这个趋势他们还提供同系列的PPT模板，一键套娃。

4.POSE人体姿势参考

5.动画曲线预览

细腻的动画能够让体验更有温度，这个网站提供了五种简单的网页版式和最基础的三组动画曲线，你可以选择最适合你的demo，体验不同动画曲线在实际页面上的感受。底部还可以调整具体参数来达到想要的效果。

需求过程中我们需要反复和上下游沟通，在这个阶段里设计稿是解决方案的可视化呈现，是中间产物，首先要满足方便沟通和传递的诉求。方案定稿后，交付的则是产品的设计蓝图，首要确保方案的完整性，要能够拆解和执行。

1.DesignProjectTemplate

2.设计协作工具XSHOW

3.还原自检WindowResizer+Zeplin

WindowResizer是一款Chrome插件，正如其名就是可以把浏览器窗口固定到指定尺寸，可用于检查网页的自适应策略，或截特定尺寸的图。

我们常常配合标注工具Zeplin的叠图功能使用。将浏览器设置为和设计稿相同的尺寸，再将半透明设计稿叠上去即可一眼看出网页是否还原到位，还有哪些地方需要调整。一图胜千言，再也不怕开发哥哥说“看不出来”了，显著提升了沟通效率和团队和谐气氛。

使用示例:上层为设计稿，下层为对应浏览器尺寸的实现效果。

4.图片压缩工具

如果仍采用非在线的较为传统的交付方式，通常需要导出为图片发给对方。有时输出网页设计或者完整流程交互稿的尺寸较大，可以多做一步压缩工作。一来同步方案的时候合作方更容易打开，另外需要导出多个版本时占用我们自己电脑空间也比较少。

如果图片在5M以内或者需要批量处理，可以用ImageOptim或者Tinypng应用来进行无损压缩，通常可以减少60-90%左右。但如果图片尺寸超过5M，使用以上两个应用耗时较长而且容易失败，此时可以试试在线压缩网站，即使是超过20M的大图也可以稳定压缩。

5.Rotato动态Mockup

Rotato提供了很多常见的动态Mockup效果，只要将你的设计稿放进去（图片或视频皆可），即可快速实现高端大气的展示效果，支持非常完备的苹果设备以及部分主流安卓设备，效果包括界面的反转，拉近，滚动展示等。

设计上线后效果如何？有效的验证能够帮助我们有目的持续迭代精进。

1.AB测试用户样本计算小工具

AB测试，也称为分桶测试或分批测试。AB测试本质上就是把平台的流量分为为几个不同的组进行实验，然后观察不同组的用户数据指标，例如：点击率、次日留存、人均观看时长等等核心指标，最终选择一个更有效的实验组上线。

在开始设计实验之前，需要明确实验的目标。基于假设方案中的元素个数，AB测试可以分为单一变量测试和多变量测试。这里以单一变量为例来进行简单的说明，如何进行流量分桶。我们推荐这个免费的小工具，来进行流量分配，根据实验的预期结果，大盘用户量，来确定实验所需最小流量。

以腾讯文档里面某一个按钮的点击率为例，目前大盘点击率为5%，预期实验能够提升0.5pp。

这个工具还可以进行很多其他维度的流量配置，感兴趣的同学可以进行深入的研究。我们希望大家在设计的同时，能够大胆创新的提出假设，然后进行科学的验证，从而得到一个更有效的设计。