首页

兰亭妙微ui设计公司分享:金额敏感界面中的信息该怎么展示?大厂实战总结 5 个设计方法

清阳 交互设计及用户体验

兰亭妙微ui设计公司分享:退票、扣款、售后协商这类涉及金钱损益的页面,很容易出现用户误判金额,造成不必要损失的问题。结合真实机票退票事故案例,拆解金额敏感场景的交互设计思路,总结 5 条可复用设计原则,帮用户在执行操作前,清晰看懂金钱变化与潜在后果。

案例背景:一次引发争议的机票退票事件

image.png

曾有一则新闻:用户完成机票退订后,发现实际仅到账四百余元,才知晓退票被扣除了上万元票款。用户原本把页面展示的退款金额,错当成退票手续费,完全没有意识到这是自己最终到手的全部钱款。

image.png

事后平台为用户做了补偿,同时迭代产品,新增退款金额过低场景的二次确认弹窗。但这件事暴露出金额类界面普遍存在的设计痛点: 很多界面只是机械罗列规则条文,却没能让用户在短暂浏览中快速读懂金钱损益;不能简单把问题归咎于 “用户没仔细读条款”,设计师要思考,如何通过界面表达,降低用户误操作风险。

核心设计方法:5 条金额敏感界面设计准则

1. 匹配用户心智:区分损失心智与收益心智

金额信息存在两种表达方式:展示最终到手(收益心智)、展示将要扣除(损失心智)。 当操作会带来大额损失时,用户的关注点是 “我会亏掉多少钱”,也就是损失心智。如果界面只强调能退回多少,就极易产生认知偏差。

image.png

设计做法:

  • 退票、扣费类高损失风险场景,优先突出扣除金额,而不是只展示最终退款;
  • 在购票阶段就直白写明退票扣款数额,不要只用模糊描述如 “仅部分税费可退”;
  • 抓住用户毫秒级的注意力窗口,把对决策最重要的信息做成认知钩子,避免被当成无效信息忽略。

image.png

示例优化:把订票页模糊提示「仅部分税费可退」,改写为明确金额提示「退票将扣除 XX 元」;退票申请页面视觉重点从 “预计退款” 切换到 “需扣款项”。

2. 高损失风险操作,提交前做有效的二次风险确认

image.png

弹窗不能滥用,但涉及用户财产损失时,二次确认是防范误操作的关键,要注意 3 个要点:

  1. 标题中立具象,拒绝模糊主观判断 不要使用 “退款金额较少” 这类主观定性话术,直接写明会扣除 / 收取的具体金额,界面只提供客观信息,把判断权交还用户。
  2. 削减信息噪音,只保留当前决策必要内容 弹窗属于侵入式交互,信息冗余、术语冗长会让用户产生厌烦,习惯性直接点确认,弹窗就彻底失去风险拦截作用。image.png
  • 非必要信息不要塞进弹窗;
  • 复杂内容做格式化、分段处理;
  • 条件化展示提示:只给使用了对应服务的用户弹出相关提醒,不要对全体用户展示无关文本。

image.png

  1. 按钮文案写清行为,摒弃 “确认 / 继续” 这类模糊词汇 按钮要描述点击之后会发生什么,例如:「确认退票(到账 ¥430)」「暂不退票」,而不是笼统的确认、继续,降低误点概率。

 

3. 减少信息噪音,分层披露信息

不要一股脑堆砌全部规则。标题、正文只保留会影响当下决策的关键信息;复杂条款折叠、分层展示,不要干扰核心金额阅读。

4. 文案保持中立客观,少做主观判断

避免 “金额较小” 等主观评价,只陈述客观数字事实,由用户自己权衡要不要继续操作。

5. 按钮文案改写,清晰描述操作结果

规避 “确认”“继续” 等语义模糊按钮,使用结果导向的操作文案,明确告诉用户点击按钮会触发的行为。

核心设计理念:优秀的金额敏感界面,目标不是让用户通读全部规则,而是让用户在点击操作前,看懂金额变化与操作后果。

