第1章　電商與電商設(shè)計

在講關(guān)于電商設(shè)計師的那些事兒之前，我覺得有必要把電商的發(fā)展歷程給大家過一下，姑且拿目前比較大的幾家電商平臺的發(fā)展歷程來向大家解說吧。

為了寫這個話題，我在網(wǎng)上翻閱了大量資料，其中包括一些采訪稿，并最終把所有的時間節(jié)點串聯(lián)了起來，于是就有了下面這個時間軸（這里只是簡略匯總了一下，時間軸兩邊是一些相關(guān)背景事件）：

看完上面發(fā)生的一些事件后，我們最終看到，歷經(jīng)12年，各大電商平臺相愛相殺后基本都是找到自己的歸宿了：騰訊電商所有業(yè)務(wù)被京東收購，蘇寧牽手了天貓，亞馬遜入駐了天貓，eBay入駐了京東全球購，沃爾瑪先是全資控股1號店，后來又以約95億人民幣的價格賣給了京東。

所以緊接著大家可能會有下面這些疑問。

1.1　互聯(lián)網(wǎng)的出現(xiàn)為我們帶來了什么？

2010年安卓系統(tǒng)風(fēng)靡全球、iPhone4的發(fā)布等等這些都使得我們的手機變得更加智能，上網(wǎng)更加方便，包括微博、微信都是在這個時候崛起的，這些新媒體都對傳統(tǒng)的紙媒、傳統(tǒng)企業(yè)、廣告行業(yè)造成了巨大的沖擊，時代的轉(zhuǎn)變造就了新的就業(yè)方向。

1.2　電子商務(wù)是指什么？

電子商務(wù)是依賴于互聯(lián)網(wǎng)而產(chǎn)生的一種聯(lián)接線上線下交易的商業(yè)活動，目前電商主要有這樣幾個模式：B2B、C2C、B2C、O2O、P2P等：

• ◆　B2B（Business to Business）：指連接代理商、生產(chǎn)商、零售商之間的線上線下交易的商業(yè)模式，比如阿里巴巴。
• ◆　C2C（Customers to Customers）：指個人對個人的網(wǎng)上交易模式，比如淘寶、當(dāng)年的拍拍。
• ◆　B2C（Business to Customers）：指商家對消費者個人的網(wǎng)上交易模式，比如天貓、京東、亞馬遜。
• ◆　O2O（Online to Offline）：指線上下單支付，線下消費的商業(yè)模式，比如京東到家、餓了么、淘點點，它跟團購模式的區(qū)別僅在于：第一，團購是限時間段的促銷，第二，支付情況由團購平臺說了算，商家是不知情的，所有消費者的信息資料都掌控在平臺那里，商家跟消費者之間在線上沒有任何交流。
• ◆　P2P金融：也稱互聯(lián)網(wǎng)金融，它是一種需要借助電子商務(wù)專業(yè)網(wǎng)絡(luò)平臺幫助借貸雙方確立借貸關(guān)系并完成相關(guān)交易手續(xù)的小額借貸交易模式。借款者可自行發(fā)布借款信息，包括金額、利息、還款方式和時間等，也可以自行決定借出金額實現(xiàn)自助式借款。自2013年起，就不斷有新的P2P金融公司出現(xiàn)，又不斷地出現(xiàn)P2P金融公司倒閉潮，這是一個持續(xù)的現(xiàn)象，一直到現(xiàn)在。

1.3　是什么促進了電子商務(wù)的發(fā)展？

其實，1994年互聯(lián)網(wǎng)就已經(jīng)被引入到國內(nèi)了，到20世紀(jì)末，電子商務(wù)雖然在國內(nèi)有所發(fā)展但還遠(yuǎn)沒被大眾所熟知，一直到了2003年非典時期出現(xiàn)了契機（記得那時候我還是個準(zhǔn)備中考的初中生，每天拼命跑步練習(xí)肺活量，由于非典的到來，白跑了，因為不需要做吹氣的肺活量測試了），大家都不敢出門，也就是在這樣一個環(huán)境下，網(wǎng)上購物變得異常火熱起來。

2003～2010年也成了電子商務(wù)發(fā)展最快的時期，因為這個時期安卓系統(tǒng)風(fēng)靡全球，iPhone4等智能手機相繼出現(xiàn)，為信息交換及連接人與人之間的交流進一步創(chuàng)造了條件，唯品會、聚美優(yōu)品、一號店還有綜合類電商平臺——京東，也是在那個時候誕生的。

