電商平臺品牌形象視覺識別規(guī)則一、概述

電商平臺品牌形象視覺識別（VI）規(guī)則是企業(yè)在數(shù)字化環(huán)境中建立統(tǒng)一、規(guī)范的品牌形象的基礎(chǔ)。通過系統(tǒng)化的視覺設(shè)計和管理，可以增強品牌認知度、提升用戶體驗、塑造專業(yè)形象。本規(guī)則旨在明確品牌視覺元素的使用標準，確保在各類平臺界面、營銷活動及用戶交互中保持一致性。

二、核心視覺元素規(guī)范

（一）品牌標志

1.正確使用：標志應(yīng)保持完整，不得隨意裁剪、變形或添加其他圖案。

2.環(huán)境要求：

(1)線上平臺：標志需放置在頁面頂部導(dǎo)航欄或底部版權(quán)區(qū)域，確保不因頁面滾動而遮擋核心內(nèi)容。

(2)活動海報：標志需與背景形成對比，建議使用白底或透明背景版本。

3.禁止行為：

(1)不得將標志與其他品牌標志混合使用。

(2)避免在低分辨率環(huán)境下使用矢量格式標志。

（二）標準色系統(tǒng)

1.主色：0056b3（深藍），用于品牌按鈕、標題等關(guān)鍵視覺元素。

2.輔助色：f5f5f5（淺灰），用于背景和分隔線，保持界面簡潔。

3.禁用色：ff0000（亮紅），僅用于特殊警示場景，日常使用需謹慎。

（三）輔助圖形

1.應(yīng)用場景：產(chǎn)品列表頁、分類篩選圖標等。

2.規(guī)范要求：

(1)圖形線條粗細統(tǒng)一為1.5px。

(2)顏色需與標準色系統(tǒng)匹配，優(yōu)先使用主色。

三、平臺界面設(shè)計規(guī)范

（一）首頁布局

1.頂部區(qū)域：品牌標志居左，搜索欄居中，用戶頭像居右。

2.內(nèi)容區(qū)：模塊間距≥20px，確保視覺呼吸感。

3.底部區(qū)域：版權(quán)信息、服務(wù)條款等，字號不小于12px。

（二）產(chǎn)品詳情頁

1.規(guī)范要求：

(1)產(chǎn)品圖片需保持統(tǒng)一圓角（10px），放大倍數(shù)不得低于3倍。

(2)商品名稱使用加粗字體，字號≥18px。

2.禁止行為：

(1)不得在圖片上疊加無關(guān)文字。

(2)避免使用動態(tài)效果干擾用戶瀏覽。

（三）移動端適配

1.字體大?。簶祟}字號≥16px，正文≥14px。

2.交互元素：按鈕點擊區(qū)域最小尺寸為44x44px。

3.響應(yīng)式設(shè)計：頁面元素需根據(jù)屏幕寬度自動調(diào)整布局。

四、營銷活動視覺規(guī)范

（一）活動海報

1.布局要求：

(1)標題與主圖占比分別為30%和70%。

(2)活動時間需用醒目字體標注，如“2023.12.01-12.31”。

2.色彩搭配：主色與輔助色比例建議為2:1。

（二）社交媒體推廣

1.視頻規(guī)范：

(1)視頻時長控制在15-30秒，含品牌標志動態(tài)展示。

(2)背景音樂需符合品牌調(diào)性（如輕快純音樂）。

2.文案配合：

(1)每條推文需含統(tǒng)一話題標簽，如XX品牌雙十一。

(2)互動問答中需使用品牌標準表情包。

五、執(zhí)行與監(jiān)督

（一）使用流程

1.下載標準素材：通過官方VI系統(tǒng)獲取最新版本文件。

2.內(nèi)部審核：設(shè)計需求需提交至品牌部門審批。

3.版本管理：定期更新VI手冊（建議每年一次）。

（二）違規(guī)處理

1.未經(jīng)授權(quán)使用VI元素，將按合同條款扣除相應(yīng)積分。

2.重大違規(guī)（如標志嚴重變形）需立即整改并通報。

六、附錄

（一）標準素材清單

1.標志：標準圖形、白底圖形、小圖標等。

2.色值表：RGB、HEX格式完整色板。

3.輔助圖形：分類應(yīng)用示例。

（二）參考案例

1.成功案例：XX平臺雙十一活動視覺完整展示。

2.錯誤案例：常見VI使用誤區(qū)解析。

一、概述

電商平臺品牌形象視覺識別（VI）規(guī)則是企業(yè)在數(shù)字化環(huán)境中建立統(tǒng)一、規(guī)范的品牌形象的基礎(chǔ)。通過系統(tǒng)化的視覺設(shè)計和管理，可以增強品牌認知度、提升用戶體驗、塑造專業(yè)形象。本規(guī)則旨在明確品牌視覺元素的使用標準，確保在各類平臺界面、營銷活動及用戶交互中保持一致性。一個清晰、統(tǒng)一的視覺系統(tǒng)有助于用戶快速識別品牌，并在不同設(shè)備和場景下獲得一致的體驗，從而建立品牌忠誠度。本規(guī)則適用于所有內(nèi)部員工、合作設(shè)計方及平臺運營人員。

二、核心視覺元素規(guī)范

（一）品牌標志

1.正確使用：標志應(yīng)保持完整，不得隨意裁剪、變形或添加其他圖案。在應(yīng)用時，應(yīng)確保標志的清晰度，避免在小尺寸或低分辨率環(huán)境下使用導(dǎo)致模糊。標志的位置應(yīng)遵循視覺重心原則，通常放置在頁面最顯眼或最穩(wěn)定的區(qū)域，如網(wǎng)站頂部導(dǎo)航欄左上角、APP啟動頁等。

2.環(huán)境要求：

(1)線上平臺：

-網(wǎng)站端：標志應(yīng)放置在頁面頭部固定區(qū)域，確保在頁面滾動時用戶始終能看到。寬度不應(yīng)小于50px，高度不應(yīng)小于30px。在移動端適配時，應(yīng)保證在折疊菜單或全屏搜索時標志依然可見。

-APP端：啟動頁、設(shè)置頁的Logo區(qū)應(yīng)使用高清版本（建議300dpi以上）。在主界面標簽欄，標志尺寸需與系統(tǒng)規(guī)范匹配。

(2)活動海報：標志需與背景形成對比，建議使用白底或透明背景版本。在組合設(shè)計中，標志的層級應(yīng)高于其他圖形元素。

3.禁止行為：

(1)不得將標志與其他品牌標志混合使用，如將本品牌標志與供應(yīng)商標志并列展示。

(2)避免在低分辨率環(huán)境下使用矢量格式標志，應(yīng)提供適用于Web和打印的優(yōu)化格式（如PNG、SVG）。

(3)不得對標志進行藝術(shù)化處理，如添加陰影、描邊或改變標準比例。

（二）標準色系統(tǒng)

1.主色：0056b3（深藍），具有專業(yè)、信任的聯(lián)想，用于品牌按鈕、標題、關(guān)鍵信息強調(diào)等。

2.輔助色：f5f5f5（淺灰），用于背景和分隔線，保持界面簡潔，提升內(nèi)容可讀性。

3.強調(diào)色：ff9500（橙色），用于次要按鈕、促銷信息提示，吸引注意力但不過度干擾。

4.禁用色：ff0000（亮紅），僅用于特殊警示場景，如訂單錯誤提示，日常使用需謹慎。000000（純黑）僅在特殊設(shè)計需求經(jīng)批準后方可使用，一般界面文本推薦使用333333或更深色系以確保易讀性。

（三）輔助圖形

1.應(yīng)用場景：產(chǎn)品列表頁的分類篩選圖標、活動頁的裝飾邊框、用戶中心的指示路徑等。

2.規(guī)范要求：

(1)圖形線條粗細統(tǒng)一為1.5px，保持簡潔利落。

(2)顏色需與標準色系統(tǒng)匹配，優(yōu)先使用主色（0056b3）或強調(diào)色（ff9500），輔助色（f5f5f5）用于透明或描邊效果。

(3)圖標風格統(tǒng)一為線性或面性扁平化設(shè)計，避免使用復(fù)雜紋理。

3.禁止行為：

(1)不得使用與品牌調(diào)性不符的復(fù)雜圖形風格（如手繪、像素風，除非有特殊設(shè)計需求并經(jīng)批準）。

(2)輔助圖形不得遮擋核心內(nèi)容或干擾用戶操作。

三、平臺界面設(shè)計規(guī)范

（一）首頁布局

1.頂部區(qū)域：

-品牌標志：居左，占據(jù)導(dǎo)航欄寬度約15%，確保在所有頁面可見。