业务优化实证:售后退款协商页面改造

业务中有一类场景:商家和用户协商调低退款金额。旧版本弹窗只简单提示 “同意后将退款 XX 元”,大量用户因为没有感知到退款被缩减,误点击同意,相关客诉长期位居售后前十。

image.png

优化方案:弹窗完整说明变更逻辑,点明 “无需退回货品,但退款将降低至 XX 元,原金额 XXX 元”。改版后该类误操作投诉基本消失,验证了明确金额表达对体验的正向价值。

image.png

延伸思考

这套设计逻辑不局限于退款、扣费的金融场景。但凡需要用户做出重要决策的界面,都可以复用这套思路:对齐用户当下心智、精简干扰信息、客观呈现关键后果、操作按钮表意明确,以此减少用户理解偏差与误操作。

 

转载:优设

 

 

 

兰亭妙微(蓝蓝设计)www.lanlanwork.com 是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计、B端界面设计、桌面端界面设计、APP界面设计、图标定制、用户体验设计、交互设计、UI咨询、高端网站设计、平面设计,以及相关的软件开发服务,咨询电话:01063334945。

 

image.png

兰亭妙微ui设计公司分享:谈 AI 时代的高级感产品:好看不等于贵,真正拉开价格的是三个看不见的地方

清阳 交互设计及用户体验

兰亭妙微ui设计公司分享:你有没有想过,现在用 AI 做出一个“看起来还不错”的产品,已经便宜到一天就能搞定,那为什么你的产品还是卖不上价?更扎心的是,别人的产品也看起来还不错,用户点开两三个应用,会觉得它们长得差不多,凭什么要多付钱给你。

这期视频的主讲人是设计师 Tim,他过去十年给 Spotify 等多家公司做过界面设计,现在专门帮已经在增长的创业公司把产品往“高级”那一档推。视频只有十来分钟,他围绕一个概念讲了三个地方:commodity ceiling(商品化天花板),也就是一个产品想让人觉得“值得多花钱”,必须先越过的那条线。他引用了不少研究和自己做过的案例,我听完觉得很有启发。我挑的是“AI 时代,好看以外的东西到底是什么”这条线,每一节先讲他是怎么说的,再写我自己的想法,分享给大家。

好看和高级从来不是一回事,大脑没有“高级探测器”,只会默默记账

Tim 开头先抛出一个判断:现在大多数用 AI 做产品的创始人都有同一个问题,产品看起来不错,别人的也一样,这最终就限制了你能收多少钱。他用了一个很形象的说法:大脑里并没有一个“高级探测器”,但它会悄悄给每一条“这个产品很好”的证据记账。

他说,今天一个创始人可以把一个设计灵感库接进自己的 agent,参考所有出色的设计,一天之内做出一个像样的东西,所以他常说我们正处在用户界面的“极简包豪斯阶段”,就像现在到处都是的那种长得一模一样的方盒子房子。这对追求性价比的消费者是好事,但如果你想成为那个让人愿意多付钱的人,这就是个问题。因为他引用了 2010 年和 2021 年的包装研究,结论是:外观让你被选中,但“产品很好”的证据,才会让人把你叫作高级。他把这些证据归纳成三个地方,都在天花板之上。

我觉得“没有高级探测器,只有默默记账”这个说法特别准确。我们总想用一个明确的标准去定义“高级”,比如用了好看的字体、做了精致的动效,但用户的感受并不是这样一次性判定的,而是在使用中一点一点累积出来的。这也解释了为什么视觉上差不多的两个产品,用了一阵之后,用户对它们的评价和愿意付的价格会拉开很大的差距:差别不在第一眼,而在后来每一次“这一步它想到了没有”。

另外,“方盒子房子”的比喻也值得想想:每一栋看着都挺好,但没有一栋让你记得住。当 AI 把“做得像样”的门槛压到最低,像样就不再是优势,而变成了入场券。

