Page 100 - 打通产品与用户需求

打通产品与用户需求
Connect Products with User Needs

2. 色彩
从色彩角度出发，小红书的红、支付宝的蓝、美团的黄、微信的绿、
Behance 的黑……通过色彩传递感知和理解，如红色传达热情、力量，蓝色传达

信任、安全，绿色传达自然、健康，黄色传达温暖、提示，黑色传达质感，专业。
面向小朋友的 APP，如洪恩、宝宝巴士等则习惯以彩色传达理念。不同 APP 界
面的色彩可直接以品牌 VI 中的标准色和辅助色进行设计。
3.Image

在 APP 界面的原型框架中的图片区域分为 Banner 区域和产品流区域图，在
Banner 区域经常放置主题活动内容，如在端午节、中秋节、国庆节时，会更换为
该节日的插画风格的 Banner，也有产品宣传类的 Banner，通常放置产品摄影类
主图，或 C4D/Blender 制作的三维图，Banner 分为标题文字、主视觉图、背景。

Banner 的尺寸变化在淘宝、京东等电商类 APP 中可以看出有高短尺寸等不同，
通常一个 Banner 的尺寸占用了 4 个瓷片区的位置，在电商类琳琅满目的产品区
域里果断将本来放置一个产品的区域 Banner 换成可放 4 个广告位的瓷片区。另
一解决办法则是将活动主题内容直接换成在闪屏区一进入 APP 时展示，通常和

屏幕尺寸一致，也有小于屏幕尺寸的设计，有效展示的推广页面可让用户更容易
看到，有需要则会点击进入，或等待 3s 又或可直接点击跳过。视频类和音乐类
依然保留了 Banner 区，可放置热门电视剧和最新唱片及乐队的介绍。Banner 区
的图片视觉设计可解决一定的运营问题。

4. 按钮
界面中的 ICON 加文字 - 按钮设计，如提交按钮，加入购物车，立即购买等
按钮。按钮使用颜色后具有 CTA（Call to Action）的功能，可引起用户注意，如
淘宝中加入购物车的按钮颜色为橘黄色，立即购买的按钮为橘红色。另一种引起

注意的方式可以加入动效图标，通过静与动的差异突出目标事物，此为通过用户
体验使用行为逻辑组织界面。其次是按钮的位置，根据右手习惯的用户，通常右
手的辐射区域在界面中的右下操作区域，所以确定键在取消键的右侧。在 Web
端使用鼠标时，确定按钮通常在左侧，在网页端的按钮中也会通过这一点在位置

上，设下交互习惯陷阱，从而引导用户无法一次删除不需要的软件。另一种按钮
则是幽灵按钮，通常设计为无边框、无填充或浅边框，如在 APP 中跳出的广告，
通常将关闭按钮幽灵化，使用户将广告看完。而这一点也容易导致老年人使用

92