-搜索欄：居中，采用白色背景+深藍邊框設(shè)計，搜索按鈕使用標準色（0056b3）填充。

-用戶頭像/購物車：居右，圖標統(tǒng)一使用標準尺寸（24px），懸停時出現(xiàn)下拉菜單提示。

2.內(nèi)容區(qū)：

-模塊間距：各功能模塊（如新品上市、熱銷推薦）之間保持至少20px的垂直或水平間距，確保視覺呼吸感。

-排版層級：使用不同字號（標題≥22px，副標題≥18px，正文≥14px）和顏色（標題用主色0056b3，正文用333333）區(qū)分信息重要性。

3.底部區(qū)域：

-版權(quán)信息：居中，使用小號字體（≥12px），顏色為666666。

-服務(wù)條款/隱私政策：使用標準小圖標+文字鏈接，顏色與正文相同。

（二）產(chǎn)品詳情頁

1.規(guī)范要求：

(1)產(chǎn)品圖片：

-圓角處理：所有產(chǎn)品主圖和縮略圖統(tǒng)一使用10px圓角，使用PNG格式保證透明背景。

-縮放功能：支持至少3倍放大，放大區(qū)域需清晰展示產(chǎn)品細節(jié)（如材質(zhì)紋理、尺寸標注）。

-圖片切換：左右滑動切換，指示器位于底部，默認高亮當前圖片。

(2)商品信息：

-商品名稱：加粗字體，字號≥18px，置于圖片下方居中。

-價格：主色（0056b3）顯示原價，強調(diào)色（ff9500）顯示優(yōu)惠價或折扣信息。

-商品描述：分點列出，使用項目符號或數(shù)字編號，段落間距≥15px。

2.禁止行為：

(1)不得在產(chǎn)品圖片上疊加無關(guān)文字、促銷標簽（標簽需通過官方工具添加）。

(2)避免使用閃爍、彈窗等動態(tài)效果干擾用戶瀏覽。

(3)商品評價區(qū)的星級顯示顏色必須與品牌規(guī)范一致（如4星及以上為00b24c，低于4星為ff9500）。

（三）移動端適配

1.字體大?。?/p>

-標題字號≥16px，確保在小型屏幕上可清晰閱讀。

-正文字號≥14px，行高建議1.5倍字號（如21px），提升閱讀舒適度。

2.交互元素：

-按鈕點擊區(qū)域最小尺寸為44x44px，重要操作按鈕（如下單、加入購物車）可擴展至60x60px。

-輸入框內(nèi)邊距建議為8px，確保手指操作不誤觸。

3.響應(yīng)式設(shè)計：

-頁面元素需根據(jù)屏幕寬度自動調(diào)整布局，關(guān)鍵信息（如價格、購買按鈕）在任何尺寸屏幕上均不可被滾動隱藏。

-圖片加載采用懶加載機制，優(yōu)先顯示首屏內(nèi)容。

四、營銷活動視覺規(guī)范

（一）活動海報

1.布局要求：

(1)標題與主圖占比：標題區(qū)域占整體高度的20%，主圖占80%。

(2)活動時間：使用加粗字體（≥24px）和主色（0056b3）標注，格式為“2023.12.01-12.31”。

(3)行動號召（CTA）：按鈕使用強調(diào)色（ff9500），文字為“立即搶購”，字號≥18px。

2.色彩搭配：主色（0056b3）占比60%，輔助色（f5f5f5）用于背景，強調(diào)色（ff9500）用于CTA按鈕，形成視覺層次。

3.字體規(guī)范：

-標題字體：無襯線粗體（如思源黑體中粗）。

-正文字體：無襯線常規(guī)（如思源黑體常規(guī)）。

（二）社交媒體推廣

1.視頻規(guī)范：

(1)視頻時長：控制在15-30秒，首3秒內(nèi)必須出現(xiàn)品牌Logo和活動名稱。

(2)背景音樂：選擇輕快、無版權(quán)風險的純音樂，音量適中，不干擾主文案。

(3)視頻風格：統(tǒng)一采用品牌主色調(diào)調(diào)色板，如背景使用f0f7ff（淺藍）。

2.文案配合：

(1)每條推文需含統(tǒng)一話題標簽，如XX品牌雙十一狂歡節(jié)。

(2)互動問答中需使用品牌標準表情包（如微笑、禮物等，需提前設(shè)計）。

(3)文案排版：段落間空一行，關(guān)鍵信息（如優(yōu)惠力度）使用加粗或不同顏色突出。

五、執(zhí)行與監(jiān)督

（一）使用流程

1.下載標準素材：通過官方VI系統(tǒng)（如品牌云臺）獲取最新版本文件，禁止下載過期版本。

2.內(nèi)部審核：

-設(shè)計需求需提交至品牌部門，填寫《VI使用申請表》，說明使用場景、數(shù)量及預(yù)期效果。

-品牌部門在2個工作日內(nèi)完成審核，重大設(shè)計需經(jīng)設(shè)計總監(jiān)批準。

3.版本管理：

-定期更新VI手冊（建議每年一次）及線上VI庫，確保所有素材均為最新。

-建立素材使用臺賬，記錄每次VI元素調(diào)用情況。

（二）違規(guī)處理

1.輕微違規(guī)（如標志輕微變形）：通過官方渠道發(fā)布《VI使用規(guī)范提醒》，要求限期整改。

2.嚴重違規(guī)（如標志被替換、使用未經(jīng)授權(quán)的色值）：需立即停止使用，并在全平臺發(fā)布更正公告，通報處理結(jié)果。

3.持續(xù)違規(guī)者：按合作合同或員工手冊扣除相應(yīng)積分或進行內(nèi)部培訓(xùn)。

六、附錄

（一）標準素材清單

1.標志：

-標準圖形（矢量AI/EPS格式）

-白底圖形（PNG格式）

-小圖標（SVG格式，用于移動端）

-矢量輪廓（用于特殊設(shè)計）

2.色值表：

-RGB：0056b3（主色）、f5f5f5（輔助色）、ff9500（強調(diào)色）

-HEX：0056b3、f5f5f5、ff9500

-CMYK（用于印刷）：C:60M:20Y:10K:90（主色示例）

3.輔助圖形：

-分類篩選圖標（PNG格式，包含分類名稱）

-裝飾邊框（SVG格式，可組合使用）

-路徑指示圖形（PNG格式）

（二）參考案例

1.成功案例：

-XX平臺“夏日清倉”活動海報完整視覺呈現(xiàn)（包含色彩搭配、字體使用、布局規(guī)范）。

-XX平臺APP2.0版本界面改版前后對比分析（重點展示VI元素統(tǒng)一性提升）。

2.錯誤案例：

-常見VI使用誤區(qū)清單（如標志變形、色值偏差、輔助圖形濫用等）。

-外部合作方提供的違規(guī)設(shè)計稿截圖及分析。

一、概述

電商平臺品牌形象視覺識別（VI）規(guī)則是企業(yè)在數(shù)字化環(huán)境中建立統(tǒng)一、規(guī)范的品牌形象的基礎(chǔ)。通過系統(tǒng)化的視覺設(shè)計和管理，可以增強品牌認知度、提升用戶體驗、塑造專業(yè)形象。本規(guī)則旨在明確品牌視覺元素的使用標準，確保在各類平臺界面、營銷活動及用戶交互中保持一致性。

二、核心視覺元素規(guī)范

（一）品牌標志

1.正確使用：標志應(yīng)保持完整，不得隨意裁剪、變形或添加其他圖案。

2.環(huán)境要求：

(1)線上平臺：標志需放置在頁面頂部導(dǎo)航欄或底部版權(quán)區(qū)域，確保不因頁面滾動而遮擋核心內(nèi)容。

(2)活動海報：標志需與背景形成對比，建議使用白底或透明背景版本。

3.禁止行為：

(1)不得將標志與其他品牌標志混合使用。

(2)避免在低分辨率環(huán)境下使用矢量格式標志。

（二）標準色系統(tǒng)

1.主色：0056b3（深藍），用于品牌按鈕、標題等關(guān)鍵視覺元素。

2.輔助色：f5f5f5（淺灰），用于背景和分隔線，保持界面簡潔。

3.禁用色：ff0000（亮紅），僅用于特殊警示場景，日常使用需謹慎。

（三）輔助圖形

1.應(yīng)用場景：產(chǎn)品列表頁、分類篩選圖標等。

2.規(guī)范要求：

(1)圖形線條粗細統(tǒng)一為1.5px。

(2)顏色需與標準色系統(tǒng)匹配，優(yōu)先使用主色。

三、平臺界面設(shè)計規(guī)范

（一）首頁布局

1.頂部區(qū)域：品牌標志居左，搜索欄居中，用戶頭像居右。

