CSSDA judge monthly highlights: April 2018

周青永
Condé Nast Design Taiwan
7 min readMay 3, 2018

今年開始我多了一個「球員兼裁判」(誤)的新身份,從3月起正式成為CSS Design Awards評審團的一員,這個身份的基本要求是每週必須至少為10個入圍網站(Nominees)就介面設計(UI Design)、使用者經驗設計(UX Design)以及創新度(Innovation)三個方向作出評分,每個入圍的網站都有其評分時限,雖然不能算是吃重的數量,可以的話我還是會儘量在能力範圍內多為幾個入選網站做評分。

在開始評分工作之後,我開始發覺對於自己相對有「感應」的入圍者,很想要為其寫些什麼,除了將他們的特色或是優點分享給對網站設計有興趣的朋友之外,也能夠驗證一些自己在設計上的想法與思考脈絡,從而激盪出一些什麼,因此我想將這件事當做是一個長期的side project持續下去,並且在每個月結束的時候,將其集結成一篇文章,五月份開始,我每個月都會推出一篇這樣的推薦清單,有興趣的朋友也可以在Facebook上追蹤 #CSSDAjudges 這個Hashtag,可以不定期地看到我最新發表的推薦網站。

這一篇文章將會包含3月、4月這兩個月份的評選,那麼就讓我們開始吧!

Mustafa Celik — Portfolio

http://www.themustafacelik.com/

Mustafa Çelik SWITZERLAND

好的UI設計是什麼呢?我認為是不張揚、直覺且易懂,有人說好的UI設計應該適度轉化為圖像,在這個網站上你能看到的圖示卻只佔最小限度的呈現,像是箭頭與方塊等以符號為主,社群圖示也改用Fb/In這樣的縮寫替代,這樣一致性高的簡約設計,使用上也沒有困難,也得到評審們的高分肯定。

CSSDA page
https://www.cssdesignawards.com/sites/mustafa-celik-portfolio/32593/

Preet is just a name

http://preetisjustaname.com/

Preet Dalal USA

我沒有非常喜歡這個網站的視覺風格,但是這並不影響他將自己的想法傳遞給我,UX這件事存乎於給予使用者的感受,而我非常喜歡他用文字敘事的方式,誠懇而真摯地娓娓道來,雖然長篇大論,但是我卻可以盯著那行不斷出現的文字一直閱讀下去,而你也可以在他的網站上用塗鴉的方式,留下圖像回應或是隻字片語,因為在設計上更注重與人的交流,在UX的評比部分他也拿到了比其他兩項更高的分數。

CSSDA page
https://www.cssdesignawards.com/sites/preet-is-just-a-name/32618/

Niika

https://www.niika.com.au/

Niika AUSTRALIA

滾動視差(Parallax Scrolling)雖然已經不是浪頭上的趨勢了,但是要在頁面動態設計上呈現有維度的空間感,的確是少不了它,要玩的巧妙又令人舒心更是需要一點訣竅,來自澳洲的agency Niika,呈現出了不至於爭奇鬥豔,又帶給人小小驚喜的視覺體驗。

CSSDA page
https://www.cssdesignawards.com/sites/niika/32684/

MB — UX/UI Designer

http://www.matteobaratin.com/

我喜歡這傢伙,因為他說“No Country for Creatives”,原出處是愛爾蘭詩人葉慈的著名詩作《航向拜占庭(Sailing toByzantium)》,也是《險路勿近(No Country for Old Men)》的英文片名,由一個看起來風華正茂的年輕人引用,著實有意思。網站本身表現很平穩,算是恰到好處。

CSSDA page
https://www.cssdesignawards.com/sites/mb-ux-ui-designer/32727/

Menada Winery

https://www.menada-winery.com/en

eDesign USA

如果有一個葡萄酒的網站可以讓你感受到風土這件事,那我想就是它了,以破題的視覺手法讓你第一眼就能感受到葡萄本身旺盛的生命力,雖然沒有用上大版面的影片背景,但是陪襯的微型影片、背景圖等都用輕聲細語地方式向你闡述當地的環境 — — 如果你有足夠的想像力,應該已經誤以為自己剛摘下了一顆葡萄正在嚐嚐味道。

CSSDA page
https://www.cssdesignawards.com/sites/menada-winery/32733/

INRA Highlights

https://faits-marquants.inra.fr/en/

Werkstatt FRANCE

你心目中的國家農業研究院應該是什麼面貌呢?法國國家農業技術研究院(INRA — Institut National de la Recherche Agronomique)將他們在農業、供應與環境三大領域上歷年來的出版選粹,以DNA螺旋形態結構呈現出一段精彩的互動之旅,炫目的表現方式象徵在生物領域上進化的概念,在主題與技術上結合,是相得益彰的完美展現。

CSSDA page
https://www.cssdesignawards.com/sites/inra-highlights/32740/

1948

http://www.1948.site/

Or Fleisher USA

近期蠻多網站會要求使用者透過長按畫面或是鍵盤的動作來達成與網站互動的目的,不過動作本身與網站內容之間多半沒有什麼關聯性,這個紀念《以色列獨立宣言》的網站則是將關聯性做得很好的例子,如果沒有任何操作,在進站提示之後的畫面是幾乎一片空白,不過當你按下鍵盤上對應22個希伯來文字母的任一按鍵,就會有一段動態畫面,搭配以色列建國首位總理David Ben-Gurion的語音讀出獨立宣言文本中的關鍵字,你也可以同時按下多個按鍵將畫面的動態混合呈現。

CSSDA page
https://www.cssdesignawards.com/sites/1948/32772/

Do Wonders

https://www.meiji.co.jp/do-wonders/

Dentsu JAPAN

必須說看到出現明治(Meiji)這個品牌,我預期會出現的是很多色彩繽紛的零食,沒想到這家公司會推出這樣像是十九世紀生物學圖鑑百科的網站,這個由日本電通執行的網站,鉅細彌遺且精緻的菌種與細胞插圖非常引人入勝,奇妙的是在索引功能設計上,手機以及平板上的體驗比桌機上來得更好,對於在桌機瀏覽上選擇隱藏選單按鈕的做法我有點意外。

CSSDA Page
https://www.cssdesignawards.com/sites/do-wonders/32817/

還喜歡本月我所分享的CSSDA網站入圍匯集名單嗎?滿意的話還請不吝拍個手(笑),有任何想法也歡迎留言給我,沒意外的話,下個月見囉。

Image credits: CSS Design Awards

--

--

周青永
Condé Nast Design Taiwan

Design Director, Vogue/GQ, Condé Nast Taiwan. Former Judge Panel of CSS Design Awards. https://linktr.ee/jeterchou