{{userData.name}}已认证

文章

关注

粉丝

￥{{role.user_data.money}}

您已完成今天任务的

Moonvy 月维，设计素材周刊 #019 期

UI
4月16日
编辑

Moonvy月维Moonvy 月维设计资源管理

设计资讯

Dalle-mini - 输入文字自动生成图像

之前介绍过革命性的 AI 图像生成工具 DallE 2，一般人现在还没法体验，但现在有了一个根据其论文打造的开源工具 Dalle mini，让大家都可以试一试，虽然和 DallE 2 比效果差很多，不过还是非常神奇。

实例配图内容为：“A painting of a fox sitting in a field at sunrise in the style of Claude Monet” (克劳德-莫奈风格的日出时分坐在田野中的狐狸画作)，你可以翻译工具把你想要的画面的描述翻译成英文，输入Dalle mini 等待一会就可以得到结果了。

https://huggingface.co/spaces/dalle-mini/dalle-mini

Sky Office 虚拟办公室

超级好玩，还提供「共享屏幕」「白板」「实时聊天」集成了很多办公需要的场景，像玩游戏一样在工作。

https://sky-office.co/

产品推荐

Macaron - 创建维护 Web 组件的开源 UI 设计工具

通过视觉的方式创建组件，将它们与任何框架或原始 HTML/JavaScript 一起使用。涉及到了部分代码知识，对于设计师上手难度颇高。

https://macaron-elements.com/

GitHub 色彩工具 Primer Prism

GitHub 的试验工具，使用调色工具，加速颜色主题的创建

暗模式不再是一个不错的功能。这是一种期待。然而，对于许多团队来说，实施暗模式仍然是一项艰巨的任务。

为深色界面创建调色板并不像反转颜色那么简单，如果您的团队计划多个主题，复杂性会增加。许多人发现自己使用了杂乱无章的颜色工具的组合，这可能是一种痛苦的体验。

GitHub 暗模式（于 2020 年 12 月在 GitHub Universe 上亮相）是反复试验、复制和粘贴以及在 Figma 文件（超过 370,000 层！）中来回反复的结果。

在推出深色模式几个月后，我们开始研究深色高对比度主题，以提供一个最大限度提高易读性的选项。在设计这个新主题时，我们着手通过构建一个实验工具来改进我们的工作流程，以解决我们在设计原始深色调色板时遇到的一些挑战。

我们称我们的实验色彩工具Primer Prism。

https://primer.style/prism/local/a1fd0d5b-da4a-4690-8841-f4b8e865572e/scale/fcf10168-0449-482e-b0ef-5ea6161c5f2c

Mesh - 渐变弥散生成器

提供了一些配色模板，在模板基础上可以自由的重新配色和调整控制点以及位置，支持导出 PNG 格式。

Figam 里有个相同功能的插件 Mesh gradients 和 Mesh Gradient

https://meshgradient.com/

Figma 插件 - 批量替换多个本文内容

框选多个图层，在一起编辑文本内容，修改更快、更容易，还提供搜索、查找和替换、制作编号列表...等功能

https://www.figma.com/community/plugin/1042878342391996546

值得读读

Figma 中新增的弹簧动画，运动背后的机制

https://www.figma.com/blog/how-we-built-spring-animations/

质量、刚度和阻尼

就像行星轨道或飞盘的飞行一样，弹簧动画可以分解为特定的公式，概述物体如何受到外力的影响。弹簧动画有三个主要变量：质量、刚度和阻尼。在我们继续之前，让我们定义所有三个：

质量： 无论大小，所有物理对象都有质量。物体的质量 (m) 越大，它就越重，加速所需的力也越大。（这两种现象是下式中“F”和“a”的来源。）力、质量和加速度之间的关系由牛顿公式定义：F = m * a

强度： 刚度是弹簧独有的特性。如果您以前拉过弹簧，您就会知道拉得越远，它的抵抗力就越强。胡克定律很好地总结了这一点，其中“k”是一个常数，表示弹簧的“刚度”程度：F = -k * x**

阻尼： 物理物体最终会因摩擦而停止。就像高速公路上的风或穿着袜子在铺有地毯的地板上打滑一样，物体移动得越快（下面等式中的“v”，“速度”的简写），它遇到的阻力就越大。（想想力量，但施加在相反的方向）。为了确定物体停止的速度，我们使用常数 b：F = -b * v

大厂项目复盘

收集阿里、腾讯、字节跳动、百度、京东、vivo、小米、58同城、滴滴等他们的项目复盘文章

https://www.yuque.com/weijin_is_wiki/ykf0s9

如何扩大您作为设计师的战略影响力

http://beforweb.com/node/1119

优先考虑您的目标，并使用它们来优化您的输出。

通过改变（以及当事情破裂时）设定正确的基调。

使用数据作为发现、优先排序和评估的工具。

确保每个人都在看你的长期地图——不仅仅是你。

设计小科普

对抗 JPEG 的「色带」

了解 JPEG 格式压缩的工作原理与解决办法

如果您曾经尝试将照片保存为 JPEG 格式，您可能知道 JPEG 看起来有多糟糕。这种格式数十年的统治导致大多数互联网用户对称为“JPEG 伪影”的效果过敏

毫无疑问，没有人愿意与其他人分享这样的烂摊子。如果你问我这张图片到底有什么问题，我可能会说它看起来非常接近原版：没有明显的颜色偏移，所有物体都是可区分的。但是，我想说有两个主要问题：

软渐变看起来像单独的块或带。这就是为什么它被称为色带。这在天空中尤其明显，但在地面上也可以看到。

尖锐物体（看屋顶）和其他微小元素周围存在寄生虫颜色渐变。这种效果称为振铃。

让我向你展示一些魔法。我想分别应用这些效果。

https://uploadcare.com/blog/fighting-jpeg-color-banding/