伴隨著 coding 理念的全面公升級，coding 正構建起覆蓋構想到交付的全覆蓋工具鏈，使用者註冊即可實踐敏捷開發與 devops，提公升軟體交付質量與速度。
一直以來，coding 作為軟體研發領域的開拓者，**託管、cloud studio、pages 等作為極客代表的明星產品，使得 coding 的品牌氣質一直給人一種創新、前衛的印象。我們在新版官網的設計上仍然延續 「極客」 的概念。但同時，作為乙個面向企業的產品，coding 也需要展現出嚴謹可靠的一面。
官網是客戶對產品的第一印象，很多潛在客戶第一次對 coding 產生認知就是發生在 coding 的首頁。在這樣的背景下，coding 官網需要進行一次全面的公升級。
市面上企業級產品的官網設計大多以嚴肅、板正的形象為主。如何追求創新，在設計上尋求自身的核心競爭力；如何正確的傳遞資訊，將官網設計好看的同時又能促進轉化，給品牌帶來價值，是本次官網設計改版最大的挑戰。
coding 的官網主要由首頁、產品詳情頁、**、支援四個部分組成，這裡重點介紹官網首頁的設計理念。首頁展示的內容資訊就好比在給使用者講述乙個產品故事，如何讓使用者記住這個故事，光有乙個好的文案是不夠的，更需要通過優秀的設計傳達。
1、大膽的首屏設計抓住使用者視角
首屏是官網最核心的位置，如何在首屏抓住使用者視角至關重要。配圖部分我們仍然延續 2.5d 等寬插畫的風格。小人點亮螢幕操作一行**後，機器被發動開啟一站式 devops ，這一過程的動效十分契合 coding 的產品價值主張。
我們嘗試過兩種首屏排版方案，一種通欄式，一種異形式。但由於通欄式的單一鋪底排版讓首頁氣質看起來非常保守，不符合極客的品牌定位。為了追求創新，我們最終選擇了大膽的異形式排版方案。
2、流程化的功能介紹引導使用者閱覽
功能介紹是首頁最為重要的部分，這個部分能引導使用者初步了解公司產品功能，設計上需要給使用者營造良好的閱讀體驗。軟體研發從構思->計畫->開發->測試->交付整個流程，我們採用步驟式互動引導，帶領使用者一步一步瀏覽完整的功能介紹。另外每乙個模組都使用真實的配圖讓使用者有親自操作 coding 功能介面的感覺。
我們在設計上捨棄之前使用的背景色塊分割區域手法，採用了開放式的布局形式，讓這些散落的功能點描述看起來是乙個整體功能的介紹內容。背景圖案提煉出對應功能圖示的元素用來點綴，讓排版顯得更加生動活潑。
3、知名企業的客戶案例增強使用者信任感
這個模組裡我們將客戶故事和客戶 logo 牆一起展示，通過閱讀大客戶的案例故事，把使用者帶入不同行業的使用場景中去。企業客戶在選擇產品的時候看到與自己行業匹配的大企業也選擇該產品，有助於提公升好感度和信任度。
4、完善的產品詳情頁促進使用者深入了解產品
產品詳情頁通過簡介、特性、使用場景讓使用者能更深入地了解產品，頁面風格選擇比較中性的排版形式。值得一提的是我們為 coding 的產品功能設計了一組抽象的概念圖示，圖示的元素同時也用作首屏背景。這種強烈的對映關係能夠更好的統一整個介紹頁的風格。
coding 官網正式上線以來，經過近兩個月的觀察，官網跳出率比之前降低了 20%，充分證明這次公升級給官網帶來了價值。總結一下，提公升企業級官網體驗需要具備四個基本要素：吸引使用者眼球的首屏刺激訪問；條理清晰的功能介紹引導閱覽；知名企業的客戶案例增強信任；完善的產品詳情頁促進轉化。
以上是我們團隊對這次改版的總結，希望能夠給設計師朋友們提供一些參考價值。
首頁欣賞：
《coding 2.0 企業級持續交付解決方案》
《coding 2.0：為什麼我們需要 devops》
coding 2.0 服務公升級：一站式服務體系助力企業研發上雲
點選使用 coding 2.0體驗 devops 全工具鏈敏捷研發
如何通過Get請求給後台傳遞陣列
位址的如下格式 由上面的位址可以看出所傳遞的陣列就是ids 了，然後就是展示一下後台怎麼接收這個陣列。話不多說上 pullmany public void pullmany requestparam value ids string ids 輸出的結果正是1322455795329273856 和1...
如何通過設計挖掘測試用例
根據目前做的測試專案想總結一些如何對非業務行的專案做測試分析的方法，前幾天在對公司培訓是也提到了如何根據設計去挖掘測試用例，針對那些非業務行的專案是很有必要去思考和研究的，那麼什麼是非業務行系統呢？其實也不準確，是否應該叫非支援商業業務的系統，其實就是區分那些針對銀行，保險，電信等這些和行業邦定非常...
給設計師的建議 如何應對不同客戶
平面設計師和網頁設計師要面對多種多樣的客戶型別，有些愛打聽，有些自以為是，還有一些根本一無所知。今天，我們就對他們分類，並教給一些應對技巧。這些技巧來自於我個人的工作經驗。在開始了解顧客的心理之前，我們需要了解一些事情。我們應先了解一些需要在承諾之前完成的事情。需要完成的事有 資料 資料對於自由職業...