2008年美國次貸引發(fā)的全球金融危機，傳統(tǒng)行業(yè)日子比較難過，也成了電商發(fā)展的催化劑，因為網(wǎng)上購物解決了信息不對稱的問題，人們可以非常便捷地花更少的錢，搜羅到全中國乃至全球的東西。

1.4　電商設(shè)計屬于什么范疇？

在解釋電商設(shè)計的范疇之前，我們可以先看看UI的定義，UI也就是User Interface，它主要是研究人、人和界面、界面這三個方面，所以UI包含了WUI（界面設(shè)計）、GUI（圖標(biāo)設(shè)計）、交互設(shè)計、用戶體驗研究這幾個方面的內(nèi)容（現(xiàn)在很多人說的UI其實都有點指代不明）。

所以電商設(shè)計其實是UI（User Interface）設(shè)計的一個分支，它是傳統(tǒng)平面設(shè)計和網(wǎng)頁設(shè)計的結(jié)合體，也是互聯(lián)網(wǎng)時代的產(chǎn)物。

舉個例子，以前我們看到的超市海報，一些折扣促銷信息之類，但是你要買東西還是需要去店里，而電商設(shè)計的任務(wù)就是，直接在網(wǎng)上把這些商品展示在網(wǎng)頁上，你直接點擊就可以購買了，這個購買的過程就涉及到了人和設(shè)備之間的互動交流。

如下圖所示：

1.5　電商設(shè)計的發(fā)展趨勢是什么？

隨著科技的發(fā)展，互聯(lián)網(wǎng)、智能手機的逐漸普及，這影響到了我們的生活習(xí)慣，人們越來越喜歡大屏幕，越來越離不開手機。

所以對我們設(shè)計師來說，也需要做出相應(yīng)的改變，比如在設(shè)計風(fēng)格、尺寸的設(shè)定上，要符合用戶的習(xí)慣。設(shè)計說白了就是為了讓大家有更好體驗的服務(wù)行業(yè)嘛！

舉個例子，假如我們在PC端的網(wǎng)頁上要設(shè)計一個商品列表，出于慣性思維都會在列表結(jié)尾放一個“查看更多”按鈕，用戶要用鼠標(biāo)單擊這個按鈕才會出現(xiàn)更多商品，而在移動設(shè)備上我們卻可以省去這個按鈕，因為用戶在移動設(shè)備上的習(xí)慣是上下左右劃動，往上劃的過程中更多商品就刷新出來了，可以自己去體驗一下。

還有很多類似的設(shè)計思維的轉(zhuǎn)變。從PC端的設(shè)計轉(zhuǎn)向移動端的設(shè)計，可不只是改改尺寸這么簡單，大家都可以多去觀察體驗。

下面給大家看一些示例。

1．小屏幕轉(zhuǎn)向大屏幕

隨著科技的進步和發(fā)展，我們的電腦屏幕是越來越大了，下面是百度統(tǒng)計流量研究院的截圖。

2．PC端轉(zhuǎn)向M端

據(jù)統(tǒng)計，現(xiàn)在有80%～90%的訂單是由移動端貢獻的，甚至很多中小店鋪已經(jīng)完全放棄PC端了，把精力集中用于打理移動端店鋪上。下面也是百度統(tǒng)計流量研究院的截圖。

3．由低價導(dǎo)向轉(zhuǎn)向品質(zhì)生活導(dǎo)向的消費觀念

假設(shè)一個20歲的年輕人在2004年電商正處于起步階段的時候就開始網(wǎng)購了，那么想想現(xiàn)在也已經(jīng)三十多歲了，一個在2004年就上網(wǎng)網(wǎng)購的人，你覺得這批人以及他們的孩子還會是那群仍然在追求低價商品地攤貨的人嗎？顯然不會，他們在成長，他們對生活的要求和追求也是在增長的。

如下圖所示，比如辣條屆的網(wǎng)紅——衛(wèi)龍，以及故宮淘寶的那些嚴(yán)肅賣萌照，都給人忍不住想笑并且要分享給朋友的沖動，再比如這幾年很火的代購潮，很多大平臺推出了全球購，這都是為了滿足人們想要買好貨并且還比國內(nèi)便宜的需求。

4．80后/90后成為網(wǎng)購主力軍

