查看原文
其他

不会编程的设计师不是好网页设计者?别让模板杀死想象力

Charlie Court Design360 2020-10-29


近日,创意网站It 's Nice That推出了一年一度的One to Watch 2020榜单,他们从全球创意人才中根据作品价值和对个人未来作品的期待,评选了13组最值得关注的创意人,这些创作者分别来自摄影、插画、平面设计或编程算法等多个领域。


其中亚洲地区有两位设计师入选,她们均来自韩国。本期为大家介绍其中一位侧重于编程的网页和平面设计师Yehwan Song,她想从根本上改变人们对网页的看法,因此通过创新的方式结合设计与编程,不断试验创造好玩的交互作品。



老实说,现在很多网站看起来都大同小异不是吗?它们大多使用了重复的模板和千篇一律的风格,比如当下最流行的极简界面。构建这些网站的背后逻辑显而易见——实行以用户为中心的建构理念,意图为用户提供最简单的途径去执行某个任务。


然而,把同样的模板运用在所有事物上还有什么乐趣呢?最直接简单的体验就是最“好”的吗?来自韩国首尔的设计师Yehwan Song并不这么想,她强烈认为网页应该更加有趣,并通过切身实践让人们看到,网页设计可以更加多样且充满趣味。


比起方便使用,网页可以更有趣吗?


Yehwan Song


虽然Yehwan在韩国长大,但曾在世界各地8个城市求学和工作,现在也经常根据工作和学习需求,不定期前往全球各个地方生活。去年她在纽约的School Of Poetic Computation学习诗意编程,在那里探索结合艺术与设计的创造性编程写作。这段经历让她更加意识到技术具有偏见性,“现成的经典网站模板太过常见,以致大多数人失去了自我意识,不再去思考如何呈现内容,就此扼杀了人们的创造力。”


短期诗意编程课程的毕业项目“拒绝用户友好”实验互动网站:

www.yhsong.com/touch_my_4_fingertips/


她哀叹道:“网站设计师们极力为用户打造更友好的体验,其实也只是让网页更易于使用,更符合所谓的“好网页设计”罢了。这有点令人沮丧,因为用户只能学习和使用相同的模板,以及找到一键替换模板的按钮。”Yehwan认为这种过度简化是在低估人们的潜力,并将互联网变成一个同质化的地方。


为弘益大学xD工作坊设计的触屏海报:www.xdworkshop272.ga/


“总的来说,优质的平面设计会更关注内容, 大多数的海报和编辑设计都是从内容出发,并将功能作为辅助,以最好的方式呈现内容。”Yehwan觉得这才是好的做法,“我认为这在网页设计中被严重忽视了,尤其是科技领域,因为人们更关注技术,一心只想让用户的生活更容易。而我更关注的是怎样才能创造更以内容为根基的事物?”


将平面设计与编程算法结合,

她让设计原则和意外生成美学相互碰撞。


Yehwan解释说:“我喜欢交互设计,它能够定义规则然后创造意想不到的非定性结果。”回想自己早期踏入交互设计领域的经历,她描述自己是在偶然上了一门几何构造数学课之后,突然被这些有规律的图案和形状迷住了。


Yehwan基于网页生成器和摄像头创作的自动生成视频实验


艺术家中村有吾和Angelo Plessas的作品中所展现的意外生成美学吸引着Yehwan,令她越发沉浸在用电脑创造迷人互动作品的世界里。


然而,她对编程和互动设计的兴趣并不是一时兴起,她在童年时便受到了来自家庭耳濡目染的影响:“小时候我特别喜欢用Flash制作小游戏和动画,我父亲也喜欢科技和设备,他在早期是一个真正的电子设备爱好者,喜欢收集新设备并使用它们进行试验。”  


Yehwan为Lima媒体美术馆打造的“Digital Cannon”网站:

www.digitalcanon.nl


Yehwan尤其重视创作的过程:“我所有的注意力都放在‘需要制定什么样的规则’来展示概念和项目。一旦这些规则被制定出来,屏幕上遵循这些规则的点就可以形成特定的图案,呈现美丽自然的图形。当规则稍微改变时,形状也会改变,但同时也形成了自己的视觉图形。“正是这一发现激发了她对参数设计的兴趣,通过设置规则和流程生成意外的视觉结果。


在www.ca-va.life网站上销售的触屏海报(需购买才可获得体验链接)


Yehwan作品的独特之处不仅仅在于编程技术,先锋的设计也给她的网页蒙上了一层独特的美学外衣。她在大学主修的平面设计课程,让她在编辑、印刷、排版方面打下了扎实的设计基础。在那时,她就已经开始更多尝试创作数字化作品,这更符合她思考事物的方式和个人兴趣。


