现在申请

UI/UX入门系列(二)|到底什么是好的UI设计?来看看一些大品牌案例

什么是出色的UI设计?当我们谈到优秀UI设计的标准和构成元素,是颜色看着舒服,布局干净整洁吗?还是它遵循了某些原则?还是让用户感到舒服?

UI/UX入门系列(二)|到底什么是好的UI设计?来看看一些大品牌案例
分享文章
什么是出色的UI设计?当我们谈到优秀UI设计的标准和构成元素,是颜色看着舒服,布局干净整洁吗?还是它遵循了某些原则?还是让用户感到舒服?


好的UI设计,可能这些都会涉及到,甚至还可以实现更多。出色的UI不仅可以帮助用户顺滑地完成他们的任务,还让他们发自内心地觉得:“这个界面可真好看!”


往期我们谈过了UI/UX到底是什么,今天这篇文章里,我们列出了9个出色的UI设计案例,说不定能为你提供一些新的灵感和启发。这些案例中,可能遵循了不同的设计原理,实现功能也各不相同,但他们各自都达到了他们的目的,又实用又好看。
跟我们一起来欣赏看看吧!


1. Dribbble的卡片设计
https://dribbble.com/

通过以长方块的图片和文字的形式,卡片的呈现方式能最直接地向用户呈现出一款产品或者功能的一些细节。Dribbble使用卡片来呈现设计师们的创意项目,让用户感受一种丰富多彩而又美观和谐的感觉。这样的整理和呈现形式非常巧妙,又能突出单个设计师的作品来吸引注意力,整体又简洁和谐。


2. Dropbox的自适应调色

https://www.dropbox.com/
https://www.dropbox.com/

自适应颜色的使用在UI设计中呈现一种增长趋势,品牌可以设置多种预定义颜色或动态颜色系统,而这些颜色不但可以是品牌logo中使用单一的象征性颜色,还可以呈现一些环境的颜色。Dropbox网站就是一个例子,每个页面都有自己独特的调色板,浏览网站的过程也带你踏上了一场发现之旅,互动度提高了,让用户一直浏览下去,直到产品购买!


3.Pinterest的瀑布流图片呈现

https://www.pinterest.com/

UI设计灵感的文章,如果不像Pinterest的标志性用户界面致敬一下,那可不能接受!作为卡片设计的先驱,Pinterest将卡片设计与瀑布流相结合,为用户提供了独特的平滑无缝体验。交互时为每张卡片赋上淡淡的阴影,Pinterest巧妙地通过这种方式加强了图片的可见性,让元素具有“可点击性”的感觉。现在很多app和品牌也都借鉴沿用了这种设计,比如小红书。

我们的产品训练营中,也单独围绕这样的瀑布流设计开设章节,为大家揭秘如何做出这样的瀑布流式呈现的效果。


4.留白的重要性

https://www.hellomonday.com/
设计师朋友应该都会明白一个道理,当你想把所有东西都放进去的时候,每个元素都想争先当主角,没有一个视觉焦点,最后什么都没突出。如果我们有所筛选,给一个元素全部的聚光灯或是在某个元素的四周留白时,才能真正起到突出作用。Hello Monday creative studio的主页面就是一个很好的例子,足够的空白来引导和强调关注点,让用户一次专注于一项功能,从而有力传递有效信息。


5. 金融类型的应用一定要刻板沉闷吗?
Group 48.jpg 633.91 KB

Current这一款财务管理APP,是专门为青少年设计的,希望帮助孩子养成良好的财务决策并学习财务责任的概念。考虑到青少年这一用户对象,他们的设计师使用了鲜艳的色彩,独特图案和字体的搭配,一改人们对于金融那种僵硬沉闷的刻板印象。这款应用程序的界面简单明了,上手容易,能让用户清楚明确自己的任务,了解自己的预算、花销从而更好的计划管理金钱。


6. 让一款网站更有活力

​https://rallyinteractive.com/
​https://rallyinteractive.com/

Digital Studio Rally将互动和动画与干净的界面和简介舒服的色彩搭配放在一起,让其网站充满了活力,与众不同。“单击箭头以获得更多信息”这个功能充满了时尚设计的元素。响应式调色板的设置也让网站的浏览更加轻松愉快。


7. 为什么不让图片动起来?

https://cognitohq.com
一个有趣的插图有时候可以凸显出自己的个性,在茫茫网站和应用程序中脱颖而出,给人留下深刻的印象。通过插画的形式来展示功能和服务,让复杂的概念更简而易懂,动画的形式又吸引了用户的注意力,又使品牌产品一目了然。


8. Spotify会变色

Spotify

今年来,UI设计师们越来越喜欢玩颜色渐变,不再是为了求安全而放置纯色块了。当我们想要通过颜色来表达某种情感或者是强调某个设计元素的时候,渐变是个不错的选择。Spotify现在将颜色渐变和广泛的音乐收藏结合在一起,用起来也更舒服有趣。


9. 3D的东西多可爱啊

Pitch

再见PPT,你好Pitch。这一款应用程序帮助你更好地呈现你的想法。目前大部分网站越来越趋于扁平化和卡通风格的字符设计,这样一来使用3D卡通风格的设计一下子就很出跳,再加上一些巧妙的动态元素,不断地吸引你的注意力,有一种在和这个网站玩耍的感觉,演示似乎也不再是一件乏味的事情了!网站在干净和全面之间找到了一个很好的平衡点,全面地呈现和涵盖了主要产品功能,让网站本身成为了一个很好的作品展示。


10. 简单点,多好啊!
Group 54.jpg 579.4 KB

服装品牌Frank and Oak强调生活方式,他们使用用户界面来吸引用户的注意力和风格品味。从UX角度来看,他们提供了一种简单流畅的在线购物体验,使用大胆的摄影和简洁的无衬线字体来捕捉品牌目标受众,呈现始终如一的干净、清爽、定制化的品牌风格。

-

好啦,今天的案例就到这里啦。

创作出色的UI设计可以更好地传达品牌形象,让用户留下深刻印象的同时促成服务或者购买行为。关注我们,下回讲一讲UI设计师遵循的10个原则到底是什么?


​对UI/UX设计感兴趣?想要学习怎么做出好看又实用的设计?欢迎来参加我们的UI/UX设计workshop, 了解一下UI/UX设计师都在做些什么!

Le Wagon的编程训练营中也包括了UI/UX的学习。在我们全栈网络开发课程的设计模块中,我们会详细带你入门UI/UX设计,仔细分析各种优秀案例,教你如何做出一款能够满足客户需求的设计。
想进一步了解Le Wagon编程训练营?
Go further illustration

准备好学习编程了吗?

我们分布在全世界45个城市。

Laptop illustration