鑫成誉-小黄鸭电动车小程序界面设计
发表于：
01
项目背景
2025 年，共享两轮车进入“3.0 时代”：政策对电池安全、车辆秩序、数据合规提出更高要求；用户侧则希望“随借随还、一眼找到、一秒换电”。小黄鸭出行需要在 6 个月内完成一次品牌升级，既要守住“亲民、可爱”的视觉资产，又要在“找车-用车-还车-换电”全链路体验上建立差异化技术壁垒。
本次兰亭妙微参与小黄鸭电动车界面设计工作，以“萌酷工业风”视觉语言统一品牌心智，亮黄主色延续品牌记忆，深空灰中和廉价感，圆角矩形贯穿大灯、坐垫与图标，让“萌”与“质感”同框；信息层级被压缩成一眼可读的三色电量环，找车、还车、换电三步即可完成，现场嘉宾抬头即见的立体箭头指引，把“可爱小黄鸭”瞬间转译为“高效、可靠、值得信任”的出行伙伴。
02
项目概述
产品定位
小黄鸭电动车瞄准城市 3–8 km 中短途机动需求，以“1 张卡 N 个人骑、1 次换电跑 80 km”的灵活经济模型，切入亲子、情侣、合租三大细分场景。产品通过降低心理门槛、扩大使用半径，把电动车从“个人通勤工具”重新定义为“家庭共享设施”
目标用户
通勤情侣、合租室友、高校宿舍、亲子家庭、银发轻旅——凡是“同一屋檐下、同一段路、同一份账单”的多人场景，都能用一张家庭时长卡把小黄鸭变成随借随走的共享出行搭子。
设计风格
“轻量未来感”——以极简几何与圆润转角包裹信息，让界面像一片会呼吸的金属：无负担的留白、瞬时响应的动效、一步即达的交互，把前沿科技的冷静注入指尖，把下一程的速度提前呈现在此刻的屏幕。
03
设计亮点
地图即首页 – 把决策压缩到 3 秒
打开 App 就是一张“活地图”，可用车、还车点、换电柜被折叠成三层优先级最高的卡片，按距离与电量智能排序；首屏只保留一个「立即用车」主按钮，视觉焦点被强制锁在屏幕中心 1/4
区域。信息架构上，我们将“发现-对比-选择”三段思维合并为“一眼即点”的单次决策，用户无需进入列表页、无需横滑对比，3 秒内完成心理确认；同时，地图底图饱和度降低
30%，让品牌黄在灰度城市背景中自动跳脱，车辆图标因此成为屏幕内唯一高亮色，形成“先看到车、再决定行动”的直觉动线，显著降低新用户首次骑行流失率。
设计前后对比
设计前后对比
运维信息实时呈现
运营Banner用「悬浮视差卡层」将信息折叠成微动叠卡，静止时像一叠触手可及的卡片，滑动时上层缓慢漂移，暗示额度可叠加、可共享，把“家庭共用”概念提前写进动势；整张Banner仅保留主标题「全家一起骑」与副标「低至2元·随时退」，其余信息全部图形化，在320*160
dp的有限画布内完成「时间共享—价格优势—即时行动」的完整叙事，实现运营广告也能讲出产品理念的高密度传达。
卡片式任务面板
卡片化设计让“车型-价格-订单-网点-车辆”五类信息在同一屏幕内形成天然视觉隔断：每块内容独占一张卡片，用户无需阅读标题即可通过轮廓差异快速识别信息属性；附近网点与附近车辆则共用横向滑动容器，左右切换时保持卡片高度一致，避免页面跳动。通过“一卡一任务”的信息架构，用户视线始终被锁定在单张卡片内完成决策，减少横向对比带来的认知负荷；同时，卡片之间预留间距，形成可触知的叠层效果，强化“可点击”心智，使找车、比车、下单、导航四大核心路径在拇指范围内即可闭环，实现“信息分明、结构清晰、一眼即操作”的轻量化体验。
一步即达的「零思考」操作带
快捷操作区把「扫码-租车-故障-预约」等高频动线集成在一张卡片中，核心功能突出，操作便捷；图标采用面性+填充设计，优雅美观同时信息传递准确高效；信息架构上，按使用频次自左至右、由上而下递减排布，【用车】【租车】核心功能大面积展示，其余功能浓缩在卡片中，手指无需离开下半屏即可完成80%任务，实现“看见即操作”的零思考体验；理念层面，整个区域像一条柔软的工具带，随时展合却从不喧宾夺主，把复杂留给系统、把简单还给用户，让每次用车从「想下一步」变成「直接到达」。
04
界面欣赏
咨询我们
您是否有此类页面的设计需求？欢迎联系我们
立即咨询