Yehwan为艺术家moojinley个展建造的微型网站:

www.moojinley.com


她解释道:“我喜欢排版字体和制造视觉效果,但对印刷物并不感兴趣。在我的成长过程中,身边更多是电脑和电子设备,而不是书籍,所以我更喜欢把字体、排版和编程、屏幕联系起来。我发现自己更加专注于创造基于规则的、生成性的作品,同时通过排版和编辑来摆放事物,这样的工作方式产生的结果通常是一个网站。”


“在我看来,创建图标和品牌识别系统,其实是在创建一个不同的环境来展示每个品牌;而代码则非常不同,它更像创建一个单一的环境,在这个环境里所有东西都遵循一个算法规则。”可以说,这两个领域都不是她想单独追求的方向,Yehwan选择了充分利用自己的编程技能,结合传统的设计原则,在代码、设计和内容之间建立着强大的联系。 


「Hangeul Design Project」展览的手势触碰海报:

http://hangeul-design-project.xyz/(仅限手机客户端登入)


很明显,Yehwan十分热爱网页这个媒介,她比喻道:“编程和网站之类的东西对我来说,更像是朋友或者某种生命体,我并不觉得它们是一个代码或技术。”这也许可以说明Yehwan独特而充满创造性的编程方式从何而来,因为它并非人们所想象的那么公式化。


Yehwan希望挑战传统网站的用户体验,

颠覆人们对网页设计的理解。


Yehwan自己的个人网站就是一个很好的例子。她用谷歌表格创建了一个可导航的维恩图(Venn Diagram),每个坐标分别代表着她不同类型的作品,无论是动画、互动网页、动态海报,都通过大的总体分支相互交织在一起。


Yehwan Song个人网站:www.yhsong.com


在她另外的个人项目Chaser and Runner(猫和老鼠)中,Yehwan利用谷歌街景API,根据用户访问网站的设备改变用户的观看视角。如果你通过电脑登入该网站,你就成为了“Chaser(猫)”,可以看到从谷歌街景中提取的12个不同的位置,这些位置距离选定的中心坐标相隔100米,这个坐标可以随时移动,得到的图像也会实时更新。


Chaser and Runner项目网站:www.yhsong.com/siproject


然而,如果你通过手机登入网站,便会进入“Runner(老鼠)”视角,得到完全不同的体验。移动端将基于你的手机所面对的方向,显示离你20公里远的街道景观。这两种体验的同步创造了一个猫捉老鼠的在线游戏,并引发了一个有趣的实验:让用户基于使用的设备,拥有完全独一无二的网页使用体验。


Chaser and Runner网站手机使用页面


在Yehwan的作品中,网站都相对简单,她没有选择通过复杂的信息可视化来呈现数据,而是为他们赋予“隐藏动作”去创造互动——“我的主要设计工具之一是网页浏览器,所以我专注于‘响应式设计’。” 


她最喜欢的一个项目是为首尔「Open Recent」平面设计展所创建的网站。基于展览在平面设计领域内讨论了归档和共享趋势,Yehwan再次挑战了传统网站的用户体验,并创建了一个不断存档的自我参照网站。每三秒钟它就会对自己进行截图, 所有截图慢慢都堆积在屏幕的右侧,并且允许用户在精确的时刻之间来回导航跳转。


「Open Recent」平面设计展网站:

www.yhsong.com/orgd_2018_archive


很明显从功能上来说,这个网站并不需要做这些,但是没有了这个特点又哪里会有乐趣呢?这就是Yehwan想要传达的观点——不被需要的设计并不意味着不应该呈现它


通常,当设计师创建一个网站时总是让它具备足够及时的响应功能,这样当浏览器窗口大小改变时,它才不会改变原有的布局,Yehwan选择挑战这个概念,并实现在2018年为Typojanchi韩国字体双年展创建的官方网站中。这是一个她非常喜欢且自豪的作品,它围绕设计师如何控制工具来创建作品展开。


2018 Typojanchi韩国字体双年展网站:

www.typojanchi.org/2018


双年展的网站必须与展览作品一样创意十足,这是人们所期望的,而Yehwan则最擅长令网页吸引眼球。“我创建了同一个网站252次,并把它们分成块状,每块都有不同的响应特性,有的可能会给予90%的反应,有的可能毫无反应。”她说:“ 在一定的缩放比例下,网站看起来如常运作,但如果你缩放页面比例,这些块状就会分散开来,因为每一块网站都有不同的响应规则。”


2019年的Typojanchi网站也由Yehwan制作。该网站以一系列网格结构为特色,穿插了许多有趣的移动图形元素,完美地捕捉了双年展的精神。


2019 Typojanchi韩国字体双年展网站:

