用这3种方法增加设计细节.docx

俗话说，细节决定成败。美，也在于细节。你对细节的关注程度，决定了你是否优雅。个作品好坏、美感全在于细节，细节处理好了你的作品几乎成功一大半。1.通过“布局”构造差异化设计风格五维度，形、色、质、字、版，最后版式就是我们今天要说的布局，如何通过布局可以构造差异化细节和创新？比如，我们可以营造真实场景体验感，沉浸式，层叠设计。a.营造真实场景感布局010203CokePIayCokePlay设计中，在入口处营造了一种真实售货机场景，唤起用户线下购物真实体验。当点击进去后，差异化选择方式，趣味性交互，让我们大开眼界。当选中所需物品后，进入到三级页面，我们看到罗列的真实物品Om><lleIQlUlLq丽0e29U *MillieMillie产品，在书架陈列模拟现实世界中放书的情景；同时在界面中增加日历设计，营造时光流逝感，场景代入感很强。b.多场景层叠布局文字图形与商品叠加，通过多场景贯穿重复布局策略，在Banner,商品卡片列表和详情页，展示页等，不断强化用户心智，又与竞品拉开设计上的差距。IIWAMlkNOWSiqsw-Ma2平包否3I3平知!32雪Nq *R8彗台MillieMillie在banner位置，通过错层叠加布局设计，增强了画面的形式感。2通过“图形DNA外化，塑造产品特征巧用图形我们增加产品设计细节，我们这里说的图形是品牌特征符合。通常我们运用较多的地方在图标上，还可以在banner、标签、界面中应用如果能全场景应用，那是最理想的状态，下面我们来看看一些案例。a符号穿透打造图标系统0OtfsQ*S2 wee想要在图标上做好的细节设计，还是有一些难度，因为目前做得好的实在太少了，要么同质化，要么没记忆点。Taling将logo中硬朗直角与斜角特征点提取，然后延续到整个图标系统中，算是比较有特色一套风格语言。SM M S8H.PointH.Point设计，将品牌logo中的“点”元素提取应用到图标系统和界面导航设计中。这种处理手法需要克制，不然过多的点元素也会造成一些干扰。当然，我这里拿出来讲，是因为这种应用方式有意思。b符号穿透打造标签系统MantaManta将logo中倾斜角度与圆角提取应用在标签中，与我们常规所见的规整的图形标签形成差异化设计。netflix美国的视频软件netflix,在标签系统行，提取IogO清晰符号基因应用在设计上。3.通过“动效”塑造产品细节随着硬件越来越好，一些有细节质感的微动效，能在app上实现出来，通过动效的作用增强产品细节的同时，还能带来趣味性和可玩性，在某些情况下还起到引导作用。a营造场景感动效nlMHl公力aLQ.gfe¾iQQQ空旨Hop岂ILMS今刁N普西电勘草以Sg¾o境台程品!G(B同2BdmUOgUMYLaundrygoLaUndrygo在第二个Tab上，通过微弱动效变化营造出生活场景感，从早晨日出到晚上，这样的设计带入生活仪式感，有温度有情感。b产品内互动趣味动效13：292022.02.202Tonygg，显2目己I早2!XI>TonytiOl¾Se>S0fi则是.里M旨SfOi效Hla。公号，。®33x2包OKLaftel通过重力感应，表情会随着旋转方向自由滑动，伴随着手机也会产生震动。20tf2vseuejaexRo:维fi¾lfi.金升世2O.OOO.O型Olfiqitfll.600.0flW12VOIWc产品内拟人化动效*ttSl用玛奇匀三siQDHSS12na旨（Hg开Al!0iWlflIOo州N+503IIAlKakaoWebtoonKakaoWebtoon在产品首页使用视差动效，再点击进入产品二级页面,通过拟人化的方式营造超级可爱的趣味功效，看了一遍还想看第二遍。10Clips手乙圳二旦10叫干君，号冒Q3巨ft?不社2C2fifJO1 7图 sol ¾e电力 fiU&fi ±7lLQ.Otq &N 曼却处q%, XIS §2 7Wfi!Ptoy AllSPicWP IX3*Jjxesa,0tSM7!3daysago9nw»>2.2KQ28aKMvs引入Iof人腐Sflassv3M2HartTMi4daysago97min>790。2op82<<aft!SOTTN方3«,flbKt<fl2暂!°*snKBSS2*gAudioCIipAUdiOeIiP当你点赞时，会出现一个卡通动画小人，高兴地跳了起来，场景很生动。