AI 偷懒跳过的,恰恰是用户最费力的地方

第一个地方,Tim 称之为“AI 漏掉的那一部分”。他说大多数创始人会以为,只要屏幕看起来对了,背后的产品基本就完成了,而用 AI 做出来的屏幕确实看起来差不多对了。但他提到,2026 年年中有研究人员,给五个 AI 搭建工具,比如 ChatGPT 和 Claude,布置了同样的设计任务。这些工具解释自己的设计选择时都非常自信,但大约四分之一的理由,最后根本没有落到界面上。

被跳过的,恰恰是那些不起眼的部分:让你看到系统正在做什么,让你可以撤销,出错之后帮你恢复。研究者甚至给这个差距起了名字,叫 design theater(设计的表演),意思是嘴上说得头头是道,界面上却没有做到。他说这会让用户付出很多心力:刚才那一下点上了吗?我能退回去吗?而大脑记的就是这种账。他援引了几十年的研究,结论是越容易理解的东西,越容易被善待地评价。

他举了自己重新设计过的一个应用 Undertone 做例子:用户测试麦克风,点了停止,却被告知时间太短,不算一次练习,什么也没留下。创始人之一这样形容用户当时的感受:“我期待的是任何东西,而不是什么都没有。”然后他又补了一句:“我们就是在这里失去他们的。”

针对“AI 工具以后会不会越来越擅长这件事”,Tim 的回答是,当然会,但工具学会的,所有竞争对手同一天也学会了,它只会变成天花板之下新的地板。真正能救你的,是把你产品的每一种状态都为用户想一遍。他给的建议很具体:走一遍你的核心流程,确认用户始终知道刚发生了什么、可以撤回,也知道下一步该做什么。“光是这种手把手的照顾,就能让你走得很远。”

我觉得这一节最有价值的概念,是“设计的表演”。它不只适用于 AI 搭建工具,也适用于很多人对 AI 产出的信任方式:AI 解释得越流畅,我们越容易以为它做对了,却很少去核对解释里的内容是否真的落到了结果里。这是一种“说得比做得好”的偏差,在设计里表现为漏掉的状态,在其他领域也会表现为漏掉的步骤。

另一层,Tim 说的“今天的优势明天就是地板”,其实是一个关于竞争的朴素道理:凡是可以被工具标准化的东西,都不会带来溢价。溢价来自那些需要你对自己的用户、自己的场景真正想过的地方。用户最累的时候,往往不是在做复杂的事,而是在“不知道发生了什么、不知道该怎么办”的那几秒里,而这些几秒,恰恰是通用工具最不愿意为你多想的。

单个屏幕都对,第 80 个屏幕却和第 1 个屏幕不是一家人

第二个地方,是跨屏幕的一致性。Tim 说,即便你把核心流程一个屏幕一个屏幕地修好,还是有个坑:用户是把你的产品当成一个整体,用上几周、几个月,希望是几年,可大多数团队评审产品时,恰恰是一个屏幕一个屏幕地看,每一个在“理想路径”下都很漂亮。但你的用户,那个天天用的人,看到的是第 80 个屏幕紧挨着第 1 个屏幕。

他引用了 2009 年约克大学的一项研究:研究者在受试者完成网页任务的中途,把导航栏从左边挪到右边,页面其他东西都没变。结果在这个页面上花的时间翻了一倍多,而且即便离开后,在接下来的几个页面上也一直更慢。问起来的时候,大多数人其实注意到了变化,却觉得自己没被拖慢多少。所以他说,如果你的产品有这类问题,它带给你的损失,往往比用户嘴上说的、甚至比你的数据显示的要大得多。他还补了一句:这个问题早就存在,但 AI 让它变本加厉,因为一个 agent 一分钟就能生成一个新屏幕,要最终得到 80 个互相不太一致的屏幕就太容易了。