80后已經(jīng)普遍成長為具有自主消費能力的一群人，而90后則普遍屬于思維活躍／勇于接受新鮮事物／個性明顯／享受超前消費的一群人，同時也具有基本消費能力，所以在電商設(shè)計的玩法上也是越來越貼近這類人群的消費習(xí)慣，2016年在朋友圈被刷屏的“淘寶造物節(jié)”其實也是在順應(yīng)這些需求，比如這些關(guān)鍵詞：新奇／科技感／VR／賤萌／污／腦洞／二次元。

5．網(wǎng)紅效應(yīng)／粉絲效應(yīng)／設(shè)計師品牌

當(dāng)前競爭日益激烈，平臺流量有限成本又高，所以品牌及店鋪一方面要把自家的產(chǎn)品做出特色，另一方面要能通過自己生產(chǎn)內(nèi)容玩社交的方式積累粉絲，比如現(xiàn)在在淘寶或京東買完東西，你會在頁面里看到加微信領(lǐng)取紅包或優(yōu)惠券的字眼，即便是線下專柜買東西也一樣，導(dǎo)購員都會詢問是否可以添加私人微信，其目的也就是打入你的社交圈，讓你一買東西第一個就能想到他。

而自媒體大咖、網(wǎng)紅、行業(yè)專家等自帶流量的人帶貨能力更是驚人，粉絲愿意相信他們的推薦，大多數(shù)網(wǎng)紅為了不辜負(fù)粉絲的信任往往也不會亂推薦產(chǎn)品，這種微妙的關(guān)系促成的超高轉(zhuǎn)化率也正吸引著越來越多的商家及品牌往這個方向發(fā)展。

1.6　電商設(shè)計師有哪些藏身地？

電商設(shè)計師大致混跡于如下7種地方，而其中，電商平臺可以容納海量店鋪，所以店鋪里藏的電商設(shè)計師應(yīng)該是最多的：

①　店鋪，比如裂帛、韓都衣舍這些電商品牌店鋪。

②　電商平臺，比如天貓、京東等等。

③　企業(yè)的電商部門，比如小米、美的、魅族都有自己的電商部門。

④　電商品牌策劃公司，主要幫助網(wǎng)店從前期策劃、拍攝到店鋪首頁、詳情頁設(shè)計、頁面上線打包完成。

⑤　代運營公司，如果說每一個品牌或者店鋪是一個孩子，那么代運營公司就好比養(yǎng)母（負(fù)責(zé)店鋪的各種運營維護和推廣等工作），然后那個生母（也就是店鋪或者品牌所有者）只需要給撫養(yǎng)費就好，其他的就不管了。

⑥　外包公司，主要是指跟大的電商平臺保持長期合作的設(shè)計公司，比如武漢藝果。

⑦　最后就是SOHO一族了，自由職業(yè)者，不過最終也可能還是會自己創(chuàng)業(yè)或者回到其前面講的幾類陣地里面尋求一個職位，不大可能一個人單打獨斗一輩子。

這里要說明的一點就是，藏身于這7種地方的設(shè)計師可能存在一些重疊，因為有些人可能身兼了數(shù)種角色。

1.7　電商設(shè)計師需要做哪些內(nèi)容？

下面從三個方面給大家介紹工作內(nèi)容：按服務(wù)對象劃分／按項目類別劃分／按載體劃分。

1．按服務(wù)對象劃分

不管這些電商設(shè)計師藏在哪里，他們的服務(wù)對象，歸根結(jié)底就兩個，一個是店鋪，一個是平臺，如下圖所示。

2．按項目類別劃分

如下圖所示。

3．按載體劃分

無非就是PC/手機／pad等移動端設(shè)備了，PC端在前面已經(jīng)介紹過了，移動端相比PC端要豐富許多，比如：H5活動引導(dǎo)頁／移動端專題活動／微信手Q活動頁設(shè)計／App等，如下圖所示。

1.8　如何走好電商設(shè)計這條路？

關(guān)于這個問題，以下三個方面將予以說明。

1．軟件技能

店鋪類的電商設(shè)計師可能不僅要會用Ps之類的設(shè)計軟件，還需要懂一些CSS方面的代碼知識，往往設(shè)計還要切圖，需要用到Dw，而越是大的電商平臺，越是優(yōu)秀設(shè)計公司分工都會比較明確一些，設(shè)計師可能只需要掌握Ps、Ai或Cdr這些軟件就好了，專注于視覺設(shè)計和創(chuàng)意這塊，不強制要求會切圖。

