首页

用户思维之旅,引领设计未来(下)

清阳 交互设计及用户体验

三、用户思维的认知篇

 

明确的废话:「以用户为中心」的四个认知。在用户思维的认知篇中,明确的废话强调了设计和交互中的核心原则,确保设计团队深刻理解并践行「以用户为中心」的理念。以下是四个关键认知:

 

image.png

 

 

明确1:首先,是「用户」而非「消费者」

这一认知原则强调将用户看作更广泛参与产品和服务的主体,而非仅仅限定为消费者。用户思维的核心在于理解用户的全面体验,包括他们与产品互动的各个层面,而不仅仅是购买和消费的瞬间。

 

关注「用户」而非「消费者」意味着将用户视为产品和服务生命周期中的参与者,包括产品设计、使用过程和售后服务。这一认知使得设计团队更加全面地考虑用户的需求、期望和体验,从而创造更加深入和有意义的用户关系。

 

在这种理念下,用户的价值不仅仅被限制在消费时刻的交易行为,更被视为对产品和服务发展的有益贡献者。通过强调用户的广泛参与,明确1的原则为设计团队提供了一个更全面、更人性化的视角,确保他们在设计过程中不会忽略用户的整体体验。

 

image.png

 

 

明确2:由「以产品为中心」到「以用户为中心」

这一认知原则标志着从传统的以产品为核心的设计理念向以用户为核心的设计理念的转变。在过去,产品设计往往侧重于产品的功能、性能和技术特性,而用户思维强调的是将用户的需求和体验置于设计过程的中心。

 

从「以产品为中心」到「以用户为中心」的变革意味着设计团队不再仅仅满足于提供功能齐全的产品,而更注重确保产品能够满足用户的期望、需求和愉悦感。这种转变要求设计过程更加关注用户的使用情境、心理体验和与产品互动的整个过程。

 

在以用户为中心的设计理念下,产品的功能和技术变得为服务用户的目标而存在,而不是为了展示技术的先进性。这种转变不仅仅关注产品的外在表现,更注重产品如何融入用户的生活,以及如何为用户创造价值和愉悦感。通过这一认知原则,设计团队将更好地满足用户的实际需求,创造更贴近用户心理的设计。

 

image.png

 

 

明确3:要「站在用户的立场着想」,而不是「满足用户需求」

这一认知原则强调设计团队不仅要满足用户提出的明确需求,更要深入理解用户的感受、期望和挑战,真正站在用户的立场思考。与简单地满足表面需求不同,「站在用户的立场着想」追求更全面、更深刻的用户体验。

 

满足用户需求是一项基本任务,但真正优秀的设计是能够预见用户的潜在需求,并在产品或服务中解决用户可能未察觉到的问题。这需要设计团队投入更多心力,通过深入的用户研究和洞察,挖掘用户真实的期望,从而创造更令人满意的体验。

 

「站在用户的立场着想」也意味着在设计决策中更多地考虑用户的感受和情境。了解用户的日常生活、习惯和文化背景,确保设计不仅仅是功能性的满足,更是与用户生活紧密相连的愉悦体验。通过这一认知原则,设计团队能够超越单一的需求层面,真正为用户创造出更具深度和共鸣的设计作品。

 

image.png

 

 

明确4:用户是伙伴:「1+1=11」

这一认知原则强调用户不仅是设计过程中的对象,更应被视为创新的合作伙伴。通过建立积极的沟通渠道和互动机制,设计团队能够与用户形成紧密的伙伴关系,共同推动产品和服务的不断演进。

 

「用户是伙伴」的理念倡导设计过程中的协作和共创。设计团队应当欢迎用户的参与,包括用户反馈、意见和建议。这种开放的沟通渠道有助于从用户角度获得直接的见解,促使团队更灵活地应对变化,提高设计的实用性和用户满意度。

 

通过与用户建立持续的合作关系,「1+1=11」的思想强调了合作的力量。用户作为伙伴能够为设计团队提供独特的视角和实际的使用体验,而设计团队则能够通过专业知识和创意驱动产品不断创新。这种共赢的伙伴关系有助于在设计过程中实现更好的用户参与,为产品的发展提供有益的方向。

 

 

 

四、用户思维的方法篇

 

4.1 用户洞察三大方法:

三位大神手把手教你如何市场调研&洞察用户 市场调研和用户洞察是设计团队深入了解目标用户、挖掘需求的关键步骤。在这一部分,我们将学习三位业界大神的实战经验,手把手教授如何进行有效的市场调研和用户洞察。

 

image.png

 

 

专家一:市场调研达人的独门技巧

这位专家将分享其在市场调研领域的独特经验和技巧。读者将了解如何正确选择调研方法、分析市场趋势、评估竞争对手,以及利用数据制定明智的设计决策。通过专家的指导,设计团队将更有信心地制定适应市场需求的设计策略。

 

专家二:用户洞察大师的深度剖析

这位专家是用户洞察领域的大师,擅长通过深度研究揭示用户的潜在需求。他将分享如何设计和执行有深度的用户调查,运用心理学和人类行为学原理解读用户行为。通过专家的实用技巧,设计团队将更好地理解用户心理,精准捕捉用户真实需求。

 

专家三:创新洞察的前沿探索者

这位专家将引领我们探索创新的洞察方法。通过观察新兴趋势、参与用户体验,他将分享如何在不断变化的市场中保持敏锐洞察力,从而在设计中融入前瞻性的元素。设计团队将受益于专家的前沿知识,更好地应对未来的设计挑战。 这一章节的目标是为读者提供灵感和指导,使他们能够运用行业大神的实战经验,更有信心地进行市场调研和深度用户洞察。

 

 

4.2 用户洞察方法1:完成生活中的任务

这一方法着重于观察和理解用户在日常生活中如何完成任务,旨在挖掘出用户真实的需求和期望。通过深入洞察用户的日常行为,设计团队能够更全面地理解用户的真实体验,从而为产品或服务提供更加贴切的解决方案。

 

