設計師心中的 4 種網站用照片說故事比文字更有效率

Polina UI/UX
4 min readApr 2, 2019

--

照片一向是網頁中不可或缺的角色,可以用來描述情境、創造和消費者間的親切感、提升品牌價值等等。

常看到很多人剛開始碰網頁設計時,喜歡用大量圖片穿插其中,覺得看起來既讓畫面豐富又顯得大氣。但並非所有產業都需要用到如此大量的照片說故事,相反的,若內容過少,像是草創的品牌,因為缺乏項目陳列,而使用過度的裝飾,會顯得資訊更加貧乏。那麼,有哪些種類的網站是「一定要有大量圖片」才會容易吸引觀者的呢?

比方說,攝影師的作品集網站。好的作品一呈現出來比什麼宣傳話術都有用

你可以想想,什麼情況你會更想看到畫面而非文字?當別人在跟你描述一本漫畫有多好看的時候?當你在俄羅斯餐廳點餐,看菜單文字毫無頭緒的瞬間?

1. 藝術相關產業

好作品比什麼都重要

包含時尚、藝術、設計。像是幫藝術家製作個人網站,當然這時候作品就是最好的傳聲器。不需要過多文字,重點放在作品身上才是正確的。或是替設計公司製作企業官網,除了公司簡介以外,軸心應放在專案集的排版規劃,用清楚的圖片取代繁瑣的文字,會更讓人停下腳步觀看。其他像是藝術機關、攝影棚租借公司等等。

Acne Studio

2. 美食相關產業

餓了就想看到食物而已

像是餐廳、美食評比網站等等。就如同以下這兩份菜單,右邊絕對會佔上風,只因為它將菜餚照片呈現出來,就能夠使你在已經飢腸轆轆的情況下,餓到理智線斷掉。在幫餐廳或飯店設計網站時,把菜色呈現出來對於消費者而言是相當具有吸引力的。

left : Metrograph / right : Love Story

3. 出國相關產業

引誘你馬上去訂機票

包含旅行社、留學代辦、訂房網站等等,當然這些網站的資訊也是觀者注意的重點,但加上照片說明,或營造情境讓人有輕鬆的心情和氛圍,更能增加消費者對於「國外」的嚮往。

美富國際:留學代辦

4. 和兒童有關的產業

圖像記憶法比父母管教更有用

像是童書出版社、兒童教育網站、兒童電視頻道網站等,對兒童而言,除了色彩繽紛有助於大腦開發之外,照片可以引導他們有更多想像空間。比起文字的鋪陳,通過照片能夠快速讓兒童專心並且啟發他們的空間感及建立他們心中的「百科全書」。

The Totem Kids

千萬記住,照片不是越多越好

屏除你的舊觀念,不要再用連續的滿版大圖片塞滿整個網頁。當然,本篇介紹的這四種網站類型可以將照片靈活善加運用於版面,不過其他的企業類型假如能夠搭配其他方式,如icon、插圖解說,反而更能加強闡述觀點喔。

比方說,像下方的案例,它是商業導向數據分析公司,他們的主力應放在「圖表化」「清楚易理解」,而非漂亮的照片去闡述故事。像這類的公司,核心概念在於用數據讓人信服,所以乾淨簡單的向量圖會是最適合的。

Smash Delta

那麼,怎麼樣的照片可以看起來具專業性?

這邊整理了一些懶人方法,讓沒有任何美學基礎的你也能夠挑出好照片。

1. 有景深的照片,讓畫面有情境和綿延的故事感

2. 整體網站在製作前先設定好要一致使用暖色調或冷色調照片

3. 畫面構圖呈現不等邊三角形,或物件錯落的位置剛好呈現橢圓形

4. 若是人像照片,下方截斷範圍不要落在小腿骨、腳踝,這種尷尬的位置。可以選擇落在腰際、或全身入鏡的畫面。

5. 明度(也就是畫面亮暗)寧可中低明度,也不要高明度到甚至過曝

6. 建築照片要注意建築物是否與畫面邊緣垂直水平對齊,視覺上保持平衡

好啦~分享了這麼多,希望剛開始接觸設計的人都可以藉由這篇文章,輕鬆掌握基礎美感,就算不是科班出身,也能夠做出水準之上的作品囉!

--

--