Undertone 里也有这种问题:当你的次数用完时,应用会把你带到两个不同的屏幕之一,两个屏幕写的都是同一句笼统的话,“你的次数已用完”,没有次数,也没有日期。Tim 的团队把两个屏幕统一成一个清晰的模式:一个“已使用 2 / 2 次”的徽标,一句“你本月的两次已经用完”,再加上刷新的确切日期。他说看起来只是一点点文案和视觉结构,但在规模化之后差别巨大。

他的结论是,如果你的产品真有独特之处,这种独特应该渗透到几百个这样的小决定里,没有任何组件库或者 AI 模型能直接给你。这才是人们愿意多付钱的东西:每个状态都想到了,屏幕与屏幕之间的“连接组织”撑得住,让整件事感觉像是有人用心做出来的一个整体。他建议的做法也很朴素:像一个真实用户那样用你的产品一个小时,把每一个“不再像同一个产品”的地方记下来。

我觉得约克大学那个实验,值得所有做产品的人记一下。用户嘴上说“没怎么影响”,行动却慢了一倍,这说明用户的口头反馈和实际成本之间,可能隔着很大一段距离。所以光靠问卷、访谈很难发现这类问题,要靠自己亲手长时间地用,或者看真实的行为数据。

还有一点,我觉得跟 AI 时代的特征特别吻合:生成越快,不一致越容易积累。以前一个屏幕要设计师花几天,团队自然会反复对齐;现在一个屏幕一分钟,就没有人有动力停下来对齐。所以真正稀缺的角色,可能不是“生成屏幕的人”,而是“负责让所有屏幕说同一种话的人”。

出错的那一刻,才是高级感真正的考场

第三个地方,Tim 称之为“大结局”,因为这是高级感不再只是一种主观看法的地方。他从 2014 年 Google 在 Chrome 里做的一件事讲起:断网的时候,你不再看到一个死掉的页面,而是一只像素风的小恐龙,按下空格键,它就变成一个小游戏。他说,上线四年后,人们每个月玩它大约 2.7 亿次。Google 把一次纯粹的失败,变成了人们真正喜欢的东西。

他说这是产品里一个被严重低估的高级感来源。想想你产品里最糟糕的时刻:付款中途失败,用户真的担心出了问题。恰恰在错误恢复这个环节,前面提到的报告里 AI 工具表现最差,他认为之后也会一直吃力,因为要做好,需要真正使用你的产品、测试它、把它弄坏。

他提到这件事有个名字,叫 service recovery paradox(服务补救悖论):2007 年一篇大型综述发现,当一次失败被处理得非常好,人们最终可能和什么都没出错时一样满意,甚至更满意。换句话说,它有可能变成用户说“哇,这东西出问题了,但他们接住了我”的那一刻,这正是高级体验该有的感觉。

他在一个加密货币卡片客户的工作坊里做过这件事。负责客服的人指出,用户是把自己的钱托付给这个应用,每次花钱或充值都得觉得安全。他描述了一笔失败交易的体验:没有任何信息告诉你该怎么办,你被一个人扔在那里。于是问题变成:怎样让人在最吓人的时刻也有信心?他们做的事情很简单:付款被拒时,弹出提示,让你去查余额,旁边放一个联系客服的按钮。Tim 说,加上其他几处设计调整,对方的新增账户增长了 60%,用户充到卡里的资金增长了 79%。

最后他还引用了 2018 年的一项调查,说大约三分之一的人,只要遇到一次糟糕的体验,就会决定不再用了。所以他的建议是:打开你的产品,故意把它弄坏。中途关掉 Wi-Fi,让付款失败,把所有列表清空,然后像设计成功页面一样用心设计这些状态,“因为很多团队跳过了这一步,这也使它成为买到高级感最便宜的地方之一”。

我觉得这一节讲的是一个很反直觉的事实:用户对产品的信任,大部分是在它出问题的时候建立或毁掉的。顺利的时候,所有产品看起来都差不多;只有出错的时候,用户才真正看到你是怎么对待他的。Chrome 的小恐龙之所以被记住,并不是因为它多精致,而是因为它让一个本来令人沮丧的时刻,多了一点善意。

