功能和视觉之间的平衡是关键。

编者按：“设计”让我们的生活更加赏心悦目。一起看看 2023 年最新的设计趋势有哪些。本文来自编译，希望对您有所启发。

图片来源：Medium

大家好，欢迎来到我最新的 UI 设计趋势指南，这已经是我写指南的第四年了，已经成为了我个人的一种传统。和以往一样，2023 年的报告也是以类似的方式准备的：经过深思熟虑，花了几周的时间进行全面观察，我收集了以下趋势中最值得注意的例子。

重要提示：99% 的示例都是真实产品。

有些趋势保留下来或演变成了更具体的东西。有些趋势则一去不复返了。你还会发现一些老趋势正在行业中卷土重来。

1. 动态设计

从左上到右下分别为：Estee Lauder, Apple, Duolingo, Wishes In Words, The Virtual Economy ,Wickret

动态设计已经变得非常庞大了，你到处都能看到它。从微交互到复杂的动画，UI 不再是一个静态的东西，用户希望它在视觉上“活起来”。

由于抖音、Instagram 和用户每天不断的活动，人们的注意力持续时间越来越短。有人猜测，我们现在的注意力水平就像金鱼一样，甚至比金鱼还低。

为了保持用户的参与性和好奇心，我们需要使用动态，并尝试在静态屏幕和图像中加入一些生命力，使它们更具有沉浸感。

如果你使用多邻国（Duolingo），可以清楚地看到他们最近的更新包括了更多的动画插图和屏幕过渡效果。大多数 UI 组件都是通过各种视觉效果与用户交互的。在用户进行操作时，屏幕上几乎总是会发生一些事情。

多邻国（Duolingo）的应用程序屏幕。在多邻国的最新版本中，这款应用几乎可以在各个层面上与你互动。

说到动态设计，不可能不提到视差效果。视差基本上是一组不同的图形层，在滚动时以不同的速度移动。这可以创造出一种非常迷人的、赏心悦目的效果，就好像内容有实际的深度一样，而实际上所有的东西都在一个维度上。

视差使用了一个简单的道理，即最近的元素比远处的元素移动得快。这正是现实生活中发生的事情，当你开车时，从车窗望向远处的山脉，就会产生这样的视差。

Midwam 使用GSAP库来创建他们的网站。

这些动画可能看起来真的很惊艳，当然，大多数都是使用 GSAP 这样的库在代码中完成的。然而，每个动画都需要先设计好，这样开发者才能重新制作。这就是设计师的用武之地。

我坚信，在不久的将来，动态设计将成为一种不可避免的设计技能，最好现在就开始学习。

2. 简洁设计

从左上到右下：Coinbase、Airbnb、Tran Mau Tri Tam、Squareblack、Foh&Boh、Revolut

多年来，我的设计风格不断演变，逐渐走向更简单、更简洁和更干净的风格。对每个设计师来说，这可能是一种自然的方式，但我很高兴在所有的趋势中，干净的极简设计是永远不会出错的。意识到这一点，既让我大开眼界，也让我感到欣慰。

每次我浏览不同的应用程序和网站时，都发现那些干净、简洁的应用程序看起来最令人愉快，也最专业。你不需要追随每一个潮流来创造伟大的现代数字产品。

受到一些流行趋势的启发是很好的，但你需要让自己的设计看起来有品位，并且经得起未来的考验。

Apple 网站：专注于产品功能的永恒、简约、简洁的 UI 设计之王。著名的苹果“Masonry grid”现在本身就是一种趋势。

3. 多色柔和渐变

从左上至右下：Sketch, LS Graphics, Winamp, Cosmos, Until, Stripe

极光渐变，抽象的渐变形式和形状，按钮上的渐变，卡片上的渐变，或者在背景中使用五颜六色和鲜艳的色彩，使其具有视差效果……这种趋势似乎仍然非常实用和强大。

极光渐变的例子。

你还会发现放在文本上的渐变，例如在标题中突出某个短语。

标题渐变的例子。从左至右：Apple，Vercel,

4. 高对比度/单色

高对比度/单色的例子。从左上到右下：Uber、Endel、revolt Business、Homey、Klarna、Dropbox

你可以在许多网站和应用上发现强烈的对比元素，有时甚至是整个部分，包括行业中最大的玩家。

我个人认为，这种趋势背后的原因是，当你滚动浏览界面时，强烈对比的元素不断闪现，可以刺激你的注意力。由于元素和文本的良好展示性，这也使界面非常容易访问，除非对比度太大，导致眼睛疲劳。

5. 黑暗未来主义/ 宇宙主义 UI

从左上到右下：GitHub, zently, Railway, Linear, concept AI, Create

事实上，越来越多的品牌正在将他们的产品和页面切换到黑暗版本。

我个人认为，黑色 UI 可能更容易吸引用户的注意力，因为它比典型的“白底”外观更不寻常，更有趣，并能创造出一种未来感，有时甚至呈现出一种“宇宙”氛围。

Linear 的网站就是暗黑UI的一个很好的例子

6. 材料仿真

从左上至右下：Solana, Letter, Thoughtlab, Youtube Music, Next.js，Mural

我们已经有了玻璃形态、粘土形态、金属形态等。我还注意到，看起来像水晶或珍珠的元素越来越流行。似乎对现实生活中材料的模仿是近年来的一个强劲趋势，而且不会很快结束。

这里要补充一个重要的观察结果，那就是玻璃形态趋势似乎正在上升。你会经常在许多网站上看到玻璃形态的效果，比如导航栏、按钮或装饰元素。

Letter 真的很喜欢水晶元素。另外，注意导航栏上强烈的玻璃形态效果。

7. 巨大的字体设计

从左上到右下：Apple、Heart Aerospace、Stand With Ukraine、Increase、Gumroad、Instagram

巨大的字体设计是当今非常明显的一个强劲趋势，通常会全屏显示或带有明显的动画。

图片来源：Heart Aerospace

无衬线的几何字体是不会消失的，它将永远是界面上安全、实用的选择。

我们现在有很多很棒的字体资源，从 Google Fonts 或 Font Share 这样的免费来源，到许多令人惊叹的优质字体家族，如 Gilroy、Circular Std、Mont、Axiforma、Nexa、Galano。我鼓励你考虑投资一些这样的专业字体，让自己的设计更上一层楼，这是值得的。

8. 感性设计

从左上到右下：Harbor, Beautiful, Vacation, Franky's, How We Feel, Express VPN

我把所有的野兽派设计、复古派、80-90 年代感、杂志/海报型设计都归为一类，贴上“感性设计”的标签。

尽管“感性设计”可以根据试图销售的产品或服务提供伟大的视觉目的，但它们通常是形式胜于功能。

与此同时，时不时地看到一些原创的、完全与众不同的东西是令人耳目一新的。

不过，一个严肃的问题是，它们真的适合 UI 设计吗？例如，许多决定转向野兽派设计的品牌都收到了非常负面的用户反馈。

Figma 和 Gumroad 是流行的例外，但这种风格并不适用于所有产品。很遗憾地说，像野兽派这样的风格对用户来说很少有功能性和吸引力。

The Verge 最近的重新设计就是一个很好的例子，在改变后，该网站每月的浏览量下降了近 550 万次。混乱的布局和极端的对比可能是罪魁祸首。

可以肯定地说，当涉及到数字产品时，功能和视觉之间的平衡是关键。

译者：Jane