電商設計第十三式-實戰(zhàn)篇（頁面制作規(guī)范與技巧）

時間：2022-08-06 04:54:01 | 來源：網(wǎng)站運營

時間：2022-08-06 04:54:01 來源：網(wǎng)站運營

時間過的很快，即將要完成一整個章節(jié)的講解，池子盤點了一下

前三式的電商設計入門的理論

到中間幾式的裝修后臺和活動圖構圖技巧

又到最后幾式的海報詳情頁實操

池子算是把入門電商設計基礎的那些事情給你掰扯清楚了，這些也是入門的筑基篇，熟練掌握以上招式思路邏輯，想準備些好到作品集不會太難，面試中就算不能保證立馬一眼跳出，但保守來說對付大部分公司需求是足夠了，有志于從事電商設計的小伙伴們可以多盤盤這些內容，想必每次收獲到的東西必定會有不同。

池子也將會繼續(xù)推出下一個煉丹篇系列，講解自己操盤過的各個類目的實戰(zhàn)思路，如果你掌握好了筑基篇招式，面試難度就不會特別大，也希望各位如愿找到好的團隊，也不妄池子寫的這些東西，繼續(xù)跟隨池子的腳步進入下一個系列，你將學會如何起盤一個品牌的店鋪視覺，從主圖，詳情頁，活動圖，首頁各個環(huán)節(jié)全方位了解單個品牌的各環(huán)節(jié)的設計思路， 幫助解決你進入公司后的實際難題，嘿嘿嘿。

說回正題，由于頁面制作是電商設計工程量中最多的一個，一篇文章的篇幅遠不足以讓各位童鞋去做太多的細節(jié)思考，想要做深入理解需要大量實戰(zhàn)經(jīng)驗和日常練習方能有效運用，本篇作為筑基實戰(zhàn)篇的最后一節(jié)，池子打算以自己做過的多個案例品牌講解為主，附帶自己收集的一些網(wǎng)上案例來讓各位童鞋對品牌頁面的調性設計有個基礎概念。




1.尺寸規(guī)范上，回顧回顧第四式開頭，







記下這幾個大的尺寸規(guī)范就夠用，另外在PC端上的海報設計的時候，切記盡量在990-1100的范圍內做你的設計核心內容，不然很容易造成裝修頁面后PC臺式機由于屏幕寬度看不到你兩邊設計的內容，池子曾經(jīng)時?？吹竭@樣的情況發(fā)生。而現(xiàn)在基本都以手機端為主要尺寸輸出畫面，因為現(xiàn)在大部分人都用手機購物，為了在手機端上有更好的視覺體驗感，尺寸設計上更多以一屏一內容的方式去做展現(xiàn)，上篇池子已經(jīng)提到過。

池子做過的案例中都是遵行這樣的尺寸規(guī)范原則，直接上圖看看。

PC端：

2.頁面框架上,通常分為日常頁面+活動頁面2種形式,

其中日常頁面框架為首頁海報+優(yōu)惠券+寶貝分類+主推寶貝+新品寶貝

活動頁面框架為首頁海報+優(yōu)惠券+活動利益點+寶貝分類+爆款寶貝+新品寶貝，

這一部分的內容在實際項目中運營那邊也會提前給到設計，這2個框架對付大部分類目來說幾乎是夠用了。直接上圖。

日常更新PC：

活動更新PC：

但電商武林,總有那些想玩差異化路線的品牌，會用純攝影的招式去做首頁產(chǎn)品展現(xiàn)的框架，做到極致簡單，把首頁當作一個線下櫥窗展示的空間，不做任何多余頁面上的設計，比如做到極致的花笙記：

亦或者把頁面結構做成一整個串聯(lián)的故事，看完一個頁面等于讀完一個故事，思路各異，別出心裁，招式多樣，別出心裁，池子另外找了些案例你們感受感受。




3.頁面設計上，遵行視覺規(guī)范4方面分析法

找出品牌該有的配色，圖形等元素，再根據(jù)每個類目產(chǎn)品的設計元素來進行分析起盤，池子經(jīng)常提到的萬物基于產(chǎn)品就是這個意思，挖掘出以上設計元素后，剩余的就是按照邏輯框架模塊填充畫面內容，具體怎么做？嘿嘿，拿出紙筆畫出頁面大框架，是不是有種熟悉的感覺？對呀，跟做海報的思路一樣有木有？池子這一節(jié)也要教給你們一個思維轉換招式，以后碰到頁面這種設計的時候，把它當作一整個豎版海報來設計，這樣才會有完整的視覺設計元素意識，不然很容易造成整個頁面每個模塊都是單獨的，分開來看每個模塊都沒啥問題，而一旦合并成一整個，發(fā)現(xiàn)會有模塊之間的過渡都不統(tǒng)一，主要是沒有統(tǒng)一視覺語言的原因造成的。池子前幾期的學員設計練習中就會經(jīng)常發(fā)生這樣的情況，比如：

既然找出了問題，下一個實戰(zhàn)系列中池子也會拿實際案例的各種類目做詳細的講解。

以上，便是今天池子要給大家介紹的頁面規(guī)范制作思路，想要給自己時間去沉淀練習的童鞋們抓緊時間，可抓緊時間真有說的那么簡單？肯定不是啊，池子每天除了忙公司項目，還要還要抽時間碼字，為了未來的百人大戰(zhàn)發(fā)掘培養(yǎng)種子成員，還得各種互動解答咨詢。。。說不累的，你來試幾天？以上種種，哪有你上班在公司可以摸摸魚，下班宅家看劇舒坦？但如果你不甘于眼前的舒坦，就抓緊時間找出合適自己的設計路數(shù)吧，結合池子的“電商設計十三式”，給自己一年的時間，讓自己蛻變！想不想這一年的時間讓池子陪你一起度過？

歡迎加入池子的社群，你起盤中的任何環(huán)節(jié)，不僅可以在群里和同路的小伙伴討論，也可以找池子梳理脈絡，同時展示自己的進步成果，得到讓自己不再沉迷于刷抖音，光空想不實干的力量！池子和一群敢想敢做的小姐姐小哥哥們在等你。