设计素材周刊 020 期

🏆 产品推荐

在 Figma 里查看 PDF

Import PDF into Figma ，在 Figma 中插入任何 PDF，并且可以选择加入的页数。

应用程序图标生成器

上传图片，可以根据标准自动生成不同尺寸，下载即可，省去了手动调整尺寸和导出的复杂流程。

https://appicon.co/#app-icon

平滑 SVG 路径变化的差值

用于在 SVG 路径之间进行变形。在相同 SVG 路径的 X 变体之间平滑变形（即相同的命令，不同的值）。

https://github.com/Minibrams/svg-path-morph

📖 值得读读

2022年 LOGO 趋势报告

我最近被要求回顾过去 20 年的 LogoLounge 趋势报告。它如何塑造了我的设计方式？对我个人有什么影响？我想到了一个我经常使用但其他人很少理解的短语：“知道你是如何到达那里的，比知道你在哪里更重要。”

显然，知道自己在哪里很重要。我并不是建议每个人都迷路（尽管有时这是创作过程的必要部分）。我要说的是，在 20 年和 380,000 个标志之后，它仍然和以往一样重要。这。工作。一个伟大的标志超越了趋势。我说的是核心定义，拉丁词根：trans（跨越）+ scandere（攀登）。

https://www.logolounge.com/articles/2022-logo-trend-report

你如果想看2021、2020、2019、2018等之前的 LOGO 趋势，可以将链接里的「2022」修改为目标年份即可。

色彩无障碍设计（Color Accessibility）之「对比度」的探索

解读无障碍设计的原因和目的

推荐人：leeC

「Color Accessibility」是什么？

WCAG 2.0 （Web Content Accessibility Guideline，Web内容无障碍指南）就是为了帮助设计师创造良好用户体验的。

WCAG 中提到的主要的四种类型的残疾是：

视力障碍（Visual impairments）

听力障碍（Hearing impairments）

运动障碍（Motor impairments）

智力障碍（Intellectual disabilities）

基于此，提出了 「POUR无障碍原则」 ：

易于感知的（Perceivable）

便于操作（Operable）

容易理解的（Understandable）

稳定耐用的（Robust）

颜色的选择属于「易于感知的」无障碍设计范畴。也就是说，网站/App 的内容应该很容易被看到——尤其是文字和图像，应该有足够高的色彩对比度（high color contrast ratio），使之很容易地从背景中被辨识出来。

https://zhuanlan.zhihu.com/p/29359260?from_voters_page=true

🔬 设计小科普

Figma 批量重命名里的「正则表达式」

正则表达式是对字符串（包括普通字符（例如，a 到z 之间的字母）和特殊字符（称为“元字符”））操作的一种逻辑公式，就是用事先定义好的一些特定字符及这些特定字符的组合，组成一个“规则字符串”，这个“规则字符串”用来表达对字符串的一种过滤逻辑。正则表达式是一种文本模式，该模式描述在搜索文本时要匹配的一个或多个字符串。

比如更改名称的语法（例如，将“Icon_003”更改为“003_Icon”），并且可以批量方便地完成。

SVG 路径数据是如何工作的

路径数据由 6 种类型的指令组成，告诉您的计算机如何绘制形状：

MoveTo

LineTo

三次贝塞尔曲线

二次贝塞尔曲线

圆弧曲线

闭合路径

这些指令中的每一个都使用字母表中的一个字母作为命令，后面的所有数字都是传递给它的参数。

https://typefully.com/DanHollick/wujrCCG

🎊 设计素材

超级全的图标库

是个图标库集合，也是通用图标框架。FontAwesome、Material Design Icons、DashIcons、Feather Icons、EmojiOne、Noto Emoji 和许多其他开源图标集（100 多个图标集、100,000 多个图标）。图标支持在线修改颜色、尺寸、旋转等参数，设计师复制 SVG 到设计工具里粘贴即可。

https://icon-sets.iconify.design/