APP-小红书商城改版练习[2020]
上海/UI设计师/1年前/30浏览
版权
APP-小红书商城改版练习[2020]
![APP-小红书商城改版练习[2020]（图ZMzg4MTk3Njk2） - APP界面 - 站酷设计师ZOOEY_Z原创素材 - 站酷ZCOOL](https://img.zcool.cn/community/67e61797574b0a3lein3zs6234.jpg?x-oss-process=image/saveexif,1/auto-orient,1/resize,m_lfit,w_1280,limit_1/sharpen,100/quality,q_100)
🧠
设计策略 · 一切围绕「转化」与「体验」双轮驱动
这次的改版目标是朝着“轻量电商”方向靠拢，去掉了冗余装饰，转而以模块化的结构搭建起用户的浏览路径。信息分发清晰、动线短促、操作反馈及时——这是对内容电商 UI 的深度再梳理。
![APP-小红书商城改版练习[2020]（图ZMzg4MTgzNDY4） - APP界面 - 站酷设计师ZOOEY_Z原创素材 - 站酷ZCOOL](https://img.zcool.cn/community/67e5e7d4a4cf2xpiy9l55z2020.jpg?x-oss-process=image/saveexif,1/auto-orient,1/resize,m_lfit,w_1280,limit_1/sharpen,100/quality,q_100)
![APP-小红书商城改版练习[2020]（图ZMzg4MTgzNDcy） - APP界面 - 站酷设计师ZOOEY_Z原创素材 - 站酷ZCOOL](https://img.zcool.cn/community/67e5e7d49c2ccth7q8v7kc1654.jpg?x-oss-process=image/saveexif,1/auto-orient,1/resize,m_lfit,w_1280,limit_1/sharpen,100/quality,q_100)
![APP-小红书商城改版练习[2020]（图ZMzg4MTgzNDc2） - APP界面 - 站酷设计师ZOOEY_Z原创素材 - 站酷ZCOOL](https://img.zcool.cn/community/67e5e7d4c498ejyjqdywla4397.jpg?x-oss-process=image/saveexif,1/auto-orient,1/resize,m_lfit,w_1280,limit_1/sharpen,100/quality,q_100)
![APP-小红书商城改版练习[2020]（图ZMzg4MTgzNDgw） - APP界面 - 站酷设计师ZOOEY_Z原创素材 - 站酷ZCOOL](https://img.zcool.cn/community/67e5e7d4a592c74q5w3h5o4026.jpg?x-oss-process=image/saveexif,1/auto-orient,1/resize,m_lfit,w_1280,limit_1/sharpen,100/quality,q_100)
![APP-小红书商城改版练习[2020]（图ZMzg4MTgzNDg0） - APP界面 - 站酷设计师ZOOEY_Z原创素材 - 站酷ZCOOL](https://img.zcool.cn/community/67e5e7d4a50e1jllpm0shm7551.jpg?x-oss-process=image/saveexif,1/auto-orient,1/resize,m_lfit,w_1280,limit_1/sharpen,100/quality,q_100)
![APP-小红书商城改版练习[2020]（图ZMzg4MTgzNDg4） - APP界面 - 站酷设计师ZOOEY_Z原创素材 - 站酷ZCOOL](https://img.zcool.cn/community/67e5e7d4c4af7teym7lopp6154.jpg?x-oss-process=image/saveexif,1/auto-orient,1/resize,m_lfit,w_1280,limit_1/sharpen,100/quality,q_100)
![APP-小红书商城改版练习[2020]（图ZMzg4MTgzNDky） - APP界面 - 站酷设计师ZOOEY_Z原创素材 - 站酷ZCOOL](https://img.zcool.cn/community/67e5e7d4a4d5dza7s4a3hp8168.jpg?x-oss-process=image/saveexif,1/auto-orient,1/resize,m_lfit,w_1280,limit_1/sharpen,100/quality,q_100)
![APP-小红书商城改版练习[2020]（图ZMzg4MTgzNDk2） - APP界面 - 站酷设计师ZOOEY_Z原创素材 - 站酷ZCOOL](https://img.zcool.cn/community/67e5e7d4a3caawnbeezir84851.jpg?x-oss-process=image/saveexif,1/auto-orient,1/resize,m_lfit,w_1280,limit_1/sharpen,100/quality,q_100)
![APP-小红书商城改版练习[2020]（图ZMzg4MTgzNTAw） - APP界面 - 站酷设计师ZOOEY_Z原创素材 - 站酷ZCOOL](https://img.zcool.cn/community/67e5e7dc427713nbf7xvbb9841.jpg?x-oss-process=image/saveexif,1/auto-orient,1/resize,m_lfit,w_1280,limit_1/sharpen,100/quality,q_100)
品牌感与功能性的平衡
整个界面在视觉上遵循“克制而有力”的美学：
- 大量留白+居中排布，提升了界面的呼吸感；
- 红色作为品牌主色精准点缀，聚焦 CTA（如购买、收藏、加购）；
- 图标统一线性风格，配合圆角卡片，提升整体一致性与精致感；
- 使用扁平化图形与文字组合，符合小红书的“社区+电商”调性，既时尚又不失理性。
2
Report
声明
1
Share
相关推荐
![视觉-LOGO练习-LOONG电音音乐视觉识别[2024]](https://img.zcool.cn/community/67eae8ecd59de3k226o93c9812.png?x-oss-process=image/resize,m_fill,w_520,h_390,limit_1/auto-orient,1/sharpen,100/quality,q_80)
![视觉-漫威像素风插画-海报[2025]](https://img.zcool.cn/community/67e5936ca1fcep41beupd26802.png?x-oss-process=image/resize,m_fill,w_520,h_390,limit_1/auto-orient,1/sharpen,100/quality,q_80)
![视觉-圣诞插画[2024]](https://img.zcool.cn/community/67e59f36a3fb0spevgi4ii179.png?x-oss-process=image/resize,m_fill,w_520,h_390,limit_1/auto-orient,1/sharpen,100/quality,q_80)
![WEB/APP-任天堂Nintendo概念设计[2020]](https://img.zcool.cn/community/67e5a5f402e3c6aj28czsb8263.png?x-oss-process=image/resize,m_fill,w_520,h_390,limit_1/auto-orient,1/sharpen,100/quality,q_80)
![WEB/APP-音乐发行-星球发行[2020]](https://img.zcool.cn/community/67e5af0eab83d2oq8x4kfh1131.png?x-oss-process=image/resize,m_fill,w_520,h_390,limit_1/auto-orient,1/sharpen,100/quality,q_80)
![全渠道视觉运营设计方案汇总-音乐[2018]](https://img.zcool.cn/community/67eae81664ef78e8t71vij6142.png?x-oss-process=image/resize,m_fill,w_520,h_390,limit_1/auto-orient,1/sharpen,100/quality,q_80)
![APP-Rhythn音乐概念稿[2017]](https://img.zcool.cn/community/67daf15648c021we24pnx56567.png?x-oss-process=image/resize,m_fill,w_520,h_390,limit_1/auto-orient,1/sharpen,100/quality,q_80)
![2套网页设计[2017]](https://img.zcool.cn/community/67dae7a5350fdqbu09zswp4354.png?x-oss-process=image/resize,m_fill,w_520,h_390,limit_1/auto-orient,1/sharpen,100/quality,q_80)
in to comment
Add emoji
喜欢TA的作品吗？喜欢就快来夸夸TA吧！
推荐素材
You may like
相关收藏夹
Log in
2Log in and synchronize recommended records
1Log in and add to My Favorites
评论Log in and comment your thoughts
分享Share