网页设计中交互设计的流行趋势!

网页设计中交互设计的流行趋势!

交互用在人和界面之间的浏览、点击、切换使之方便、快捷、平滑,好的交互是使用户依赖,能使产品长久留住用户 。视觉则是人的眼睛看起来舒服、舒适,让用户惊喜,让用户愿意去尝试 。网页则是一个产品类型,同时需要用到交互和视觉来是此产品更好地宣传需要展示的内容的载体 。成为交互的话需要把握产品受众人群的心理,了解产品的特性,以及要有新颖的创新思想,能想到让人一亮的让人用起来更舒服的点子 。
交互设计与视觉设计他们本身可为是相互相成的关系 。不同的地方是各自的侧重点不同 。交互侧重与人的心理认知过程和各方面的习惯及心理感受 。视觉设计侧重与页面的美感,视觉效果 。这就需要一个优秀的网页设计 。
一、响应式设计日益成熟
就在几年前 , 提起“响应式网站”,还意味着它的适配平台仅限于桌面 , 平板和智能手机等客户端 。随着智能手表,智能电视和其他智能家用设备的迅猛增长,响应式设计的定义也得到了极大的扩展 。
很多大公司近几年着重推进响应设计的研发进程 。如google前些时间推出的moto 360,以及苹果推出的iwatch,三星、LG、华为都推出了自家的智能手表 。这标志着未来在智能可穿戴设备将超过手机发展势头 , 随之而来的就是全面革新的响应式设计闯入生活,未来的生活方式将更加有趣 。
二、幽灵按钮
【网页设计中交互设计的流行趋势!】
幽灵按钮就是隐藏形式的按钮,不破坏整体的画面感,保持了画面简洁,统一 , 但又不失功能性 。可以说是未来在流行简约、背景大图的一大必然趋势 。

三、更强调字体
出现这一趋势主要有两个方面 。首先传统的一些Web字体价格昂贵,意味着网站排版需要更多的预算 。如今,这种情况在改变,设计师只要更少的预算甚至免费的字体就能在网页上自由设计 。另外,在流行的简约风格下,背景基本都是缺少故意装饰的图案,部分网页只有背景和文字 , 有时会缺乏整体的设计感,所以更大的标题文字能使画面更具冲击力 , 主次分明,使人印象深刻的同时又不使画面显得凌乱 。
四、滚动主导点击
移动互联的不断发展,刷新了移动终端的使用频率 , 人们越是依赖手机等设备就是越是促进移动交互的设计,所以,更加方便的滚动逐渐主导点击,成为移动交互的新宠儿 。
五、卡片式设计继续
随着信息处理能力的增强,部分以堆加信息的设计逻辑依然能存活 。这里就有典型例子,卡片式设计 。不同于其它走简约的信息分类,它直接醒目的将各个内容图片铺开放在一起,这样做的好处是,用户筛选信息快速、方便,不用进入下一级就可以基本全部了解信息 。例如 , 微博和视觉中国的图文信息排版 。
六、扁平化继续(或者Material Design设计语言崛起)
扁平化是google最新推出的设计方向,它的另一个名字是材料设计(Material Design) 。之所以这么称呼,其实在于google的设计师想追求一种原始干净的设计思路,把三维的空间简单化 , 把二维的空间复杂化 , 使画面具有扁平的动势 。抛开影响人深度思考的惯性逻辑 , 使UI、图片简单并且具有物体的动态象征性 。