2.內(nèi)容區(qū)：模塊間距≥20px，確保視覺呼吸感。

3.底部區(qū)域：版權(quán)信息、服務(wù)條款等，字號不小于12px。

（二）產(chǎn)品詳情頁

1.規(guī)范要求：

(1)產(chǎn)品圖片需保持統(tǒng)一圓角（10px），放大倍數(shù)不得低于3倍。

(2)商品名稱使用加粗字體，字號≥18px。

2.禁止行為：

(1)不得在圖片上疊加無關(guān)文字。

(2)避免使用動態(tài)效果干擾用戶瀏覽。

（三）移動端適配

1.字體大小：標題字號≥16px，正文≥14px。

2.交互元素：按鈕點擊區(qū)域最小尺寸為44x44px。

3.響應(yīng)式設(shè)計：頁面元素需根據(jù)屏幕寬度自動調(diào)整布局。

四、營銷活動視覺規(guī)范

（一）活動海報

1.布局要求：

(1)標題與主圖占比分別為30%和70%。

(2)活動時間需用醒目字體標注，如“2023.12.01-12.31”。

2.色彩搭配：主色與輔助色比例建議為2:1。

（二）社交媒體推廣

1.視頻規(guī)范：

(1)視頻時長控制在15-30秒，含品牌標志動態(tài)展示。

(2)背景音樂需符合品牌調(diào)性（如輕快純音樂）。

2.文案配合：

(1)每條推文需含統(tǒng)一話題標簽，如XX品牌雙十一。

(2)互動問答中需使用品牌標準表情包。

五、執(zhí)行與監(jiān)督

（一）使用流程

1.下載標準素材：通過官方VI系統(tǒng)獲取最新版本文件。

2.內(nèi)部審核：設(shè)計需求需提交至品牌部門審批。

3.版本管理：定期更新VI手冊（建議每年一次）。

（二）違規(guī)處理

1.未經(jīng)授權(quán)使用VI元素，將按合同條款扣除相應(yīng)積分。

2.重大違規(guī)（如標志嚴重變形）需立即整改并通報。

六、附錄

（一）標準素材清單

1.標志：標準圖形、白底圖形、小圖標等。

2.色值表：RGB、HEX格式完整色板。

3.輔助圖形：分類應(yīng)用示例。

（二）參考案例

1.成功案例：XX平臺雙十一活動視覺完整展示。

2.錯誤案例：常見VI使用誤區(qū)解析。

一、概述

電商平臺品牌形象視覺識別（VI）規(guī)則是企業(yè)在數(shù)字化環(huán)境中建立統(tǒng)一、規(guī)范的品牌形象的基礎(chǔ)。通過系統(tǒng)化的視覺設(shè)計和管理，可以增強品牌認知度、提升用戶體驗、塑造專業(yè)形象。本規(guī)則旨在明確品牌視覺元素的使用標準，確保在各類平臺界面、營銷活動及用戶交互中保持一致性。一個清晰、統(tǒng)一的視覺系統(tǒng)有助于用戶快速識別品牌，并在不同設(shè)備和場景下獲得一致的體驗，從而建立品牌忠誠度。本規(guī)則適用于所有內(nèi)部員工、合作設(shè)計方及平臺運營人員。

二、核心視覺元素規(guī)范

（一）品牌標志

1.正確使用：標志應(yīng)保持完整，不得隨意裁剪、變形或添加其他圖案。在應(yīng)用時，應(yīng)確保標志的清晰度，避免在小尺寸或低分辨率環(huán)境下使用導(dǎo)致模糊。標志的位置應(yīng)遵循視覺重心原則，通常放置在頁面最顯眼或最穩(wěn)定的區(qū)域，如網(wǎng)站頂部導(dǎo)航欄左上角、APP啟動頁等。

2.環(huán)境要求：

(1)線上平臺：

-網(wǎng)站端：標志應(yīng)放置在頁面頭部固定區(qū)域，確保在頁面滾動時用戶始終能看到。寬度不應(yīng)小于50px，高度不應(yīng)小于30px。在移動端適配時，應(yīng)保證在折疊菜單或全屏搜索時標志依然可見。

-APP端：啟動頁、設(shè)置頁的Logo區(qū)應(yīng)使用高清版本（建議300dpi以上）。在主界面標簽欄，標志尺寸需與系統(tǒng)規(guī)范匹配。

(2)活動海報：標志需與背景形成對比，建議使用白底或透明背景版本。在組合設(shè)計中，標志的層級應(yīng)高于其他圖形元素。

3.禁止行為：

(1)不得將標志與其他品牌標志混合使用，如將本品牌標志與供應(yīng)商標志并列展示。

(2)避免在低分辨率環(huán)境下使用矢量格式標志，應(yīng)提供適用于Web和打印的優(yōu)化格式（如PNG、SVG）。

(3)不得對標志進行藝術(shù)化處理，如添加陰影、描邊或改變標準比例。

（二）標準色系統(tǒng)

1.主色：0056b3（深藍），具有專業(yè)、信任的聯(lián)想，用于品牌按鈕、標題、關(guān)鍵信息強調(diào)等。

2.輔助色：f5f5f5（淺灰），用于背景和分隔線，保持界面簡潔，提升內(nèi)容可讀性。

3.強調(diào)色：ff9500（橙色），用于次要按鈕、促銷信息提示，吸引注意力但不過度干擾。

4.禁用色：ff0000（亮紅），僅用于特殊警示場景，如訂單錯誤提示，日常使用需謹慎。000000（純黑）僅在特殊設(shè)計需求經(jīng)批準后方可使用，一般界面文本推薦使用333333或更深色系以確保易讀性。

（三）輔助圖形

1.應(yīng)用場景：產(chǎn)品列表頁的分類篩選圖標、活動頁的裝飾邊框、用戶中心的指示路徑等。

2.規(guī)范要求：

(1)圖形線條粗細統(tǒng)一為1.5px，保持簡潔利落。

(2)顏色需與標準色系統(tǒng)匹配，優(yōu)先使用主色（0056b3）或強調(diào)色（ff9500），輔助色（f5f5f5）用于透明或描邊效果。

(3)圖標風格統(tǒng)一為線性或面性扁平化設(shè)計，避免使用復(fù)雜紋理。

3.禁止行為：

(1)不得使用與品牌調(diào)性不符的復(fù)雜圖形風格（如手繪、像素風，除非有特殊設(shè)計需求并經(jīng)批準）。

(2)輔助圖形不得遮擋核心內(nèi)容或干擾用戶操作。

三、平臺界面設(shè)計規(guī)范

（一）首頁布局

1.頂部區(qū)域：

-品牌標志：居左，占據(jù)導(dǎo)航欄寬度約15%，確保在所有頁面可見。

-搜索欄：居中，采用白色背景+深藍邊框設(shè)計，搜索按鈕使用標準色（0056b3）填充。

-用戶頭像/購物車：居右，圖標統(tǒng)一使用標準尺寸（24px），懸停時出現(xiàn)下拉菜單提示。

2.內(nèi)容區(qū)：

-模塊間距：各功能模塊（如新品上市、熱銷推薦）之間保持至少20px的垂直或水平間距，確保視覺呼吸感。

-排版層級：使用不同字號（標題≥22px，副標題≥18px，正文≥14px）和顏色（標題用主色0056b3，正文用333333）區(qū)分信息重要性。

3.底部區(qū)域：

-版權(quán)信息：居中，使用小號字體（≥12px），顏色為666666。

-服務(wù)條款/隱私政策：使用標準小圖標+文字鏈接，顏色與正文相同。

（二）產(chǎn)品詳情頁

1.規(guī)范要求：

(1)產(chǎn)品圖片：

-圓角處理：所有產(chǎn)品主圖和縮略圖統(tǒng)一使用10px圓角，使用PNG格式保證透明背景。

-縮放功能：支持至少3倍放大，放大區(qū)域需清晰展示產(chǎn)品細節(jié)（如材質(zhì)紋理、尺寸標注）。

-圖片切換：左右滑動切換，指示器位于底部，默認高亮當前圖片。

(2)商品信息：

-商品名稱：加粗字體，字號≥18px，置于圖片下方居中。

-價格：主色（0056b3）顯示原價，強調(diào)色（ff9500）顯示優(yōu)惠價或折扣信息。

-商品描述：分點列出，使用項目符號或數(shù)字編號，段落間距≥15px。

2.禁止行為：

(1)不得在產(chǎn)品圖片上疊加無關(guān)文字、促銷標簽（標簽需通過官方工具添加）。

(2)避免使用閃爍、彈窗等動態(tài)效果干擾用戶瀏覽。

(3)商品評價區(qū)的星級顯示顏色必須與品牌規(guī)范一致（如4星及以上為00b24c，低于4星為ff9500）。

