二、場景圖:適合展示功能性商品、審美創造和珠寶類商品場景圖:對於強調功能屬性的商品，場景圖比白底圖更有優勢，場景圖通過美感和場景衍生的功能，讓這類功能性商品的購買者產生聯系感。總結:對於具有功能屬性和美感的商品，場景圖的轉化率往往優於白底圖，買家可以通過主圖獲得代入感，對增加購買和訂單轉化起到積極作用。比如下面這個是放大鏡，右邊的場景圖展示功能比左邊的白底圖更生動具體，更能傳達賣點。
3.拍攝方向:對於珠寶和食物，平視比俯視更好。理由:平視適合顯示建模，而俯拍適合顯示全景。壹般平視拍攝換食物的轉化率比俯視高。總結:對於時尚產品，拍攝前仔細觀察其在燈光下的造型特點。金銀首飾的表面造型雖然堅實圓潤，但在特定方向照射時，會壹直發光、運動；食物主圖的轉化率壹般高於俯視圖。
四、模特的作用:有模特的服裝品類有利於時尚品類、服裝、內衣品類的轉化，在不拼接主畫面的情況下使用有模特的場景對轉化有積極的作用。總結:對於服裝類的主圖，建議把模特的大圖放在第壹張圖中，然後把拼接圖和細節圖放在後面的輔助圖中，這樣轉化率比較高。
文章由小魚電商賣家助理分享。可以自己去官網搜壹下。
卡片排版界面小技巧正確理解卡片設計，什麽是卡片，總結卡片的優點，通過兩個設計案例講解卡片的正確設計知識。希望能幫到妳。
無論是WEB還是APP卡片設計被廣泛使用，很多UI設計師都更喜歡這種表現。卡片設計會給人壹種視覺上的享受，給界面壹種層次感。但是，卡片設計中往往有壹些技巧需要了解。卡片設計不應該基於卡片設計，而應該更好的應用於界面場景。希望有壹些知識點能在這次分享中幫到妳。在接下來的系列文章中，順叔將對界面中潮流的設計手法進行分析，希望能對壹些設計夥伴有所幫助。
教程前的介紹
卡片設計這幾年比較流行，同樣的設計表達也是壹種趨勢。應用到APPPC接口上還是比較受歡迎的。任何從事UI設計的人都會知道，卡片設計具有將內容進行整合和模塊化的功能，從視覺和個性化的體驗上來呈現，這是設計師在設計中常見的表現，也有獨特的創新理念。
在壹些項目中，有些客戶會說設計的APP界面有點太白，沒有層次感。這時候妳要告訴客戶，APP設計中使用了壹種流行的表現手法——卡片設計，可以解決畫面中個性化、多變、層次化的設計問題。卡片設計是什麽？
無處不在的卡片設計具有個性的美感和良好的可用性。它是由文字標題、副標題、圖形或圖片組成的模塊化，以塊的形式整合內容，使內容更有規律，視覺上更個性化，也是內容信息的快速入口。更直觀的內容信息表達和快速跳轉操作。已經成為當今設計的流行趨勢，卡片在設計上也占據了壹定的優勢，使得整體更有層次感，使用起來也更方便，在視覺、體驗、交互上都有很好的優勢。
本文專門設計了兩個案例，通過這兩個案例進行壹些說明。請看下圖:
無論是大平臺還是小平臺，產品都會采用這種類卡設計的趨勢，這也使得類卡設計成為現在普遍的優勢，但是類卡設計確實有不錯的效果。
具有壹定的層次感，能在頁面布局中發揮不同的設計，個性化的變化，頁面層次感強，能更好的體現提取的內容。
卡片設計通過整合圖片、圖標、LOGO、標題，以分塊的形式展現在界面中，在排版上更有規律。雖然內容太多會導致頁面淩亂，但是壹個模塊包含內容後會更加規整，這也給頁面設計帶來了更好的視覺。
卡式會為整個頁面增加視覺體驗，尤其是大圖卡式更有視覺沖擊力，背景襯托前景卡式設計。我也覺得用卡很舒服。卡片設計還是要根據整體布局，產品需求，功能來設計。以達到最佳的用戶體驗和視覺體驗。
不要為了卡片設計而設計卡片。
卡片設計在易用性和靈活性上相對較高，在響應式設計中也運用較多。可以更好的有條不紊的安排。
簡單的設計會更有品質，也不需要過多的裝飾。哪怕是白色色塊，圖標五顏六色，字幕有變化，也會覺得高大上。即使是色塊卡，在設計內容上也不需要太多的標題、圖標、按鈕來支持卡片。
在卡片設計上，會有壹些動態交互，比如整個卡片的放大、縮小、左滑、右滑，可以讓整個模塊滑動、縮放。整體效果增加了良好的視覺交互體驗。
總的來說，界面設計中卡片存在的意義和表達是什麽？下面給大家介紹壹些常見的正確的設計表達方式。希望朋友們在設計的同時能有壹些啟發和借鑒，在自己的設計中加入壹些表現手法。合適才是最重要的。卡片設計應根據整體風格和布局進行展示。在進壹步的比較和布局中，效果最好的是最終的顯示方式，並總結分析了幾個常見的代表性例子。如有不全之處，歡迎討論補充。以下是壹些例子:
色塊為主體，由流行的漸變色組成，其中四邊為圓角，同色塊下的陰影襯托主題。這是卡片設計中常見的應用方法，卡片的長度和高度也是根據設計中的結構、內容和功能來設定的。正方形和長方形都是壹種表達方式。色塊上的標題文字、圖標、圖形是整張卡片的布局形式，無非就是左右布局和上下布局。
應用場景:卡包、天氣、類目、入口、優惠卡。
這個表格* * *類似於頭部C位出現的卡片設計，上面帶有標題、副標題和圖形布局。不難發現，如果圖片是彩色的，那麽底部就是白色的，這樣白底色塊的外觀就比較簡單來突出卡片。如果背景是彩色的，卡片也是彩色的，卡片的突出性就不會那麽強了。會員卡設計中經常用到圖2，也比較簡單。另外兩個* * *背景顏色壹樣。壹般底部的背景色是整個界面的主色調。背景是彩色的，上面用了壹張白色的卡片。卡片上方的標題、文字、圖片呈現。只是排版的方式不同而已。在很多APP設計中，有很多這樣的表達。通過主色可以將上方的狀態欄和導航欄在視覺上融為壹體，底部背景色延續，上面突出白色卡片，更具視覺和層次感。白卡不需要過多的裝飾，更能體現出上面的文字和圖片。
應用場景:會員卡、滑卡、圖文標題、入口
這種形式在畫面素材的選擇上尤為重要。視覺效果好的圖片可以剪切、處理、合成、拍照、插畫等。如果圖片質量好，就能帶動整個設計，通過有效的圖片溝通和文字溝通，讓用戶更清晰地理解。這種造型壹般以入口或列表的形式出現，也能體現出融合性和可視化。
應用場景:滑卡，圖文標題，入口，列表。
大尺度的卡片式，壹般以攝影圖片和插畫的形式，更有沖擊力，更能表現出壹種潮流。體驗也很好。放大視野、展示內容和圖片的結合，讓參觀者更願意多看壹會兒。表達的畫面與文字內容壹致，達到圖文交融的程度。壹般這個對圖片的選擇還是挺嚴格的。沒有質量，圖形的效果就會降低。
應用場景:列表、描述、入口、天氣。
列表卡設計，壹般是白卡，以標題、頭像、按鈕、平面插圖的形式體現。多用於壹級頁面的下級內容和二級頁面的列表頁或收藏頁。整體弱化背景以白色為主，給圓角和陰影以層次感，體現上層內容。每個模塊的單元都有壹個統壹的願景。
應用場景:列表、收藏頁面、門戶
大卡設計，表現為帶有標題、按鈕等信息的大卡，也表現出層次感突出、設計個性化的特點。反映內容，壹般背景是彩色的，上面的卡片是白色的，如果下面的背景是白色的，那麽卡片的形式也可以是彩色的，在對比中有壹個對比來突出卡片的作用。
應用場景:提示、解釋、折扣虛張聲勢入口
上面總結的幾種卡片的形式可以根據設計中的情況來設計。卡片多樣化，布局多樣化。適合自己的產品最重要。雖然設計常用於界面設計，但是不要為了卡而盲目的把設計應用到卡上。這樣不行，但是效果達不到理想的程度。希望幾個卡片總結能給大家帶來壹些啟發和啟發。
同樣在這些卡片中，會有壹些基本特征:
1.四個角都是圓角。
2.根據趨勢，逐漸改變顏色或白牌。
3.色塊下的陰影，色塊下的陰影更能體現層次。
4.卡片的上述組成部分，標題，副標題，圖形，按鈕，圖片，頭。
5.字體大小、字體顏色發生變化
6.通用卡常用於會員、列表、描述、優惠分類、類別、收藏頁、歡迎頁等場景。
為了解釋文章，順叔臨時構思了壹個產品原型，很快進行了壹個簡單的設計，壹個初版，壹個優化版，主要是解釋這張卡設計中的壹些問題。
下圖是這個想法的原型:
分析完原型之後，設計就開始了。首先，設計壹個版本。如果卡片這樣設計，顏色搭配，會怎麽樣？整體設計以藍紫色為主色調。先鋪上藍紫色的色塊作為背景，再在上面放上白色卡片，這樣卡片上的數字、圖形等細節內容更能豐富配套卡片。同樣，數據流也是比較重要的C位。這也是壹個重要的位置。然後根據原型，下面有兩張卡。通過扁平化設計，以色塊為主設計了壹個藍色卡片和壹個橙色卡片，上面有圖標、頭像和標題。兩種顏色的對比讓視覺更有沖擊力。這樣的設計整體上沒什麽問題，但問題是拿出單個模塊的效果確實不錯，但是構圖之後，上卡的C位讓下面的兩個彩卡搶了視覺。妳打開這個界面，視覺就落在色卡上了，所以整體設計有問題。以上數據，白牌其實更重要，全圖是壹張沒有任何設計改動的牌。
那麽我們只能在這個基礎上進行優化。其實大家都在同時做設計。在考慮功能模塊的前提下，還要考慮用戶體驗。那麽視覺從何而來，色彩，層次，格式等等？那麽我們能優化它嗎？其實還是有優化的空間的。下圖為第壹版:
根據上面的設計進行了優化，也保留了白卡的壹些元素，在卡片之間放置了壹些彩色圖標，這樣可以快速訪問功能，卡片設計上也可以加入變化，讓整個畫面更加靈活。雖然是白卡，但是有壹些顏色的點綴，也讓白卡活躍起來，把色卡換成白卡，從上到下的布局就舒服多了，而且沒有這種跳躍。整體風格更簡潔，功能更全面。
調整後:
從原型，到第壹版的設計，再到優化調整，證明了卡不應該因為卡而設計，反而會失去效果。考慮到功能模塊，用戶體驗，視覺體驗，肯定會讓整體很舒服。壹直都說繪畫需要有主有次，設計也要有主有次，這樣層次關系才能更清晰。
但這些條件必須從經驗、色彩、版面、版式等方面進行比較和研究。先不要急著做設計，前期思考，邏輯清晰，設計會更順暢。卡片設計，大家都在應用。希望這篇文章能給妳帶來壹點知識。
怎麽畫讀書筆記的小插畫？查找圖片的方法分為以下五個步驟:
1，讀書筆記的小插畫可以用動物形象，先畫出頭部的輪廓。
2，然後用看和鼻子部分來畫，可以畫的更簡單。
3.然後給它畫身體，四肢，尾巴。
4.畫完後，在熊下面畫壹個枕頭，前面畫壹只蝴蝶。
5.最後壹部分給小熊塗上相應的顏色，小插畫完成。