www.looksinfo.com专访!追波排版达人Gil Huybrecht的极简风设计秘诀 - www.looksinfo.com-UISDC

www.looksinfo.com专访!追波排版达人Gil Huybrecht的极简风设计秘诀

2018/11/25 26134评论区

@N可可洛N@爆炒地瓜​​​​:Gil Huybrecht 是极简风格的实践者,他的着陆页排版设计在 Dribbble 有着很高的人气,他是怎么做到「断舍离」的,一起来听他讲解图文排版的心得!

Dribbble:https://dribbble.com/gilhuybrecht

△ Gil Huybrecht Dribbble

www.looksinfo.com:

是什么让您选择进入设计行业的?能否讲讲您的成长经历?

Gil Huybrecht:

首先,非常感谢有机会和中国的朋友一起聊聊我在设计上的想法。

△ Transition Test

其实我做设计是一个偶然事件。15岁上高中的时候我还不知道以后要做什么,我的一个好朋友当时说要去学一个平面媒体技术或者叫什么其他的课程,我当时也处于一个选择摄影还是选择平面设计课程的两难之中。最后,我朋友说服了我,与他在一个班级里学习了平面媒体技术。

前两年,我们主要学习印刷技术,但是我们也学了插画和排版。最后的两年,我们需要选择是继续做印刷还是数字媒介部分的深入学习。我选择了后者,因为我想要学习 Ps。

有趣的是,我的那个朋友在学习的第一年就放弃了。如果不是他,也许今天我也不会干这行。

△ Product Hero

经过两年的 Ps、html/css 和其他课程的基础学习,我们需要完成一个关于自己的项目需求,平面设计和网站是我们的设计任务。这是我第一次做设计项目,我爱上了这种感觉。

△ 365psd

高中毕业之后,我就继续去大学完成设计知识的学习。因为我不太确定到底想做什么,所以我选择了一个什么都学的专业,坏处是我真的没有学到新的东西,好的方面是,我有了很多闲暇时间来学习设计。我大学班里有一个同学特别擅长做网页设计,我说的还是拟物化时代的事儿。我当时特别痴迷于他做出来的干净的皮质感和细节感。从那天开始,我在大学的每次课上都会在365psd网站(你可以从这个网站下载源文件)下载psd,这一切都推动着我走向了网页设计。

△ Dribbble Activity Wood

早期的时候,主要还是拟物化设计,我也在 Dribbble 中上传了我的作品,如果你一直向下拉,就会找到这时候的作品了。这就是我的开始。

△ Article Interaction

在大学的时候,我就开始自由职业了,也是在那段时间里,我学到了关于视觉设计的一切知识。大概8个月之后,我对 UX设计非常感兴趣,在这之后,就开始有计划的接单,现在我还在学习撰稿的知识。

每天我都在学习,我认为这是最重要的部分,永远不要停止学习。

www.looksinfo.com:

你最满意的设计案例是什么?能为我们讲解一下它的设计思路么?

Gil Huybrecht:

Zet 项目是我非常喜欢的。

△ Zet Pageload

我的同事为这个项目制定战略,该客户是比利时的家具制造商,主要专注于椅子和桌子。 唯一一家在比利时设计和制造家具的品牌,这个品牌是服务于商家的,所以整个页面看起来非常的 B2B。在考察市场、定位研究之后,我们得出来的结论是这个品牌应该更关注终端消费者。

我们为这个品牌重新做了定位和消费者市场,我们将其转变成为一个生活气息浓郁的品牌。我在这个项目中是艺术指导,首页头图我选择了使用产品图片作为背景。

△ Zet Homepage Motion

在网上浏览之后,我们找到了一些能够与客户的产品一拍即合的东西,在灵感和创意的帮助下,我们为客户拍摄完成了图片摄影。

△ Zet Homepage

色彩方面,我总是希望能够呈现一个良好的视觉层次,我主要使用两种颜色,例如黑色和灰色。最重要的是,我会使用一种鲜艳的色彩,用来调动整个画面。在这个项目中,我使用了淡黄色/橙色,这种颜色也是对椅子等制作原材料的互动。

因为这个网站使用的是极简风格,我希望它能够有些让人愉快的细节,这就是那些应该被记住的东西,所以我在页面中需要引起注意的部分加入了圆形的元素,起到强调和装饰作用。

www.looksinfo.com:

能分享一下您的排版心得么?看得出来在您的设计中视觉层级非常重要,您在设计案例中是如何应用的?

Gil Huybrecht:

在 ZET 项目中,我使用视觉层级结构来建立整个页面。

△ Zet

人是不喜欢阅读大量内容的,我们只喜欢在其中寻找有价值的内容。通过大标题的使用将页面分成几个清晰的部分,每部分都拥有自己的主题,它们能帮助我们快速定位到想要的内容。

△ Zet chair

在 ZET 案例中,对用户来说最重要的是找到椅子/产品。因此,我们的主要重点暗示将转移到椅子/产品部分。

www.looksinfo.com:

在开始设计的时候你会从框架开始,您认为框架设计的作用是什么?

Gil Huybrecht:

如果可能的话,首先我会与客户开个会,如果是国际客户的话,主要使用调查问卷。目的是为了更好的了解业务:他们为什么想要一个新的网站、主要销售渠道、网站的目标是什么(细致一点的话主要目标、次要目标是什么)。

△ Article Slider