（三）移動端適配

1.字體大小：

-標題字號≥16px，確保在小型屏幕上可清晰閱讀。

-正文字號≥14px，行高建議1.5倍字號（如21px），提升閱讀舒適度。

2.交互元素：

-按鈕點擊區(qū)域最小尺寸為44x44px，重要操作按鈕（如下單、加入購物車）可擴展至60x60px。

-輸入框內(nèi)邊距建議為8px，確保手指操作不誤觸。

3.響應(yīng)式設(shè)計：

-頁面元素需根據(jù)屏幕寬度自動調(diào)整布局，關(guān)鍵信息（如價格、購買按鈕）在任何尺寸屏幕上均不可被滾動隱藏。

-圖片加載采用懶加載機制，優(yōu)先顯示首屏內(nèi)容。

四、營銷活動視覺規(guī)范

（一）活動海報

1.布局要求：

(1)標題與主圖占比：標題區(qū)域占整體高度的20%，主圖占80%。

(2)活動時間：使用加粗字體（≥24px）和主色（0056b3）標注，格式為“2023.12.01-12.31”。

(3)行動號召（CTA）：按鈕使用強調(diào)色（ff9500），文字為“立即搶購”，字號≥18px。

2.色彩搭配：主色（0056b3）占比60%，輔助色（f5f5f5）用于背景，強調(diào)色（ff9500）用于CTA按鈕，形成視覺層次。

3.字體規(guī)范：

-標題字體：無襯線粗體（如思源黑體中粗）。

-正文字體：無襯線常規(guī)（如思源黑體常規(guī)）。

（二）社交媒體推廣

1.視頻規(guī)范：

(1)視頻時長：控制在15-30秒，首3秒內(nèi)必須出現(xiàn)品牌Logo和活動名稱。

(2)背景音樂：選擇輕快、無版權(quán)風險的純音樂，音量適中，不干擾主文案。

(3)視頻風格：統(tǒng)一采用品牌主色調(diào)調(diào)色板，如背景使用f0f7ff（淺藍）。

2.文案配合：

(1)每條推文需含統(tǒng)一話題標簽，如XX品牌雙十一狂歡節(jié)。

(2)互動問答中需使用品牌標準表情包（如微笑、禮物等，需提前設(shè)計）。

(3)文案排版：段落間空一行，關(guān)鍵信息（如優(yōu)惠力度）使用加粗或不同顏色突出。

五、執(zhí)行與監(jiān)督

（一）使用流程

1.下載標準素材：通過官方VI系統(tǒng)（如品牌云臺）獲取最新版本文件，禁止下載過期版本。

2.內(nèi)部審核：

-設(shè)計需求需提交至品牌部門，填寫《VI使用申請表》，說明使用場景、數(shù)量及預(yù)期效果。

-品牌部門在2個工作日內(nèi)完成審核，重大設(shè)計需經(jīng)設(shè)計總監(jiān)批準。

3.版本管理：

-定期更新VI手冊（建議每年一次）及線上VI庫，確保所有素材均為最新。

-建立素材使用臺賬，記錄每次VI元素調(diào)用情況。

（二）違規(guī)處理

1.輕微違規(guī)（如標志輕微變形）：通過官方渠道發(fā)布《VI使用規(guī)范提醒》，要求限期整改。

2.嚴重違規(guī)（如標志被替換、使用未經(jīng)授權(quán)的色值）：需立即停止使用，并在全平臺發(fā)布更正公告，通報處理結(jié)果。

3.持續(xù)違規(guī)者：按合作合同或員工手冊扣除相應(yīng)積分或進行內(nèi)部培訓(xùn)。

六、附錄

（一）標準素材清單

1.標志：

-標準圖形（矢量AI/EPS格式）

-白底圖形（PNG格式）

-小圖標（SVG格式，用于移動端）

-矢量輪廓（用于特殊設(shè)計）

2.色值表：

-RGB：0056b3（主色）、f5f5f5（輔助色）、ff9500（強調(diào)色）

-HEX：0056b3、f5f5f5、ff9500

-CMYK（用于印刷）：C:60M:20Y:10K:90（主色示例）

3.輔助圖形：

-分類篩選圖標（PNG格式，包含分類名稱）

-裝飾邊框（SVG格式，可組合使用）

-路徑指示圖形（PNG格式）

（二）參考案例

1.成功案例：

-XX平臺“夏日清倉”活動海報完整視覺呈現(xiàn)（包含色彩搭配、字體使用、布局規(guī)范）。

-XX平臺APP2.0版本界面改版前后對比分析（重點展示VI元素統(tǒng)一性提升）。

2.錯誤案例：

-常見VI使用誤區(qū)清單（如標志變形、色值偏差、輔助圖形濫用等）。

-外部合作方提供的違規(guī)設(shè)計稿截圖及分析。

一、概述

電商平臺品牌形象視覺識別（VI）規(guī)則是企業(yè)在數(shù)字化環(huán)境中建立統(tǒng)一、規(guī)范的品牌形象的基礎(chǔ)。通過系統(tǒng)化的視覺設(shè)計和管理，可以增強品牌認知度、提升用戶體驗、塑造專業(yè)形象。本規(guī)則旨在明確品牌視覺元素的使用標準，確保在各類平臺界面、營銷活動及用戶交互中保持一致性。

二、核心視覺元素規(guī)范

（一）品牌標志

1.正確使用：標志應(yīng)保持完整，不得隨意裁剪、變形或添加其他圖案。

2.環(huán)境要求：

(1)線上平臺：標志需放置在頁面頂部導(dǎo)航欄或底部版權(quán)區(qū)域，確保不因頁面滾動而遮擋核心內(nèi)容。

(2)活動海報：標志需與背景形成對比，建議使用白底或透明背景版本。

3.禁止行為：

(1)不得將標志與其他品牌標志混合使用。

(2)避免在低分辨率環(huán)境下使用矢量格式標志。

（二）標準色系統(tǒng)

1.主色：0056b3（深藍），用于品牌按鈕、標題等關(guān)鍵視覺元素。

2.輔助色：f5f5f5（淺灰），用于背景和分隔線，保持界面簡潔。

3.禁用色：ff0000（亮紅），僅用于特殊警示場景，日常使用需謹慎。

（三）輔助圖形

1.應(yīng)用場景：產(chǎn)品列表頁、分類篩選圖標等。

2.規(guī)范要求：

(1)圖形線條粗細統(tǒng)一為1.5px。

(2)顏色需與標準色系統(tǒng)匹配，優(yōu)先使用主色。

三、平臺界面設(shè)計規(guī)范

（一）首頁布局

1.頂部區(qū)域：品牌標志居左，搜索欄居中，用戶頭像居右。

2.內(nèi)容區(qū)：模塊間距≥20px，確保視覺呼吸感。

3.底部區(qū)域：版權(quán)信息、服務(wù)條款等，字號不小于12px。

（二）產(chǎn)品詳情頁

1.規(guī)范要求：

(1)產(chǎn)品圖片需保持統(tǒng)一圓角（10px），放大倍數(shù)不得低于3倍。

(2)商品名稱使用加粗字體，字號≥18px。

2.禁止行為：

(1)不得在圖片上疊加無關(guān)文字。

(2)避免使用動態(tài)效果干擾用戶瀏覽。

（三）移動端適配

1.字體大?。簶祟}字號≥16px，正文≥14px。

2.交互元素：按鈕點擊區(qū)域最小尺寸為44x44px。

3.響應(yīng)式設(shè)計：頁面元素需根據(jù)屏幕寬度自動調(diào)整布局。

四、營銷活動視覺規(guī)范

（一）活動海報

1.布局要求：

(1)標題與主圖占比分別為30%和70%。

(2)活動時間需用醒目字體標注，如“2023.12.01-12.31”。

2.色彩搭配：主色與輔助色比例建議為2:1。

（二）社交媒體推廣

1.視頻規(guī)范：

(1)視頻時長控制在15-30秒，含品牌標志動態(tài)展示。

(2)背景音樂需符合品牌調(diào)性（如輕快純音樂）。

2.文案配合：

(1)每條推文需含統(tǒng)一話題標簽，如XX品牌雙十一。

(2)互動問答中需使用品牌標準表情包。

五、執(zhí)行與監(jiān)督

（一）使用流程

1.下載標準素材：通過官方VI系統(tǒng)獲取最新版本文件。

2.內(nèi)部審核：設(shè)計需求需提交至品牌部門審批。

3.版本管理：定期更新VI手冊（建議每年一次）。

（二）違規(guī)處理

1.未經(jīng)授權(quán)使用VI元素，將按合同條款扣除相應(yīng)積分。

2.重大違規(guī)（如標志嚴重變形）需立即整改并通報。