加密货币卡片的例子也很典型:涉及钱的场景,用户的焦虑天然很高,所以在这里多想一步,回报特别明显。“去查余额”加“联系客服”,这两个动作本身几乎没有技术含量,却把“我被扔下了”变成了“有人在帮我”。这样的小改动,回报往往比想象的大。

我自己的一点思考

听完这期,我最大的感受是,Tim 讲的三个地方,其实是同一件事的三个层次:有没有想到用户的每一种处境,有没有让这些想法在整个产品里说同一种话,有没有在最糟的时刻守住用户。它们有个共同点,就是都不在第一眼看得到的地方。

这对 AI 时代的创业者是个很实在的提醒。AI 把“做出一个看起来不错的东西”变得几乎免费,也就把“看起来不错”变成了零溢价的东西。真正有溢价的,是那些需要你对自己的用户真的下过功夫的地方:他在哪一步会迷路,哪一个提示会让他安心,出错的时候他最需要什么。这些东西没有现成的模板,也很难被一次提示词生成,因为它们来自对人的长期观察。

还有一点,这些事都有个特点:每一件单独看都很小,一个徽标,一行文案,一个按钮,但它们累积起来,就是用户心里那本“默默记账”的账本。高级感不是某一个大动作,而是几百个不被注意的小决定。

转载:优设

 

 

 

兰亭妙微(蓝蓝设计)www.lanlanwork.com 是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计、B端界面设计、桌面端界面设计、APP界面设计、图标定制、用户体验设计、交互设计、UI咨询、高端网站设计、平面设计,以及相关的软件开发服务,咨询电话:01063334945。

 

image.png

 

兰亭妙微ui设计公司分享:4 大模式 + 3 大场景|B 端设计师 AI 实战上手指南

清阳 设计资源

兰亭妙微ui设计公司分享:还在埋头画按钮、调间距?当 AI、Copilot、Agent 席卷设计行业,不少 B 端设计师陷入焦虑:难道 AI 要取代设计师了?

其实大可不必恐慌。AI 不是来替代设计师的,而是高效的协作助手,帮我们承接大量重复繁琐的基础工作,让设计师把精力聚焦在真正具备核心价值的体验决策上。本文抛开晦涩理论,拆解 B 端产品里 AI 的四类交互模式、三大落地业务场景,聊聊 B 端设计师该如何拥抱 AI、完成能力升级。

一、B 端产品中 AI 的 4 类交互模式

AI 在 B 端产品里并非千篇一律,根据嵌入形态与交互逻辑,可以划分为对话式助手、伴随式副驾驶、嵌入式副驾驶、智能增强界面、自主代理五大形态,每一类都有对应的设计原则与业务案例。

1. 对话式助手:拟人化聊天交互

image.png

这是大众最熟悉的 AI 形态,以独立聊天窗口承载问答交互,同时支持文字、语音输入。

案例:阿里云、百度云平台内置智能助手;企业内部员工智能客服,员工可直接查询年假、报销制度,无需咨询 HR。

设计要点

  1. 输出语言尽量拟人化,避免机械生硬回复;
  2. 完善交互状态:思考加载动画、文字 / 语音输入态;
  3. 提供纠错反馈入口,当 AI 回答出错,允许用户快速修正结果。

2. 伴随式副驾驶:常驻的专家侧边栏

image.png

不开启独立弹窗应用,以常驻侧边栏、工具栏形式深度嵌入现有业务界面,随时响应用户复杂、多样的任务诉求,不割裂用户原有工作流。

案例:Microsoft 365 Copilot 深度集成 Word/PPT/Teams;阿里云通义灵码编码辅助;企业微信聊天侧栏智能服务总结。

设计要点

  1. 布局位置合理,不遮挡主业务操作区域,优先选用侧边栏、工具栏;
  2. 时机精准:在用户产生潜在需求时主动输出建议,避免无意义打扰;
  3. 操作轻量化,建议内容直观易懂,支持一键采纳 AI 方案。

