当前位置: 首页 > 科技观察

改善UI细节和体验的10种常用方法

时间:2023-03-18 17:18:59 科技观察

如果你觉得自己的UI设计很无聊,想让它看起来更有趣,其实有很多比较常用的方法。这些方法大多并不复杂,稍微调整一下,总会有好的结果。如果你想尝试一下,试试我总结的这10种方法来赋予你的UI个性。1.为文案注入生命力无论是新用户引导流程还是加载信息,都能给用户带来乐趣。这就是为什么OldSpice和Geico等品牌下的产品具有如此广泛的知名度和影响力。通过在营销中引入幽默和个性化的元素,可以带来更好的广告效果和内容呈现。MailChimp的用户体验设计总监AarronWalter说:“我们发现,将幽默、复活节彩蛋、吉祥物和大量个人风格融入工作流程中,可以将原本平凡的任务变成人们期望的体验。想念它。”“加载中……”和“我们训练有素的猴子正在做……”的区别在于,后者更有活力。好的文案并不一定意味着它很幽默。当然,在不同的行业,对幽默的需求是不同的。一些网站和应用程序应该是严肃的,所以最好不要使用幽默的文案。在设计下一代产品时,考虑如何让用户体验更加幽默和吸引人。2.添加图标和表情添加表情和图标可以让你的设计更加一目了然使用emoji使其更具吸引力和友好性。这使您的UI更具视觉吸引力,简单有效。此外,需要注意两件事,一是不要使用太多,二是不要重新发明轮子或使用它“太创新了变化”。尽量好玩,不要烦人,“+”是添加,carticon是购物车,gearicon是设置,这些约定俗成的不要动。这是我从以下位置获得图标表情符号的地方:EmojioneIcons8BoxIconsFeatherMaterial3。通过插图使您的产品人性化您可以通过插图轻松传达复杂的信息。我们从小就接受过将语言和复杂视觉联系起来的训练。我们小时候看到的各种插画、童书,都是学习资料。在产品设计中加入插画,可以平衡界面,吸引用户注意力,让界面的功能和信息更容易理解。但更重要的一点是插图需要有明确的目的,可以作为内容的补充,而不是替代。插图应在不干扰操作的情况下提升用户体验,风格和界面应保持一致,不会显得格格不入。我一般拿到插画的地方是:哎哟!FreepikUndrawHumaans4。深色模式如果你现在正在开发的app有一个深色模式,对于像我这样常年生活在深色模式中的用户来说是一个福音。深色模式让眼睛更容易适应,所以你不会觉得一直盯着一个令人眼花缭乱的灯泡。深色模式和浅色模式在设计上并没有太多本质区别。无非就是修改整个配色方案,只是颜色配置需要根据规范仔细调整。我建议让用户决定是使用深色模式还是浅色模式。模式之间的切换可以给用户带来良好的体验,给用户更强的控制感。5.高品质的图片在APP中,图片和其他元素一样重要。您需要非常谨慎地选择高质量的图片,这样可以使UI和体验非常生动有趣,提升UI界面的整体效果。有很多地方可以找到高质量的图像,这里是我最喜欢的一些:UnsplashPexelsFreepikAdob??eStock6人们。错误状态的感知通常是负面的。但如果你能帮助用户解决他们的问题,你也可以把它变成一种有个性、有趣的积极体验。一直很喜欢谷歌浏览器“网络已断开”错误界面的设计。它提供了几乎所有必要的信息,包括如何修复网络的指导,以及一个被好评不断的小恐龙跑酷游戏!简单的设计是天才!我也喜欢Dribbble的404页面的设计。它很棒,因为它的设计非常周到,用户很快就会回头使用它。7.添加动效从动效进入设计过程到现在,它已经成为设计过程中不可或缺的一部分。无论是基于插图的动画效果,还是基于UI元素的微交互,动效无处不在。Dribbble上有很多动态。但对于用户来说,他们总是希望动效尽可能接近现实世界中的实际体验。物体应该按照通常的物理规则行事。喜欢缓和。对于球,我们对其施加力。踢它时,它会先加速再减速。这个过程是现实的。这些物理规则是动画的基础,也是现实的基础。Pincipled、XD等动画,InvisionStudio、AE、Lottie、Flinto等工具逐渐涌现,让设计师更好更快地制作动画效果。我更喜欢XD中的自动动画功能,它很直观,可以让我在投入大量时间和精力之前快速验证想法。我最近经常使用的另一个很棒的工具是Airbnb的Lottie。Lottie让我可以轻松地将任何AE转换为对网络更友好的SVG动画。与插图类似,动画应该是有目的的并且优先考虑体验而不是分散用户的注意力。如果你想做出系统的动效,不妨看看MaterialDesign提供的设计规范。8.使用微交互帮助用户关注细节。类似于动画,微交互可以给用户带来意想不到的微妙体验,让你在APP中感知真实世界的体验,微交互可以带来有效的即时反馈。在Medium中,拍手(点赞)这种微交互是非常典型的提升体验的案例。这和Youtube里的点赞完全不一样。在Youtube中,点赞只有简单的颜色变化,从灰色变为灰色。它是蓝色的,没有动画效果。这与两大平台的内容属性有直接关系:文字内容需要微交互来增强观感,而在视频平台上,这种微交互会淹没观众,分散用户注意力,需要弱化。9.结合图案和渐变图案和渐变是使不那么吸引人的内容更加引人注目和美观的有效方式。向图像或背景添加纹理、图案和渐变可以快速为平淡的设计增添趣味。当然,大家可以根据实际情况发挥自己的创意,但是一定要注意一点,那就是不要让它淹没了主人。10.善用阴影增加层次的深度。不要忘记视觉Z轴!阴影是增加设计深度的好方法,可以使设计在视觉上更具立体感。不同的元素有不同的深度,在视觉上,离用户越近的元素越重要,这种重要性通过阴影来呈现。但是仅仅因为它们“看起来不错”而使用阴影也是有问题的。在设计决策时,要有目的性。添加阴影时,记得过滤优先级,将阴影添加到最重要的部分。结论提升UI的细节感、视觉感、体验感的技巧有很多。有目标的设计。如果你有一个方向,总会有改进它的方法。