当我掌握这些信息后,我再开始制作网站站点地图。在这一步,重要的是考虑正在处理案例的设计需求。有些公司确实需要他们的网站为公司服务,这种情况下,这些网站在转换优化方面的要求就非常多,有多种页面转化漏斗路径,每隔几个月就必须进行测试更改。对于这些站点地图,最重要的是考虑 SEO。其他针对拥有高端产品、并不依靠网站进行销售的公司,这种情况下,我会尝试提供更多的在线体验,添加一下令人愉快的部分,包括视频、音频、互动等元素。通过这种方式,让用户获得品牌的在线体验,并希望购买品牌所呈现的东西,这种情况下,SEO 并不是最重要的。

△ Nav Interaction Idea

在进行页面结构设置时,最重要的是,考虑用户如何访问网站、会访问哪个页面及如何让用户进行页面转换。我会用简单的块和单词制作最基础的线框,在完成后与客户进行讨论。我也认为在一个网站上没有死胡同是非常重要的。所以,在制作线框时,页面的末尾部分,你所考虑的是如何让用户点击它的相关内容。这就是我对线框的看法。

www.looksinfo.com:

在页面中您是如何平衡留白的?

Gil Huybrecht:

我觉得留白与平衡是非常重要的。当你以正确的形式使用它,网站可以更好的工作,实际上不只是网站,任何设计都有商业目标或其他目的,通过使用留白与平衡,你可以让信息更加突出。当一个对象或者一组对象被空格包围时,我们会更加注意到该对象或者这组对象。​

这样,通过更清晰、少干扰的呈现效果,能够更快或更好的达到你的商业目标或其他目的。

www.looksinfo.com:

您非常喜爱极简设计,您是如何处理喜爱指点江山的甲方呢?

Gil Huybrecht:

我会尝试说服他们使用留白,原因如上了。留白在设计中是非常重要的元素,可以更清晰、简洁有效的进行沟通。

△ SPACED Pageload

我们生活在一个人们过度繁琐的时代,例如,将特别多的东西放在首页就相当于在网站上非常卖命的向用户/客户推销一个商品。

△ Botanical

通过合理的使用留白和视觉层次结构,将主页头图部分优先考虑一个或两个内容。当你从战略开始并拥有明确的目的和价值主张时,我们就有了完美的信息。 当你把它放在主页头图部分时,用户确切地知道他可以从你(公司)那里得到什么。

△ Video Reveal

人们想要价值,他们不想被推销。这至少是我设计中的生活。

www.looksinfo.com:

您的典型一天是怎样的?

Gil Huybrecht:

我在一家设计机构有全职工作,在下班后处理自己的事情。

△ Scroll Animation

一般都是7点醒来,洗个澡然后开始享用早餐(一天中最重要也是最美味的一餐,我最喜欢早餐)。8点开车上班,大约9点开始工作,直到下午1点与同事共进午餐。为了不堵车,大约下午4点下班,5点左右到家,然后继续工作到晚上7点。7点吃完晚饭之后,会和女朋友打游戏。一直到11点,然后休息。

△ Adopt

这些天我一直试着读书,不过还没有开始,不过这是我现阶段想做的事情。

www.looksinfo.com:

有什么建议可以给正在学习的设计师,您有推荐的书或网站么?

Gil Huybrecht:

我觉得心态非常重要,认识到总是有很多你应该学习的新知识。

△ Portfolio 3.0

对我而言,Dribbble 能让我的技巧变得更好。另外,当你看到一些很酷的东西时,你应该尝试重现它。当然考虑为什么做也非常重要。来自 Marty Neumeier 的所有书籍在战略等方面都具有超高的价值。 我还收听了许多关于设计、商业和品牌的博客。 商业也是非常值得学习的部分,当你了解战略并想要销售策略时,与客户交流很重要,推荐来自 Douglas Davis的《Creative Strategy and the Business of Design》, 它是关于学习业务和战略的基础知识。

www.looksinfo.com:

我们非常感兴趣您的办公环境,能否为我们展示一下您的工作台,以及为您带来幸福感的物品呢?

Gil Huybrecht:

△ 工作台

△ 工作台

非常感谢 Gil Huybrecht 百忙之中为我们讲授的排版经验,喜欢他的小伙伴可以通过以下链接获得更多作品哦!

设计师专访,了解大牛都是如何开展设计的」

www.looksinfo.com大课堂

非特殊说明,本文版权归原作者所有,转载请注明出处
本文地址:/uisdc-access-gil-huybrecht

发表评论 加载中....

评论加载中....

uisdc

评论区都快饿瘪了,看看我期盼的小眼神...

sketch 转场动效 www.looksinfo.com大课堂 设计师 扁平化设计 交互设计师 界面设计 排版布局 职场 平面设计 配色 设计师专访 视觉设计 素材下载 设计流程 web前端开发 AI教程 用户体验设计 设计理论 神器下载 字体下载 海报设计 设计趋势 设计规范 psd下载 动效设计 图标设计 产品设计 logo设计 ICON 神器推荐 职场规划 App设计 字体设计 酷站推荐 交互设计 ui设计 设计师职场 优秀网页设计 用户体验 ps技巧 酷站 PS教程 网页设计 经验分享

把好文章收藏到微信

打开微信,扫码分享
学设计 www.looksinfo.com网 在这里

首页百度一下360搜索 搜狗搜索 神马搜索"