这一设计语言有种灵气 , 简单脱俗 。在层次感和动画上保存真实的动态有型的世界 , 同时简化了物体的体积的造型感 。
这样灵动的设计气质,使的很多大公司争相研究,如苹果从ios7,谷歌原生UI,微软win8界面 。扁平化在大公司开疆带领下必将在未来风光无限 。
当然,扁平化不仅仅是停留在UI设计层面上,很多网站都运用了这一设计语言 , 如苹果官网,字体灵动但是毫无体积感 。
除了审美上的需求外,扁平化也是技术上的突破 。它的到来使图片和文字的压缩量减少,带来的就是更加流畅的用户体验 。这样零点几秒的体验提升 , 带来的是用户不自觉的接受并且慢慢成为习惯,直到最后难以折回 。视觉和功能上的完美体验,如同每次打开的都像是卡通画 , 精致耐看 。
七、微交互
微交互就是一个小小的智能系统,例如,你在打开天猫或者京东等购物网站的时候 , 网站通过你个人经常浏览的信息进行处理 , 弹出一个你想买的东西的窗口 。这种交互方式使人感觉网页十分只智能、亲近 。虽然小小改变足使人感到贴心,所以它会是将来发展比较好得交互方式 。
八、交互式故事
比起长篇累牍的文字介绍,放一篇生动的故事更能捉住读者的眼球 。在未来,这样贴近生活的交互模式下,泛滥成灾的长篇文字早已超出人们阅读的耐心,所以微博才会限制字数在140字以内,多数网站如特斯拉,苹果等更喜欢用简短的文字讲故事或者干脆放上精彩的广告视频,这样既节约了读者的时间,也在瞬间取得关注 。

九、愈大愈佳的图片
文字越来越大是因为强调主题 , 稳固整体结构 。那么越来越大的图片就表明了 , 科技进步带来的信息产业飞速发展,之前因为带宽较低,大图基本不可能出现在网页上,而今不同,大图标志着更具简约时尚 , 是一个成熟网站设计的标志之一 。
大图不仅方便取材 , 更方便设计师的加工和修改 。通过色彩滤镜和模糊透镜 , 划分层次,降低图片背景的关注度,强调题目文字,使得文字有一种悬浮于背景之上的新的视觉观感 。
除此之外大图还有个好处就是,可以很好的结合之前所提到的如垂直滚动、扁平化、幽灵按钮、故事内容等等交互模式相结合,打造出多层次、多体验感受、多视觉冲击的全新交互设计 。
这里依然拿苹果做例子,因为他是无数设计师的榜样产品,无论是工业设计 , 广告设计,UI设计,系统设计等等都是最好的,我认为没有之一,是综合实力最强的 。在浏览它的官网可以看出,苹果一直在不断的完善自己的设计风格,一直在追求极致的简单、大气、精致的品牌和设计理念 。我觉得这是一种几乎变态的追求完美,虽然设计是具有时效性的,但是苹果的每个产品都是那个时期最优秀的,就算过时依旧精致 。这个传奇的企业娴熟的掌握各种设计语言,其中的大图模式仅仅是他们冰山一角 。
十、更为自由的排版方式
网页设计的排版方式一直是设计师们讨论的话题,自2006年以来,固定网页文字格式的排版已经在慢慢变化了,设计师的思维早就想把枯燥的文字格式重新设计,但是由于当时综合技术层面上的原因没有成功 。但是现在不一样了,响应式交互使得排版方式不得不发生改变,更自由的排版方式更能博得读者的好奇心和关注度 。
网页设计中,影响读者文字阅读体验的三个重要因素是:1.字体大小2.列宽3.行间距传统web浏览中,较大的字题和适当的行距可以明显提高阅读感受 。但是,多互联响应式的到来,移动终端的阅读浏览量已经远大于PC,所以新的排版不见得就是运用原来的方法 。手机和平板使用的距离较近,有时并不需要较大的字体用于凸显,相反在小屏幕上营造空间感才是新的排版方向 。
十一、网页图表迎来新曙光
人作为视觉性动物,对于图片信息的接受能力远大于文字信息,所以在碰到需要大量数据做案例的文段时,图表的优势就很明显的体现出来了 。图表不仅能使人快速理清逻辑、数据等信息,还能使大脑有长期而清晰地记忆点 。更重要的是,结合多种动画设计 , 图表会更加生动,更有说服力 。
现在网页图表已经慢慢流行,相比普通图表,它具有互动性,他可根据网络数据的变化而随时变化,加上鲜明的色彩、简单的样式以及多层次的动画 , 使的他更具有关注点 。数据举例不再冰冷,更多的网页喜欢拿可靠、生动的数据说话了 。


经验总结扩展阅读