10 个适用于设计师的 Google Chrome 扩展
已发表: 2015-06-11如果您是遵循标准设计流程的网页设计师,您的任务包括:
- 研究
- 线框图
- 选择配色方案
- 选择正确的字体
- 测试几种变体
- 与客户和队友合作
还有一些……
您知道您可以在浏览器中完成所有这些以及更多操作吗? 是的,如果您是 Google Chrome 专业人士,那么您可以通过 Chrome 的扩展程序完成所有这些任务。 他们中的大多数只需点击几下。
因此,节省大量时间并为设计师试用这 10 个 Google Chrome 扩展程序。
1.响应式网页设计测试员
发布谷歌的移动友好更新,响应能力是流行语! 因此,这是一个扩展程序,可让您在所有主要的 Android 和 Apple 移动设备上测试您的网站。
它也可以离线工作,因此即使您在本地进行设计,它也是一个不错的选择。 它具有适用于所有流行设备的预设,但您也可以添加自定义尺寸。
选择要预览的设备后,当前选项卡会在弹出窗口中打开,显示您的页面在该设备上的外观。

2. TypeWonder
字体确实设置了网站的氛围,但选择合适的字体是一项艰巨的任务。 你知道这个练习——回到你的代码,进行更改和预览。 而这一切一遍又一遍。
但这里是这个方便的字体扩展的地方。TypeWonder 允许您更改浏览器中任何网站的字体。
只需访问您的网站并单击扩展程序的图标即可。 您有几个字体选项。 单击任何一个几乎都会立即以该字体创建您网站的预览。 如果您对预览感到满意,您可以获取相关代码以添加到您的网站及其 CSS 文件中。

3.标签打包器
研究是一件大事。 如果你是一个认真研究研究的设计师,我可以肯定地说,在任何时候,你至少打开了七到十个标签。
如果您必须征求设计师朋友或队友对您所指网站的意见怎么办? 您将为文件夹中的所有页面添加书签,将其全部导出,然后选择要发送的集合,当然,在打开邮件程序之后。 相当一些工作!
幸运的是,你不必这么辛苦。 Tab Packager 可让您打包所有打开的选项卡。 然后,您只需单击一下即可通过包裹的链接发送。 您可以通过电子邮件、Twitter 和更多服务进行分享。

4. 田径鸭
有效的沟通是每个成功项目的背后。 但是,在电子邮件中反复尝试进行细微的调整或进行重大更改可能会很费力。
现在这听起来可能有点夸大其词,但 TrackDuck 就像一个迷你体式,专为设计师设计。
TrackDuck 是一种可视化协作工具,可让您将网站添加为项目。 添加项目后,您可以邀请您的团队成员加入。 每当您对该项目(或网站 - 您只需单击扩展程序的图标即可)发表评论时,就会生成有关评论的任务。 您可以将此任务分配给您的队友,添加附件和屏幕截图,并将其与许多协作工具(如 Trello 和 Basecamp)集成。

5. ColorZilla
你永远不知道什么时候会看到一种可爱的颜色,它会激发你下一个 Web 项目的调色板。
那么,您如何捕捉网络上的任何颜色?
好吧,这就是 ColorZilla——它很容易成为每个设计师最喜欢的 Chrome 好东西。 它最基本和最受欢迎的功能是获取网页上任何颜色的代码。
另一个功能是它可以让您获得任何网站的配色方案。 您必须单击网页颜色分析器选项,然后会出现一个显示该网页上所有颜色的调色板。


6.什么字体
当您遇到一个使用完美字体、颜色和大小的网站时,有很多次。 事实上,您想在您的网站上使用确切的组合可能会非常好。
但是您不必再采用 Inspect Element 路线了——WhatFont 只需单击一下即可剖析网页上的任何字体。
只需单击扩展程序的图标并将鼠标悬停在您感兴趣的文本部分上。WhatFont 会生成字体类型、大小、高度、颜色和系列。

7.即时线框
如果您在设计网站之前定义了网站的信息层次结构,您将创建一个用户友好的网站。 线框图是解决这个问题的最佳方式。
Instant Wireframe 扩展可让您查看任何网页的相当好的线框。 它仍处于测试阶段,但做得很好。
如果您遇到想要查看其线框的网站,只需单击地址栏中的扩展程序图标即可。 值得尝试!

8.页尺
有几种方法可以测量网页元素的尺寸。 但其中大多数涉及多个步骤并且需要时间。
Page Ruler 是最方便的方法。 Page Ruler 可让您查看元素的高度、宽度和相对位置。 您还可以按 div 分析元素。
它非常适合创建像素完美的横幅、特色图像和其他营销材料。

9. Chrome 的调色板
网站上充斥着图像,你不能说你什么时候会看到一张足够好的图像来激发调色板的灵感。
但您不必担心,因为 Palette for Chrome 始终为您提供保障。 只需右键单击您觉得有趣的图像,然后选择此扩展程序的选项。 它将立即创建一个受所选图像启发的调色板。 您可以指定要为配色方案生成的颜色数量。
如果有办法导出配色方案,我会更喜欢它。 但是扩展仍然是必须的。

10. ExtensionMuzli – 设计早餐
您知道,当您刚刚开始时,您订阅了您所在领域内的所有热门博客。 您的 RSS 提要已全部启动。 但是随着你的工作堆积起来,你会有点脱节。 并不是你不需要灵感,只是很难赶上。
ExtensionMuzli 就是为了弥补这一点而构建的。 它从大约 12-15 个顶级设计资源中挑选故事。 如果您想切换,还有一个网页设计工作部分。
安装此扩展程序后,您的新标签将包含来自网络的一些最新的励志或教育设计故事。 它提供了一种简洁的方式来密切关注您的利基市场中的最新消息。

所以,你去吧。 使用这些令人惊叹的网页设计师扩展程序为您的 Chrome 提供动力,并观察您的生产力飙升。 你如何分解你的设计过程,你使用什么扩展来完成什么任务? 我很想了解更多。
