7 個必收藏的網頁設計靈感網站
整理 7 個必收藏網頁設計靈感網站,從 Awwwards、Land-book、Godly、SiteInspire、Mobbin、One Page Love 到 Dribbble,各對應一種設計能力,附比較表、四象限分類與三層萃取法,教你帶問題瀏覽、做拆解筆記,不再越找越像別人。
作者:褚崇名(Sliven)
本頁目錄
- 設計卡關不是你沒才華,是大腦被「空白畫布」癱瘓了
- 把靈感網站分成四種「藥效」,先對症再找藥
- 七個值得固定回去翻的網頁設計靈感網站
- Awwwards:看世界級作品的天花板
- Land-book:Landing Page 的百科全書
- Godly:科技與新創的質感集中營
- SiteInspire:編輯精選的極簡與網格美學
- Mobbin:行動版設計的真實教科書
- One Page Love:一頁式網站與模板寶庫
- Dribbble:單一元件的靈感便利店
- 把別人的神仙構想變成你自己的:三層萃取法
- 第一層:拆結構,不要看顏色
- 第二層:辨識手法,給它一個名字
- 第三層:用自己的材料重組
- 一個實際的萃取示範
- 看完之後,怎麼真的在畫面上做出來
- 一個室內設計專案的靈感蒐集流程示範
- 進階:把靈感蒐集變成可重複的工作流
- 日常:十分鐘的眼睛保養
- 週更:整理你的靈感庫
- 專案:帶著問題找答案
- 三個會把「參考」變成「抄襲」的地雷
- 地雷一:連配色字體一起搬
- 地雷二:只收集,不整理
- 地雷三:追流行脫離品牌
- 關於找靈感,最常被問到的三個問題
- 一定要付費訂閱這些網站嗎?
- 看了很多還是做不出來,怎麼辦?
- 客戶給的參考跟我方向不一樣,怎麼辦?
- 你的下一步:建立自己的靈感藥櫃
客戶約好下週要看首頁視覺,你打開 Figma,盯著那塊 1440 的空白畫布,腦袋跟著一起空白。滑了兩個小時的 Pinterest、存了八十幾張圖,回過頭卻還是生不出半個明確方向。這個畫面,許多設計師都不陌生。
設計卡關,跟才華沒有關係。就算在這一行做久了,設計師到現在還是會卡。差別只在於,手邊有沒有一套固定的「靈感藥櫃」,卡住的時候不會漫無目的地亂滑,而是走過去拉開對的抽屜。
這份清單就是那個藥櫃。接下來會盤點七個值得反覆查看的網頁設計靈感網站,再加上一套能和客戶一起走的靈感蒐集流程、把參考轉成自己作品的萃取方法,以及三個會讓「參考」踩成「抄襲」的地雷。
核心重點
- 卡關不要亂滑。先把「自己卡在哪一關」講出來,再決定去哪個網站找答案。
- 靈感網站是一座分科的藥櫃,整站氛圍、版型骨架、行動版畫面、單一元件,各有對應的去處。
- 七個值得固定回去翻的清單:Awwwards、Land-book、Godly、SiteInspire、Mobbin、One Page Love、Dribbble。
- 看到不等於用得到。用「拆結構、辨手法、重組」三層萃取,才不會把別人的作品 copy 進來。
- 找靈感是最便宜的事,把它做出來才是真功夫。挑對工具與流程,比存了幾百張圖更重要。
設計卡關不是你沒才華,是大腦被「空白畫布」癱瘓了
很多人把設計卡關跟「我沒有靈感」畫上等號,於是拚命看更多圖。這個直覺只對了一半。真正讓你卡住的,通常不是素材不夠,而是選擇太多、限制太少。當你可以在幾秒鐘內滑過幾百張漂亮網站,你的大腦會進入一種「什麼都好、什麼都想做」的過載狀態,這個狀態跟完全沒想法一樣危險。
打個比方:你不會走進一間沒有菜單的超市,把架上所有食材丟進購物車,然後回家才想今晚煮什麼。你會先決定「今晚要煮什麼」,再回頭採買。找網頁設計靈感也是同一件事。先決定你這次要解決的問題是什麼(是首頁 Hero 太弱?是行動版的卡片排版很亂?是 CTA 按鈕沒人點?),再帶著這個問題去對的網站找答案,效率會翻好幾倍。
還有一個現實壓力,讓「找對靈感」這件事不能太隨便。超過六成的全球網頁流量來自行動裝置(Statista 的季度統計,2026 年 4 月),設計必須在小螢幕上成立。WordPress 也支撐了網路上一大部分網站(W3Techs 統計,2026 年 6 月);實際專案還得面對 CMS、佈景主題或頁面編輯器的限制。能精準找到可實現的靈感,遠比蒐集一堆炫技卻難以落地的構想重要。
正因如此,找靈感應該被當成一個獨立的專業技能來練,而不是天賦。業餘者等靈感降臨,專業者建立一套讓靈感穩定產出的流程。這套流程不必多複雜,但它要能重複、要能被檢驗、要能在你狀態最差的時候還是把你自己撈起來。接下來要講的這套分類與萃取方法,就是這種在狀態最差的時候還能依靠的流程。
所以這篇文章不會只丟七個網址給你。接下來會先教你怎麼分類自己卡在哪一關,再帶你走過這七個網站各自適合解決什麼問題。
把靈感網站分成四種「藥效」,先對症再找藥
實務上可以把所有靈感網站依照「能幫你解決什麼問題」分成四類。你在開始找資料之前,先問自己一句話:我現在缺的是整體感覺、是結構、是行動版、還是某個小元件?答案決定你該開哪一個網站。
| 藥效分類 | 你會問自己的問題 | 適合去的網站類型 |
|---|---|---|
| 整站氛圍 | 「我要的風格到底是科技冷感、還是溫暖手作?」 | 得獎作品庫、編輯精選集 |
| 版型骨架 | 「這個段落到底要怎麼排,資訊才不會打架?」 | Landing Page 合集、排版作品集 |
| 行動版畫面 | 「手機上看起來會不會很擠、按鈕好不好點?」 | App 畫面截圖資料庫 |
| 單一元件 | 「這個卡片、按鈕、導覽列要怎麼設計?」 | 設計師作品社群、元件庫 |
這個分類最大的好處是:它逼你先把問題講清楚。不少「設計卡關」其實是需求還沒講清楚。當客戶說「我想要現代感」,這句話是空的;但當客戶說「我想要首頁第一屏像科技公司的留白跟冷色調」,你就知道要往整站氛圍類的網站去找,避開按鈕設計那一塊。
把這個四象限記在心裡,接下來的七個網站就能對號入座。
七個值得固定回去翻的網頁設計靈感網站
底下這七個網頁設計參考網站,是依照前述問題分類整理的口袋名單。每個網站都會標出它屬於哪一種「藥效」、最強的地方在哪,以及不適合拿來做什麼。你也可以先看總覽表,再往下挑有興趣的細讀。
在使用這份清單之前,還有一個觀念要先講清楚:沒有哪一個網站是「最好」的,只有最適合你當下問題的那一個。同一個網站,你在不同關卡去翻,會看到完全不同的東西。所以與其死記網址,不如記住每一個網站最擅長解的問題。下面會盡量把「什麼時候去」講清楚,讓你之後可以像查字典一樣按圖索驥。
| 網站 | 主要藥效 | 最強項 | 不適合拿來 |
|---|---|---|---|
| Awwwards | 整站氛圍 | 有評審機制的高水準前衛作品 | 找簡單可落地的小型站台 |
| Land-book | 版型骨架 | Landing Page 大全、可分類篩選 | 找複雜的多頁內容站結構 |
| Godly | 整站氛圍 | 科技、SaaS、AI 新創質感站 | 找傳統產業或電商氛圍 |
| SiteInspire | 版型骨架 | 編輯精選、極簡與網格美學 | 找花俏動效 |
| Mobbin | 行動版畫面 | 真實 App 畫面截圖資料庫 | 找桌面版的複雜排版 |
| One Page Love | 版型骨架 | 一頁式網站與模板資源 | 找多層級的內容站 |
| Dribbble | 單一元件 | 設計師上傳的元件 shot | 看整站實際上線樣貌 |
Awwwards:看世界級作品的天花板
Awwwards 是一個有評審制度的網站設計競賽平台,每天都會選出當日作品,每月、每年還有更大的獎項。它的價值在於「門檻」:能在這裡被選上的網站,普遍在視覺、互動、技術執行都達到一個檔次。所以它最適合的用途,是讓你看看「這個產業的天花板長什麼樣子」。
但有個陷阱要誠實提醒:Awwwards 上的網站很多是「炫技型」的,動效繁複、版面前衛,這些構想在真實商業專案裡往往做不出來,或做出來會拖垮效能。比較建議的用法是把它當「眼睛的營養品」,定期翻一翻維持品味,但真的要落地時,再去找比較收斂的參考。
卡在一個「我不知道這個產業可以做到多強」的時候,去 Awwwards。卡在「我要怎麼把這個動效做出來」的時候,不要在這裡找答案。
Land-book:Landing Page 的百科全書
Land-book 把網路上的 Landing Page 整理成一個可篩選的資料庫,你可以依照產業(設計公司、電商、餐飲、作品集)或風格去過濾。它解決的是「結構」問題:當你不知道一個頁面的段落順序該怎麼排、Hero 接下來該放什麼、定價區塊要怎麼呈現,這裡有成百上千個真實案例可以參考。
做行銷活動頁的時候,這裡最常派上用場。因為活動頁的本質就是 Landing Page,它有一套相對穩定的結構公式:抓住注意、說明價值、建立信任、引導行動。如果你想把這套結構摸熟,可以先看我們寫的Landing Page 轉換指南,再來 Land-book 對照真實案例,會很有感。
Godly:科技與新創的質感集中營
Godly 聚焦在「數位與科技領域」的質感網站,收錄很多 SaaS、AI 工具、開發者工具的官方站台。如果你做的是 B2B、科技、軟體類的專案,這裡幾乎是你要的味道:冷色調、留白、剛好的字體層次、不過度裝飾。
它的定位跟 Awwwards 有點重疊,但風格更收斂、更貼近商業現實。所以如果你的客戶是科技公司、新創,或你自己做的是工具型產品,Godly 會比 Awwwards 更「用得到」。思考「AI 時代的網站到底該長什麼樣」的時候,也適合來這裡找方向,這部分也可以搭配我們寫過的 AI 網頁設計主題一起看。
SiteInspire:編輯精選的極簡與網格美學
SiteInspire 走的是編輯精選路線,收錄的網站偏極簡、排版導向、網格美學。它可以用風格 tag(例如 minimalist、typography、illustrative)去篩選,非常適合在「我想做一個安靜、有質感、不靠動效取勝的站台」時來翻。
這個網站最大的啟發,是「留白也是一種設計決策」。很多自架站的朋友怕畫面空,於是把每個區塊都塞滿,結果反而失去層次。SiteInspire 上的案例會讓你看到,一個靠字體層次與留白就成立的首頁,質感可以贏過一堆塞滿資訊的網站。對字體與排版有興趣的話,再延伸看排版設計的相關技巧。
Mobbin:行動版設計的真實教科書
前面提到過,超過六成的網頁流量來自手機,依據是 Statista 的行動流量統計。這代表設計任何頁面時,都不能把手機版放到最後才處理。Mobbin 是一個真實 App 畫面截圖資料庫,收錄大量 iOS 與 Android 介面,可以依照畫面類型(登入、設定、列表、個人檔案)去篩選。
為什麼一個網頁設計師要看 App 截圖?因為手機螢幕就這麼大,App 設計師被逼著用極少的空間解決資訊呈現問題,他們對「單屏資訊密度」「按鈕好點不好點」「卡片層次」的處理,往往比網頁更精煉。當你在煩惱行動版的某個區塊怎麼排時,去 Mobbin 找同類型的 App 畫面,常常一句話就通了。搭配我們的網頁版面設計攻略一起看,行動版的功力會進很快。
One Page Love:一頁式網站與模板寶庫
One Page Love 顧名思義,專注在一頁式網站,同時也提供不少模板資源。它解決的是「小站結構」問題:個人作品集、活動頁、單一產品介紹頁、小型服務頁。這類網站不需要複雜的多層導覽,重點是把一個故事在單一頁面裡說完、說服人。
做個人品牌、接案作品集、或幫小型工作室架站的朋友,建議第一站就來這裡。它的案例能幫你快速決定「這個段落要不要」「順序怎麼排」「收尾要放什麼」。如果你同時在思考怎麼把這些段落串成轉換路徑,可以再讀我們的CTA 按鈕設計指南,把每一個段落的「下一步」都設計清楚。
Dribbble:單一元件的靈感便利店
Dribbble 是設計師上傳作品的社群平台,上面充滿了單一畫面、單一元件的 shot。它跟前六個網站最大的不同,是這裡的內容多半屬於設計師的提案、練習、概念稿,未必是實際上線的網站。所以它最適合的用途,是找「單一元件」的靈感:一個定價卡片、一組 onboarding 流程、一個儀表板介面、一顆按鈕的狀態。
相對地,Dribbble 最不適合拿來判斷「整站該長什麼樣」。因為很多 shot 是脫離真實營運情境的概念稿,看起來漂亮,搬到真實站台會有很多問題(內容長度不可控、沒有效能考量、沒有無障礙考量)。所以比較建議的用法是把它當「零件供應商」,缺某個零件的時候去逛,不要把它當整站參考。
把別人的神仙構想變成你自己的:三層萃取法
找靈感最怕的一件事,是看了一百個網站,最後做出來的東西還是空的。原因出在「看」跟「用」之間,少了一個轉換步驟。這個轉換可以拆成三層,也適合拿來當團隊共同的工作方法。
第一層:拆結構,不要看顏色
當你看到一個喜歡的網站,第一個動作是把它的結構拆出來,先別急著記配色。它有幾個段落?每個段落在做什麼事?段落之間的順序是什麼?資訊層次怎麼安排?你可以用一張白紙,把它的結構用方塊畫出來,這就是它的骨架。
為什麼先拆結構、不看顏色?因為結構是可以直接搬用的(業界本來就有公認的版型公式),而配色跟字體是品牌識別,搬了就出事。把結構抽離出來,你已經拿到一半的價值,而且不會踩到抄襲的紅線。對版型結構有興趣,可以延伸讀我們整理的Bento Grid 排版教學,看一種當代很流行的版型骨架怎麼運作。
第二層:辨識手法,給它一個名字
第二層是去辨識「它用了什麼手法」。例如:它用了大字標題配小字副標的層次對比、它用了一個置中的 hero 搭配漸層背景、它把定價做成三欄中間放大的比較表。把你看到的手法用一句話講出來,給它一個名字。
這一步的威力在於:當手法被你命名之後,它就脫離了原本那個網站的影子,變成你「工具箱裡的一個工具」。下次你自己設計的時候,你可以自由地把這個工具跟其他工具組合,做出跟原作完全不同的東西。這也是設計師跟抄襲者最大的差別:設計師吸收手法,抄襲者複製外觀。
第三層:用自己的材料重組
第三層,是把前兩層抽出來的「骨架」與「手法」,套進你自己的品牌材料裡重新組合。你自己的品牌色、你自己的字體、你自己的圖片、你自己的文案長度。同一個骨架,套上不同的材料,會長出完全不同的東西。
這一層也是大多數人偷懶跳過的地方。他們看到喜歡的網站,直接把配色、字體、間距全部抄過來,這不是找靈感,這是複製。真正的萃取,是只借結構與手法,材料全部用自己的。當你能做到這一點,就算你參考的對象跟你的成品擺在一起,別人也看不出血緣關係。
一個實際的萃取示範
以下用常見的 SaaS 工具官網做示範。第一層拆結構:首頁先是「置中大標配一句副標、一顆主 CTA、底下產品截圖」的英雄區,接著是三欄功能卡片,再來是社會證明的客戶 logo 牆,收在定價比較區。把這個骨架用方塊畫成草圖,全程不碰它的顏色跟字體。
第二層辨識手法:可以看出它用了「置中對齊搭配大量留白」「三欄等高卡片」「把客戶 logo 轉成灰階降低視覺干擾」這幾個手法。接著給每一個手法取一個名字,存進自己的設計筆記,這幾個名字之後可以單獨拿出來用。
第三層重組:把同一個骨架,套進律師事務所這類品牌的材料:深藍主色、穩重的襯線字體、真實的案件現場照片。出來的成品跟原本那個 SaaS 站擺在一起,沒有人會覺得它們有血緣關係,但骨子裡是同一套結構。這就是萃取的真正力量:你借的是骨,不是皮。同一副骨架,換上不同的材料,可以長出無限種成品。
看完之後,怎麼真的在畫面上做出來
找靈感是最便宜的一步,把靈感做出來才是真功夫。很多人卡在「我看到了神仙構想,但我做不出來」。這時候你要分的問題是:你是卡在「設計能力」,還是卡在「工具能力」?
如果是設計能力(不會排、不會抓比例、不會配色彩),那就回頭補網頁設計的基礎觀念。我們寫過一篇網頁設計從零到一的完整指南,把 UI/UX 原則、響應式、SEO 友善架構串起來,先讀過一遍,你看靈感網站的眼光會完全不一樣。配色跟字體的基礎,可以再搭配順手的配色工具與我們整理的最新網頁設計趨勢,把品味校準到當下。
如果是工具能力(知道要什麼,但工具做不出來),那就回到「你用什麼架站」。WordPress 支撐了網路上一大部分網站(依 W3Techs 到 2026 年中的統計),許多專案也會受佈景主題或頁面編輯器的能力限制。這時候選對編輯器,會影響哪些靈感能合理落地。頁面編輯器比較可以幫你挑出適合的工具。
還有一條更快的路:用 AI 協助把靈感落地。現在的 AI 網站生成工具已經可以做到「給它一個參考、它生出一個初版給你改」的程度,對非設計背景的朋友特別友善。這條路的優點是快,缺點是生出來的東西往往很「平均」,缺乏你品牌的獨特性。所以建議的做法是:用 AI 生初版,再用前面講的三層萃取法,把品牌材料一層一層換進去。對這條路有興趣,可以看我們實測的AI 網頁設計實戰。
換句話說,一個觀念:工具是手段,從來都不是目的。實務上常見到朋友陷入「工具焦慮」,一直換新工具、找新外掛,卻遲遲不動手把第一個版本做出來。找靈感、選工具、動手做,這三件事的時間比例應該落在 2 比 1 比 7。把七成的力氣放在實作與迭代,你的設計能力才會真的進步。再漂亮的靈感、再強的工具,不動手都是零。
一個室內設計專案的靈感蒐集流程示範
以室內設計公司的官網需求為例,客戶可能丟來一整個 Pinterest board,說「這些我都要」。Board 裡從北歐風客廳、工業風餐廳到極簡禪風臥室全混在一起,又擔心做出來的網站「沒有那種感覺」。
遇到這種 board,第一步不是打開編輯器,而是把那兩百張圖分成三堆:一堆是「氛圍參考」(想傳達的感覺,例如自然光、木質、留白),一堆是「版型參考」(喜歡的版面,例如大圖滿版、作品集卡片牆),一堆是「誤會參考」(跟網頁無關的室內照片,對設計沒有指導意義)。分完之後,真正的需求通常會浮現:要的不是「把這兩百張圖都放進網站」,而是「一個安靜、有質感、用大圖說話的作品集站台」。
接著把前面講的四象限分類套上去。氛圍參考那一堆,對照 SiteInspire 跟 Godly,找出幾個同樣走「安靜留白」路線的網站,確認「這種感覺在網頁上長這樣」。版型參考那一堆,對照 Land-book 跟 One Page Love,找出幾個室內設計公司或建築師事務所的真實案例,看看「作品集站台可以怎麼排」。全程沒有抄任何一個網站,而這樣整理下來,通常一看就能確認「對,就是這個味道」。
客戶給的參考,價值通常在於它透露出的需求,不只在外觀。你的工作是把客戶用圖片表達的感覺,翻譯成具體的設計決策。這個流程可以整理成一個表,直接拿來用:
| 階段 | 動作 | 產出 |
|---|---|---|
| 1. 盤點 | 把客戶給的所有參考分成氛圍、版型、誤會三堆 | 一句話講得出的真實需求 |
| 2. 對照 | 帶著需求去對應的靈感網站找同類案例 | 三到五個可對話的參考站 |
| 3. 萃取 | 用三層萃取法抽出結構與手法 | 一張骨架草圖與手法清單 |
| 4. 重組 | 套進客戶的品牌材料重新組合 | 獨一無二的初版設計 |
進階:把靈感蒐集變成可重複的工作流
很多人找靈感是「靈感來了才找」,這是被動式。更好的狀態是建立固定工作流,定期蒐集並整理,不必等到卡關才慌張地滑手機。底下分成日常、每週與專案三個節奏,也可以帶著團隊和客戶一起跑。
| 節奏 | 頻率 | 動作 | 目的 |
|---|---|---|---|
| 日常 | 每天十分鐘 | 固定逛一兩個網站,存喜歡的 | 養眼睛、累積語彙 |
| 週更 | 每週一次 | 整理參考、四象限歸檔、寫一句話筆記 | 消化而非囤積 |
| 專案 | 有案子才做 | 帶著具體問題開對應的抽屜 | 精準解題 |
日常:十分鐘的眼睛保養
每天給自己十分鐘,固定逛一到兩個靈感網站,看到喜歡的就存下來。重點不是數量,是規律。就像運動一樣,每天十分鐘會比一個月一次、一次兩小時有效太多。例如早上喝咖啡的時候順手滑一下 Godly 跟 SiteInspire,存個兩三張就收工。這十分鐘的目的是維持品味、累積語彙,不為了當下要解決什麼問題。久了你會發現,自己看一個網站的速度變快、判斷變準,這就是日常保養的複利。
週更:整理你的靈感庫
每週撥一段時間,把這週存下來的參考整理一次。用前面講的四象限分類歸檔,把重複的刪掉,把雞肋的清掉。這一步很重要,因為它強迫你去消化每一張參考,避免靈感庫淪為單純的囤積。整理的時候順手給每一張參考寫一句話筆記:它哪一點值得借鏡、它解決了什麼問題、可以怎麼用。這個筆記才是真正屬於你的資產,圖片只是觸發點。沒有筆記的參考,三個月後你再看到它,多半已經想不起當初為什麼存。
工具上,可以用 Figma 把參考資料整理成一個「靈感板」檔案,每個畫板對應一個專案,把相關參考貼進去加註。Figma 的好處是可以順便畫草圖、做 wireframe,從蒐集到草圖都在同一個地方完成,省去在多個工具之間切換。對 Figma 還不熟,可以從 Figma 的完整教學資源入門,把工作流程一步步搭起來。參考一多,單一 Figma 檔案也會開始難以翻找,這時可以把靈感庫搬進 Eagle,利用色彩搜尋與標籤找回截圖和原始檔,讓累積的靈感真正成為可重複使用的資產。
專案:帶著問題找答案
真正的專案來的時候,你已經有日常跟週更打好的底。這時候找靈感是帶著問題找答案:先像前面講的,用一句話講出自己卡在哪一關,再開對應的抽屜。因為你平常已經在養眼睛,這時候看一個網站的速度會快很多,一眼就能抓到它用了什麼手法、能不能解決你的問題。從被動等靈感切換到主動養靈感之後,卡關的時間通常會少一大半,因為很多答案其實早就存在靈感庫裡,只是等著被翻出來。
三個會把「參考」變成「抄襲」的地雷
找靈感這件事,做對了是專業,做錯了是災難。底下三個地雷,是實務上最常見、也最容易踩的抄襲陷阱。
地雷一:連配色字體一起搬
前面講三層萃取法的時候提過,結構可以借,配色跟字體是品牌識別,不能搬。但很多人做不到這一點,因為「它看起來就是漂亮」。判斷標準很簡單:如果你把兩個網站擺在一起,一個一般讀者會說「這兩個好像」,那就是抄,不是參考。要避開這個地雷,強迫自己換掉配色、換掉字體、換掉圖片風格,只留結構。只要做到這一點,相似度就會立刻掉下來。
地雷二:只收集,不整理
很多人有「靈感庫焦慮」,存了幾百張圖,卻從來不分類、不回頭看。這個習慣有兩個問題。第一,你的靈感庫會變成垃圾場,真的要用的時候找不到。第二,你會陷入「我已經看很多了,所以我很會設計」的錯覺,但實際上你只是囤積,沒有消化。實務做法是每個月清一次靈感庫,把過期的刪掉,把留下來的重新分類到前面講的四象限。寧可庫存小而精,也不要大而雜。
地雷三:追流行脫離品牌
每年都有當紅的設計風格,例如前陣子很紅的毛玻璃效果、近期的 Bento Grid 排版。追流行沒有錯,但流行要服務你的品牌,不是你的品牌去服務流行。常見的失誤是,傳統產業的品牌硬套上科技新創的設計語彙,結果看起來像穿了別人尺寸的衣服。判斷的標準是:這個流行有沒有強化你的品牌訊息?如果沒有,再炫也不要用。對當下流行有興趣的話,可以看我們整理過的網頁設計趨勢內容,但趨勢是參考用的,不是照單全收的購物清單。
關於找靈感,最常被問到的三個問題
一定要付費訂閱這些網站嗎?
不一定要付費。這些網站通常提供公開瀏覽或免費層級,付費功能則可能包含進階篩選、完整截圖、收藏或較高額度;各站方案會調整,使用前要看當期限制。先用免費功能確認自己真的需要哪些工作流程,再決定是否升級。
看了很多還是做不出來,怎麼辦?
這通常是看跟做之間的斷層。建議是強迫自己看完一個網站之後,立刻用三層萃取法做一次拆解,然後當天就用你手邊的工具(哪怕是 Canva、是 Figma、是頁面編輯器)試著把那個骨架做出來一次。哪怕做得很醜都沒關係,重點是走完「看、拆、做」的迴圈。你走過十次之後,手跟眼睛的連結就會建立起來,再做就不會那麼心虛。看的目的從來都是為了做,看而不做,等於沒看。
客戶給的參考跟我方向不一樣,怎麼辦?
這是接案者最常見的困境。做法是前面提過的翻譯法:把客戶的參考當成他表達需求的語言,先別把它當成他要的最終外觀。你先翻譯出他真正的需求(例如他想要的是專業感、不是那個特定藍色),再用你自己的專業判斷,找出最能滿足這個需求的設計方向。把這個邏輯講給客戶聽,多半能取得共識。記得,客戶找你是為了你的專業判斷,不是為了當他的代工滑鼠。這部分的心法,也可以參考我們整理給品牌網站的幾個關鍵建議。
你的下一步:建立自己的靈感藥櫃
找靈感這件事,講白一點就是建立一套可重複的系統。一旦系統建立起來,你就不會再每次都從零開始發慌,而是走過去拉開對的抽屜。底下是這週就可以開始做的五個動作。
- 盤點現有的靈感來源。把現在你會去找靈感的所有地方(Pinterest、書籤、手機截圖)全部列出來,誠實問自己:哪些真的用得到、哪些只是囤積。
- 用四象限分類重新歸檔。把留下來的參考,分成整站氛圍、版型骨架、行動版畫面、單一元件四大類。這個分類會成為你未來找資料的索引。
- 從七個網站挑三個固定回去翻。不要七個都用,那會回到過載狀態。依照你常做的專案類型,挑三個最對口的,變成你的固定口袋名單。
- 下一次卡關,先問問題再開網站。強迫自己在打開任何靈感網站之前,用一句話講出「我現在卡在哪一關」。講得出來,你才知道該開哪個抽屜。
- 對每一個參考跑一次三層萃取。拆結構、辨手法、用自己的材料重組。只要養成這個習慣,你就不會再把參考做成抄襲。
最後想跟你說一句實在話。找靈感這件事,短期看像在浪費時間,長期看卻是設計能力最關鍵的複利來源。你今天存下的每一個好參考、寫下的每一句手法筆記,都會在未來某一個專案裡回報你。設計這一行的天花板,往往不是軟體熟不熟練決定的,而是你的語彙庫有多深、眼界有多寬。這兩件事只能靠日常一點一滴養出來,沒有捷徑,也騙不了人。
設計卡關是常態,不是失誤。這七個網站、四象限分類與三層萃取法,可以組成一套持續更新的工作方式。實際用過幾輪後,再依自己的專案類型調整分類;藥櫃整理得越精準,卡關時就越容易找到下一步。