平面設計學院學院筆記

匿名的安慰

電商視覺設計實戰教程 > 8.2 首頁設計思路（理論）

思考思路：風格-調性-排版先在草稿紙上將排版的大致布局框架羅列出來，將搭配的元素在腦海里過一遍，然后再找類似風格的參考，然后再去找相應的素材

匿名的安慰

電商視覺設計實戰教程 > 8.1 首頁設計基本元素介紹（理論）

活動/品牌展示：重要的活動在每個頁面都可以展示，有力提高活動的曝光率。同樣對于比較有實力的店鋪，沒有比提升品牌形象更重要的了，所以首頁底部也會放置一些比較有代表性的模特海報，廣告語等

匿名的安慰

電商視覺設計實戰教程 > 8.1 首頁設計基本元素介紹（理論）

客服中心：首頁底部是在每個頁面都會顯示的模塊，無論是首頁、詳情頁、分類頁都會顯示;客服中心方便快捷的提供咨詢，提高轉化率

匿名的安慰

電商視覺設計實戰教程 > 8.1 首頁設計基本元素介紹（理論）

分類導航：客戶如果是對這個店鋪感興趣，一般會把整個頁面瀏一遍，當瀏覽到首頁底部的時候，設置一個分類，可以更好的幫助客戶快速找到想要的寶貝

匿名的安慰

電商視覺設計實戰教程 > 8.1 首頁設計基本元素介紹（理論）

斷層內容可以多種多樣。提高**率就是提高銷售額，所以必須要時常提醒顧客立即**，要給顧客營造“搶購”的氛圍，也可配上倒計時時間，制造時間緊迫的樣子，以促使顧客盡早**。

匿名的安慰

電商視覺設計實戰教程 > 8.1 首頁設計基本元素介紹（理論）

視覺斷層：所謂的視覺斷層，就是在一樣的模板陳列中間，通過增加不一樣的內容，來促使頁面產生視覺斷點，它的作用，是防止顧客看多了一樣的畫面，而產生視覺疲勞后，增加頁面跳失率，降低流量的利用率。這一塊可以每個模塊的頭部，也可以是2個模塊中間間隔其他信息，這塊內容，可以適當增高，太短不能有效起到視覺斷點的作用，因為顧客拉頁面的速度很快，太短易被忽略

匿名的安慰

電商視覺設計實戰教程 > 8.1 首頁設計基本元素介紹（理論）

爆款展示是非常重要的，要展示在店鋪的第三屏

匿名的安慰

電商視覺設計實戰教程 > 8.1 首頁設計基本元素介紹（理論）

尺寸：1024*800 1366*768 1280*800 1920*1080

匿名的安慰

電商視覺設計實戰教程 > 8.1 首頁設計基本元素介紹（理論）

首屏海報的高度要有限定，適合主流顯示器的高度，保證最小的顯示器可以一屏內完全顯示店招和首屏海報，150+600=750，所以首屏海報的高度，最大確定為600px左右，再大之后，用戶體驗效果不好。

匿名的安慰

電商視覺設計實戰教程 > 8.1 首頁設計基本元素介紹（理論）

首頁內容最好集中在990內，因為顯示頻最小的是1024px

匿名的安慰

電商視覺設計實戰教程 > 8.1 首頁設計基本元素介紹（理論）

活動海報和單品海報它的區別在于:單品海報，它是直接鏈接到我們店鋪內的一個單個的一個寶貝詳情；而活動海報它就是鏈接地址可能就是一個新的一個活動頁面。

匿名的安慰

電商視覺設計實戰教程 > 8.1 首頁設計基本元素介紹（理論）

因為展現率高，店招與首屏幾乎成了首頁設計最重要的部分，往往一個店鋪的風格都是從首屏海報上表現，其分為活動海報和單品海報；首屏也可以添加多張海報輪播，不過第二張的展現率要低很多，還不如第二屏，寶貝數量不多的店鋪，盡量不要使用輪播。

匿名的安慰

電商視覺設計實戰教程 > 8.1 首頁設計基本元素介紹（理論）

黃金三屏是展現率最高的

wx-1647575648

Photoshop 零基礎入門教程 > 2.1 圖層及混合模式

圖層，自動選擇

紅藍

Photoshop 零基礎入門教程 > 1.1初識ps

CC2017，工作區，菜單欄（縮放200%

匿名的安慰

電商視覺設計實戰教程 > 7.3 淘寶后臺熟悉

C店就是淘寶店，B店就是天貓店

匿名的安慰

電商視覺設計實戰教程 > 7.2 店招設計 / 店鋪裝修

1.店鋪裝修:選首頁導航欄上部要等達到150高才能遮掉默認條編輯切換代碼視圖進DW復制代碼粘貼代碼保存。2.導航方正蘭亭細/中黑微軟雅黑 14px-16px-18px 默認14px瀏覽字體14px。3.上傳賣家中心店鋪后臺圖片空間店招新建文件夾上傳圖片進DW 插入圖像復制圖片鏈接（進圖片空間）替換掉DW里面的鏈接屬性設置：地圖(命名) 創建熱點（可復制的）目標：選blank 填寫鏈接（可右鍵復制相關鏈接）

匿名的安慰

電商視覺設計實戰教程 > 7.1 店招設計 / 思路講解

店招的分類：1.小店鋪、小門面、我的要求并不高；2.規規矩矩，實用最重要，這類大部分套用模板；3.促銷型、一天一個大促，老板說要清倉；4.高逼格、高冷、就是個“范”，信春哥就是這么自信；5.創意型，與首頁海報相結合，但缺少通用性。

匿名的安慰

電商視覺設計實戰教程 > 7.1 店招設計 / 思路講解

天貓店招尺寸是1920px*150px,可編輯區域是990px*150px（分類：height=30px）。淘寶的店招尺寸是1920px*150px，可編輯區域是950px*150px（分類：height=30px）

匿名的安慰

電商視覺設計實戰教程 > 7.1 店招設計 / 思路講解

店招包含內容（并不是所有東西都要放，選擇其中幾個即可）——基本：（LOGO、關注、廣告語、導航）可選：（優惠券、主推款、售后保障、收藏本店）