3. 嵌入式副驾驶:即用即走的浮动工具

image.png

没有固定常驻位置,依附当前业务上下文,依靠快捷键、选中文本、触发符号唤起浮动工具栏,用来完成单一原子化任务,任务结束自动消失。

案例:Notion AI 输入/唤起能力菜单;WPS AI 快捷键唤起续写、改写;通义灵码快捷键生成代码片段。

设计要点

  1. 按需触发,非必要时保持静默,不干扰主流程;
  2. UI 轻量,浮动面板、行内提示,优先级始终低于用户主内容;
  3. 功能意图直白,用户无需理解成本,点击即可执行;
  4. 把控制权交还用户,支持撤销、拒绝、修改 AI 生成的全部内容。

4. 智能增强界面:无感赋能原有组件

image.png

最隐蔽的 AI 形态,没有独立 AI 入口,传统 UI 组件被 AI 能力增强,用户几乎感知不到 AI 存在,但产品使用效率大幅提升。

案例:企业微信模糊语义智能搜索;发票拍照识别自动填充报销表单;智齿科技对话全量智能质检。

设计要点

  1. 降低学习成本,做到能力无感融入,符合用户固有操作直觉;
  2. 状态反馈清晰,明确告知识别、处理成功或失败结果;
  3. 保留人工修改入口,AI 输出内容允许用户二次编辑。

5. 自主代理:给定目标,自动完成任务

高阶 AI 形态,用户仅输入最终业务目标,AI 自主拆解多步流程、自动执行任务,输出最终结果。

案例:网易云商对话 SOP 流程智能引导;阿里商旅 AI 自动规划差旅行程。

设计要点

  1. 提供任务进度面板,可视化展示执行过程;
  2. 规避黑盒风险,关键节点交给用户确认;
  3. 最终结果结构化展示,信息清晰易懂。

二、三大核心业务场景:AI 解决 B 端企业真实痛点

理解 AI 交互模式之后,再看 B 端高频业务场景,AI 如何破解企业现存痛点。

场景 1|流程自动化:智能审批与智能数据录入

image.png

业务痛点:报销审批流程冗长、合同审阅工作量巨大,手动录入数据枯燥且容易出错。

AI 解决方案

  1. 智能报销:拍照识别发票信息,自动填单、校验合规,合规单据自动流转,异常单据再交由财务人工复核,代表产品:钉钉 AI 报销、阿里商旅。
  2. 智能合同审核:AI 对比标准合同模板,自动标记高、中、低风险条款、识别内容增删修改,法务只需要聚焦风险项,代表产品:法大大、e 签宝。

设计思维转变:设计重心不再是引导用户完整填写表单,而是聚焦异常场景的处理体验。

场景 2|数据洞察化:智能问答与辅助业务决策

image.png

业务痛点:报表数量庞大,有效信息淹没在海量数据中;提取指标需要技术人员协助,响应周期长。

AI 解决方案

  1. 自然语言 BI 分析:用户直接用口语提问业务数据,AI 自动解析数据集,生成图表和分析结论,例如阿里云 Quick BI。
  2. 数据主动预警:系统实时监控业务指标,一旦识别数据异动,主动推送风险提醒。

设计思维转变:从完整展示全部原始数据,升级为帮助用户快速抓取业务洞察。

场景 3|知识协同化:搭建企业知识大脑

image.png

业务痛点:企业文档沉淀海量,查找资料效率低下;新员工上手慢,过度依赖老员工答疑。

AI 解决方案:企业智能知识库,用户通过对话、搜索提问,AI 跨聊天记录、会议纪要、项目文档,聚合信息并且整理总结答案,如企业微信 5.0 智能搜索。

设计思维转变:放弃复杂文件目录、多层筛选器,打造类似与人对话的自然知识获取入口。

三、B 端 UI 设计师 AI 落地行动清单

AI 时代,B 端设计师不用急于追求复杂 AI 开发,先完成心态与基础能力的迭代。