image.png

 

 

任务观察:洞悉用户行为与需求

首先,设计团队需要选择一个明确定义的任务,这可以是用户在特定情境下需要完成的日常活动。通过观察用户在执行这一任务时的行为,团队能够捕捉到许多细微的细节,包括使用习惯、面临的问题以及情感体验。

 

行为模式分析:揭示潜在需求

通过对用户行为模式的深入分析,设计团队能够揭示出潜在的需求和期望。这可能包括用户在任务执行过程中的挑战、喜好,以及对特定功能或体验的期待。这一分析将为团队提供深入的用户洞察,超越表面的需求,更好地理解用户背后的动机和心理。

 

场景还原:创造真实用户体验

为了更好地理解用户体验,设计团队可以通过场景还原的方式,尝试亲自完成用户在生活中的任务。通过亲身体验,团队将更深入地感知用户的需求、痛点和情感反馈,为后续的设计决策提供更实际、贴近用户生活的参考。

 

通过这一方法,设计团队能够真实地感受用户的日常生活,深入了解他们的需求和期望,为设计提供更具体、更人性化的灵感。

 

 

4.3 用户洞察方法2:站在用户的立场思考

这一方法旨在通过模拟用户的视角,深入理解用户在使用产品或服务时的体验和感受。通过站在用户的立场思考,设计团队能够更全面地考虑用户的需求、期望和使用场景,从而制定更贴心的设计方案。

 

image.png

 

 

用户视角模拟:体验用户的感受

设计团队首先需要从用户的角度出发,将自己置身于用户的日常生活和使用环境中。这可以通过模拟用户的日常活动、使用场景,或者通过角色扮演等方式来实现。通过亲身体验,团队能够更直观地感受用户的需求和体验。

 

情境分析:考虑用户使用背后的动机

在模拟用户的立场时,设计团队需要分析用户可能面临的各种情境。这包括考虑用户的心理状态、行为动机以及使用产品的具体场景。通过深入的情境分析,团队可以更好地理解用户的决策过程和行为动机,为设计提供更有针对性的解决方案。

 

用户体验反馈:记录真实感受

在模拟用户的过程中,设计团队需要详细记录自己的感受和观察。这可以包括使用产品时的舒适度、遇到的问题、喜好等方面的反馈。这些反馈将成为设计团队调整和改进设计的重要依据,确保最终的产品更符合用户的期望。

 

通过站在用户的立场思考,设计团队能够更好地理解用户的需求和体验,帮助他们制定更符合实际情境的设计方案。这一方法有助于打破设计者的主观认知,真实地站在用户的角度,为设计提供更客观、用户导向的视角。

 

 

4.4 用户洞察的方法3:亲身体验

在这一方法中,我们将深入研究通过亲身参与用户体验,直接感知用户需求和情感反馈的手段。亲身体验是一种直观而深刻的方法,能够为设计团队提供真实而珍贵的用户洞察。

 

image.png

 

 

参与用户角色:全身心融入用户体验

设计团队通过主动参与用户所面临的情境和任务,全身心融入用户的角色。这可能包括使用产品、执行特定任务、访问服务等。通过亲身参与,团队能够更深刻地理解用户的感受、需求和体验。

 

感知用户情感:捕捉真实反馈

在亲身体验的过程中,设计团队需要敏锐地捕捉用户的情感反馈。这包括用户在使用过程中可能表现出的喜悦、挫折、满足等情感。通过记录这些真实反馈,设计团队可以更好地理解用户的情感体验,为设计提供有力的情感导向。

 

实地考察用户场景:深度洞察使用环境

除了产品或服务本身,团队还需深入考察用户所处的实际环境。这可能包括用户的生活空间、工作场所等。通过实地考察,设计团队可以更好地了解用户的行为背后的背景和动机,为设计提供更具深度的用户洞察。

 

通过亲身体验,设计团队能够以更直观的方式感知用户的需求和体验,深入了解用户使用产品或服务的真实场景,为后续的设计工作提供更加具体和贴切的指导。这一方法是深入用户洞察的重要途径,有助于设计团队更好地满足用户的期望。

 

 

 

总结

 

本章系统地回顾了用户思维的演进历程,着重探讨了其四个阶段和四种关系,明确了以用户为中心的新认知。通过深入分析用户思维4.0中的三大洞察方法和寻找市场机会的六个思维,我们为读者提供了在用户思维框架下准确洞察用户的方法论。

 

我们理解到,在用户思维的演进中,从简单的「顾客是上帝」到现代的「以用户为中心」,设计理念已经经历了巨大的变革。这一变革的核心在于更深入地理解和满足用户的真实需求,从而创造出更具价值和用户体验的产品。

 

在接下来的内容中,我们将更深入地探讨用户思维在实际设计中的应用。通过具体案例和实践经验,我们将为设计团队提供有力的指导,帮助他们更好地运用用户思维,创造出贴近用户心理的创新设计。让我们一同探索,在这个充满挑战和机遇的设计世界中,如何更好地理解和服务用户,成就卓越的用户体验。

转载:黑马青年

 

 

 

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

 

image.png

从极简到暗黑:六大专业灵感站点助你掌握当代设计趋势

清阳 行业趋势

在当今快速发展的数字设计世界中,寻找优质的设计灵感至关重要。无论你是专业设计师还是刚入行的新手,以下这些精选的网页设计灵感站点将帮助你提升创意和设计水平。兰亭妙微深耕 UI 设计与开发领域,团队设计师始终保持持续学习、稳步成长的状态,和你分享当代设计趋势。

1. Curated Design - 设计精品集锦

image.png

 

