春哥技術部落格：作為一名UI/UX設計師，你一定想擁有一個足夠優秀的作品展示頁來呈現你所有的作品。你的潛在客戶需要看到的不止是你能做到什麼，還需要看到你是如何做設計，並且怎樣讓這些設計脫穎而出的。

雖然設計師宣傳自己的方式許許多多，但是一個能隨時訪問的設計作品展示頁面始終是最直觀、效果最好的呈現方式。感覺上設計一個頁面似乎並不複雜，但是事實上並非如此。

隨著越來越多的設計師開始將自己的作品集放到網站上，這類網站就開始將不同的設計技巧、技術融入其中。今天我們再來審視作品展示頁的設計和開發的時候，會發現已經有許多技巧和技術可供我們參考和學習了。而今天，我們將從BeTheme 的設計中汲取經驗。

客觀上來講，要建立一個作品展示頁，需要考慮到三個主要角色：

·確保你的作品展示頁能夠展示出你的設計技巧
·讓客戶信任你，看到你的設計能夠迎合他們的需求
·展現你作為這一優秀業務的提供者的優勢

打造優秀作品展示頁的必要步驟

選擇對的設計工具與素材當然是一件重要的事情，不過有些必要的步驟應當始終牢記：

·審慎對待網站的標題、文案和LOGO，它們直接影響著使用者開啟網站後的第一印象
·打造穩固的作品叢集，15~20個設計作品會帶來不錯的效果
·將平庸的設計作品過濾掉
·合理的組織分類能更好的幫助使用者瞭解你的作品
·將你獲獎的作品、得到的認可都展示出來
·讓佈局保持簡約直觀
·針對關於我們頁面和行為召喚按鈕等進行個性化設計

作品展示頁設計案例

作品展示頁應當精準地反映產品和服務本身，同時應該保持足夠的清爽和直觀，將令訪客分心的元素儘量去除。

著名的預構建主題網站 Be Theme 就是清爽直觀這一特色的完美呈現。網站頁頭最明顯的位置留給了這一設計機構的獨特價值主張（UVP），圖片的選取比較走心，選單的設計巧妙，作品展示和服務區域完美的組織到了一起，體驗也相當不錯。

Be Portfolio

無論你是網頁設計師、攝影師還是創意文案，又或者是營銷人員，你的作品展示頁應當傳達出如下資訊：

·展示整個設計歷程，而非單純的結果
·突出設計中的關鍵元素（假設你只有1分鐘來展示，那麼你想表達哪些部分？）

Be Freelancer

整個頁面的設計無疑是在突出作品展示的部分，所以這個部分的設計應當非常小心，因為使用者不會被其他的元素干擾，這個時候作品的任何一點瑕疵都會唉審視下被放大。

Be Parallax

這個作品展示頁明顯比前者更現代也更加流暢舒適。大量的留白讓視覺焦點集中，精緻的作品展示則讓使用者留下了非常不錯的第一印象。這樣的設計看起來簡單了點，但是視差滾動的使用讓頁面更加動態，更容易講述歷程，比起單純的文字+圖片更具有表現力。

Be Web Design

如果你的團隊專精於網頁設計，那麼這個預構建WP主題可以很好的迎合你的需求，它以更加創新的手法，構建出充滿信任感的頁面風格，佈局穩固，它給人的感覺也符合一個設計機構應有的印象。

Be App2

Be APP2 是一個能同移動端應用聯動的主題。優雅而簡約的移動端作品展示頁的體驗是怎樣的？它就是答案。

Be Lifestyle

如果你的作品展示更偏向生活方式的話，Be Lifestyle 的展現形式會更適合於你的網站。經歷、地點、人物等資訊和內容緊密結合到一起，資訊的組織和展示是這個預構建主題的特色。

BeMusic

音訊類的作品展示肯定和其他型別的略有不同，氛圍的營造，不同媒體型別的展示形式，以及更加富有活力的色彩搭配，我們可以從BeMusic 這個頁面的設計中學習到。

Be Theme

實際上，今天所展示的幾個例子是設計機構 Be Theme 所提供的200多個預構建網站主題中的一部分，他們的網站主題涵蓋了多個不同的領域，並且基本都是以作品展示為主。這些預構建主題都是完全可定製的，所以，有足夠多的可能性從中選取符合你需求，或者說足以定製成你想要的作品展示網站的樣子。

Be Carpenter

Be Charity

Be Sushi

Be Kebab

Be Perfume

Be Tea

Be Retouch

Be Mining

Be Print

Be Casino

Be HR

Be Holding

Be Accountant

結語

Be Theme 可能是目前最大的預構建主題網站，它所提供的功能和模組夠多，使用者群也同樣龐大。其中包含的模組也相當實用，比如 Muffin Builder 3 he Shortcode Generator 都讓網站的使用者無需程式碼就可以方便快捷地編輯、調整整個網站的功能、風格和細節。

即使你不打算使用這些預構建主題，Be Theme 所提供的這些設計案例也足夠你學習和借鑑了。

本文出自春哥技術部落格官網，轉載請註明出處，謝謝！