1. 心态转型:从「画师」切换为「导演」

image.png

  • 过去:作为画师,核心工作打磨像素细节,纠结按钮位置、样式。
  • 现在 & 未来:化身导演,编排用户与 AI 之间的协作流程。思考重点变成:这个任务交给 AI 自动执行?还是需要用户确认之后再执行?

AI 不会取代设计师,但会取代固守旧模式的设计师。

2. 三项新基本功,立刻上手练习

image.png

  1. Prompt 提示词设计:掌握和 AI 沟通的语言,指令描述需要明确:风格、尺寸、业务场景、约束条件,拒绝模糊指令。 差示例:生成一个图标 好示例:为金融 APP 设计代表安全的线性蓝色钥匙图标,尺寸 64×64px。
  2. AI 状态反馈设计:AI 输出具备不确定性,需要完整设计全套状态:思考加载、执行成功、报错、结果存疑等反馈界面。
  3. 优秀产品案例拆解:日常体验 WPS AI、通义灵码、钉钉智能助手。不只使用功能,主动复盘交互:这个流程好在哪里?存在什么问题?如果由我设计,如何优化。

写在最后

AI 的本质是解放设计师,把我们从重复画图的角色,进化成智能体验策略设计师。面对 AI 浪潮不必焦虑,保持好奇心,发挥设计师体验洞察的优势,把 AI 变成自己最强的设计工具。

 

 

转载:优设

 

 

 

兰亭妙微(蓝蓝设计)www.lanlanwork.com 是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计、B端界面设计、桌面端界面设计、APP界面设计、图标定制、用户体验设计、交互设计、UI咨询、高端网站设计、平面设计,以及相关的软件开发服务,咨询电话:01063334945。

 

image.png

兰亭妙微移动端UI设计公司审美积累 | Ready Player Fit 健身 UI/UX 设计

丽洁 移动端UI设计文章及欣赏

把每一次训练,转译成角色成长的可见进度。

兰亭妙微专注 UI 与用户体验设计,持续关注国内外优秀作品,分享界面设计与交互思路,进行设计审美积累。今天分享 Ready Player Fit,一组把健身计划、角色自定义和朋友组队结合起来的 App 设计。训练记录在这里拥有了接近游戏大厅的呈现方式。


一、项目背景:让持续投入拥有更具体的反馈
等级、经验、连续训练与装备把行为积累转成可见状态。设计围绕训练与成长建立联系,让用户既能看见计划,也能在个人角色上找到持续参与的线索。

     图片18.png

图 1  训练信息的分步采集

步骤提示、训练选项与身体部位示意共同构成入门流程,底部动作保持清楚。深色与青蓝延续游戏气质,填写结构则十分明确,让个性视觉与基础操作共存。

图 2  角色自定义与即时预览

中央角色提供即时的外观预览,下方参数按组展开,保存按钮收住整个选择过程。这组角色配置图把“我正在修改什么”直接呈现在画面中心,选择与结果之间距离很近。

 

二、设计策略:用统一的游戏语言组织健身内容
①信息架构:训练信息、角色设置、成长资料与邀请队友各有明确页面。②视觉语言:深蓝黑基底衬托青蓝发光元素,3D 角色形成焦点;进度条、能力指标与装备卡片延续同一世界观。

Ready Player Fit | 界面细节与设计启发

图片19.png     

图片20.png

图 3  个人资料与成长记录

这张个人资料局部将等级、经验、金币、连续训练与装备解锁集中起来。进度与角色状态共同构成成长面板,数据也因此带有清楚的积累感和目标感。

图 4  邀请队友与发送反馈

成员等级与状态为组队提供背景,邀请发送后的提示补上动作反馈。开始与取消等入口继续保留,角色成长的个人体验由此延伸到与朋友一起训练的场景。

③场景化交互:训练信息分步填写,角色参数与预览放在相近区域,资料页集中展示积累,邀请流程补充队友状态。强烈视觉之下,选择、保存与发送等动作仍保持熟悉的操作逻辑。

 