六、附錄

（一）標準素材清單

1.標志：標準圖形、白底圖形、小圖標等。

2.色值表：RGB、HEX格式完整色板。

3.輔助圖形：分類應(yīng)用示例。

（二）參考案例

1.成功案例：XX平臺雙十一活動視覺完整展示。

2.錯誤案例：常見VI使用誤區(qū)解析。

一、概述

電商平臺品牌形象視覺識別（VI）規(guī)則是企業(yè)在數(shù)字化環(huán)境中建立統(tǒng)一、規(guī)范的品牌形象的基礎(chǔ)。通過系統(tǒng)化的視覺設(shè)計和管理，可以增強品牌認知度、提升用戶體驗、塑造專業(yè)形象。本規(guī)則旨在明確品牌視覺元素的使用標準，確保在各類平臺界面、營銷活動及用戶交互中保持一致性。一個清晰、統(tǒng)一的視覺系統(tǒng)有助于用戶快速識別品牌，并在不同設(shè)備和場景下獲得一致的體驗，從而建立品牌忠誠度。本規(guī)則適用于所有內(nèi)部員工、合作設(shè)計方及平臺運營人員。

二、核心視覺元素規(guī)范

（一）品牌標志

1.正確使用：標志應(yīng)保持完整，不得隨意裁剪、變形或添加其他圖案。在應(yīng)用時，應(yīng)確保標志的清晰度，避免在小尺寸或低分辨率環(huán)境下使用導(dǎo)致模糊。標志的位置應(yīng)遵循視覺重心原則，通常放置在頁面最顯眼或最穩(wěn)定的區(qū)域，如網(wǎng)站頂部導(dǎo)航欄左上角、APP啟動頁等。

2.環(huán)境要求：

(1)線上平臺：

-網(wǎng)站端：標志應(yīng)放置在頁面頭部固定區(qū)域，確保在頁面滾動時用戶始終能看到。寬度不應(yīng)小于50px，高度不應(yīng)小于30px。在移動端適配時，應(yīng)保證在折疊菜單或全屏搜索時標志依然可見。

-APP端：啟動頁、設(shè)置頁的Logo區(qū)應(yīng)使用高清版本（建議300dpi以上）。在主界面標簽欄，標志尺寸需與系統(tǒng)規(guī)范匹配。

(2)活動海報：標志需與背景形成對比，建議使用白底或透明背景版本。在組合設(shè)計中，標志的層級應(yīng)高于其他圖形元素。

3.禁止行為：

(1)不得將標志與其他品牌標志混合使用，如將本品牌標志與供應(yīng)商標志并列展示。

(2)避免在低分辨率環(huán)境下使用矢量格式標志，應(yīng)提供適用于Web和打印的優(yōu)化格式（如PNG、SVG）。

(3)不得對標志進行藝術(shù)化處理，如添加陰影、描邊或改變標準比例。

（二）標準色系統(tǒng)

1.主色：0056b3（深藍），具有專業(yè)、信任的聯(lián)想，用于品牌按鈕、標題、關(guān)鍵信息強調(diào)等。

2.輔助色：f5f5f5（淺灰），用于背景和分隔線，保持界面簡潔，提升內(nèi)容可讀性。

3.強調(diào)色：ff9500（橙色），用于次要按鈕、促銷信息提示，吸引注意力但不過度干擾。

4.禁用色：ff0000（亮紅），僅用于特殊警示場景，如訂單錯誤提示，日常使用需謹慎。000000（純黑）僅在特殊設(shè)計需求經(jīng)批準后方可使用，一般界面文本推薦使用333333或更深色系以確保易讀性。

（三）輔助圖形

1.應(yīng)用場景：產(chǎn)品列表頁的分類篩選圖標、活動頁的裝飾邊框、用戶中心的指示路徑等。

2.規(guī)范要求：

(1)圖形線條粗細統(tǒng)一為1.5px，保持簡潔利落。

(2)顏色需與標準色系統(tǒng)匹配，優(yōu)先使用主色（0056b3）或強調(diào)色（ff9500），輔助色（f5f5f5）用于透明或描邊效果。

(3)圖標風格統(tǒng)一為線性或面性扁平化設(shè)計，避免使用復(fù)雜紋理。

3.禁止行為：

(1)不得使用與品牌調(diào)性不符的復(fù)雜圖形風格（如手繪、像素風，除非有特殊設(shè)計需求并經(jīng)批準）。

(2)輔助圖形不得遮擋核心內(nèi)容或干擾用戶操作。

三、平臺界面設(shè)計規(guī)范

（一）首頁布局

1.頂部區(qū)域：

-品牌標志：居左，占據(jù)導(dǎo)航欄寬度約15%，確保在所有頁面可見。

-搜索欄：居中，采用白色背景+深藍邊框設(shè)計，搜索按鈕使用標準色（0056b3）填充。

-用戶頭像/購物車：居右，圖標統(tǒng)一使用標準尺寸（24px），懸停時出現(xiàn)下拉菜單提示。

2.內(nèi)容區(qū)：

-模塊間距：各功能模塊（如新品上市、熱銷推薦）之間保持至少20px的垂直或水平間距，確保視覺呼吸感。

-排版層級：使用不同字號（標題≥22px，副標題≥18px，正文≥14px）和顏色（標題用主色0056b3，正文用333333）區(qū)分信息重要性。

3.底部區(qū)域：

-版權(quán)信息：居中，使用小號字體（≥12px），顏色為666666。

-服務(wù)條款/隱私政策：使用標準小圖標+文字鏈接，顏色與正文相同。

（二）產(chǎn)品詳情頁

1.規(guī)范要求：

(1)產(chǎn)品圖片：

-圓角處理：所有產(chǎn)品主圖和縮略圖統(tǒng)一使用10px圓角，使用PNG格式保證透明背景。

-縮放功能：支持至少3倍放大，放大區(qū)域需清晰展示產(chǎn)品細節(jié)（如材質(zhì)紋理、尺寸標注）。

-圖片切換：左右滑動切換，指示器位于底部，默認高亮當前圖片。

(2)商品信息：

-商品名稱：加粗字體，字號≥18px，置于圖片下方居中。

-價格：主色（0056b3）顯示原價，強調(diào)色（ff9500）顯示優(yōu)惠價或折扣信息。

-商品描述：分點列出，使用項目符號或數(shù)字編號，段落間距≥15px。

2.禁止行為：

(1)不得在產(chǎn)品圖片上疊加無關(guān)文字、促銷標簽（標簽需通過官方工具添加）。

(2)避免使用閃爍、彈窗等動態(tài)效果干擾用戶瀏覽。

(3)商品評價區(qū)的星級顯示顏色必須與品牌規(guī)范一致（如4星及以上為00b24c，低于4星為ff9500）。

（三）移動端適配

1.字體大?。?/p>

-標題字號≥16px，確保在小型屏幕上可清晰閱讀。

-正文字號≥14px，行高建議1.5倍字號（如21px），提升閱讀舒適度。

2.交互元素：

-按鈕點擊區(qū)域最小尺寸為44x44px，重要操作按鈕（如下單、加入購物車）可擴展至60x60px。

-輸入框內(nèi)邊距建議為8px，確保手指操作不誤觸。

3.響應(yīng)式設(shè)計：

-頁面元素需根據(jù)屏幕寬度自動調(diào)整布局，關(guān)鍵信息（如價格、購買按鈕）在任何尺寸屏幕上均不可被滾動隱藏。

-圖片加載采用懶加載機制，優(yōu)先顯示首屏內(nèi)容。

四、營銷活動視覺規(guī)范

（一）活動海報

1.布局要求：

(1)標題與主圖占比：標題區(qū)域占整體高度的20%，主圖占80%。

(2)活動時間：使用加粗字體（≥24px）和主色（0056b3）標注，格式為“2023.12.01-12.31”。

(3)行動號召（CTA）：按鈕使用強調(diào)色（ff9500），文字為“立即搶購”，字號≥18px。

2.色彩搭配：主色（0056b3）占比60%，輔助色（f5f5f5）用于背景，強調(diào)色（ff9500）用于CTA按鈕，形成視覺層次。

3.字體規(guī)范：

-標題字體：無襯線粗體（如思源黑體中粗）。

-正文字體：無襯線常規(guī)（如思源黑體常規(guī)）。

（二）社交媒體推廣

1.視頻規(guī)范：

(1)視頻時長：控制在15-30秒，首3秒內(nèi)必須出現(xiàn)品牌Logo和活動名稱。

(2)背景音樂：選擇輕快、無版權(quán)風險的純音樂，音量適中，不干擾主文案。

(3)視頻風格：統(tǒng)一采用品牌主色調(diào)調(diào)色板，如背景使用f0f7ff（淺藍）。

