從產品化的思維，聊聊如何設計企業官網
本文作者將結合自己的工作經驗總結了一下官網設計的tips。
官網，可以理解成企業的IP，或者企業的另一張“臉”，記載企業的概況和發展歷程。好的官網，能夠充分展現其內涵，給人以美的感受；而糟糕的官網，不僅不能有效表達企業的願景，更有可能將合作和發展機會拒之門外；至於沒有官網，那就真的是“我XX還能說什麼？你是有多懶！！”。
筆者很有幸參與到公司此次官網的改版，故總結一下官網設計的tips。將官網當做一個產品，圍繞“目的、定位、人群和功能”要素進行設計，
產品規劃1、需求分析
官網，是企業面向大眾的視窗，能夠傳達給閱讀者企業的形象，展現自身實力，以及解決用戶疑問。 不過，在規劃官網的時候，需要瞭解企業所處階段和官網改版的目的：
對於初創公司新上線的官網，需要以最小最優產品（MVP）方式呈現公司的核心業務，2、目標人群最終使用產品的使用者（包括企業客戶和大眾使用者），這一類人群重視產品的使用感受；投資方和業務相關人群，可能有進一步進行企業合作洽談的機會；面試人群，
3、總體定位
雖然各家企業的發展業務不同，但官網總離不開以下資訊：slogan口號，核心業務，優勢，產品簡介，公司簡介等基礎資訊。
筆者所在公司是一家大資料行銷公司，此次官網專案主要內容可以總結為幾點：優化視覺表現；突出行銷業務；豐滿產品線。
產品設計1、產品風格確定
首先，
Adobe官網
蘋果官網
某官網
在我司官網的風格設計中，則考慮了產品的定位：資料驅動行銷。既要體現出資料採擷的技術優勢，又要貼近行銷。因此，除表現科技感之外，可以採用較為清新簡約的配色，最好能跟企業的主題色對應。
我司官網
2、產品框架
產品框架建立的流程分為：
拆解功能 → 確定功能優先順序 → 聚合重組
將官網所有的功能平鋪成以下關鍵字：index（首頁）marketing（行銷）DSP（廣告管理平臺）DMP（資料管理平臺）SSP（供應方平臺） ADX（廣告交易平臺） Software（軟體產品） solution（解決方案）Labs（實驗室）intro（公司介紹）case（優秀案例）News（公司新聞）。boss大大說儘量把功能都展示在功能表上，功能表多不怕，一行放的下，做出來了就要讓世界看見！ Orz 向大佬低頭。
功能關鍵字
在產品設計中，每個功能都突出，其實就等於沒重點 。在MUJI無印良品的設計中，學會“克制”，不過分邀功，而是用體驗和細節去打動用戶。也就是說，不能一昧橫向擴充，還需要縱向加深，增強層次感。
回歸到我們的官網本身，需要對功能進行優先順序劃分。綜合此次改版目標：突出行銷和豐滿產品線，因此把行銷單獨作為一個功能表板塊，放置在首頁之後，把公司介紹放在最後。其次，根據關鍵字的屬性聚合出分類，把DSP，DMP，ADX，SSP聚合成數位行銷產品；把Labs歸入到軟體產品同樣有技術研究屬性的功能下；把案例歸入到行銷推廣服務下。最後提煉出來的產品框架如下：
3、核心頁面設計
首頁設計：
重點展現企業的願景、產品的定位、實力公司的業務介紹，使用戶有頂層的感受把首頁當成整個官網各個功能表功能的概述，並提供便捷入口，即目錄式的指引首頁佈局草稿：
行銷推廣服務：
作為核心業務模組，通過概述頁展示行銷推廣服務涵蓋的範圍和優勢將廣告行銷涉及的物件分頁面進行闡述，分為媒體、人群、運營、案例頁面，以便能深入闡述每個物件的優勢確保頁面統一性，各個功能模組儘量採取標題及簡單文案解釋、附帶圖片的方式產品驗證
每次上線前驗證時，都是一臉懵逼，內心OS：無fuck說，這真的是我當時設計的嗎！！！不過還是乖乖去測試bug和提意見，死磕功能和體驗，Orz 向研發大大低頭。整個驗證過程就是不斷提問題的過程：
功能路徑：功能是否有欠缺？跳轉路徑是否正確？文案：語句是否通順，不存在歧義？風格UI：頁面主圖和配圖的風格是否和模組定位相對應？佈局和設計稿是否有出入？相容性：考慮移動端的適配問題，頁面是否會錯亂？性能：頁面跳轉時間、圖片載入時間是否太長？寫在最後
這篇文章對官網改版做了一個簡單的複盤，工作一年來，視角漸漸從【功能倒推介面】轉化為【從產品定位自頂向下設計產品】，工作精力也從【體驗參考無數競品】轉移到【用戶行為和心理分析】。
《如何閱讀一本書》有這樣一句話：
付錢擁有一本書，不過是真正擁有這本書的前奏而已。
同樣，每一項技能能力只有在一個個“然後”（不斷思考、總結）才能創造價值。但行好事，莫問前程。
作者：christy_ma，簡書：Christy_Ma
本文由 @christy_ma 原創發佈于人人都是產品經理。未經許可，禁止轉載。
某官網
在我司官網的風格設計中，則考慮了產品的定位：資料驅動行銷。既要體現出資料採擷的技術優勢，又要貼近行銷。因此，除表現科技感之外，可以採用較為清新簡約的配色，最好能跟企業的主題色對應。
我司官網
2、產品框架
產品框架建立的流程分為：
拆解功能 → 確定功能優先順序 → 聚合重組
將官網所有的功能平鋪成以下關鍵字：index（首頁）marketing（行銷）DSP（廣告管理平臺）DMP（資料管理平臺）SSP（供應方平臺） ADX（廣告交易平臺） Software（軟體產品） solution（解決方案）Labs（實驗室）intro（公司介紹）case（優秀案例）News（公司新聞）。boss大大說儘量把功能都展示在功能表上，功能表多不怕，一行放的下，做出來了就要讓世界看見！ Orz 向大佬低頭。
功能關鍵字
在產品設計中，每個功能都突出，其實就等於沒重點 。在MUJI無印良品的設計中，學會“克制”，不過分邀功，而是用體驗和細節去打動用戶。也就是說，不能一昧橫向擴充，還需要縱向加深，增強層次感。
回歸到我們的官網本身，需要對功能進行優先順序劃分。綜合此次改版目標：突出行銷和豐滿產品線，因此把行銷單獨作為一個功能表板塊，放置在首頁之後，把公司介紹放在最後。其次，根據關鍵字的屬性聚合出分類，把DSP，DMP，ADX，SSP聚合成數位行銷產品；把Labs歸入到軟體產品同樣有技術研究屬性的功能下；把案例歸入到行銷推廣服務下。最後提煉出來的產品框架如下：
3、核心頁面設計
首頁設計：
重點展現企業的願景、產品的定位、實力公司的業務介紹，使用戶有頂層的感受把首頁當成整個官網各個功能表功能的概述，並提供便捷入口，即目錄式的指引首頁佈局草稿：
行銷推廣服務：
作為核心業務模組，通過概述頁展示行銷推廣服務涵蓋的範圍和優勢將廣告行銷涉及的物件分頁面進行闡述，分為媒體、人群、運營、案例頁面，以便能深入闡述每個物件的優勢確保頁面統一性，各個功能模組儘量採取標題及簡單文案解釋、附帶圖片的方式產品驗證
每次上線前驗證時，都是一臉懵逼，內心OS：無fuck說，這真的是我當時設計的嗎！！！不過還是乖乖去測試bug和提意見，死磕功能和體驗，Orz 向研發大大低頭。整個驗證過程就是不斷提問題的過程：
功能路徑：功能是否有欠缺？跳轉路徑是否正確？文案：語句是否通順，不存在歧義？風格UI：頁面主圖和配圖的風格是否和模組定位相對應？佈局和設計稿是否有出入？相容性：考慮移動端的適配問題，頁面是否會錯亂？性能：頁面跳轉時間、圖片載入時間是否太長？寫在最後
這篇文章對官網改版做了一個簡單的複盤，工作一年來，視角漸漸從【功能倒推介面】轉化為【從產品定位自頂向下設計產品】，工作精力也從【體驗參考無數競品】轉移到【用戶行為和心理分析】。
《如何閱讀一本書》有這樣一句話：
付錢擁有一本書，不過是真正擁有這本書的前奏而已。
同樣，每一項技能能力只有在一個個“然後”（不斷思考、總結）才能創造價值。但行好事，莫問前程。
作者：christy_ma，簡書：Christy_Ma
本文由 @christy_ma 原創發佈于人人都是產品經理。未經許可，禁止轉載。