[Curated Design](http://curated.design) 是目前最佳的网页设计灵感资源之一。该平台精心挑选了来自全球的顶尖网站设计,按照不同的风格和特点进行分类,包括暗色系、柔和色调、多彩设计、极简主义等。

特色亮点:

- 提供精选的高质量设计案例

- 按设计风格和属性进行详细分类

- 提供专业版订阅服务,解锁更多功能

- 每周更新,保持最新设计趋势

Curated Design 的界面本身也是一个设计典范,简洁而富有美感,让浏览体验变得轻松愉悦。对于寻求高端设计灵感的专业人士来说,这是一个不可错过的资源。

 

2. Landing Gallery - 全方位的着陆页灵感

image.png

[Landing Gallery](http://landing.gallery) 专注于提供各个领域的着陆页设计灵感。无论你需要设计什么类型的页面,从主页、定价页面到联系页面,甚至是404错误页面,这里都能找到优质的参考案例。

主要功能:

- 按页面类型进行详细分类(主页、定价页、关于页等)

- 按网站构建工具筛选(Elementor、Framer、Shopify等)

- 定期更新最新的设计案例

- 提供深色/浅色模式切换

Landing Gallery 的组织结构非常清晰,让用户能够快速找到所需的特定类型页面设计,是进行目标明确的设计研究的理想平台。

 

3. SaaS Landing Page - SaaS领域的专业灵感

image.png

[SaaS Landing Page](http://saaslandingpage.com) 专门收集了SaaS(软件即服务)公司的优秀着陆页设计。对于科技创业公司和SaaS产品设计师来说,这是一个宝贵的资源。

核心优势:

- 超过800个顶级SaaS公司的着陆页案例

- 按页面类型细分(着陆页、定价页、功能页等)

- 提供多种技术栈的模板参考

- 按流行字体和设计标签进行筛选

 

如果你正在为SaaS产品设计网站,这个平台提供的针对性案例将帮助你了解行业最佳实践和设计趋势。

 

4. Supahero - 精选的英雄区设计

image.png

 

image.png

[Supahero](http://supahero.io) 专注于网站最重要的部分之一——英雄区(Hero Section)设计。这个区域通常是访问者首先看到的部分,对于吸引用户注意力至关重要。

 

特色内容:

- 精心挑选的高质量英雄区设计

- 按风格分类(暗色、极简、3D、彩色等)

- 提供相关设计工具和模板资源

- 定期更新最新设计趋势

 

Supahero 的集中焦点使其成为寻找引人注目的网站开场设计的绝佳资源,特别适合想要在第一印象上脱颖而出的设计师。

 

5. Mobbin - 最大的UI/UX参考库

image.png

image.png

 

[Mobbin](http://mobbin.com) 是目前最大的UI/UX设计参考库之一,提供了大量的移动应用和网站界面设计案例。与其他平台不同,Mobbin 不仅展示首页设计,还提供完整的用户流程和交互设计参考。

 

主要特点:

- 海量的移动应用和网站UI/UX设计案例

- 完整的用户流程和交互设计展示

- 按行业、功能和设计模式分类

- 提供设计系统和组件库参考

 

对于需要研究用户体验和界面设计的专业人士,Mobbin 提供了深入了解成功应用如何构建用户流程的机会。

 

6. Dark Design - 暗色模式设计专家

image.png

 

[Dark Design](http://dark.design) 专注于收集优秀的暗色模式网站设计。随着暗色模式在各种平台上的普及,这个资源变得越来越有价值。

 

核心特色:

- 专注于高质量的暗色模式网站设计

- 提供模块化设计元素和模板

- 按风格和功能分类

- 支持书签功能,保存喜爱的设计

 

Dark Design 不仅提供整体网站设计灵感,还关注暗色模式下的细节处理,如色彩对比、可读性和视觉层次,是设计暗色界面的绝佳参考资源。

 

总结

这些设计灵感站点各有特色,覆盖了从整体网站设计到特定元素、从通用领域到专业行业的各个方面。作为设计师,定期浏览这些资源可以帮助你:

 

- 了解最新的设计趋势和模式

- 获取针对特定项目的灵感

- 学习行业最佳实践

- 提升自己的设计技能和审美水平

无论你是在设计一个全新的网站,还是对现有项目进行改进,这些平台都能为你提供宝贵的参考和灵感。

转载:未来交互趋势

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

 

image.png

资深设计的 10 个 UI 技巧

清阳 B端ui设计文章及欣赏

正文

为了帮助大家更轻松地提升设计水平,这里整理了一些简单实用的小贴士。希望这些小技巧不仅能够助力您优化当前的设计项目,还能在未来的设计之旅中为您提供参考价值。

 

 

 

01. 避免卡片上文本信息过多

 

一个卡片内通常会包含图片、标题、详细介绍及行动按钮等元素,这些元素需要以聚焦的形式去呈现,以帮助用户快速扫描内容。当文本内容较长、展示的信息过多时,不利于用户快速扫描,导致用户无法在第一时间快速感知到产品想要展示的、或用户想要知道的信息,很容易被用户过滤。

 

image.png

 

文本内容过多且无法删减时,我们可以从中提取部分更有价值信息,也可以只显示文本内容的前两行,其他将其省略,以点击展开更多、内容弹窗或者跳转页面的方式将其完整展示,都不失为一种不错的解决方式。

 

image.png

 

 

 

02. 减少表单字段的填写数量

 

在设计表单时,让用户填写过多的内容会增加其认知负荷,表单完成率也会随之下降。为了减少用户的操作次数,降低使用难度,但凡能让用户选择的就不要让他输入、能够系统获取的就不让用户去选择,要尽可能的减少字段填写数量,让表单显得更加简单。

 

类似地址、日期这类层级内容,不要将其分成多个字段,最好做成联动选择让用户一气呵成。

 

image.png

 

 

 

03. 不同输入场景下的键盘类型

 

为了简化数据输入,满足不同的类型的文本输入需求,用户在输入不同类型的字段时,应提供对应类型的键盘,便于用户更快完成表单内容,常见的键盘有以下几种:

 

  • 中文键盘:绝大多数表单使用的类型,应对纯中文或综合性文本类型的输入需求;

  • 英文键盘:纯英文类型的字段,例如字母类型的用户名、英文名输入等;

  • 数字键盘:纯数字类型的字段,例如手机号、身份证号、银行卡号等;

  • 数字键盘(乱序):多用于纯数字密码类型的输入需求,对安全系数要求较高,如支付密码等。因出于安全考虑,这类键盘虽然会增加用户的理解成本,但与财产的安全性相比,显然在可接受范围之内。

 

image.png

 

 

 

04. 行高应跟随字号而变化

 

有很多设计师在处理大量的文本内容时,为了遵循设计规范,会设定固定的行高数值,例如常用的1.2、1.5倍等,需知设计规范是为了避免我们在设计中出错,并非为了规范而规范。

 

在应对大量的文本类容时,为了让用户有更好的可读性和易读性,行高因跟随字号的大小而变化,字体越小、行高越大,想要视觉上更加细腻,文字越粗(越黑)、行高越大,我们只需要保证在同一字号、字重的条件下,保持同相同数值的行高即可。

 

image.png

 

如果中文看的不是那么明显,可以试下英文,特别是上一行基线到下一行基线之间的距离尤为明显。笔者因工作中涉及中、英、泰三文切换,在处理行高时不敢有丝毫马虎。

 

 

 

05. 基于拾色器右上方选取颜色

 

在为UI选取主色调时,大多都是根据logo色来建立UI色彩体系,因品牌logo会用户各行各业,尤其是平面印刷用色与电子屏幕用色差异过大,故而logo色并不能直接用于UI设计,我们需要在logo品牌色的基础上做出调整。

 

设定主色调时,可基于品牌logo的色相或往邻近色方向微调,然后在拾色器右上方(介于饱和度和明度最大值附近)选取具体的颜色。这种配色方式能让主色更加鲜明,在电子设备中显示也会更加舒适、和谐。不仅如此,在选取辅助色时也可以使用这种方式。

 

9af363ea15145ad20bfee65eb764bb28.jpg

 

目前市面上那些成熟产品的配色,都会有这种规律,主色都基于拾色器右上角的位置。

 

3b71af18f9df946b67d554008e9026dd.jpg

 

 

 

06. 表单标签的对齐方式

 

常见的表单标签对齐方式有三种,左对齐、右对齐和顶对齐。不同的对齐方式都有各自的优点和缺点,我们需要根据项目实际情况来选择最合适的对齐方式。

 

左对齐:左对齐是最为常见的对齐方式,可充分利用页面的垂直空间,易于扩展。在选用左对齐时,标签字数需在可控范围类,一般不超过4字,否则会降低可输入空间,影响输入内容的长度;

 

c90ce9c315d7458cc764d074e1e91c7e.jpg

 

右对齐:多用于网页表单中,在标签稍长、且字数长度不一的情况下使用。当标签参差不齐时,与左对齐相比,右对齐能拉近标签与输入框的距离,增强内容的关联性;

 

851b0c1831ef929fed5353270ea9d5eb.jpg

 

顶端对齐:会占用较多的纵向空间,通常用于标签长短不可控的场景下,例如常见的英文表单。在中文场景中使用不多,如用户问卷调查、信息搜集等。

 

76ecf71d33b06e37314546a5a9835b75.jpg

 

 

 

07. 大胆使用空间留白

 

为了提高界面利用空间,追求信息的饱和度无可厚非,但过度追求并非是一件好事,当信息过于密集、信息层级较难区分时,会耗费用户更多的时间成本。

 

不要吝啬界面留白,基于亲密性原则,在合理的将信息进行分组之后,请大胆使用留白,应避免元素与元素、与信息组之间过于密集,保持界面的呼吸感,给用户更为舒适通透的体验。

 

973140880d16232629cfe22d9d16370a.jpg

 

 

 

08. 中性色的设定(黑白灰)

 

中性色在UI设计中相当重要,虽然仅次于品牌色,但在我们的设计流程中,定义中性色往往会早于定义品牌色,因为在界面配色之前,我们会通过中性色来表现界面信息的层级。

 

中性色即色彩中的黑白灰,设定中性色是由调整HSB(色相/饱和度/亮度)中的B值高低里形成一个表现视觉强弱的等级阶梯,一般设定4~5个等级即可,例如B值的20%(#333333)、40%(#666666)、60%(#999999)、80%(#CCCCCC)、90%(#E6E6E6)。

 

ce704177f70d217c002cfe3d25d4a9d0.jpg

 

这里需要注意两个问题,一是要避免使用纯黑色,因为纯黑色在电子屏幕中是不发光的,会与其他发光的颜色产生巨大的反差,不易与视觉浏览;而是设定的黑白灰等级数量不宜过多,否则邻近的色值很难拉开视觉层级。

 

 

 

09. 投影的光源保持统一

 

这可以被视为提升用户体验的一个高级技巧。在给组件添加投影时,如果光源方向或强度不一致,即使这种差异很细微,也可能因为不协调而破坏整体视觉效果,使界面看起来不够专业或者缺乏连贯性。

 

为了增强视觉上的和谐与统一,所有UI组件都应遵循相同的光源方向,使各个元素之间更加协调,帮助用户更快地理解和适应界面布局。此外,通过确保光照效果的一致性,还可以有效地突出重点信息。

 

7f3e11a7cf2fe70d973e7db19fe89200.jpg

 

 

10. 避免用占位符替代标签

 

输入框中的占位符可以为用户提供初步的指引,帮助他们在开始输入前有一个短期的记忆提示。理想情况下,占位符应作为标签的补充。然而,如果只有占位符而没有标签,用户可能会感到困惑,尤其是在他们点击输入框后占位符消失时,可能会一时记不起要输入的内容。

 

标签对于明确指示用户在表单字段中输入什么信息至关重要。保持标签的可见性不仅能提升产品的易用性,还能特别照顾到那些认知和记忆力较弱的用户。这样可以确保每个输入字段的用途始终一目了然,减轻用户的认知负担,使表单更加友好、清晰且易于使用。

 

9ea922da8645b4036364c3a0cf84538a.jpg

转载:黑马青年

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

 

image.png

为什么懂开发的UI设计公司更容易成功?

清阳 设计思维

在 UI 设计行业,“能做视觉稿” 早已不是核心竞争力 —— 随着市场对产品的要求从 “好看” 升级为 “好看又好用”,客户对设计公司的评判标准,正从 “视觉设计能力” 转向 “设计落地能力”。懂开发的 UI 设计公司,本质是打破了 “设计只管美学、开发只管技术” 的行业割裂壁垒,通过设计与开发的深度融合,从根源解决了设计落地难、协作效率低、商业价值弱等行业痛点,最终在竞争中形成差异化核心优势,更易实现商业成功。北京兰亭妙微科技有限公司正是如此,作为深耕 UI/UX 设计领域的专业团队,兰亭妙微立足用户体验核心,兼具专业设计能力与技术落地认知,深度打通设计与开发的协作链路,为各行业客户提供从设计创意到技术落地的全流程解决方案,凭借 “设计能落地、体验能兑现、商业能赋能” 的核心能力,成为众多企业的优质设计合作伙伴。
 

一、效率突破:减少 “设计 - 开发” 协作内耗,缩短项目交付周期

兰亭妙微UI作品
 
兰亭妙微UI作品
传统设计模式中,“设计与开发脱节” 是导致项目延期、客户满意度低的核心原因:设计师输出的视觉稿常因未考虑技术边界需反复修改,开发过程中发现的设计适配问题需回溯调整,形成 “修改 - 返工 - 再修改” 的恶性循环,严重拉长交付周期,也加剧了跨团队协作矛盾。
 
懂开发的 UI 设计公司,能从源头规避协作内耗,让设计交付更高效:
 
  1. 需求阶段提前对齐设计与技术逻辑:设计团队深谙开发底层逻辑,能精准把握技术实现边界(如响应式布局适配规则、动效渲染性能要求),在设计构思阶段就规避 “技术不可实现” 的方案,无需开发端反复反馈修改。兰亭妙微在项目需求拆解阶段,会让设计团队与技术顾问同步介入,提前明确设计方案的技术落地可行性,从根源减少后期返工可能。
  2. 设计过程中主动适配开发需求:设计师能基于开发思维,输出标准化、可落地的设计稿,包含精准的标注、切图及规范文档,避免因设计标注模糊、规范不统一导致开发端反复沟通。某企业 SaaS 系统设计项目中,兰亭妙微凭借对开发流程的熟悉,输出的设计稿直接匹配开发对接标准,让开发端无需额外沟通设计细节,项目协作效率提升 60%,交付周期较行业平均水平缩短 30%。
  3. 落地阶段高效解决适配问题:面对开发过程中出现的小范围适配调整,设计团队能基于开发认知快速响应,无需反复沟通确认,大幅减少问题解决时间。某电商小程序设计中,开发端反馈部分动效在低端机型易卡顿,兰亭妙微设计团队即刻结合技术可行性优化方案,将动态渐变调整为静态渐变,问题当天解决,未影响项目整体进度。
 
行业数据显示,懂开发的 UI 设计公司,项目返工率平均降低 60%,协作沟通成本减少 50%,交付周期比传统设计公司缩短 30%-40%—— 效率优势不仅能提升客户满意度,更能让设计公司承接更多优质项目,成为业务拓展的核心支撑。
 

二、体验落地:让 “好设计” 真正转化为 “好产品”,兑现设计核心价值

 
很多设计公司能做出 “高颜值” 的视觉稿,却难以实现 “好体验” 的落地:设计稿中的流畅交互、精准反馈、细节质感,因设计团队缺乏开发认知,未考虑技术实现细节,最终开发落地后变形走样,导致产品 “看起来美,用起来差”,违背设计的核心初衷,也让客户的设计投入无法兑现价值。
 
懂开发的 UI 设计公司,能让设计创意精准落地,让体验价值真正兑现:
 
  1. 还原设计细节,保障体验一致性:懂开发的设计师深知开发实现逻辑,在设计阶段就会考虑细节的技术落地性,确保设计稿中的每一个细节(如按钮点击反馈延迟≤100ms、不同页面字体大小统一、动效帧率稳定 60fps)都能被精准还原,而非仅停留在视觉层面。某医疗 APP 设计项目中,兰亭妙微严格把控设计细节的技术落地标准,从检测报告加载动效到操作按钮的交互反馈,均确保多设备体验一致性,最终产品上线后,用户对 “流畅感” 的感知度提升 70%,应用商店评分达 4.8 分,远超行业同类产品。
  2. 平衡设计创意与技术可行性:当设计创意与技术实现存在冲突时,懂开发的设计团队能找到最优解,而非简单妥协或放弃创意,既保证技术落地性,又最大程度保留设计核心价值。某金融 APP 的 K 线图设计中,客户要求实现动态交互、实时更新的体验效果,传统设计公司因未考虑性能压力,设计方案难以落地,而兰亭妙微结合开发认知,优化设计方案并配合开发端做数据分块加载处理,最终既实现了动态交互的核心体验,又避免了页面卡顿,该功能用户使用率达 85%,远超行业平均水平。
  3. 把控全流程体验,规避落地漏洞:懂开发的设计团队能从产品全流程视角出发,不仅关注视觉设计,更能预判开发落地过程中可能出现的体验漏洞,提前做好设计预案。某教育 APP 设计中,兰亭妙微基于对开发场景的熟悉,预判到学生使用时可能出现的广告误触问题,在设计阶段就加入 “二次确认弹窗” 的设计方案,避免产品上线后因体验问题紧急迭代,保障了产品上线后的核心体验。
 
设计的核心价值,是通过优质体验提升产品竞争力。懂开发的 UI 设计公司,能让设计从 “视觉稿” 真正转化为 “好产品”,让客户的设计投入兑现为实际的产品体验价值,这也是客户选择设计公司的核心考量。
 

三、成本优化:降低 “后期迭代” 与 “跨方协作” 成本,提升客户投入回报

 
传统设计模式的成本浪费,常隐藏在 “后期迭代” 与 “跨方协作” 中:因设计团队缺乏开发认知,前期设计未考虑落地性,导致产品上线后需频繁修改优化,每次迭代都需设计与开发重新对接,消耗大量人力、时间成本;同时,客户需单独对接设计公司与开发公司,跨方沟通的时间与资金成本居高不下,让整体项目成本大幅增加。
 
懂开发的 UI 设计公司,能从全流程为客户优化成本,提升设计投入回报比:
 
  1. 减少后期迭代成本:前期设计就融入开发思维,充分考虑技术落地性与产品全流程体验,从根源降低产品上线后的修改需求,让客户避免不必要的迭代投入。某母婴平台设计项目中,兰亭妙微因前期充分考虑开发落地与用户体验,产品上线后无需额外迭代优化,为客户节省约 20 万元的后期修改成本。
  2. 降低跨方协作成本:懂开发的设计公司能成为客户与开发端之间的 “桥梁”,无需客户额外协调设计与开发的沟通矛盾,减少客户的跨方管理成本。同时,如兰亭妙微这类兼具设计能力与开发认知的团队,能为客户提供一体化的设计落地解决方案,避免客户单独对接多方的繁琐流程,进一步节省沟通成本。
  3. 优化设计投入效率:让客户的每一分设计投入都能转化为产品的实际价值,避免因设计落地变形导致的设计投入浪费。某初创企业对比行业服务后,选择兰亭妙微进行小程序全案设计,因设计稿直接匹配开发标准、落地零返工,最终整体项目成本较 “传统设计 + 外部开发” 的模式降低 40%,且产品上线后体验效果远超预期。
 
对客户而言,选择设计公司不仅是为了获得优质的设计方案,更是为了实现设计价值的最大化落地。懂开发的 UI 设计公司,能从全流程为客户优化成本,提升设计投入回报比,这也是赢得客户认可的核心关键。

四、商业转化:让设计赋能产品商业价值,增强长期合作粘性

 
UI 设计的终极目标,从来不是单纯的 “视觉美观”,而是通过优质的用户体验赋能产品商业价值,帮助客户实现业务目标(如提升用户转化、增加用户留存、强化品牌认知)。设计公司的长期成功,不仅取决于 “能否做出好设计”,更取决于 “能否让设计为客户创造商业价值”。
 
懂开发的 UI 设计公司,能通过设计与开发的深度融合,让设计真正赋能产品商业价值,从而增强与客户的长期合作粘性:
 
  1. 优化核心路径体验,提升用户转化:懂开发的设计师能基于产品业务目标,结合开发落地性,优化产品核心操作路径(如简化注册流程、突出转化按钮、优化下单步骤),降低用户决策成本,提升产品转化效率。某电商品牌的 “限时秒杀” 页面设计中,兰亭妙微将商品详情到下单的点击路径从 3 步缩至 1 步,搭配视觉化的库存倒计时提示,最终页面秒杀转化率达 38%,比客户预期提升 15%。
  2. 打造情感化体验,增强用户留存:结合开发可行性,融入情感化设计细节(如个性化欢迎语、连续使用徽章、节日专属皮肤),提升用户对产品的好感度与粘性。某社交 APP 设计项目中,兰亭妙微加入的 “用户生日专属皮肤”“连续登录成就体系” 等设计,让产品月留存率提升 42%,客户后续的 2.0、3.0 版本迭代均继续选择兰亭妙微合作。
  3. 强化品牌化设计,提升品牌认知:将客户的品牌定位融入产品全流程设计,通过统一的色彩体系、专属图标风格、品牌视觉元素,让产品成为品牌的延伸,提升品牌在用户心中的辨识度。某高端家电品牌官网设计中,兰亭妙微将品牌 “极简、科技” 的核心定位深度融入界面设计,从视觉风格到交互体验均贴合品牌调性,最终官网的品牌辨识度评分达 90%,帮助客户提升了高端用户的品牌认同感,后续双方又达成了产品控制 APP 的设计合作。
 
当设计公司能帮客户实现 “设计落地 + 体验提升 + 商业赋能” 的三重价值时,客户不再将其视为 “单纯的设计乙方”,而是视为 “产品商业价值的合作伙伴”。这种深度的合作关系,能大幅增强客户粘性,实现长期复购,而这正是懂开发的 UI 设计公司的核心商业竞争力。
 

懂开发,本质是懂 “设计的落地价值与用户价值”

 
懂开发的 UI 设计公司更容易成功,核心不是 “多了一项开发技能”,而是 “多了一种以落地为核心、以用户为中心的设计思维”。在用户体验主导产品竞争力的当下,设计的终极目标不是 “做出好看的稿子”,而是 “通过设计打造好用的产品,赋能客户商业价值”。
 
懂开发的 UI 设计公司,恰好打通了 “设计创意” 与 “技术落地” 的链路,既能做出符合用户体验、贴合品牌定位的好设计,又能让设计精准落地、兑现价值,最终为客户提供 “设计有创意、落地无阻碍、商业能赋能” 的全流程解决方案。北京兰亭妙微科技有限公司始终坚守这一核心逻辑,以 “懂设计、懂开发、懂用户、懂商业” 的综合能力,为各行业客户打造兼具体验美感与商业价值的优质设计作品,在 UI/UX 设计领域形成了独特的核心竞争力,也成为越来越多企业的首选设计合作伙伴。
 
在行业竞争日益激烈的当下,“仅懂设计” 的传统模式早已无法满足市场需求,懂开发、能落地、善赋能,才是 UI 设计公司的核心生存法则,也是实现长期商业成功的底层逻辑。
 
 

16 个高转化 UX/UI 设计技巧:驱动产品增长的实用指南

涛涛 用户研究

UX/UI 设计不仅是美学的呈现,更是转化效率与用户体验的平衡艺术。好的设计能降低用户操作成本、减少决策阻力,最终推动产品核心指标增长。以下 16 个经过实践验证的设计技巧,覆盖按钮设计、信息呈现、交互逻辑等关键场景,帮你在设计中少走弯路,精准触达用户需求。

交互设计七大核心定律:解锁高效体验的设计密码

涛涛 交互设计及用户体验

交互设计的本质,是搭建人与产品之间的顺畅桥梁。正如 “交互设计之父” 阿兰・库珀所言:“除非有更好的选择,否则就遵从标准”。那些经过时间验证的交互设计定律,正是这样的 “标准”—— 它们从人类认知规律、行为习惯出发,为产品设计者提供了可落地的指导原则,帮助规避可用性问题,提升操作效率与用户满意度。以下是对七大核心定律的深度解析与实践应用指南。

浅色界面设计赏析:多场景下的轻盈与高效

蓝蓝设计的小编 B端ui设计文章及欣赏

 

北京兰亭妙微 UI 设计公司始终保持学习的态度,不断拆解国际上的优秀设计案例,汲取前沿设计思路,以下精选 5 组国外设计师的 UI 设计作品,
 
这组界面设计延续了浅色基调的核心优势,在企业管理、金融工具、教育科技等多场景中,实现了视觉舒适度与功能效率的平衡。
 
为设计创作提供可落地的参考:
 

1. 设备管理后台(图 1)

 
以米黄色为基底,搭配低饱和的灰色与黄色,营造出柔和专业的氛围。
 
  • 核心功能:全球设备分布地图以深浅灰度区分区域,黄色标记设备数量,悬浮卡片可快速查看设备详情;右侧安全状态仪表盘与历史会话列表,让管理员对设备风险和使用记录一目了然。
  • 设计亮点:圆角卡片与细腻的阴影层次,让信息模块清晰易读,避免了传统后台的压抑感。

2. 订阅套餐页(图 2)

 
采用极简浅蓝 + 白色的配色方案,突出套餐价格与核心卖点。
 
  • 核心功能:三个套餐卡片以不同透明度和色彩区分主次,中间 “最受欢迎” 的季度套餐用高饱和蓝色强化视觉焦点,顶部的切换按钮可快速切换个人 / 企业方案。
  • 设计亮点:轻量化的线条与柔和的渐变,让商业转化页面既专业又不生硬。
 

3. 工作流自动化编辑器(图 3)

 
以浅绿 + 白色为背景,搭配低饱和的功能模块色彩,让复杂的流程搭建变得直观。
 
  • 核心功能:拖拽式的节点设计,用不同颜色的线条和箭头区分数据流向,右侧工具列表可快速添加触发条件与动作,适合非技术人员快速搭建自动化场景。
  • 设计亮点:点阵背景与悬浮交互,让界面既有设计感又不干扰功能操作。
 

4. 金融仪表盘(图 4)

 
以白色为基底,用珊瑚红作为辅助色突出关键数据,让财务信息一目了然。
 
  • 核心功能:集成了账户管理、收支统计、股票走势等模块,环形图、波动图等可视化组件让数据直观易懂,AI 助手入口进一步提升了操作效率。
  • 设计亮点:圆角卡片与呼吸感留白,让高密度的金融信息不再压抑。
 

5. 房产风控后台(图 5)

 
以浅绿 + 米白为底色,营造出清新专业的视觉感受。
 
  • 核心功能:左侧房产列表展示关键信息(房龄、温度、地址),右侧地图用彩色热力圈标注风险区域,帮助风控人员快速定位高风险物业。
  • 设计亮点:半透明的热力层与简洁的卡片布局,让空间信息与房产数据联动更清晰。
 

6. 教育学习平台(图 6)

 
以浅粉 + 浅蓝的低饱和配色,契合教育产品的友好感。
 
  • 核心功能:顶部问候语与学习进度图表,搭配课程推荐与好友成绩对比,激发用户学习动力;多维度的数据可视化让学习效果清晰可见。
  • 设计亮点:柔和的色彩过渡与细腻的动效,让学习过程更具愉悦感。

 

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

 

image.png

全球标杆拆解:5 个国际化金融 APP 交易界面与 UI/UX 设计规范

蓝蓝设计的小编 移动端UI设计文章及欣赏

     兰亭妙微是一家拥有 16 年行业经验的专业设计公司,核心团队源自清华美院等顶尖院校,专注 UI/UE 咨询及全链路设计开发服务,深耕金融、医疗、能源等七大领域,累计服务超 500 家大中型企业,擅长以用户为中心破解 B 端后台、大屏可视化及金融 APP 的设计痛点北京兰亭妙微科技有限公司。我们始终坚持通过拆解全球优秀案例提炼设计方法论,以下结合行业标杆实践与自身经验,整理金融 APP 界面设计核心规范。

  1. 卡片管理页(图 4)
    • 深色磨砂质感的卡片设计,突出显示余额 “35,900.50 €”,搭配三色切换标签(EUR/USD/UAH),让多币种管理一目了然。
    • 下方的交易记录卡片采用深色渐变,兼顾信息层级与视觉舒适度。

  2. 提现页(图 3)
    • 大字号显示提现金额 “975.00 €”,并标注上下限(min 18.00 /max 35,900.50),符合金融场景的严谨性。
    • 底部弹出的币种选择列表,用浅色背景与主界面形成视觉区分,操作路径清晰。

     
  3. 数据统计页(图 5)
    • 柱状图用红 + 白分层展示每日金额,虚线标注均值,直观呈现一周收支趋势。
    • 下方的分类支出卡片(Travel/Shopping/Delivery)用不同渐变色调区分类别,提升信息识别效率。

     
  4. 个人中心页(图 6)
    • 极简布局,顶部展示头像、姓名与邮箱,下方功能入口采用大圆角卡片设计,视觉轻盈且易于点击。
    • 通知图标上的红色角标(9),有效吸引用户注意力。
     


 

✨ 整体设计亮点

  • 色彩策略:红、蓝、紫等高饱和渐变与深色背景形成强烈对比,既符合金融 / 科技产品的专业感,又增强了视觉冲击力。
  • 质感统一:磨砂、玻璃拟态、颗粒噪点等质感在不同页面中保持一致,强化品牌识别度。

金融 APP 界面设计规范清单

一、 核心设计原则

  1. 安全优先原则
     
    • 核心金融数据(余额、交易金额)需突出显示,同时避免在非必要页面全量展示完整信息。
    • 操作按钮(转账、提现、确认)需设置二次确认交互,防止误触;关键操作页禁止设置自动跳转功能。
    • 色彩需传递稳定感,主色调优先选择蓝色、深灰色等低饱和度色系,警示操作(如删除、注销)可使用红色,且需搭配明确文案提示。
     
  2. 信息层级清晰原则
     
    • 采用 “核心信息 - 次要信息 - 辅助信息” 三级布局,核心信息(金额、账户状态)放大字号、加粗处理;次要信息(交易时间、商户名称)适中字号;辅助信息(规则说明、备注)缩小字号、降低色阶。
    • 利用卡片式分区隔离不同功能模块(如账户管理、交易记录、数据统计),卡片间距≥8dp,避免视觉拥挤。
     
  3. 易用性原则
     
    • 功能入口需符合用户操作习惯,高频功能(转账、充值、账单)放置在首页或底部导航栏,低频功能(设置、客服)收纳至个人中心。
    • 表单填写页采用 “分步引导” 设计,减少单页输入项;支持自动填充(如银行卡号识别、常用收款人保存)。
     

二、 视觉设计规范

 
  1. 色彩规范
     
    色彩类型 适用场景 设计要求
    主色调 品牌标识、导航栏、核心按钮 选择 1 种主色(如深蓝色 #165DFF),保持全 APP 统一
    辅助色 分类标签、图表数据、功能图标 按功能分类设定(如收入用绿色、支出用橙色),色系需与主色协调
    警示色 错误提示、高危操作 仅使用红色系(如 #F53F3F),避免大面积使用
    中性色 背景、文本、分割线 背景用浅灰(#F5F7FA),正文用深灰(#1D2129),辅助文本用中灰(#86909C)
     
  2. 字体规范
     
    • 正文字体优先选择无衬线字体(如思源黑体、Roboto),保证移动端显示清晰。
    • 字号分级:
      • 核心数据(余额、金额):20-24sp,加粗
      • 页面标题:18-20sp,加粗
      • 正文内容:14-16sp,常规
      • 辅助文本:12sp,常规
       
    • 行间距:正文行间距为字号的 1.5 倍,标题行间距为字号的 1.2 倍。
     
  3. 控件规范
     
    • 按钮:核心按钮(确认、提交)采用纯色填充,圆角半径 8dp;次要按钮(取消、返回)采用描边样式,与核心按钮区分。
    • 输入框:激活状态需有边框高亮提示,输入错误时显示红色边框 + 错误文案;支持一键清空功能。
    • 图表:数据统计图表(柱状图、折线图)需标注清晰数值,支持点击查看详情;色彩区分数据类别,避免超过 4 种颜色,防止视觉混乱。
     
 

三、 交互设计规范

 
  1. 导航设计
     
    • 底部导航栏:控制在 3-5 个选项,图标 + 文字组合,当前页面图标高亮,文字加粗。
    • 页面内导航:长页面采用顶部选项卡(Tab)或侧边栏,支持锚点定位,方便快速跳转。
     
  2. 反馈设计
     
    • 操作反馈:点击按钮时有按压动效,交易操作成功 / 失败后弹出提示框(搭配图标 + 文案),并支持手动关闭。
    • 加载反馈:数据加载时显示骨架屏(而非纯加载动画),骨架屏需与页面布局一致,降低用户等待焦虑。
     
  3. 适配设计
     
    • 兼容主流移动端分辨率,保证在不同尺寸手机上布局不紊乱;核心功能按钮需避免被刘海屏、底部导航栏遮挡。
    • 支持深色模式切换,深色模式下需调整文本与背景的对比度,确保可读性。
     

四、 合规性设计要求

  1. 需展示金融相关资质证书(如支付牌照),放置在 “关于我们” 或 “设置” 页面,支持点击查看详情。
  2. 用户隐私协议、服务条款需单独分页展示,字体不小于 12sp,禁止使用 “默认勾选” 同意选项。
  3. 交易记录需保留完整信息(时间、金额、商户、流水号),支持导出、打印功能,满足用户对账需求。

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

 

image.png

设计的双重维度:理性奠基与感性赋能

涛涛 设计思维

设计的本质是什么?是冰冷的逻辑推演,还是温暖的情感共鸣?关于 “设计应感性主导” 还是 “理性为王” 的争论,在设计圈从未停歇。有人将设计等同于艺术创作,执着于个人情感的抒发;也有人将设计视为工程任务,严守逻辑与规则的边界。实则,这场争论的核心误区在于混淆了设计的两个核心维度 —— 设计决策与设计表达。真正成熟的设计,从来不是非此即彼的选择,而是以理性为根基,以感性为羽翼,二者层层嵌套、相辅相成的完整体系。

日历

链接

个人资料

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

存档