2.文案配合：

(1)每條推文需含統(tǒng)一話題標簽，如XX品牌雙十一狂歡節(jié)。

(2)互動問答中需使用品牌標準表情包（如微笑、禮物等，需提前設(shè)計）。

(3)文案排版：段落間空一行，關(guān)鍵信息（如優(yōu)惠力度）使用加粗或不同顏色突出。

五、執(zhí)行與監(jiān)督

（一）使用流程

1.下載標準素材：通過官方VI系統(tǒng)（如品牌云臺）獲取最新版本文件，禁止下載過期版本。

2.內(nèi)部審核：

-設(shè)計需求需提交至品牌部門，填寫《VI使用申請表》，說明使用場景、數(shù)量及預(yù)期效果。

-品牌部門在2個工作日內(nèi)完成審核，重大設(shè)計需經(jīng)設(shè)計總監(jiān)批準。

3.版本管理：

-定期更新VI手冊（建議每年一次）及線上VI庫，確保所有素材均為最新。

-建立素材使用臺賬，記錄每次VI元素調(diào)用情況。

（二）違規(guī)處理

1.輕微違規(guī)（如標志輕微變形）：通過官方渠道發(fā)布《VI使用規(guī)范提醒》，要求限期整改。

2.嚴重違規(guī)（如標志被替換、使用未經(jīng)授權(quán)的色值）：需立即停止使用，并在全平臺發(fā)布更正公告，通報處理結(jié)果。

3.持續(xù)違規(guī)者：按合作合同或員工手冊扣除相應(yīng)積分或進行內(nèi)部培訓(xùn)。

六、附錄

（一）標準素材清單

1.標志：

-標準圖形（矢量AI/EPS格式）

-白底圖形（PNG格式）

-小圖標（SVG格式，用于移動端）

-矢量輪廓（用于特殊設(shè)計）

2.色值表：

-RGB：0056b3（主色）、f5f5f5（輔助色）、ff9500（強調(diào)色）

-HEX：0056b3、f5f5f5、ff9500

-CMYK（用于印刷）：C:60M:20Y:10K:90（主色示例）

3.輔助圖形：

-分類篩選圖標（PNG格式，包含分類名稱）

-裝飾邊框（SVG格式，可組合使用）

-路徑指示圖形（PNG格式）

（二）參考案例

1.成功案例：

-XX平臺“夏日清倉”活動海報完整視覺呈現(xiàn)（包含色彩搭配、字體使用、布局規(guī)范）。

-XX平臺APP2.0版本界面改版前后對比分析（重點展示VI元素統(tǒng)一性提升）。

2.錯誤案例：

-常見VI使用誤區(qū)清單（如標志變形、色值偏差、輔助圖形濫用等）。

-外部合作方提供的違規(guī)設(shè)計稿截圖及分析。

一、概述

電商平臺品牌形象視覺識別（VI）規(guī)則是企業(yè)在數(shù)字化環(huán)境中建立統(tǒng)一、規(guī)范的品牌形象的基礎(chǔ)。通過系統(tǒng)化的視覺設(shè)計和管理，可以增強品牌認知度、提升用戶體驗、塑造專業(yè)形象。本規(guī)則旨在明確品牌視覺元素的使用標準，確保在各類平臺界面、營銷活動及用戶交互中保持一致性。

二、核心視覺元素規(guī)范

（一）品牌標志

1.正確使用：標志應(yīng)保持完整，不得隨意裁剪、變形或添加其他圖案。

2.環(huán)境要求：

(1)線上平臺：標志需放置在頁面頂部導(dǎo)航欄或底部版權(quán)區(qū)域，確保不因頁面滾動而遮擋核心內(nèi)容。

(2)活動海報：標志需與背景形成對比，建議使用白底或透明背景版本。

3.禁止行為：

(1)不得將標志與其他品牌標志混合使用。

(2)避免在低分辨率環(huán)境下使用矢量格式標志。

（二）標準色系統(tǒng)

1.主色：0056b3（深藍），用于品牌按鈕、標題等關(guān)鍵視覺元素。

2.輔助色：f5f5f5（淺灰），用于背景和分隔線，保持界面簡潔。

3.禁用色：ff0000（亮紅），僅用于特殊警示場景，日常使用需謹慎。

（三）輔助圖形

1.應(yīng)用場景：產(chǎn)品列表頁、分類篩選圖標等。

2.規(guī)范要求：

(1)圖形線條粗細統(tǒng)一為1.5px。

(2)顏色需與標準色系統(tǒng)匹配，優(yōu)先使用主色。

三、平臺界面設(shè)計規(guī)范

（一）首頁布局

1.頂部區(qū)域：品牌標志居左，搜索欄居中，用戶頭像居右。

2.內(nèi)容區(qū)：模塊間距≥20px，確保視覺呼吸感。

3.底部區(qū)域：版權(quán)信息、服務(wù)條款等，字號不小于12px。

（二）產(chǎn)品詳情頁

1.規(guī)范要求：

(1)產(chǎn)品圖片需保持統(tǒng)一圓角（10px），放大倍數(shù)不得低于3倍。

(2)商品名稱使用加粗字體，字號≥18px。

2.禁止行為：

(1)不得在圖片上疊加無關(guān)文字。

(2)避免使用動態(tài)效果干擾用戶瀏覽。

（三）移動端適配

1.字體大小：標題字號≥16px，正文≥14px。

2.交互元素：按鈕點擊區(qū)域最小尺寸為44x44px。

3.響應(yīng)式設(shè)計：頁面元素需根據(jù)屏幕寬度自動調(diào)整布局。

四、營銷活動視覺規(guī)范

（一）活動海報

1.布局要求：

(1)標題與主圖占比分別為30%和70%。

(2)活動時間需用醒目字體標注，如“2023.12.01-12.31”。

2.色彩搭配：主色與輔助色比例建議為2:1。

（二）社交媒體推廣

1.視頻規(guī)范：

(1)視頻時長控制在15-30秒，含品牌標志動態(tài)展示。

(2)背景音樂需符合品牌調(diào)性（如輕快純音樂）。

2.文案配合：

(1)每條推文需含統(tǒng)一話題標簽，如XX品牌雙十一。

(2)互動問答中需使用品牌標準表情包。

五、執(zhí)行與監(jiān)督

（一）使用流程

1.下載標準素材：通過官方VI系統(tǒng)獲取最新版本文件。

2.內(nèi)部審核：設(shè)計需求需提交至品牌部門審批。

3.版本管理：定期更新VI手冊（建議每年一次）。

（二）違規(guī)處理

1.未經(jīng)授權(quán)使用VI元素，將按合同條款扣除相應(yīng)積分。

2.重大違規(guī)（如標志嚴重變形）需立即整改并通報。

六、附錄

（一）標準素材清單

1.標志：標準圖形、白底圖形、小圖標等。

2.色值表：RGB、HEX格式完整色板。

3.輔助圖形：分類應(yīng)用示例。

（二）參考案例

1.成功案例：XX平臺雙十一活動視覺完整展示。

2.錯誤案例：常見VI使用誤區(qū)解析。

一、概述

電商平臺品牌形象視覺識別（VI）規(guī)則是企業(yè)在數(shù)字化環(huán)境中建立統(tǒng)一、規(guī)范的品牌形象的基礎(chǔ)。通過系統(tǒng)化的視覺設(shè)計和管理，可以增強品牌認知度、提升用戶體驗、塑造專業(yè)形象。本規(guī)則旨在明確品牌視覺元素的使用標準，確保在各類平臺界面、營銷活動及用戶交互中保持一致性。一個清晰、統(tǒng)一的視覺系統(tǒng)有助于用戶快速識別品牌，并在不同設(shè)備和場景下獲得一致的體驗，從而建立品牌忠誠度。本規(guī)則適用于所有內(nèi)部員工、合作設(shè)計方及平臺運營人員。

二、核心視覺元素規(guī)范

（一）品牌標志

1.正確使用：標志應(yīng)保持完整，不得隨意裁剪、變形或添加其他圖案。在應(yīng)用時，應(yīng)確保標志的清晰度，避免在小尺寸或低分辨率環(huán)境下使用導(dǎo)致模糊。標志的位置應(yīng)遵循視覺重心原則，通常放置在頁面最顯眼或最穩(wěn)定的區(qū)域，如網(wǎng)站頂部導(dǎo)航欄左上角、APP啟動頁等。

2.環(huán)境要求：

(1)線上平臺：

-網(wǎng)站端：標志應(yīng)放置在頁面頭部固定區(qū)域，確保在頁面滾動時用戶始終能看到。寬度不應(yīng)小于50px，高度不應(yīng)小于30px。在移動端適配時，應(yīng)保證在折疊菜單或全屏搜索時標志依然可見。

