UI/UX·产品体验笔记05

用户头像
深圳/设计爱好者/1年前/2259浏览
UI/UX·产品体验笔记05
用户头像
凯奇CAT
「京东金融 & 招商银行」 黄金交易功能对比
UI/UX·产品体验笔记05(图ZMTUxMTg5MzI=) - 观点 - 站酷设计师凯奇CAT原创素材 - 站酷ZCOOL
收藏
背景
前段时间国际金价连创新高,作为一个没什么偏财运的非重度投资者也想来凑凑热闹,体验一下这种坐过山车的感觉,为此我先后在京东金融、招商银行以及支付宝分别进行了建仓尝试。
支付宝
的黄金产品实质为场内基金,规则与账户金不同,无法与另两款产品在同一维度对比,故本次测评暂不纳入。
京东金融「黄金·积存金」
招商银行「小金库」
在交易规则上基本一致,但两者在界面布局、交互操作、风险提示等环节呈现出明显差异。这种差异不仅反映了两个平台在业务定位、目标人群心智、合规策略等层面的不同,也对用户的下单效率与操作心智产生直接影响。
基于上述动因,我以“买入”“卖出”“条件单”三个高频操作为切入点,对京东金融与招商银行的黄金交易流程进行了逐步拆解,并从视觉情绪与信息层级、操作效率与引导策略几个维度展开对比分析。
*本文不具有任何投资建议与引导,仅做产品体验设计分析「投资有风险,入市需谨慎」
体验版本
iOS端
京东金融版本(7.0.10)
招商银行版本(13.1.0)
对比说明
流程节点:首页 → 买入 → 卖出 → 条件单;
对比维度:视觉情绪与信息层级、操作效率与引导策略;
UI/UX·产品体验笔记05(图ZMTUxMTg5NDA=) - 观点 - 站酷设计师凯奇CAT原创素材 - 站酷ZCOOL
京东金融与招商银行的首页一屏效果,金刚区均有「黄金」入口
收藏
一、黄金首页一屏
京东金融「黄金·积存金」
界面以价格曲线为视觉重心,遵循国内红涨绿跌的规则,以高饱和配色强化市场信息优先级,并通过垂直排列与适中信息密度减轻认知负荷;核心操作(买入/卖出)置于底部,
简化为“查看行情→决策操作”的线性路径
,有效
缩短决策至执行
的距离。
UI/UX·产品体验笔记05(图ZMTUxMTg5NDQ=) - 观点 - 站酷设计师凯奇CAT原创素材 - 站酷ZCOOL
京东金融「黄金·积存金」
收藏
招商银行「黄金」
界面采用产品展示型视觉层级,营销Banner引导用户点击,配合高密度网格展示多类产品,突出内容丰富度与品牌调性;通过分组建立产品间关系,但操作需进入二级页面完成,
路径为“选产品→看行情→决策操作”
整体引导策略
强调理性决策与风险缓冲
,更契合稳健型用户需求。
UI/UX·产品体验笔记05(图ZMTUxMTg5NTY=) - 观点 - 站酷设计师凯奇CAT原创素材 - 站酷ZCOOL
招商银行「黄金」,注意这里“持仓信息”虽然也是一个交互热区,但并不像“市场数据-黄金活期”那样有一个明显的按钮入口,并且两个入口下转的页面有一些结构和场景上的差异,给用户体验带来了一些影响
收藏
二、买入
京东金融「黄金·积存金」
买入流程采用弹窗形式,信息聚焦且反馈即时,用户可在首页一屏内完成“输入金额→确认买入”的操作路径,实时价格与预设金额标签强化操作引导,整体
强调高效率与快速决策,适合高频交易
用户。
输入前展示规则说明,
帮助用户建立预期
,输入后切换为金额快捷按钮与实时反馈信息(预计买入克重、成本均价等),关键内容一屏展示,操作高效、信息透明,
提升用户决策信心与交易流畅度
UI/UX·产品体验笔记05(图ZMTUxMTg5ODQ=) - 观点 - 站酷设计师凯奇CAT原创素材 - 站酷ZCOOL
收藏
招商银行「黄金」
买入流程层级较深,需依次点击进入多个页面完成操作。并且招商银行行情页能通过两个不同的入口下转进入,在界面上也存在一些差异。让人匪夷所思的是持仓信息并没有一个明显的按钮让用户点击下转,而作为用户的我完全是凭卡片也可点击的直觉进入到了持仓信息的专属页面,发现与之前点击“购买”按钮进入的页面不一致时,第一时间不是觉得惊喜,而是困惑。
UI/UX·产品体验笔记05(图ZMTUxMTg5Njg=) - 观点 - 站酷设计师凯奇CAT原创素材 - 站酷ZCOOL
收藏
招商银行黄金行情页差异化推导:
① 从「黄金活期-购买」入口进入时,页面
偏重新用户引导
,主操作为“定投”“购买”;
② 而从「持仓信息」热区进入时,则
聚焦已有持仓用户
,主操作为“卖出/定活互转”“购买”,强化资产管理功能,引导用户在充分了解基础上完成交易,更契合低频、审慎型的投资需求。;
③ 两者在结构、引导与按钮组合上差异明显,体现了
对不同用户状态的适配意图
,但
可能导致操作预期不统一
,影响整体使用连贯性。
三、卖出
京东金融:
卖出页面与买入页面形式一样,用户可在首页一屏内完成“输入金额→确认买出”的操作路径,
弹窗式设计保持对市场行情的感知连续性
,设快捷选项,明确到账金额,层次简洁减轻心理压力,帮助用户建立预期。
招商银行:
与买入流程 “多层级、渐进式信息披露” 思路一致,卖出流程通过 “黄金默认页→详情页→卖出页” 分步推进,符合金融交易谨慎需求。
UI/UX·产品体验笔记05(图ZMTUxMTg5NzI=) - 观点 - 站酷设计师凯奇CAT原创素材 - 站酷ZCOOL
收藏
四、条件单
京东金融「黄金·积存金」
界面保持着主题色和红绿行情波动提示,营造金融交易氛围。信息层级上,通过页签切换区分“限价买入”等状态,便于用户在一页内查看挂单状态,
避免认知中断
。用户可在一个界面完成核心操作,操作流程高效,配合字段标签与价格提示
提升交易效率与信心
功能信息呈现细致周到,提供“预计差价”助用户判断偏离程度,提示“卖出手续费”等增强透明度,允许自定义挂单有效期,支持多种付款方式。
UI/UX·产品体验笔记05(图ZMTUxMTg5NzY=) - 观点 - 站酷设计师凯奇CAT原创素材 - 站酷ZCOOL
收藏
招商银行「黄金」
界面同样保持着主题色和红绿行情波动提示,营造金融交易氛围。但条件单交互路径长,用户查看挂单状态需经多步操作,“委托挂单-首页-持仓-历史交易”,操作链条长、信息分散、跳转频繁,
降低信息获取效率与连贯性
在“持仓”页中点击“历史交易”按钮,却进入了一个标题为“交易记录”的页面,文案术语不一致会
破坏用户原有的心智预期
,尤其是在金融类操作中,用户通常更谨慎,任何模糊感都会增加操作焦虑。
UI/UX·产品体验笔记05(图ZMTUxMTg5ODA=) - 观点 - 站酷设计师凯奇CAT原创素材 - 站酷ZCOOL
收藏
在功能信息上,招行明显简化,如挂单页面没有直观性的“预计差价”计算与“卖出手续费”提示,自定义挂单有效期需要唤起弹窗面板操作。面对需灵活策略与交易透明度的用户,
体验保守,缺乏直观的决策辅助能力
五、结语
定位:
京东金融以​​高频交易效率优先​​,构建极简操作闭环,实时行情与买卖入口,通过弹窗一屏完成,强调实时数据反馈与路径最短化;
招商银行则立足​​风险管控与用户教育​​,采用多层漏斗式设计,分散功能入口,以操作阻力换取决策审慎性,契合银行系合规基因。
矛盾:
京东金融的效率操作弱化了波动风险提示,可能助长冲动交易;
招商银行的风控强化却因​​路径断裂​​,破坏连贯性,且工具能力不足; 两者分别暴露互联网产品的“过度简化”与传统金融的“流程冗余”问题。
小吐槽:
京东金融在开启“报价浮窗”后,返回桌面再次进入到应用,会暂停后台的音乐播放,借用热搜的一句话“你们这些软件能不能搞清楚自己的定位,凭什么暂停播放我的音乐” XD
*本图文笔记不具有任何投资建议与引导,仅做产品体验设计分析
「投资有风险,入市需谨慎」
UI/UX·产品体验笔记05(图ZMTUxMTk0MzY=) - 观点 - 站酷设计师凯奇CAT原创素材 - 站酷ZCOOL
收藏
23
举报
|
54
分享
相关推荐
评论
用户头像
评论你的想法~
表情
喜欢TA的作品吗?喜欢就快来夸夸TA吧!
推荐素材
【新年UI图标】体育icon
【新年UI图标】活动icon
新能源APP应用UIKit
新拟态风格 UI设计组件库
科技医疗透明柜UI界面设计
【新年UI图标】礼物/活动icon
【新年UI图标】相机icon
APP/小程序商业项目UI模板|99个高保真UI+79个原型
UI应用平面图标
【新年UI图标】积分icon
高级表盘系列UI源文件
【新年UI图标】美食icon
Security Camera UI kit
UI界面 组件
【新年UI图标】银行卡icon
钱包ui模板
高级感金属拟物 UI设计组件库
UI通用设计素材1
森系3D渐变流体抽象矢量UI背景图
UI 登录界面设计模板包
3D渐变流体抽象矢量UI背景图
智能家居中心 简约 UI设计组件库
我的钱包-UI界面设计-app
手表表盘UI系列
你可能喜欢
相关收藏夹
大家都在看
登录注册