Axure是交互設(shè)計要用到的軟件，能懂一些的話當(dāng)然不會有壞處，如果你的合作對象是用Word畫交互框架圖或者交互稿的，那么也許你還需要懂Word。總之除了視覺設(shè)計以外的工具和軟件都是因為你可能需要去跟其他人溝通合作，而需要掌握。繪畫對設(shè)計師來說是非常加分的一項技能，雖然并不是必須要掌握的，如下圖所示。

2．需要了解的知識點

設(shè)計需要掌握的知識，包括色彩構(gòu)成、平面構(gòu)成、立體構(gòu)成這三大構(gòu)成，文案創(chuàng)意、市場營銷、用戶體驗等等這些方面。因為我們的設(shè)計活動都是與活動銷售額掛鉤的，商業(yè)設(shè)計就需要在確定其活動目的的基礎(chǔ)上做合適的設(shè)計，要面對需求人、面對消費者，所以會涉及到以上知識點，其他方面還包括溝通能力、理解能力、生活閱歷、人際關(guān)系等等這些方面，如下圖所示。

3．其他方面

其他方面主要是指溝通技巧、思考方式、是否對自己的職業(yè)感興趣等，分為三個方面：上下級之間、上下游之間、自我驅(qū)動力。

上下級之間：只要你不是SOHO一族自己單干，只要你是待在一個公司里面，肯定就會面臨要么有上級沒下級（基層員工），要么既有上級又有下級（中高層領(lǐng)導(dǎo)），要么只有下級（你是老板，但或許你還有投資人），在這種環(huán)境里，你要想去做一件事情，就必須得到比你高層級人的支持還有比你低層級人的配合執(zhí)行，你才可能達(dá)到這個目的，這時候是不是就需要你會溝通和處事別人才會愿意更好地支持你、配合你對不對？

上下游之間：上下游是平級，不存在誰高誰一等，誰必須聽誰的，所以你要去做成一件事情更需要能夠換位思考和好好溝通，每個崗位互相配合，就比如我們做視覺設(shè)計，你的上游是交互設(shè)計師／產(chǎn)品經(jīng)理或者運營策劃，下游是前端，在一個正規(guī)的大公司里，一個頁面完整出爐，是他們共同合作的結(jié)果而并不是某一個人的功勞。

可能很多人把上游理解為上級了，比如運營只是設(shè)計的上游，他并不是設(shè)計的上司，他們之間是平級的，有些運營可能誤以為自己是上級就可以對設(shè)計隨意指揮，這就很要不得了。

自我驅(qū)動力：你去做一件事情是自我驅(qū)動的，有可能是因為興趣，有可能是因為覺得自己有這個責(zé)任去做。不管怎樣，如果是通過自我驅(qū)動去做一件事情的話，肯定會比被動去做要高效、要堅持得持久些。

1.9　寫在最后——一些嘮叨的話

1．想做設(shè)計但是沒有任何基礎(chǔ)怎么辦？

沒有基礎(chǔ)就去學(xué)習(xí)、去打基礎(chǔ)，如前面提到的。

2．已經(jīng)是設(shè)計師但是還在考慮要不要轉(zhuǎn)行。

如果是因為對設(shè)計不感興趣，那就趁早轉(zhuǎn)行，設(shè)計這行對于不感興趣的人可能真的是非常痛苦，但對于感興趣的人，是苦并快樂著的。

如果是因為設(shè)計這行工資太低，才想要轉(zhuǎn)行，那么問題就在于自己是否足夠努力以及足夠有天賦了，任何行業(yè)都有拿高工資的和拿低工資的，而正常情況下，排除實力之外因素，拿高薪的那一群人付出的努力、時間精力、耐受的寂寞都要比我們多得多。

3．一名普通設(shè)計師該怎么進入大公司呢？

普通設(shè)計師想要進入大公司好公司，前提都是要拿作品說話的，所以好好提升自己的設(shè)計能力吧，如果能有些特長，比如畫畫特別好、攝影很厲害、唱歌很贊，等都可以給自己加分，能夠認(rèn)識愿意推薦自己的前輩拿到錄用通知的概率也要大些，但前提始終是自己的設(shè)計能力要達(dá)標(biāo)。