-APP端：啟動頁、設(shè)置頁的Logo區(qū)應(yīng)使用高清版本（建議300dpi以上）。在主界面標簽欄，標志尺寸需與系統(tǒng)規(guī)范匹配。

(2)活動海報：標志需與背景形成對比，建議使用白底或透明背景版本。在組合設(shè)計中，標志的層級應(yīng)高于其他圖形元素。

3.禁止行為：

(1)不得將標志與其他品牌標志混合使用，如將本品牌標志與供應(yīng)商標志并列展示。

(2)避免在低分辨率環(huán)境下使用矢量格式標志，應(yīng)提供適用于Web和打印的優(yōu)化格式（如PNG、SVG）。

(3)不得對標志進行藝術(shù)化處理，如添加陰影、描邊或改變標準比例。

（二）標準色系統(tǒng)

1.主色：0056b3（深藍），具有專業(yè)、信任的聯(lián)想，用于品牌按鈕、標題、關(guān)鍵信息強調(diào)等。

2.輔助色：f5f5f5（淺灰），用于背景和分隔線，保持界面簡潔，提升內(nèi)容可讀性。

3.強調(diào)色：ff9500（橙色），用于次要按鈕、促銷信息提示，吸引注意力但不過度干擾。

4.禁用色：ff0000（亮紅），僅用于特殊警示場景，如訂單錯誤提示，日常使用需謹慎。000000（純黑）僅在特殊設(shè)計需求經(jīng)批準后方可使用，一般界面文本推薦使用333333或更深色系以確保易讀性。

（三）輔助圖形

1.應(yīng)用場景：產(chǎn)品列表頁的分類篩選圖標、活動頁的裝飾邊框、用戶中心的指示路徑等。

2.規(guī)范要求：

(1)圖形線條粗細統(tǒng)一為1.5px，保持簡潔利落。

(2)顏色需與標準色系統(tǒng)匹配，優(yōu)先使用主色（0056b3）或強調(diào)色（ff9500），輔助色（f5f5f5）用于透明或描邊效果。

(3)圖標風格統(tǒng)一為線性或面性扁平化設(shè)計，避免使用復(fù)雜紋理。

3.禁止行為：

(1)不得使用與品牌調(diào)性不符的復(fù)雜圖形風格（如手繪、像素風，除非有特殊設(shè)計需求并經(jīng)批準）。

(2)輔助圖形不得遮擋核心內(nèi)容或干擾用戶操作。

三、平臺界面設(shè)計規(guī)范

（一）首頁布局

1.頂部區(qū)域：

-品牌標志：居左，占據(jù)導(dǎo)航欄寬度約15%，確保在所有頁面可見。

-搜索欄：居中，采用白色背景+深藍邊框設(shè)計，搜索按鈕使用標準色（0056b3）填充。

-用戶頭像/購物車：居右，圖標統(tǒng)一使用標準尺寸（24px），懸停時出現(xiàn)下拉菜單提示。

2.內(nèi)容區(qū)：

-模塊間距：各功能模塊（如新品上市、熱銷推薦）之間保持至少20px的垂直或水平間距，確保視覺呼吸感。

-排版層級：使用不同字號（標題≥22px，副標題≥18px，正文≥14px）和顏色（標題用主色0056b3，正文用333333）區(qū)分信息重要性。

3.底部區(qū)域：

-版權(quán)信息：居中，使用小號字體（≥12px），顏色為666666。

-服務(wù)條款/隱私政策：使用標準小圖標+文字鏈接，顏色與正文相同。

（二）產(chǎn)品詳情頁

1.規(guī)范要求：

(1)產(chǎn)品圖片：

-圓角處理：所有產(chǎn)品主圖和縮略圖統(tǒng)一使用10px圓角，使用PNG格式保證透明背景。

-縮放功能：支持至少3倍放大，放大區(qū)域需清晰展示產(chǎn)品細節(jié)（如材質(zhì)紋理、尺寸標注）。

-圖片切換：左右滑動切換，指示器位于底部，默認高亮當前圖片。

(2)商品信息：

-商品名稱：加粗字體，字號≥18px，置于圖片下方居中。

-價格：主色（0056b3）顯示原價，強調(diào)色（ff9500）顯示優(yōu)惠價或折扣信息。

-商品描述：分點列出，使用項目符號或數(shù)字編號，段落間距≥15px。

2.禁止行為：

(1)不得在產(chǎn)品圖片上疊加無關(guān)文字、促銷標簽（標簽需通過官方工具添加）。

(2)避免使用閃爍、彈窗等動態(tài)效果干擾用戶瀏覽。

(3)商品評價區(qū)的星級顯示顏色必須與品牌規(guī)范一致（如4星及以上為00b24c，低于4星為ff9500）。

（三）移動端適配

1.字體大小：

-標題字號≥16px，確保在小型屏幕上可清晰閱讀。

-正文字號≥14px，行高建議1.5倍字號（如21px），提升閱讀舒適度。

2.交互元素：

-按鈕點擊區(qū)域最小尺寸為44x44px，重要操作按鈕（如下單、加入購物車）可擴展至60x60px。

-輸入框內(nèi)邊距建議為8px，確保手指操作不誤觸。

3.響應(yīng)式設(shè)計：

-頁面元素需根據(jù)屏幕寬度自動調(diào)整布局，關(guān)鍵信息（如價格、購買按鈕）在任何尺寸屏幕上均不可被滾動隱藏。

-圖片加載采用懶加載機制，優(yōu)先顯示首屏內(nèi)容。

四、營銷活動視覺規(guī)范

（一）活動海報

1.布局要求：

(1)標題與主圖占比：標題區(qū)域占整體高度的20%，主圖占80%。

(2)活動時間：使用加粗字體（≥24px）和主色（0056b3）標注，格式為“2023.12.01-12.31”。

(3)行動號召（CTA）：按鈕使用強調(diào)色（ff9500），文字為“立即搶購”，字號≥18px。

2.色彩搭配：主色（0056b3）占比60%，輔助色（f5f5f5）用于背景，強調(diào)色（ff9500）用于CTA按鈕，形成視覺層次。

3.字體規(guī)范：

-標題字體：無襯線粗體（如思源黑體中粗）。

-正文字體：無襯線常規(guī)（如思源黑體常規(guī)）。

（二）社交媒體推廣

1.視頻規(guī)范：

(1)視頻時長：控制在15-30秒，首3秒內(nèi)必須出現(xiàn)品牌Logo和活動名稱。

(2)背景音樂：選擇輕快、無版權(quán)風險的純音樂，音量適中，不干擾主文案。

(3)視頻風格：統(tǒng)一采用品牌主色調(diào)調(diào)色板，如背景使用f0f7ff（淺藍）。

2.文案配合：

(1)每條推文需含統(tǒng)一話題標簽，如XX品牌雙十一狂歡節(jié)。

(2)互動問答中需使用品牌標準表情包（如微笑、禮物等，需提前設(shè)計）。

(3)文案排版：段落間空一行，關(guān)鍵信息（如優(yōu)惠力度）使用加粗或不同顏色突出。

五、執(zhí)行與監(jiān)督

（一）使用流程

1.下載標準素材：通過官方VI系統(tǒng)（如品牌云臺）獲取最新版本文件，禁止下載過期版本。

2.內(nèi)部審核：

-設(shè)計需求需提交至品牌部門，填寫《VI使用申請表》，說明使用場景、數(shù)量及預(yù)期效果。

-品牌部門在2個工作日內(nèi)完成審核，重大設(shè)計需經(jīng)設(shè)計總監(jiān)批準。

3.版本管理：

-定期更新VI手冊（建議每年一次）及線上VI庫，確保所有素材均為最新。

-建立素材使用臺賬，記錄每次VI元素調(diào)用情況。

（二）違規(guī)處理

1.輕微違規(guī)（如標志輕微變形）：通過官方渠道發(fā)布《VI使用規(guī)范提醒》，要求限期整改。

2.嚴重違規(guī)（如標志被替換、使用未經(jīng)授權(quán)的色值）：需立即停止使用，并在全平臺發(fā)布更正公告，通報處理結(jié)果。

3.持續(xù)違規(guī)者：按合作合同或員工手冊扣除相應(yīng)積分或進行內(nèi)部培訓(xùn)。

六、附錄

（一）標準素材清單

1.標志：

-標準圖形（矢量AI/EPS格式）

-白底圖形（PNG格式）

-小圖標（SVG格式，用于移動端）

-矢量輪廓（用于特殊設(shè)計）

2.色值表：

-RGB：0056b3（主色）、f5f5f5（輔助色）、ff9500（強調(diào)色）

-HEX：0056b3、f5f5f5、ff9500

