本篇主要介紹騰訊工業云平臺 WeMake 首頁主視覺及二級頁視覺部分的設計內容，重點講解了工業平臺從 1.0 到 2.0 的視覺迭代過程和使用的方法。
1. WeMake 平臺介紹
騰訊云工業云 wemake 平臺是騰訊產業互聯網的重要組成部分，致力于為企業提供端到端的云服務，覆蓋設計、研發、生產、銷售等環節；
提供工業 APP 應用市場，提供有行業競爭力的 APP 市場。在工業互聯網場景，騰訊云提供了工業能力底座，構建出面向數據智能、物聯網、工業 AI、5G、協同辦公等中臺能力。
2. 設計回溯
此次設計升級主要目的為基于 1.0 的視覺基礎上探索工業云的設計方向和提升平臺的整體視覺效果以及規范標準化落地。
根據煙臺工業云 1.0 的頁面進行視覺探索，煙臺工業云設計于 2019 年初，也是對于產業互聯網中的工業互聯網平臺進行的初步探索，而此次升級則是更深入的探索工業互聯網平臺的視覺方向可能與視覺提升的探究。工業項目的時間是耗時很長的，打通數據與功能需要經歷時間的驗證，但是本次視覺設計的使命是探究更前沿的設計趨勢，可以保持平臺在長久穩定的狀態。
3. 設計思路
通過 1.0 平臺的經驗，進行 2.0 視覺風格的遞進升級。1.0 的探索階段視覺上以素材為主來深化工業平臺的整體形象，在 3D 塑造方面也提供了一個方向性探索，那么 2.0 視覺風格也是以 3D 視覺的深化來進行了。除了在視覺層次上的提升外，也希望在視覺系統化和規范化上有新的進展，以便平臺搭建完成后續的運營工作的順利開展。
平臺設計中，首先的設計重點是平臺首頁的視覺升級；首頁的視覺表現就像是兩個人相識，和見面第一印象一樣重要。那么關鍵因素也是要給對方留下深刻印象和特點。
1. 發現設計問題
發現問題是早期設計分析中很重要的一個環節，為了更系統、全面的發現問題，在分析過程中采用了對應產品 5 個層次的方法。如下圖：
而集中在視覺表現層的主要問題如下：
- 視覺感受偏灰，智能化體現不足
- 版面過于死板，首頁視覺精細度不夠
- 顏色搭配過于單調
- 工業平臺特色不夠突出
2. 確立首頁優化目標
通過發現的界面問題的分析，確立首頁優化的目標。從現有的問題中，我們要形成新的視覺感受，那么就要確定解決目前問題的設計目標。為了塑造 wemake 的工業制造的平臺，設立的設計目標分別是深入品牌、強化智能、突出行業。
3. 用戶分析
工業平臺的用戶集中在企業決策人瀏覽和運營方使用人員使用。此類用戶特點是年齡基本在 30 以上，更偏好沉穩的科技風。設計中，我們需要給用戶傳遞的是“安全”、“信賴”、“價值”、“沉穩” 。
- 安全：安全是工業云平臺的基礎，注重數據安全性和平臺安全性是首要目標，也是用戶最看重的基本要求。
- 信賴：平臺需要傳遞給用戶值得信賴的感受；其可以拆解為品牌影響力和產品影響力。
- 價值：平臺需要傳遞給客戶最大的價值是功能和體驗上的高效性。
- 沉穩：平臺需要在風格上傳遞沉穩的感受。
4. 設計關鍵詞
頭腦風暴
通過用戶分析及結合產品功能特點，梳理設計關鍵詞：以“智能”“制造”發散擴展，展現騰訊云技術能力“數字化”“AI”等 ；展現行業特性“安全”“穩定” 等。
關鍵詞提煉
通過一系列的關鍵詞和行業特性，我們從工業數字化生產的核心“智造” 作為第一個關鍵詞 ；從決策鏈路和用戶分析我們總結了第二個關鍵詞“安全”；基于平臺工業生態搭建的愿景和定位，我們總結了第三個關鍵詞“鏈接”。
情緒版
情緒版的目的是輔助展現最終視覺表達效果，幫助設計師找到合適的視覺演進方向。此次項目中情緒版關鍵詞“工業”找出工業生產和制造的實際場景，感受實際的工業行業氛圍，“數字化”側重智能視覺的展現，抓住情緒版中點線面、空間以及色彩的智慧智能化表達。
1. 主視覺風格設定
主視覺設定思路：工業元素為基礎，增加數字化元素表達。banner 主視覺以主體型+背景的形式統一化表達；搭建平臺統一化視覺基礎；調節不同主圖形來表達不同二級頁內容。
視覺轉換
我們通過解構的手法來拆解視覺元素和進行視覺轉換；視覺轉換是很重要的一個步驟，通過設計分析的結論要通過視覺轉換來完成視覺的表達。也就是將關鍵詞轉換為材質質感顏色等視覺呈現上的關鍵詞。例如“工業”的關鍵詞轉化為材質，可以考慮到大部分工業的場景中視覺最多的會是金屬和水泥，也就是這兩種材質會在視覺上關聯關鍵詞。運用這種方法進行逐步推導轉化。
通過視覺轉換，先確定顏色和比例，為整體視覺奠定基礎基調。
視覺表現形式
在確定材質顏色后，還需要確定視覺表現形式；需要從眾多的視覺表現形式中尋找分析其特點并結合產品特點找尋合適的表現形式。
視覺元素
質感、顏色、形式確定后，那么最主要的“形”的選取也是很重要的；形也可以總結為視覺元素，是視覺的實際組成部分，不同的視覺元素經過設計師大腦對于美學的排列組合形成了最終的視覺呈現形式。舉例“機械臂” 既能展示“機械”的元素關鍵詞，也可以表現工業機械的材質，也可以表現現代工業的智能化。
2. 視覺探索
在進行視覺執行的過程中，必然不是一蹴而就的，而也是演進的調整的。視覺元素的呈現比例和主次層級也需要不斷探索對比而演進的。工業的視覺探索過程就是在不斷的調校中進行的。
我們最先介入設計的時候會以互聯網化的思維進行，重點突出智能化主體，但就會缺少明顯的行業特性，不能完全滿足設計目標；下一個階段便是融入工業場景，將更多的工業元素融入到背景中；再下一個階段是考慮平臺的屬性，需要更加宏觀的視角，而不僅僅是側重在細微場景中，所以采用更大的區域工業場景來展現平臺屬性，并嘗試平行透視來展現宏觀場景。最終在融合了品牌和多元素下形成了最終的精細化主視覺。
3. 主視覺方案
最終的主視覺方案貫穿“less is more”的理念，通過減少草案中視覺內容，集中展現各視覺元素的方式，使最終方案更突出。并且在進行視覺探索后，進行整體的視覺感受的調整：弱化調節強烈的工業場景感受，強化智能化數字平臺感受，添加了虛擬化數字界面的設計。
主視覺設計元素和色彩搭配按照之前分析的顏色和元素進行執行。
視覺對比
以下是 1.0 和 2.0 的主視覺對比。總結一下，比較重要的改進點是工業顏色的調整，使其更符合工業行業的特性，并在主視覺上深入細節設計。
作為平臺的設計，很重要的一點便是考慮平臺的視覺統一化設計，也是在主視覺完成后需要完善的重點內容。
1. 視覺統一化
統一化幾乎是所有平臺最基礎的目標也是最難以執行好的設計目標，我們經常會頭疼于如何將視覺統一化。那么最簡單的方法便是在最開始設計的時候將統一化考慮在內。視覺統一化的一大難點是差異化與統一元素的協調性；既要完成視覺的統一表達，又要有差異化表達。那么在進行工業平臺二級頁面主視覺統一化的時候，我們的設計思路是保留一致的基礎背景和主體元素，然后加入不同頁面差異點的視覺元素，最終形成可以統一化的視覺表達。
在進行視覺執行的時候，需要光感、空間感。材質質感統一；突出特性元素。
2. 設計延展策略
作為平臺，其視覺的是具有很強的豐富性的，如何形成統一的視覺體系，并提高視覺效果與執行效率也是要考慮的重要難題。那么在思考這部分的時候，我們的策略是建立素材庫來滿足不同的多維需求。在 3D 模型可以復用的情況下，既可以滿足統一性需求，也可以提高執行效率。但是素材也是需要長期積累而成的。
3. 視覺規范化
在視覺建立的過程中也要考慮到視覺規范化，也就是統一的視覺表達與規范的視覺語言呈現，在后續的設計協作以及設計復用時，提供有效的參考。
平臺類視覺迭代的過程中，除了要考慮執行層的內容還需要規劃平臺整體視覺風格甚至是設計語言。設計過程中不僅僅要專注于視覺層面的執行和推導，也要考慮到最終視覺感受的整體感；最終也是需要精細化調整不同關鍵詞的比例來達到最終平衡的視覺效果。
優設推薦關注“騰訊設計”官方公眾號，第一時間獲取騰訊的設計方法論
復制本文鏈接 文章為作者獨立觀點不代表優設網立場，未經允許不得轉載。
熱評 ??