资深设计师对当代产品外观设计基本设计趋势的研判

发布时间:2021-08-31 02:29:17 作者:admin 494
资深设计师对当代产品外观设计基本设计趋势的研判
 
【文摘】这种趋势让你,一开始就很容易被这种强烈而引人注目的视觉所吸引。这些例子中的每一个都有一个额外的元素,动画不断增加人脸的兴趣。
 
  每个月,我们都会发布一份我们在网上看到的三大趋势的总结。有时,它们是旧的最爱,经历复兴,有时,它们是新的想法,只是建立动力。如此注重可读性和可访问性,这种趋势可能有点令人惊讶。设计师正在尝试难以阅读的英雄文本元素。
 
  这并不是说文本元素不可读;你只需要停下来想想他们。
  这项技术为什么有效?在这种情况下,文本更多的是一种艺术元素。虽然这些词很有意义,但它们吸引我们的注意力是因为它们的视觉元素。文字是为了让你看起来更长。
 
  MetaVie  w采用了分屏设计,其中的文本元素可以改变分屏的颜色。左边的颜色比较柔和,比较透明,而右边的颜色比较大胆,缺乏透明度。这些词是可读的,但你肯定需要额外的几秒钟来处理它们。

 
  完美包括两层文字。一个大的前景层会提醒你在屏幕上缺少字母来填充单词。它的背后是一个苍白、柔和的背景层,文字已经转了90度,这也让你仔细看资料。
 
  一家创意公司将轮廓字体与动画和渐变描边混合在一起。虽然这可能是这组例子中最容易阅读的元素,但它清楚地显示了这种设计是如何迫使你慢慢阅读的。你的大脑处理“让我们做吧”的速度非常快,理解短语中的最后一个词几乎需要整个动画时间。
  很难找到一种更直接的方式来连接用户,而不是一个吸引眼球的图像。用一张脸来传达情感,建立更清晰的联系。
 
  用令人惊叹的人物特写来设计你脸上的趋势。视觉创造了直接的焦点和影响力。用户在开始处理屏幕上的单词或其他信息之前会有所感觉。
 
  这种趋势的优势在于,它旨在将用户与内容联系起来。
 
  在下面的每个例子中,你可能会发现很难把目光移开。你先看屏幕上的脸,然后用类似库莉的创意设计你甚至可以笑一点。这引起了好奇心。你开始扫描设计的其余部分,找出它是关于什么的。
 
  这种趋势让你,一开始就很容易被这种强烈而引人注目的视觉所吸引。这些例子中的每一个都有一个额外的元素,动画不断增加人脸的兴趣。
 
  库莉的创意包括很多人做各种各样的脸,穆阿克斯有一个滚动的图像(虽然照片中的图像是你脸上最多的),罗布林在人物转头直接看用户时使用浮躁的动画。3.左侧的所有文本
 
  有一段时间,英雄标题的趋势是在屏幕中间使用大文本。你仍然会在设计中看到很多这样的东西。(这是一个永不过时的概念。)开始获得steam的是一个更加片面的布局,所有的文字都在屏幕的左侧,图像和图形在右侧。人们很容易称之为“左翼对齐",”,但不仅仅如此。
 
  当适当加权时,这种布局会产生不同类型的对称。屏幕左右两边的元素需要感觉重量相等,这样眼睛才能很好的传递信息。
  响应性设计确实推动了这一趋势。(请访问移动版克里克和一些在下面的设计,你可以看到它的功能。
  文本和图像元素叠加在较小的屏幕上。最左边的元素——这里的文本——在小屏幕上浮动到设计的顶部。这为在小型设备上传递消息提供了出色的显示,同时保持了桌面用户体验的一致外观和设计。
  所有这些左撇子角色之所以真的管用,是因为他们不扁平。每个网站都使用惊人的字体和颜色来充分利用容易无聊的东西。
  暗界面下需要注意的细节
  习惯了光接口的设计?本文将为大家展示深色界面的设计,谈谈深色界面下的设计细节,让你设计的深色界面在常见的浅色界面下脱颖而出,展现你的个性。
 
  去年在WWDC,苹果发布了提供黑暗模式的macOS  Mojave系统。相信一些小伙伴已经开始体验了。
 
  至于什么是黑暗模式?简单来说,就是macOS  Mojave系统全新的界面外观,将所有UI变成黑色或深色模式。它强调以内容为核心,让用户更加关注内容本身,这对创意专业人士很有帮助。同时也适合每一个想要专心完成工作任务的用户,所以无论是想专注写文章还是看小说,暗黑模式都会是不错的选择。
 
  这也是这个主题的由来。关于暗界面的设计,暗界面有明显的优缺点,不具有普适性。合理的设计可以凸显高端、优雅、奢华的氛围;相反,可能会破坏你在页面上精心设计的所有UI,甚至影响使用效率,打折体验上大。
 
  以下是我在设计网易邮箱大师Mac版的暗黑模式时,在视觉上需要注意的一些小细节,希望在设计暗黑相关界面时,能对大家有所帮助或启发。
 
  在深色界面,尽量不要用纯白色作为文字颜色。对于黑底白字的形式,白字更容易吸引眼球,视觉刺激更强。但是,强烈的文字会同时带来视觉疲劳和不舒服的阅读体验,甚至极端情况下的对比会造成白色眩光,不利于文字的识别。
 
  大多数研究表明,暗界面的可读性比亮界面稍差,因此适当增加段落间距和行高是增强暗界面下文本可读性的重要途径。
 
  在暗界面下,无衬线字体比衬线字体更易读,但在暗界面下,衬线字体比无衬线字体更优雅,前提是字体需要放大并留空。
  我们应该仔细观察图标,进行艺术反转,这样它才能在明暗界面都很好地传达意思。例如,下图中的笑脸图标可能只能在深色界面下改变颜色。
 
  乍一看似乎没什么大问题,但仔细观察就会发现,图标在浅色界面下是以边框的形式设计的,中间是空白的。这是因为白色背景可以用来更好地展示它的形状;但是,如果也放在暗界面下,它的形状和体积感似乎会消失,变得有点奇怪。这时,我们应该反转它,加强它的形状和体积(如下所示)。
 
  另一个例子是下面的图标。
 
  当然,有时候也可以根据实际情况来衡量是否反转图标,比如考虑图标的风格和统一性。 
 
  当点击按钮时,一般的方式是加深按钮的背景(下图左图),但在暗界面下也是采用这种方式,会发现被点击状态下的按钮颜色更接近背景,模糊了按钮的边框和轮廓(下图右)
 
  因此,在深色界面,一般建议突出背景色(如下图右侧所示)。
 
  分割线也是我们设计中常用的元素之一,用于创建内容之间的视觉分割。但是在深色界面,如果简单反转,在黑色背景上用白线进行视觉分割,效果就不那么理想了。我们可以看一个例子。下图是写信界面,直接反转分割线的颜色,用白线分割。会觉得台词太多,很烦。
 
  那么,如果我们都用黑线进行分割,就会觉得枯燥,不够精炼。
 
  所以我觉得不同区域之间可以用黑线进行分割,同一区域之间可以用弱白线进行区分,让画面更加细腻,意思清晰,认知简单。
  与光界面相比,暗界面下的颜色应该更亮,更饱和。例如,看看下面邮件列表的焦点颜色。同样的蓝色在深色界面下显得有点白;优化后的蓝色更加纯净,与深色界面更加匹配。另一个例子是按钮的颜色。
 
  深色背景用颜色装饰,可以是品牌色,也可以是其他颜色,这样会让设计看起来更加优雅高级。
 
  从色彩心理来看,黑色会传达出高端、拘谨、名气和力量的感觉,这也是为什么很多大品牌会围绕黑色进行视觉设计,以黑白为主色调的原因。
 
  自然界没有100%的黑色。我们在日常生活中看到黑色其实就是深灰色。如果在设计中使用纯黑色,会显得不自然。因为纯黑可以压倒一切,压倒一切其他元素。
 
  在暗光界面下,更要注重视觉层面,各个版块之间的对比要清晰鲜明,否则用户很容易迷失在布局中,造成不好的体验。
  深色界面给人一种沉重的感觉,拥挤的布局会加剧这种感觉,所以我们应该在深色界面下使用空白或“黑色空间”,以平衡布局,使元素呈现得更清晰,从而吸引用户的注意力。
 
  以上就是我在设计深色界面时梳理的小细节。有一些点在浅色界面下也适用,但在设计深色界面时,要把握好“度”来弥补深色界面的不足,让深色界面在普通浅色界面下脱颖而出,展现其个性仅仅因为某样东西受欢迎并不总是意味着设计“好”。不代表不好。流行设计只展示新技术和视觉元素,出现的频率更高
 
文章中插图照片材料和相关内容来自网络,如有侵权请告知,我们马上删除!