-CMYK（用于印刷）：C:60M:20Y:10K:90（主色示例）

3.輔助圖形：

-分類篩選圖標（PNG格式，包含分類名稱）

-裝飾邊框（SVG格式，可組合使用）

-路徑指示圖形（PNG格式）

（二）參考案例

1.成功案例：

-XX平臺“夏日清倉”活動海報完整視覺呈現(xiàn)（包含色彩搭配、字體使用、布局規(guī)范）。

-XX平臺APP2.0版本界面改版前后對比分析（重點展示VI元素統(tǒng)一性提升）。

2.錯誤案例：

-常見VI使用誤區(qū)清單（如標志變形、色值偏差、輔助圖形濫用等）。

-外部合作方提供的違規(guī)設(shè)計稿截圖及分析。

一、概述

電商平臺品牌形象視覺識別（VI）規(guī)則是企業(yè)在數(shù)字化環(huán)境中建立統(tǒng)一、規(guī)范的品牌形象的基礎(chǔ)。通過系統(tǒng)化的視覺設(shè)計和管理，可以增強品牌認知度、提升用戶體驗、塑造專業(yè)形象。本規(guī)則旨在明確品牌視覺元素的使用標準，確保在各類平臺界面、營銷活動及用戶交互中保持一致性。

二、核心視覺元素規(guī)范

（一）品牌標志

1.正確使用：標志應(yīng)保持完整，不得隨意裁剪、變形或添加其他圖案。

2.環(huán)境要求：

(1)線上平臺：標志需放置在頁面頂部導(dǎo)航欄或底部版權(quán)區(qū)域，確保不因頁面滾動而遮擋核心內(nèi)容。

(2)活動海報：標志需與背景形成對比，建議使用白底或透明背景版本。

3.禁止行為：

(1)不得將標志與其他品牌標志混合使用。

(2)避免在低分辨率環(huán)境下使用矢量格式標志。

（二）標準色系統(tǒng)

1.主色：0056b3（深藍），用于品牌按鈕、標題等關(guān)鍵視覺元素。

2.輔助色：f5f5f5（淺灰），用于背景和分隔線，保持界面簡潔。

3.禁用色：ff0000（亮紅），僅用于特殊警示場景，日常使用需謹慎。

（三）輔助圖形

1.應(yīng)用場景：產(chǎn)品列表頁、分類篩選圖標等。

2.規(guī)范要求：

(1)圖形線條粗細統(tǒng)一為1.5px。

(2)顏色需與標準色系統(tǒng)匹配，優(yōu)先使用主色。

三、平臺界面設(shè)計規(guī)范

（一）首頁布局

1.頂部區(qū)域：品牌標志居左，搜索欄居中，用戶頭像居右。

2.內(nèi)容區(qū)：模塊間距≥20px，確保視覺呼吸感。

3.底部區(qū)域：版權(quán)信息、服務(wù)條款等，字號不小于12px。

（二）產(chǎn)品詳情頁

1.規(guī)范要求：

(1)產(chǎn)品圖片需保持統(tǒng)一圓角（10px），放大倍數(shù)不得低于3倍。

(2)商品名稱使用加粗字體，字號≥18px。

2.禁止行為：

(1)不得在圖片上疊加無關(guān)文字。

(2)避免使用動態(tài)效果干擾用戶瀏覽。

（三）移動端適配

1.字體大小：標題字號≥16px，正文≥14px。

2.交互元素：按鈕點擊區(qū)域最小尺寸為44x44px。

3.響應(yīng)式設(shè)計：頁面元素需根據(jù)屏幕寬度自動調(diào)整布局。

四、營銷活動視覺規(guī)范

（一）活動海報

1.布局要求：

(1)標題與主圖占比分別為30%和70%。

(2)活動時間需用醒目字體標注，如“2023.12.01-12.31”。

2.色彩搭配：主色與輔助色比例建議為2:1。

（二）社交媒體推廣

1.視頻規(guī)范：

(1)視頻時長控制在15-30秒，含品牌標志動態(tài)展示。

(2)背景音樂需符合品牌調(diào)性（如輕快純音樂）。

2.文案配合：

(1)每條推文需含統(tǒng)一話題標簽，如XX品牌雙十一。

(2)互動問答中需使用品牌標準表情包。

五、執(zhí)行與監(jiān)督

（一）使用流程

1.下載標準素材：通過官方VI系統(tǒng)獲取最新版本文件。

2.內(nèi)部審核：設(shè)計需求需提交至品牌部門審批。

3.版本管理：定期更新VI手冊（建議每年一次）。

（二）違規(guī)處理

1.未經(jīng)授權(quán)使用VI元素，將按合同條款扣除相應(yīng)積分。

2.重大違規(guī)（如標志嚴重變形）需立即整改并通報。

六、附錄

（一）標準素材清單

1.標志：標準圖形、白底圖形、小圖標等。

2.色值表：RGB、HEX格式完整色板。

3.輔助圖形：分類應(yīng)用示例。

（二）參考案例

1.成功案例：XX平臺雙十一活動視覺完整展示。

2.錯誤案例：常見VI使用誤區(qū)解析。

一、概述

電商平臺品牌形象視覺識別（VI）規(guī)則是企業(yè)在數(shù)字化環(huán)境中建立統(tǒng)一、規(guī)范的品牌形象的基礎(chǔ)。通過系統(tǒng)化的視覺設(shè)計和管理，可以增強品牌認知度、提升用戶體驗、塑造專業(yè)形象。本規(guī)則旨在明確品牌視覺元素的使用標準，確保在各類平臺界面、營銷活動及用戶交互中保持一致性。一個清晰、統(tǒng)一的視覺系統(tǒng)有助于用戶快速識別品牌，并在不同設(shè)備和場景下獲得一致的體驗，從而建立品牌忠誠度。本規(guī)則適用于所有內(nèi)部員工、合作設(shè)計方及平臺運營人員。

二、核心視覺元素規(guī)范

（一）品牌標志

1.正確使用：標志應(yīng)保持完整，不得隨意裁剪、變形或添加其他圖案。在應(yīng)用時，應(yīng)確保標志的清晰度，避免在小尺寸或低分辨率環(huán)境下使用導(dǎo)致模糊。標志的位置應(yīng)遵循視覺重心原則，通常放置在頁面最顯眼或最穩(wěn)定的區(qū)域，如網(wǎng)站頂部導(dǎo)航欄左上角、APP啟動頁等。

2.環(huán)境要求：

(1)線上平臺：

-網(wǎng)站端：標志應(yīng)放置在頁面頭部固定區(qū)域，確保在頁面滾動時用戶始終能看到。寬度不應(yīng)小于50px，高度不應(yīng)小于30px。在移動端適配時，應(yīng)保證在折疊菜單或全屏搜索時標志依然可見。

-APP端：啟動頁、設(shè)置頁的Logo區(qū)應(yīng)使用高清版本（建議300dpi以上）。在主界面標簽欄，標志尺寸需與系統(tǒng)規(guī)范匹配。

(2)活動海報：標志需與背景形成對比，建議使用白底或透明背景版本。在組合設(shè)計中，標志的層級應(yīng)高于其他圖形元素。

3.禁止行為：

(1)不得將標志與其他品牌標志混合使用，如將本品牌標志與供應(yīng)商標志并列展示。

(2)避免在低分辨率環(huán)境下使用矢量格式標志，應(yīng)提供適用于Web和打印的優(yōu)化格式（如PNG、SVG）。

(3)不得對標志進行藝術(shù)化處理，如添加陰影、描邊或改變標準比例。

（二）標準色系統(tǒng)

1.主色：0056b3（深藍），具有專業(yè)、信任的聯(lián)想，用于品牌按鈕、標題、關(guān)鍵信息強調(diào)等。

2.輔助色：f5f5f5（淺灰），用于背景和分隔線，保持界面簡潔，提升內(nèi)容可讀性。

3.強調(diào)色：ff9500（橙色），用于次要按鈕、促銷信息提示，吸引注意力但不過度干擾。

4.禁用色：ff0000（亮紅），僅用于特殊警示場景，如訂單錯誤提示，日常使用需謹慎。000000（純黑）僅在特殊設(shè)計需求經(jīng)批準后方可使用，一般界面文本推薦使用333333或更深色系以確保易讀性。

（三）輔助圖形

1.應(yīng)用場景：產(chǎn)品列表頁的分類篩選圖標、活動頁的裝飾邊框、用戶中心的指示路徑等。

2.規(guī)范要求：

(1)圖形線條粗細統(tǒng)一為1.5px，保持簡潔利落。

(2)顏色需與標準色系統(tǒng)匹配，優(yōu)先使用主色（0056b3）或強調(diào)色（ff9500），輔助色（f5f5f