2017年最大的网页设计趋势是什么,2018年会有多大?今年即将结束,我们要求设计师和工作室负责人分享他们的观点,观点和预测。
my sunshine张杰当前浏览器暂不支持播放
正如我们为您带来2018年的巨大平面设计趋势一样,这不是跟随创意群体:这是关于评估行业现在的位置。所以,不管你是否遵循这些趋势,知道它们是什么是有用的。
01.网页动画
互动设计师chris gannon表示:“动画可以使创意和界面更容易理解。“在每个人都匆忙,时间短的世界里,动画可以在短时间内传达复杂的想法,同时又可以吸引和传达信息。”
lightful的高级数字设计师bruno la versa 对此表示赞同。他说:“故事性和个性化是新老品牌为了吸引用户的注意力而开展的工作,动画在这方面开始发挥更大的作用。la versa表示:“动画已经显示并将继续展现品牌在我们的数字世界中的实力,给品牌带来强大的个性,使其变得更加静态和更具活力。
那么2018年我们将会看到更多具体的动画呢?动画标识是一个明显的趋势,也是一个给公司提供进一步提升品牌的大好机会。但是,正确的做法是一项重大的责任。gannon解释说:“这是一个在狭小空间中的公司的视觉表现,如果它是一个很好的标志,它的意义非常重大。”gannon解释说。
我们也看到了gif的回归- 部分归功于基本的动画gif几乎可以被任何东西读取的事实。“看起来这个世界已经准备好了(而且的确在大声疾呼)所有的动画,无论是猫的喜剧圈掉下来,还是给电子邮件签名中的标志增添一丝乐趣。”创始人李·法斯卡尼(lee fasciani)说。 领土项目。
那么是什么造成了这种动画的热情呢?那么现在设计师可以使用的创作工具的数量就起了很大的作用。gannon说:“这些工具中的很多都是针对设计者,开发者或其他非动画设计者的,并且具有旨在简化构建它们的复杂性的接口。
“这给越来越多的人开放了游戏场,并允许他们进行动画实验,这是非常巨大的,因为历史上非动画师已经避开了动画部分的项目。
数字创意机构dare的创意总监mireia lopez 也指出了这些工具如何帮助模糊设计和开发之间的界限。她说:“我们已经看到设计团队开始动画,原型设计和学习整洁的编码,以便使用更复杂的原型工具 来向客户传达概念,并向开发人员解释数字旅程。
如果将这些工具的可用性与浏览器的改进结合起来,很容易看出为什么2018年的动画将会变得更大。即使在像svg和手机这样的矢量格式中,今天的浏览器也超过60fps。
与任何趋势一样,重要的是不要为了包括它而包括它 - 这对你的项目来说是正确的。gannon警告说:“我们都有责任让观众选择何时何时不使用动画。
“这是否会增强或以其他方式为经验做出积极的贡献?当客户接近我说他们想要”在我们的应用程序中喷洒动画“时,我的心就会沉沦。将动画设计成动画设计很少结束,因为动画没有任何目的而不是撩拨。“
但是没有什么可争辩的 - 当它做得很好的时候,动画可以把一个好的项目变成一个很好的项目。为了顺应潮流,请查看我们的5个步骤来掌握chris gannon的网页动画和10个精彩的网页动画。
02.更冒险的颜色
“在过去的一年中,我们已经看到了整个数字化平台所使用,在使用大胆的色彩增加了,”詹姆斯指出bearne,创意总监kagool。designstudio为英超联赛2016/2017赛季推出的新品牌计划就是一个很好的例子。
“从以前的身份信心出发,醒目的视觉处理并没有停止在网站或应用程序,它与广告牌,社交媒体和更多的咆哮声。
bearne预测,这个数字在2018年将不会放缓。“借助khroma等新工具,我们可以帮助我们找到使用色彩的更有趣的方式,似乎我们可能会看到更多的设计师探索如何使用色彩来提供卓越的体验。
“有趣的是,如何将颜色与定制和个性化一起使用,为消费者创造出真正独特的体验,同时勾选几个盒子。”
03.有创意的排版
99designs的内容战略高级经理kelly morr说,在眼球战中,排版是一个强大的武器,今年它在网络上的使用已经扩大了。“印刷术是强大的,越大越好。所以,当像helvetica这样新奇怪的无衬线风格保持流行的时候,设计师们正在分化,转向可用的各种字体。“
她预测,2018年将看到衬线的回报,以及越来越多的网站配对serif和sans-serif字体(在ge执行精美)创建一个动态的用户体验。
设备分辨率越来越高,放大了易读性的事实也为自定义字体的上升打开了大门。“设计师们正在选择不仅个性强调而且个性十足的排版。所有这一切,再加上超大字体所带来的戏剧性,表明2018年将不会是微妙的,我们可以期待看到大胆的趋势继续发展。
hyped marketing的工作室经理gee guntrip发现的另一种类型相关趋势是排版剪裁。 她说:“这项技术使用了一块颜色,而不是通过清晰的字体显示静止或移动的图像。“选择正确的字体并限制字母数量对于这项工作至关重要。
“举个例子,丹伯里做得非常好,有一个明亮的文字抠图,吸引了用户对视频的注意。comedie francaise使用文本悬停的排版效果。并通过信件培育数字展示视频。“
04.数据讲故事
ito world高级数据可视化设计经理craig taylor说:“2017年是设计的好年头。“我们目睹了动画可视化的热潮,并从3d角度看到了对数据表示的兴趣。但是,如果这些数据无法消化并最终可用,那么这个数据有什么用呢?
输入泰勒所说的信息讲故事者。他解释说:“现在,人们非常重视通过设计进行有效的讲故事,将复杂的信息尽可能地简单和有趣地传达给不同的观众。“设计师们正在寻找新的定制作品 - 老式的柔和的调色板,以色彩鲜明的过渡和极简而大胆的排版结合在一起。
那么2018年的信息设计是什么呢?泰勒表示:“更好地利用新技术无疑将会增加使用动画作为讲故事手段的设计师人数。
“随着ar和vr技术的进步,虚拟模型的模拟研究的前景开始引人入胜,所以我们必须牢记信息和数据是我们所做的核心。如果我们做到了这一点,那么数据科学和设计的重叠领域将会使数据可视化的信息量越来越大,扎根和清晰。
lee fasciani同意ar和vr有更多的提供。他说:“技术使我们能够更容易地将我们的真实世界与我们基于屏幕的世界混合在一起。“我们正在从不断增加的视频向数字体验添加视频的愿望。不久之前,它们就不可能实现的深度和丰富性。
“混杂的现实将我们牢牢地融入到'新'中,大型科技公司致力于创新ar,未来的设计将需要从四个方面考虑我们的世界,我们看到了流行游戏和混合现实的开始功能应用程序,如宜家广场“。
对于希望开始探索更简单的数据可视化的初学者来说,有很多新的工具可用。数据可视化专家mike brondbjerg表示:“像d3.js这样的图书馆非常棒,但是对于非开发者来说可能会有点吓人。“但是现在有很多平台可以导入,可视化和托管你的数据项目,像datawrapper这样的平台可以很容易地生成一系列的标准图表,而flourish使用新闻,讲故事式的可视化方式来做很棒的事情。
但是,所有这些创新都必须谨慎。brondbjerg提供了一个警告:“在假新闻的时代,高质量的数据也意味着清晰,透明和可靠。
05.设计工具之间的标准化
在2017年,如果没有invision,adobe xd,figma,axure,marvel,vectr等新的应用程序,工具或功能,似乎不是一天过去了。这包括sketch,其开放文件格式更新,草图43,一直是一个真正的游戏改变者。(您可以在本指南中了解更多信息。)
bruno la versa说:“我们只是说,如果你还在使用photoshop进行ui设计,那么你可能需要看看周围的环境。“2017年是新设计工具的一年:figma,webflow,invision studio等等。设计工具的激增突出了设计如何成为企业运营的核心要素。“
然而,bearne指出,这种趋势确实对机构构成了特别的挑战。“2017年已经出现了大量的工具竞争,希望成为行业的”选择工具“,但同时,产品的洪水已经变得令人沮丧,因为所有人都声称辜负了巨大的期望。
“这给机构间的工作带来了一个问题,在这个问题上,团队有不同的流程,因为每个人都经过测试,发现它是否可以代替sketch。市场反过来就饱含选择权,但对如何提高效率却没有什么指导。
“invision studio的推出将于2018年1月开始 - 将会很有趣,我们将看看它是否可以使用其协作平台最终为设计过程带来标准化。如果invision和外观一样好,sketch会发生什么?photoshop的生存斗争终于结束了吗?“
要了解更多信息,请阅读我们的30后网页设计工具,以加快2018年的工作流程。
06.平面设计2.0
平面设计并没有死亡,但在2018年,它肯定要学会适应保持相关性,morr认为。“这种新的,所谓的平面2.0或半平面设计,依赖于增加其先前禁欲身份的细微差别和深度。这是怎么回事?沉迷于一些设计禁忌:渐变和阴影。但是别担心,只是适度而已。“
自2007年以来,渐变变成了公司powerpoint演示文稿,00年代网页标题和标注日期徽标设计的图像。“但是在2018年,他们回来了,虽然进化了,”morr继续说道。“渐变现在摇摆的活力,更新颜色调色板和更柔和,更微妙的过渡。”
平面设计已经对instagram,stripe和苹果的ios图标等品牌产生影响,并在dropbox和mastercard等公司的高调重新设计中扮演主角。
“由于网络浏览器功能的进展,我们也看到了阴影的复苏,像渐变一样,阴影被搁置,以支持极简主义和2d设计,现实主义和skeuomorphism仍然没有,但在2018年设计师将进行更多的尝试,更多的是在工作中更新,柔和,风格化的阴影。“
她举例说明了scale网站。她解释说:“界面的布局非常简单,但具有柔和,过饱和的梯度,并大量使用基于阴影的微相互作用。“不仅许多可点击的按钮与延长的阴影一起强调,而且阴影也强调媒体并分解页面。深度有助于确定视觉层次结构,并可指向用户在屏幕上输入字段和调用操作。“
平面设计是彻底背离了00s的skeuomorphism和hyperreality,但摆动摆动太多?“在2018年,我们将继续朝着两全其美的方向发展,”morr认为,“巧妙地重新引入阴影和渐变可以增加功能和美感。”
07.俏皮的例证
2017年,我们在网站上看到了更多的插图,这不是巧合。morr说:“品牌想要脱颖而出,插图是将个性注入网站的绝佳方式。
“他们在视觉上不妨碍功能性和简单性; 插图进入无限的形状,大小,风格,是一个动态的元素,在2018年及以后的期待。我们正在学习,不要以简单的用户体验的名义来忽略游戏性。“
不过,这个趋势不仅仅是异想天开。“插图可以是非常实际的提供或解释信息的方式。没有人想要一个无聊的网站,而定制的图画是一种可以让生活变得枯燥无味的人情味。
“市场是饱和的,有竞争力的,网站设计需要在个性和功能之间取得平衡;插图是展示你是谁的完美方式,只要看看funemployed.life即可。
08. ai的演变
人工智能不再是科幻的一个问题。人工智能已经通过诸如会话界面(chatbots)等技术进入主流网页设计。事实上,根据ebay产品设计师elaine lee的说法,您可能已经在日常工作中使用ai,甚至不知道它。
正如她在这篇文章中解释的那样,所谓的“人造窄智能”(ani)已经很难为google home和苹果的siri等语音助手提供支持。它还运行亚马逊,spotify和netflix等推荐技术,更不用说智能家居设备,自驾车和聊天机器了。
manifesto公司首席执行官兼创始人jim bowes说:“随着人们越来越习惯于与机器人互动,我们看到了设计中使用会话界面的兴起。“展望未来,机器学习和人工智能将被引入到我们在未来几年与之交互的许多系统中。
“作为一种媒介,设计将以多种方式适应这一点,”他预测道。“在某些情况下,它的目标是展示人工智能,有时候设计会使ai看起来很自然,看不见。我想我们会看到大量的设计,试图展示更大的智慧,而实际上并没有真正的ai被使用。这通常是通过更好地利用数字旅程的背景来实现的。“
如果您想了解如何创建自己的聊天机器人,请查看我们的如何构建聊天机器人界面帖子,如何设计聊天机器人体验技巧以及这5个最重要的聊天机器人学习资源。
09.不对称的布局
2010年的响应式设计运动为网页设计带来了革命性的变化,使设计人员能够搭建适合不同设备的网站。bearne说:“今年,我们看到越来越多的设计违背了响应式设计的限制,试图更具”创造性“。
“你几乎可以听到客户的反馈,说:”能不能那么四分五裂?“设计师回应道。”新技术意味着2017年,传统的网页设计规则正在左右分化。
但是,贝恩表示,趋势正在谨慎接近。他指出:“在不对称情况下推动限制的设计在2015年确实出现了。“在那一年,spotify使用了不对称的设计来提供”音乐年“。在这种情况下,感觉是正确的,并增加了品牌的创意和大胆的特征。不幸的是,其最基本的形式已经开始变成一种常规的方式,并已经进入更多的网站,并不一定是更好的。
“2017年强调的是不断分化...