网络上充斥着各种火爆的网站,以及数量相当或更多的才华横溢的设计师和开发者,他们共同创造了这些网站。网络就是这样令人惊叹,它鼓励这种创造力。
尽管如此,我仍然对某些特征如何出现在各种事物中感到惊讶。我的意思是,这很合理。我们许多人使用相同的 UI 框架,并从我们欣赏的网站中汲取灵感。但偶尔,我的目光会开始捕捉到时代精神以及随之而来的共性。
最新的趋势是什么?Blob 形状。这是一种有趣的点缀,可以增添一丝风情,特别是对于需要一抹色彩或引人注目的焦点来引导视线从一个地方转移到另一个地方的扁平化设计而言。我确信您已经见过它了。我花了一周时间收集了我在浏览过程中遇到的使用 Blob 形状的网站的屏幕截图。我当然不是在刻意寻找这些示例,它们只是在我日常浏览中突然出现。
如果您觉得我在批评某些人,我深感抱歉,因为那并非我的本意。我实际上非常喜欢这个概念——事实上,我正在考虑将它应用到我的一个项目中!图库中的一些示例简直美不胜收。
在多次发现这些 Blob 形状后,我开始注意到在使用它们时需要考虑的一些因素。例如
- 注意文本位于 Blob 上方时的对比度。有很多情况下,文档背景是白色的,而 Blob 是深色的。如果文本穿过它们,将很难找到符合 WCAG 2.1 AA 可读性标准 的字体颜色。
- 混合和匹配颜色时要谨慎。在卡片组件后面放置一个热粉色 Blob 没什么大不了,但如果你添加黄色、橙色和其他鲜艳的颜色与之并排,那么设计将开始分散注意力,掩盖内容。此外,五彩缤纷的 Blob 形状会引发可访问性问题。点缀就是点缀:一种微妙而有效的美感。
- Blob 不仅适用于颜色。我看到的一些最有趣的示例将图像裁剪成有趣的形状。我们可以将图像直接嵌入 SVG 中,然后用路径对其进行蒙版,这真是太酷了。
- Blob 也不仅适用于背景。您注意到 Topcoder 网站 的屏幕截图了吗?它们将 Blob 用作标签,非常时尚酷炫。
所有这些都让我思考,今天的网站将如何被明天的开发者看待。还记得大约 15 年前,许多网站采用 Apple 的反光图像吗?我可能仍然保留了一些 Photoshop 的肌肉记忆,因为它多次复制了这种效果。

拟物化、斜面、动画 GIF 背景、长阴影、英雄、渐变、散景背景……所有这些以及许多其他视觉效果都曾风靡一时。或许 Blob 将来会加入这个行列。或许它们在那之后会再次流行起来。谁知道呢!我觉得回顾过去 30 年激励我们的事物,并想象我们今天所做的事情将如何在时间的长河中被审视,这很有意思。
如果能看到其他 Blob 形状的示例会很棒——如果您有,请分享出来!
(恕我直言,我不认为这是一种新的趋势,我甚至可以说它已经被滥用了——背景颜色 Blob 的出现伴随着 [Slack(?) 网站重新设计] 浅色背景 + 低分辨率插图人物 + 线条 + 艺术 + 植物。也就是说……)
一个很棒的 Blob 工具,值得分享:https://www.blobmaker.app/
嗨 Geoff,还有其他趋势吗?还是一次只展示一个?谢谢。
哦,可能吧。这个趋势只是引起了我的注意,它让我思考了网页设计是如何随着时间的推移而发展的。
很棒的内容,想出真正原创的想法很难。
我想我们许多人也被我们在合理时间内能够实现的目标以及我们可用的技能所限制。
有时能够将现代风格改造成过去的设计会很棒。
无论如何,感谢您的见解。
很高兴知道 Geoff 正在关注。
Charles。
仙人掌:https://cactus.app
这让我感同身受,我们最近推出了一个新网站(https://timetastic.co.uk),它也是以 Blob 为中心的。直到有人指出,我才注意到这种趋势!
不过,它比在表格布局中分割 JPEG 图像以使圆角起作用要好。我想知道下一个趋势会是什么。
好文章,非常清晰。我的客户喜欢 Blob 形状,因为它们可以为朴素的背景增添色彩和光彩。您可以无限地玩弄它们的形状、颜色和大小。
我的设计师最近给我了一个背景,它要么不是 Blob,要么是很多 Blob:油漆飞溅。我想,如果一个 Blob 很好,3000 个会更好,对吧?
他们还坚持必须保留为 SVG 格式,所以我不得不费尽心思将其压缩到一个体面的大小。
哈哈。这就像 2000 年代初期到中期流行的元球体徽标:P