三、设计启发:游戏化的完整感,来自行为与反馈的对应
角色、经验和装备让训练拥有可见回声,分组与主按钮则维持使用秩序。做运动、学习或习惯产品时,可以先思考哪些真实行为值得被看见,再为它们设计连贯的成长表达。

如有运动健身、训练管理类 App的 UI/UX 设计需求,欢迎联系兰亭妙微,交流产品场景与设计需求。

兰亭妙微(蓝蓝设计)www.lanlanwork.com 是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计、B端界面设计、桌面端界面设计、APP界面设计、图标定制、用户体验设计、交互设计、UI咨询、高端网站设计、平面设计,以及相关的软件开发服务,咨询电话:01063334945。

 

image.png

兰亭妙微入门科普:如何入门交互设计

涛涛 交互设计及用户体验

本文面向交互设计新人,完整梳理交互设计师的能力构成、工作流程、核心理论模型以及自我提升路径,把常用理论、模型搭配案例通俗讲解,适合搭建基础知识框架。

兰亭妙微人物科普:UX 领域三大标杆人物

涛涛 交互设计及用户体验

文章梳理用户体验行业三位里程碑人物:唐・诺曼(Don Norman)、雅各布・尼尔森(Jakob Nielsen)、阿兰・库珀(Alan Cooper),从行业影响力、著作、核心贡献出发,同时给出设计师的职业启发。

兰亭妙微ui设计公司分享:界面改版值不值得做怎样把设计价值讲清楚

鹤鹤 B端ui设计文章及欣赏

一套新的B端界面设计拿到评审会上,大家可能都觉得更清爽,却仍然不知道是否值得安排开发。Alex Williams 的文章通过一个明确标注为虚构的产品案例,讨论设计投入如何与业务目标和验证方法连接。我们不搬用其中的收益数字,而是从设计交付的角度聊聊:怎样把页面变化讲成一件可以观察、可以验证的事。以下均为假设场景和AI概念界面,不是兰亭妙微客户成果。

兰亭妙微ui设计公司分享:让AI记住项目要求先把设计资料整理清楚

鹤鹤 交互设计及用户体验

昨天已经改好的品牌名称,今天生成的内容又回到旧版本;一个项目的配色,被带进另一个完全不同的页面。遇到这些情况时,继续加长提示词未必最有效。Tanner Kohler 对AI重度用户的观察提到,资料的更新、查找与使用范围同样影响结果。借此,兰亭妙微分享一套面向设计协作的资料整理思路。下面的工作区与审核界面是概念示意,具体做法需要结合团队工具和项目约定调整。

兰亭妙微ui设计公司分享:AI模拟用户给出的答案为什么总是很像

鹤鹤 交互设计及用户体验

一份研究材料写得流畅,人物背景也很完整,就能帮助我们理解真实用户吗?Rachel Banawa 分享了一次比较:在特定的开放问题上,AI模拟受访者与真人的主要结论相近,但回答的差异更小。它提醒用户体验设计公司,判断研究价值时,还要留意那些不常见却可能影响设计的情况。以下只简述这一观察,并结合假设的产品任务,分享我们对研究准备与证据使用的思考;不把单次比较推广成所有AI工具的结论。

兰亭妙微ui设计公司分享:少点几次按钮之后体验真的更好吗

鹤鹤 交互设计及用户体验

从打开筛选器到填写条件,再到对比结果,许多数字产品要求用户先学会界面,才能说清自己想做什么。Carrie Webster 的文章用几个产品画面讨论了另一种方向:让用户先表达目标,再由系统帮助组织结果。这给交互设计公司和产品团队提出了很实际的问题:省掉操作以后,用户还能否理解结果、调整选择并控制接下来发生的事?本篇保留少量原文案例画面,其余围绕这一问题展开独立的设计观察。

日历

链接

个人资料

蓝蓝设计的小编 http://www.lanlanwork.com

存档