www.typojanchi.org/2019


“当你在网站上浏览时,可以看到物体开始在网站上聚集,变成了一个链接到展览作品描述页面的按钮。重复的图标及其图案显示了展览所拥有的大量艺术作品,而当你将鼠标移动到图标上时,显现的小物体运动轨迹代表着每件作品的活力,”Yehwan说。


这个设计在移动设备上的运作模式略有不同,所以任何与移动屏幕的交互也意味着与设计元素的互动。“这也传递了展览想表达的概念,你可以在展览现场看到、听到和读到这些存档在网站上的物件。”了解更多韩国字体双年展的资料请点击此处阅读更多


2019 Typojanchi韩国字体双年展移动端网站


关于网站的导航元素,Yehwan指出,如果用户没有明确与图标交互,图标也可以作为屏幕保护程序。她说:“如果你在一段时间内不移动光标,你可以看到这些物体开始聚集在页面上,然后这些物体就会变成链接到艺术家描述的按钮。”


尽管人们管理和处理数据的方式令人担忧,

但数据却总能给人带来惊喜。


有编程学习背景的Yehwan对复杂的数据和算法并不陌生,这在创意产业中是一个非常独特的位置。她的许多工作都是通过使用数据集来创建不可预测的、令人兴奋的运作方法,来运行解决方案和执行命令。


人们如何管理和处理数据,是当前社会面临最重要的问题之一,甚至常被形容为人类必须警惕的事情。令人十分振奋的是,Yehwan坚持以开放的心态对待数据,希望以积极的方式使用它,她说道:“如今的数据如此生动且出人意料,这太有趣了。我们无法完全理解也无法控制这么巨大的数据库,这也意味着它总是包含意外和惊喜。”


ISIA Urbino Werkplasts Typografie暑期学校存档网站:

www.yhsong.com/isia_wt_summerschool_archive


正是从这个角度看待数据让Yehwan备受鼓舞,她从来都不清楚自己会根据数据生成什么样的视觉效果,这才是数据最大的潜力。“尽管我设定了详细明显的运行标准,但排序后的数据总会生成毫无头绪的视觉效果,这就是为什么我喜欢探索编程,因为即使我专注在内容上,可结果总是流动的。数据更像是一个鲜活的生物,它所揭示和展示的东西是非常有创造力和不可预测的。”


为Cava Pop-up商店打造的移动设备宣传网站页面:www.ca-va.city


如今,Yehwan独特的设计已给她积累了不少大品牌客户,她将在今年致力于这些项目。除此之外,她有一个更大且更困难的主要目标——让人们改变对网页的刻板印象。


她说:“我希望更多跟随自己的想法,这样就可以向外界展示更大的创作空间。今年我想推动更多个人项目,这样我就可以向人们展示更广的可能性,以及通过代码可以实现和创造什么。”


“Very Responsive”网站作品,展于加州艺术学院的展览


显然,这不是一项容易的任务。但随着Yehwan继续深入行业,并不断做出更有趣且具备开创性的作品。假以时日,这些内容必定将会慢慢对人们产生影响。她感叹道:“我真想让人们从一个不同的角度来看待网站,希望其他人也想像我一样这么尝试!”


在纽约诗意编程学院短期课程的毕业项目“控制室”,展现一个安装了安全摄像头,随机捕获20个链接到她个人网站的页面:www.yhsong.com/control_room/


不管尝试的结果如何,正是Yehwan的逆向思维衍生了如此有趣的作品。她探索了呈现信息的新方式,打破了传统的从上到下滚动网站页面的局限性。而Yehwan对视觉手法的灵活运用,让她的作品充满惊喜,具备更独特的价值。


虽然人们第一次体验这些网站时,可能会感到困惑,因为里面总会藏有一个需要被破解暗号,或是渴望被探索的迷宫。但没有什么比跟你玩游戏的网站更好玩的了,不是吗?



资料来源 | www.itsnicethat.com

编译排版 | Chips and Yogurt

校对 | Roni、Yuer



- Design360°观念与设计杂志 -
2020年2月刊延期发售通知
受新冠病毒疫情影响Design360°杂志2月刊 No.85延迟至3月底发售全年订阅用户的订单将优先安排寄出



- Design360°杂志新刊  No.84 -Award360°  年度特刊
现已全面发售!现在购买可享包邮优惠点击下方小程序即可购买



- Design360°观念与设计杂志 -
2020年全年订阅开放
现在购买可享8.8折+包邮*包含2020年2月刊至12月刊(85期至90期)点击下方小程序即可购买


- Award360°100年度设计奖 -


点击下方链接了解2019年度获奖名单



    您可能也对以下帖子感兴趣

    文章有问题?点此查看未经处理的缓存