一、概述
整理圖案圖形設計文檔有助于更好的傳遞支付寶品牌的視覺語言、保持平臺的統(tǒng)一性、提升團隊工作效率和打磨細節(jié)體驗。
圖案圖形是支付寶品牌dna的重要部分，通過幾何圖形(矩形、圓形、三角形)的組合，造型鮮明，可以傳遞出支付寶品牌的安全感、信賴感和專業(yè)感;基礎的幾何圖形通過不同的靈活組合，可以創(chuàng)造出千變?nèi)f化的造型感，符合想象力的品牌調(diào)性;30°角度給人以速度感，圖案圖形通過轉(zhuǎn)角位30°倍數(shù)的原則做視覺處理可以傳遞支付寶的便捷調(diào)性。通過以上描述打造出來的圖案圖形可以傳遞支付寶安全感、信賴感和專業(yè)感的品牌調(diào)性。
二、原則關(guān)鍵詞
幾何圖形、方正穩(wěn)重、30°倍數(shù)、外圓內(nèi)方。
1.圖標
必須由幾何圖形所組成，形狀鮮明、方正穩(wěn)重感、對稱且一致。
出現(xiàn)轉(zhuǎn)角的地方必須為30°的倍數(shù)。
外圓內(nèi)方。
2.卡片、底圖
卡片為矩形，轉(zhuǎn)角為圓角，圓角角度要小。
3.插圖
必須符合集團螞蟻形象規(guī)范。
螞蟻的形體有3像素的描邊，色值為333333。
插圖中帶有光影明暗變化。
4.圖標規(guī)范
規(guī)范一：icon的尺寸
功能和宮格：48*48px
頭部：60*60px
規(guī)范二：icon特征
必須由幾何圖形所組成，形狀鮮明、方正穩(wěn)重感、對稱且一致。
出現(xiàn)轉(zhuǎn)角的地方必須為30°的倍數(shù)。
規(guī)范三：端點的平行關(guān)系
圖形線條或塊面結(jié)束處要和圖標成平行關(guān)系。
icon邊緣外圓內(nèi)方(圓角為2px)。
三、卡片/底圖
卡片樣式為矩形(包括按鈕圓角)，圓角為4px。
1.插圖規(guī)范
規(guī)范一：造型設計
頭部觸須更飽滿和圓潤。
嘴巴和嘴部結(jié)構(gòu)要適當弱化。
規(guī)范二：色彩構(gòu)成
色彩構(gòu)成需要遵守alipaydesingdna輔助色系規(guī)范。
規(guī)范三：漸變構(gòu)成
色彩構(gòu)成需要遵守alipaydesingdna輔助色系規(guī)范。
規(guī)范四：在頁面中使用的比例規(guī)范示意
插圖在通用報錯頁的整體視覺范圍為400x400px。
插圖的尺寸范圍為290x290px。
考慮到螞蟻動作和形態(tài)的多樣性允許在290px的尺寸外有距上下或者距左右55px的出血。