網商貸官網設計案例
時間：2023-06-11 06:33:01 | 來源：網站運營
時間：2023-06-11 06:33:01 來源：網站運營
網商貸官網設計案例：哈嘍～大家好！這里是龍貓喵哦設計鋪，今天和大家分享網商貸的官網設計案例展示、設計思路、設計規(guī)范制定和組件化設計等。
01 項目背景
___網商貸是螞蟻金服旗下網商銀行提供的借貸產品，向中小企業(yè)提供貸款服務，可實現(xiàn)支付寶貸款，網商貸是針對阿里體系里的純信用個人經營貸款。
02 用戶人群
___近8000萬的小微企業(yè)，數量多分布廣，平均學歷較低，對貸款認知水平低，缺少資金支持，這些用戶人群有理性訴求和感性訴求，理性訴求是短期貸款、需求頻繁、快速到賬、簡單省事、希望低息。而感性訴求是不但任性、安心借貸、認知成本低、品等尊重和被認可。
03 產品框架
___（1）入口：因網商貸款是網商銀行提供的貸款產品，網商貸的官網入口嵌入在網商銀行官網內。網商銀行官網網址：
https://www.mybank.cn/網商貸網址：
https://login.mybank.cn/login/loginhome.htm?redirectURL=http%3A%2F%2Floanweb.mybank.cn%2F（2）主要內容分為：首頁、額度成長、還款、記錄查詢、信息管理和客服大廳。首頁額度有很多種情況，以是否準入和是否查看額度為例展示路徑。網商貸由團隊合作完成，個人負責部分：未登錄頁、首頁的各種狀態(tài)、缺省頁和營銷位規(guī)范制定。后面的頁面展示中只展示個人負責設計頁面。
04 交互鏈路
___該部分為交互設計師花懿負責設計，主要為確定頁面跳轉路徑和頁面內容確定，之后再交給UI設計師制作，這樣可以有效避免在設計過程中內容不確定的低效率返工。
05 設計思路
___（1）首頁布局：整體信息簡潔，給用戶溫暖感受，無過多干擾信息
（2）首頁背景適配：做過PC端的設計同學應該了解，如果要做不同分辨率的頁面適配，要實現(xiàn)中間內容寬度不變的情況下，兩邊拉伸變動，純色和漸變色更好實現(xiàn)，那么帶有較為復雜的背景如何做適配呢？
將背景圖層劃分為3層：顏色層、氛圍層、過渡層。其中顏色層和過渡層都為顏色漸變，前端同學可以寫出來，氛圍層分為左右2個獨立圖，分別靠左靠右適配。
06 設計規(guī)范制定
___設計規(guī)范包含：按鈕點擊狀態(tài)、氣泡設計和對齊規(guī)范、產品imatch和營銷imatch設計規(guī)范、小卡的設計規(guī)范。
07 組建化設計
___組件化設計列舉：彈窗組建、信息區(qū)組建、小卡組建和缺省頁組建。
08 設計展示
___以登錄頁、不準入頁、首頁卡片數適配和彈窗展示為例
小結
以上是網商貸官網設計案例的分享，未來會持續(xù)在龍貓喵哦設計鋪更新設經驗、案例分析和行業(yè)趨勢等，歡迎大家私信商務合作和設計交流～
在線咨詢
