/我发现，用这3种方法增加细节，就连总监都不一定知道！
最新文章2024-02-18

我发现，用这3种方法增加细节，就连总监都不一定知道！

2022年第15篇文章，距离年底目标120篇还剩下105篇

功夫UX第 197 篇原创专业文章







老铁们记得预约我本周六晚八点的直播

俗话说，细节决定成败。美，也在于细节。你对细节的关注程度，决定了你是否优雅。

这句话一直影响着我，一个作品好坏、美感全在于细节，细节处理好了你的作品几乎成功一大半。
最近，我在玩一些app，又有了一些新的灵感，这些产品的设计细节非常值得我们学习其思路。

下面，就开始今天的分享。

1.通过“布局”构造差异化

设计风格五维度，形、色、质、字、版，最后版式就是我们今天要说的布局，如何通过布局可以构造差异化细节和创新？比如，我们可以营造真实场景体验感，沉浸式，层叠设计。
a.营造真实场景感布局

CokePlay

CokePlay设计中，在入口处营造了一种真实售货机场景，唤起用户线下购物真实体验。当点击进去后，差异化选择方式，趣味性交互，让我们大开眼界。当选中所需物品后，进入到三级页面，我们看到罗列的真实物品。


Millie

Millie产品，在书架陈列模拟现实世界中放书的情景；同时在界面中增加日历设计，营造时光流逝感，场景代入感很强。

b.多场景层叠布局


Soldout

文字图形与商品叠加，通过多场景贯穿重复布局策略，在Banner，商品卡片列表和详情页，展示页等，不断强化用户心智，又与竞品拉开设计上的差距。


Millie
Millie在banner位置，通过错层叠加布局设计，增强了画面的形式感。

2.通过“图形”DNA外化，塑造产品特征

巧用图形我们增加产品设计细节，我们这里说的图形是品牌特征符合。
通常我们运用较多的地方在图标上，还可以在banner、标签、界面中应用。如果能全场景应用，那是最理想的状态，下面我们来看看一些案例。

a.符号穿透打造图标系统

Taling
想要在图标上做好的细节设计，还是有一些难度，因为目前做得好的实在太少了，要么同质化，要么没记忆点。
Taling将logo中硬朗直角与斜角特征点提取，然后延续到整个图标系统中，算是比较有特色一套风格语言。

H.Point
H.Point设计，将品牌logo中的“点”元素提取应用到图标系统和界面导航设计中。这种处理手法需要克制，不然过多的点元素也会造成一些干扰。当然，我这里拿出来讲，是因为这种应用方式有意思。
b.符号穿透打造标签系统

Manta

Manta将logo中倾斜角度与圆角提取应用在标签中，与我们常规所见的规整的图形标签形成差异化设计。


netflix

美国的视频软件netflix，在标签系统行，提取logo清晰符号基因应用在设计上。

3.通过“动效”塑造产品细节

随着硬件越来越好，一些有细节质感的微动效，能在app上实现出来，通过动效的作用增强产品细节的同时，还能带来趣味性和可玩性，在某些情况下还起到引导作用。

a.营造场景感动效

‍


Laundrygo

Laundrygo在第二个Tab上，通过微弱动效变化营造出生活场景感，从早晨日出到晚上，这样的设计带入生活仪式感，有温度有情感。
b.产品内互动趣味动效

Laftel

通过重力感应，表情会随着旋转方向自由滑动，伴随着手机也会产生震动。


c.产品内拟人化动效


Kakao Webtoon

Kakao Webtoon在产品首页使用视差动效，再点击进入产品二级页面，通过拟人化的方式营造超级可爱的趣味动效，看了一遍还想看第二遍。


AudioClip

AudioClip当你点赞时，会出现一个卡通动画小人，高兴地跳了起来，场景很生动。



4.写在最后

如果说我们想在同质化竞争中脱颖而出，那么通过细节差异化创新值得我们一试。

例如今天说的，我们可通过品牌特征符号、差异化布局、微动效等方式，丰富产品细节设计，实现差异化创新突围。

虽然，有时候资源比较有限，无法实现一些好的效果，但是不能就此放弃。比如在做创新探索时候，是可以拿出你的全新idea，这时候其实就是靠日常的积累。

如何才能更快的成长，更快的系统化提升，更快的构建知识体系，更快的构建知识模型，这些我都经历过，请点击下方卡片，我来帮你！

一键三连，升职加薪↓↓

本文来自微信公众号“功夫体验设计”（ID：UX-Talk）。大作社经授权转载，该文观点仅代表作者本人，大作社平台仅提供信息存储空间服务。

TAGS:

相关文章