首页

用户体验是一种投资而不仅仅是成本

鹤鹤

 
 
在过去 1 年,我们和 10 多位个客户一起共创项目。在这段时期,我通过 1 对 1 咨询,分享活动和线上直播连麦的方式,和超过 100 位创始人进行深入交谈。
 
我们达成了一个共识:
用户体验是一种投资而不仅仅是成本
 
 
每一个创始人都构建了一个较为完整的想法,他们只需要找个设计师实现。这纯粹是一个执行交付的项目。
这对于设计服务行业而言,太正常不过了。客户提出需求,我们着重介绍客户所需的服务,和客户达成共识,我们就启动项目,最后交付高质量的服务。
 
这里有一个难点问题。
价钱
 
我们提供一系列的服务套餐,价格各有不同。这是因为我们知道我们的潜在客户画像:
  1.  
    预算不足:自负盈亏或种子前阶段的初创公司通常没有大量的资金储备。
  2.  
    观念误解:由于不知用户体验和设计的回报价值,将体验和设计视为成本,他们通常想把这些成本降到最低。
 
第一个问题,我们无法直接解决,如何获取/积累项目启动和增长资金。这需要风险投资人和创始人自己思考。如果你对自己的项目很自信,也可找我们,我们也开展种子轮的投资,可以共创共赢。
 
第二个问题,我们很擅长解决,即便如此,这也不是一个拍拍脑袋就能够解决的。所有问题是随着时间的推移不断积累而成。我们一起探讨为什么会陷入这种境地的原因,以及如何摆脱的方法。
 
...
 
在开始阅读文章以前,首先,对于用户体验(UX)一词的定义和大家达成一致。来自交互设计基金会描述:
用户体验是一种投资而不仅仅是成本
 
 
第二点特别的重要:用户并不只是接触产品后的体验。而是,每一位用户从开始到结束和产品交互的每一个接触点。
 
...
 
01 用户体验为什么没有被视为投资回报率
我认为造成这种情况的主要原因在于:产品构建者本身(例如我)没有直接表述这个诉求。
用户体验设计师常常会说:
用户体验是一种投资而不仅仅是成本
 
 
超赞的。这是一项值得从事的事业。我全身心投入其中,或许这会让我晚上睡的很香,因为,我在为其他人做一些好用的产品。
其中,有个问题。
数据和指标。
 
如果没有数据,就无法计算 ROI 。我们往往决定某件事情是否值得w做,都会计算投资回报。坦率地说,没有数据支撑的用户体验难以阐述真实的价值,这就是问题所在:
在企业内部用户体验设计往往地位卑微,因为没有数据和衡量标准,以至于被低估,无法充分发挥价值。最后损害的还是用户和业务。
 
更糟糕的是,如果没有强有力的观点支持,设计就会被视为企业纯成本支出的部分。如果不赚钱,那么为什么还需要你呢?随着大量企业裁员现象,通货膨胀对消费者需求的影响,往往最先被裁撤的,就是那些没有产生收入的部门。
我们需要重新定义用户体验(UX)
看清形势,我们要背上销售指标。一些决策者正在密谋决定我们预算和未来,而我们还在用主观的“好体验”来回应吗?
这明显是不行的。
我知道这行不通,因为这正是我从事设计总监阶段大部分时间尝试做的事情。
缓慢、稳定的增长是最好的情况。
我想争取更多。
 
02 用户体验为什么是投资回报(ROI)
我们直接进入正题。这里有 3 个指标可以衡量用户体验(UX)的投资回报率(ROI)。其中还有一些不同颗粒度的指标,这些我们可以放在后面讨论。这是从我在 ETHGathering 大会演讲时使用的 PPT 。
用户体验是一种投资而不仅仅是成本
 
 
用户登陆、使用、留存。
就这么办,让我们看看这些指标如何拆解。
 
让更多客户登陆(产品)
这些都是早期接触点。比如,高铁座椅后背显示的数字广告,点击链接就能跳转到登录页,以及通过搜索找到我们的产品。
在这个阶段最重要的就是展示明确产品的价值主张,构建用户的信任,突出能够提供给用户的好处。此时,面对大量流量,无论多微小的改变都会造成巨大的影响,因此,A/B测试往往在这个阶段使用,A/B测试能够帮助我们确定哪些用户体验会导致页面/步骤产生更多转化(使更多用户登陆)。
用户体验是一种投资而不仅仅是成本
 
 
让客户更多使用(产品)
一旦用户进入我们的产品,产品应该要简单且好用,我们所评估要点(下面所示):
  •  
    任务完成率
  •  
    任务完成时间
  •  
    操作间隔
  •  
    任务满意度
  •  
    停留时长
  •  
    扩大信息路径
 
有很多可以研究的内容,这完全取决具体的产品体验。最后一项要点在引导用户使用 APP 时非常有用,我们可以了解用户在尝试完成任务时究竟想要什么。
这一点应该需要结合定量和定性,或许我们可能知道是什么,但是不知道为什么。
仅在特定公里/小时范围内获得奖励,确保用户正在跑步
仅在特定公里/小时范围内获得奖励,确保用户正在跑步
 
让客户更多停留
这一切都是为了提高留存率避免客户流失。这个指标会在客户流失时触发警告信号。如果这个数据很低或正在下降,那么,客户无论何时续约,我们都很有可能会达不到销售指标。
我们所知的流失率和留存率更多关注客户成功(账户管理),然而这不是孤立的进行的,因为用户使用过程中,指标将直接导致后续的留存与流失的路径。
更快交付,迭代速度更快和新功能更快。
更快交付,迭代速度更快和新功能更快。
 
...
 
这些正是我们在用户体验(UX)方面创建更直接,更贴切的内容,征程才刚刚开始。
不断向外展示作为用户体验(UX) 设计师的能力范围,让更多人相信用户体验具备推动产品的用户满意度,用户增长和销售收入的力量。
换言之,你也可以理解用户体验(UX) 设计师能够节省成本和时间。这也不错,虽然无法选出哪个更好,但相信,企业主和创始人会更喜欢的往往不是节省支出,而是营收。
 
所以我们可以这样做:
然后,不断循环
用户体验是一种投资而不仅仅是成本


作者:三分设
链接:https://www.zcool.com.cn/article/ZMTYzMTk5Ng==.html
来源:站酷
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。
 

蓝蓝设计(www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计B端界面设计桌面端界面设计APP界面设计图标定制用户体验设计交互设计UI咨询高端网站设计平面设计,以及相关的软件开发服务,咨询电话:01063334945。我们建立了一个微信群,每天分享国内外优秀的设计,有兴趣请加入一起学习成长,咨询及进群请加蓝小助微信ben_lanlan。

WechatIMG27.jpg

关键词:UI咨询UI设计服务公司软件界面设计公司、界面设计公司、UI设计公司UI交互设计公司数据可视化设计公司用户体验公司高端网站设计公司银行金融软件UI界面设计能源及监控软件UI界面设计气象行业UI界面设计轨道交通界面设计地理信息系统GIS UI界面设计航天军工软件UI界面设计医疗行业软件UI界面设计教育行业软件UI界面设计企业信息化UI界面设计、软件qt开发软件wpf开发软件vue开发

 

深入探究B端产品设计的核心

鹤鹤

一、B端用户需求的深入理解和分析
在当今高度信息化的商业环境中,B端产品已成为企业高效运营和持续发展的关键支撑。
这些产品不仅提供工具和服务,更是企业优化流程、提升工作效率和竞争力的有力武器。然而,要打造一款成功的B端产品,关键在于对
B端用户需求的深入理解与分析。
B端用户,
如企业决策者、团队管理者和专业人员以及普通员工,他们在日常工作中处理复杂的业务流程,对数据分析、系统整合、安全性等方面有着极高的要求。
这些用户的独特需求不仅体现在产品的基本功能上,更涉及到产品的易用性、可扩展性以及服务支持等多个层面。
深入探究B端产品设计的核心
 
 
深入探究B端产品设计的核心
 
 
深入探究B端产品设计的核心
 
 
深入探究B端产品设计的核心
 
 
深入探究B端产品设计的核心
 
 
需求分析是产品设计的核心环节,它要求设计师深入探究用户的需求、痛点和期望,从而确保产品能够满足用户的实际需求。对于B端用户而言,需求分析的重要性更为突出。这是因为B端产品往往需要解决企业运营中的具体问题,其设计必须紧密围绕用户的需求展开,以确保产品的实用性和高效性。
在需求分析的过程中,我们需要关注以下几个方面:
深入探究B端产品设计的核心
 
 
首先,
功能性需求
是B端用户最为关注的一点。他们需要产品具备强大的数据处理能力、灵活的业务流程管理功能以及全面的安全防护措施。这些功能性的需求是确保B端产品能够满足企业日常运营需要的基础。
其次,
易用性需求
同样不容忽视。尽管B端产品往往面向具备一定专业素养的用户,但简洁直观的界面设计、流畅的操作体验以及可定制的用户界面仍然是提升用户满意度的关键。通过优化用户交互流程、减少冗余信息,我们可以帮助用户更高效地完成工作任务。
此外,
整合与扩展性需求
也是B端用户关注的重点。企业需要产品能够与其他系统无缝对接,实现数据共享和业务协同。同时,随着企业业务的发展,产品还需要具备良好的扩展性,以支持新功能的快速添加和部署。
最后,
服务与支持需求
同样重要。B端用户期望获得专业的客户支持、完善的培训机制以及丰富的资源文档,以确保产品的稳定运行和持续优化。
深入探究B端产品设计的核心
 
 
综上所述,深入理解B端用户的独特需求是打造成功B端产品的关键。通过全面的需求分析,我们可以确保产品不仅满足用户的基本功能需求,更在易用性、整合扩展性和服务支持等方面提供卓越的体验。这将有助于提升企业的运营效率,进而推动其在激烈的市场竞争中脱颖而出。
 
二、B端用户的独特需求
B端用户,即企业级用户,他们的需求与C端个人用户有着显著的差异。
这些差异主要体现在以下几个方面:
深入探究B端产品设计的核心
 
 
业务强驱动性:
B端产品的主要需求来源于业务方,由业务驱动并主导。
这是因为B端产品主要是为了解决组织内某个或某一类具体业务领域的问题。业务方通常离业务最近,也最了解使用用户的需求,因此他们在产品需求上拥有较大的话语权。
用户群体差异大:
不同于C端用户需求的大同小异,B端用户群体的需求差异巨大。
这些差异主要体现在角色差异、组织差异、管理层级差异、用户深度差异、客户规模差异、客户行业差异以及客户性质差异等。这种多样性要求B端产品在设计时需要考虑更多的变量和定制化需求。
高效性与便捷性
企业级用户非常重视工作效率和操作流程的简化。
他们希望产品能够提供高效的功能和简洁的操作界面,以减少工作中的繁琐步骤和时间成本。因此,B端产品设计需要注重提升用户的工作效率,提供便捷的操作体验。
安全性与稳定性:
对于企业级用户来说,数据安全和系统稳定是至关重要的。
他们需要一个可靠且安全的平台来处理和存储敏感的业务数据。B端产品必须能够提供强大的安全防护措施和稳定的系统性能,以确保企业业务的正常运行和数据的安全。
定制化与灵活性:
每个企业的业务流程和需求都是独特的,因此B端用户希望产品能够根据自身的实际情况进行定制。
他们需要一个灵活可配置的产品解决方案,以满足企业特定的业务需求和工作流程。
集成性与兼容性:
在企业级应用中,B端产品往往需要与其他系统或软件进行集成,以实现数据的共享和流程的协同。
因此,产品的集成性和兼容性是企业用户非常关注的一个方面。B端产品设计需要考虑到与现有系统的无缝对接和数据交换的便捷性。
深入探究B端产品设计的核心
 
 
综上所述,B端用户的独特需求主要体现在业务的强驱动性、用户群体的大差异性、对高效便捷的追求、对安全稳定的重视、对定制化和灵活性的需求以及对集成性和兼容性的关注等方面。这些需求特点要求B端产品在设计时必须充分考虑企业级用户的实际需求和业务场景,以提供符合用户期望的优质产品解决方案。
 
三、
B端产品设计的核心原则
B端产品设计需要遵循一系列核心原则,以确保产品能够满足企业级用户的独特需求。
深入探究B端产品设计的核心
 
 
3.1 用户中心设计
深入理解目标用户:
在设计B端产品时,必须首先了解目标用户,包括他们的工作流程、需求痛点以及行为习惯。这需要通过深入的用户研究和调查来实现,以便更好地设计适合用户的产品。
符合用户期望:
产品的设计应以用户为中心,确保功能、界面和操作都符合用户的期望和习惯。这有助于提高用户满意度和使用效率。
3.2 简洁直观的界面
简约性:
B端产品的交互界面应该简洁明了,避免过多的复杂功能和视觉元素。这样用户可以更轻松地理解和使用产品。
直观性:
界面设计应直观易懂,减少用户的学习成本。通过明确的导航和标识,帮助用户快速找到所需功能。
3.3 强大的功能支持
满足业务需求:
B端产品需要提供丰富的功能,以满足企业复杂的业务需求。这些功能应涵盖用户在工作流程中的各个环节,确保用户能够顺利完成工作任务。
灵活配置:
产品功能应具备高度的可配置性,以便用户根据自身需求进行灵活调整。这有助于提升产品的适用性和用户体验。
3.4 高度可配置性
定制化体验:
B端产品应允许用户根据自身需求灵活配置产品功能和界面。这包括调整功能模块、设置权限、定制报表等,以满足不同用户的个性化需求。
易于管理:
产品应提供便捷的管理工具,使用户能够轻松地对产品进行配置和管理。这有助于降低用户的操作难度和提升工作效率。
3.5 数据驱动决策
数据分析:
B端产品应具备强大的数据分析功能,帮助用户深入挖掘业务数据中的价值。通过对数据的分析,用户可以更好地了解业务状况、发现问题并制定相应的解决方案。
决策支持:
产品应提供可视化的数据报表和分析工具,为用户提供决策支持。这有助于用户做出更明智的决策,推动企业的发展和创新。
深入探究B端产品设计的核心
 
 
综上所述,B端产品设计的核心原则包括用户中心设计、简洁直观的界面、强大的功能支持、高度可配置性以及数据驱动决策。遵循这些原则有助于设计出符合企业级用户需求的优质B端产品。
 
四、B端产品设计流程
B端产品设计流程是一个系统性、结构化的过程,旨在确保产品能够满足企业级用户的实际需求和业务场景。
深入探究B端产品设计的核心
 
 
4.1 市场调研与用户研究
市场调研:
了解行业趋势、市场规模、主要竞争对手以及潜在的市场机会,为产品定位和设计提供市场层面的输入。
用户研究:
通过深入访谈、问卷调查、用户观察等方式,收集目标用户的需求、痛点、工作流程等信息。这些信息对于理解用户行为和期望至关重要。
4.2 需求调研和分析
需求收集:
从用户、业务方、利益相关者等多渠道收集需求。
需求分析:
对收集到的需求进行深入分析,理解需求的本质和背后的业务逻辑。
需求筛选与排序:
基于业务价值、用户价值、实现成本等因素,对需求进行筛选和优先级排序。
4.3 产品规划与设计
产品规划:
根据市场调研和用户研究结果,制定产品的发展规划和路线图。
功能设计:
明确产品的核心功能和特点,确保产品能够满足用户的实际需求。
信息架构设计:
对产品的内容和功能进行分类和组织,确定产品的核心功能和信息架构,使用户更容易找到和使用相关功能。
4.4 原型设计与UI设计
原型设计:
制作产品原型,展示产品的基本结构和交互流程,帮助团队更好地理解产品设计。
UI设计:
根据产品原型和业务需求,进行用户界面设计,确保界面简洁、美观且易于使用。
4.5 用户测试与反馈
用户测试:
邀请目标用户对产品原型或初步实现的产品进行测试,观察用户的使用行为和反馈。
反馈收集与分析:
收集用户的反馈意见,对反馈进行深入分析,找出产品的问题和改进点。
4.6 产品开发与迭代
产品开发:
基于产品设计文档和原型,进行产品的实际开发工作。
测试与修复:
对开发完成的产品进行详细的测试,确保产品质量和稳定性。针对测试中发现的问题进行及时修复。
产品迭代:
根据用户反馈和市场变化,持续对产品进行迭代和优化,以满足用户不断变化的需求。
4.7 上线与运维
产品上线:
经过充分的测试和验证后,将产品正式上线,供用户使用。
运维与监控:
持续监控产品的运行状况,及时发现并解决潜在的问题。同时,为用户提供必要的技术支持和服务。
深入探究B端产品设计的核心
 
 
整个B端产品设计流程需要跨部门的紧密协作和持续的用户参与。通过不断优化和完善设计流程,可以确保B端产品更加贴近用户需求,提升用户体验和业务效率。
 
五、结论
B端产品设计流程是一个复杂而精细的过程,它涉及到从市场调研、用户研究到产品开发、迭代和运维的多个环节。在这个过程中,始终以用户需求为中心,通过深入的市场和用户研究来确保产品的定位准确性,再通过原型设计、用户测试等环节不断优化产品设计,最终开发出满足用户需求、稳定且高效的B端产品。
通过遵循这一流程,
企业能够更有效地理解目标市场和用户的真实需求,设计出更符合用户使用习惯和业务流程的产品。这不仅可以提升用户的工作效率和满意度,还可以增强企业的市场竞争力,实现商业价值的最大化。
B端产品设计流程是确保产品质量和满足用户需求的关键,它需要多部门的协同合作和持续的用户参与,以打造出优秀的B端产品。
 



作者:张阳光Designer
链接:https://www.zcool.com.cn/article/ZMTYyMTczNg==.html
来源:站酷
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。

蓝蓝设计(www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计B端界面设计桌面端界面设计APP界面设计图标定制用户体验设计交互设计UI咨询高端网站设计平面设计,以及相关的软件开发服务,咨询电话:01063334945。我们建立了一个微信群,每天分享国内外优秀的设计,有兴趣请加入一起学习成长,咨询及进群请加蓝小助微信ben_lanlan。

WechatIMG27.jpg

关键词:UI咨询UI设计服务公司软件界面设计公司、界面设计公司、UI设计公司UI交互设计公司数据可视化设计公司用户体验公司高端网站设计公司银行金融软件UI界面设计能源及监控软件UI界面设计气象行业UI界面设计轨道交通界面设计地理信息系统GIS UI界面设计航天军工软件UI界面设计医疗行业软件UI界面设计教育行业软件UI界面设计企业信息化UI界面设计、软件qt开发软件wpf开发软件vue开发

 

 

奥运会、温网、NBA……顶尖赛事的字体选择,如何带来惊艳视觉?

鹤鹤

导读
: 欧洲杯余温尚在,巴黎奥运会开幕在即,体育赛事总是跨越着时间与地域,将观众们的情绪紧紧相连。
除了精彩纷呈的竞赛本身,各大体育赛事的视觉表达也总能引起热议。徽标设计、赛场新貌、信息文字……它们不仅沉淀着历史基因,还传达着关乎当下的特色表达,而其中字体的选择也是关键要素。
本文聚焦 8 项全球顶尖体育赛事的徽标及官网设计,感受字体如何在其中构建起富有表现力的场域。
 
1|奥林匹克运动会
奥运会的徽标设计总是引人注目,往往融合了前瞻的设计理念及丰富的地域特色,其中图形设计与文字信息的和谐搭配亦至关重要。
奥运会、温网、NBA……顶尖赛事的字体选择,如何带来惊艳视觉?
 
 
奥运会、温网、NBA……顶尖赛事的字体选择,如何带来惊艳视觉?
 
 
即将到来的 2024 巴黎奥运会会徽融合了金牌、奥运圣火与象征国家的玛丽安娜元素,以此致敬女性运动员。
奥运会、温网、NBA……顶尖赛事的字体选择,如何带来惊艳视觉?
 
 
奥运会、温网、NBA……顶尖赛事的字体选择,如何带来惊艳视觉?
 
 
而下方文字则是设计团队特别定制的 Paris2024 Font 可变字体,风格简约,线条动感,蕴含装饰艺术风格。这款字体不仅运用到了印刷物料中,也在巴黎奥运会官网中用以呈现信息。
历届奥运会徽标设计常常采用手写字体或是定制字体以更好地匹配概念核心,但也有不少徽标采用了现成的字库字体。
奥运会、温网、NBA……顶尖赛事的字体选择,如何带来惊艳视觉?
 
 
 
例如 2004 雅典奥运会徽标采用了 Gill Sans,组委会表示这款字体的字母形状与大量的希腊古代石刻铭文有异曲同工之妙。2020 东京奥运会使用了 DIN,其严谨细致的字体基因与祖市松纹图案搭配和谐。
 
2|澳大利亚网球公开赛
Font:Sharp Sans
网球四大满贯赛事之一的澳大利亚网球公开赛(简称澳网),创办至今已有 100 多年的历史,是每年四大满贯中最先举行的一个赛事,亦是最年轻的大满贯。
左:旧徽标         右:新徽标
左:旧徽标 右:新徽标
 
澳网于 2016 年推出了新徽标,使用了 Sharp Type 字体公司旗下的 Sharp Sans(现已加入蒙纳家族)。相比于旧徽标,这款几何风格无衬线体为徽标增添了更多时尚简约的现代气息。
奥运会、温网、NBA……顶尖赛事的字体选择,如何带来惊艳视觉?
 
 
澳网官网也使用了 Sharp Sans,既保证了视觉风格的统一,也通过这款适应度极高的字体实现了良好的信息传达。
 
3|温布尔登网球锦标赛
Font:Gotham
同为网球四大满贯赛事之一的温布尔登网球锦标赛(简称温网),创办于 1877 年,历史悠久、声望丰厚。独特的草地场地也是温网的特色之一,为比赛增添了独特的观赏性和挑战性。
奥运会、温网、NBA……顶尖赛事的字体选择,如何带来惊艳视觉?
 
 
目前的温网徽标自 2011 年起启用,代表草地颜色的绿色部分有两个交叉的球拍和一个网球,外侧紫色环形部分则用 Gotham 字体标注了温网名称。
奥运会、温网、NBA……顶尖赛事的字体选择,如何带来惊艳视觉?
 
 
这款经典的美系无衬线体也应用到了温网的数字呈现中,既权威直率,又蕴含轻盈优雅。
 
4|NBA 美国职业篮球联赛
Font:Knockout
左:旧徽标         右:新徽标
左:旧徽标 右:新徽标
 
NBA 的徽标也经历了多重的焕新,2017 年,维持了长达 48 年的徽标有了小幅度更新,核心部分维持不变,色彩略微调深,字母变得更窄,强化徽标在品牌数字资产中的醒目度。
奥运会、温网、NBA……顶尖赛事的字体选择,如何带来惊艳视觉?
 
 
NBA 官网则是选择了 Hoefler & Co. 旗下的 Knockout 字体。这款字体是对与 19 世纪末美国活版印刷商各种无衬线字体的一种总结诠释,打破了现代主义的传统,传递出更为经典的美式风格基因,与网站整体视觉风格相得益彰。
 
5|英格兰足球超级联赛
Font:蒙纳定制字体 Premier Sans
作为欧洲足球五大联赛之一,也因节奏快、竞争激烈、强队众多而商业表现极为突出的足球联赛,英超联赛在 2016 年启动了品牌升级,适配更多元化的媒介。
奥运会、温网、NBA……顶尖赛事的字体选择,如何带来惊艳视觉?
 
 
 
左:旧徽标         右:新徽标
左:旧徽标 右:新徽标
 
 
蒙纳应 DesignStudio 委托,为英超联赛定制了品牌字体 Premier Sans。品牌升级前,英超联赛一直使用一款全大写的字体;时过境迁,英超需要一款更清新、亲切的字体,适配各种媒介。此外,欧洲职业足球联赛的品牌营销竞争激烈,字体也需要在营销上发挥作用。
奥运会、温网、NBA……顶尖赛事的字体选择,如何带来惊艳视觉?
 
 
最终,Premier Sans 这款字体不仅在大字号下确保了良好的展示,还适应表格这样布局密集的版面,并配备了窄体来显示较长的球员名字,从而适用于多种媒介,从屏幕、球衣号码、再到电视节目、排名表等等。
奥运会、温网、NBA……顶尖赛事的字体选择,如何带来惊艳视觉?
 
 
6|世界摩托车大奖赛
Font:蒙纳定制字体 MotoGP Font
奥运会、温网、NBA……顶尖赛事的字体选择,如何带来惊艳视觉?
 
 
国际摩联(FIM)公路赛车的各项赛事中,世界摩托车大奖赛(MotoGP)最受关注。MotoGP 始创于 1949 年,是历史最久的摩托车大奖赛,每个赛季覆盖四大洲的 16 个国家。
作为顶级的摩托车赛事,MotoGP 集结了全世界最优秀的车手与最先进的摩托车型。2020 年,MotoGP 商业权利持有方 Dorna Sports 决定与 Fontsmith(现已归入蒙纳)合作,设计一款活力、高端、迷人的品牌字体。
奥运会、温网、NBA……顶尖赛事的字体选择,如何带来惊艳视觉?
 
 
该款字体不仅框架清晰,并且融入了赛事元素,如开放的车道形状,因而兼备摩托车工业感的曲线和优美的视觉意味,个性鲜明且富有动感,从而使 MotoGP 的品牌形象和力度都得到提升。
 
奥运会、温网、NBA……顶尖赛事的字体选择,如何带来惊艳视觉?
 
 
目前,这款字体不仅应用于 MotoGP 的各类实体物料,也呈现在各类数字媒介和转播画面中,鲜明一致地传达出赛事风格。
 
7|伦敦马拉松
Font:ITC Avant Garde Gothic + Proxima Nova
奥运会、温网、NBA……顶尖赛事的字体选择,如何带来惊艳视觉?
 
 
伦敦马拉松诞生于 1981 年,于每年 4 月下旬举办。伦马也是世界六大马拉松赛事之一,但不同于其他赛事,伦敦马拉松是一个慈善马拉松,大约三分之二的跑者都是通过慈善捐款的方式获得参赛资格。
伦马的徽标左侧字体颇具优雅的曲线感,而右侧则使用了一款现成的字体:ITC Avant Garde Gothic。
这款字体以 Avant Garde 杂志的 logo 字体为基础而设计,并逐渐由设计师团队经手优化为完整的字体家族;具有强大而现代的外观,是平面设计师用于标题及短文本的理想选择。
奥运会、温网、NBA……顶尖赛事的字体选择,如何带来惊艳视觉?
 
 
伦马的官网标题字体也沿用了 ITC Avant Garde Gothic,正文则选择了易读性更强的的 Proxima Nova,兼具力量感与现代性。
 
8|全英羽毛球公开赛
Font:Neue Haas Grotesk Display + DIN
奥运会、温网、NBA……顶尖赛事的字体选择,如何带来惊艳视觉?
 
 
全英羽毛球公开锦标赛是世界上历史最悠久、最负盛名的羽毛球锦标赛,由 1898 年在英国吉尔福德成功举办的世界上第一场羽毛球公开比赛发展而来。
伦敦创意机构 Monopo London 于 2023 年为全英赛打造了忠于基因却也更为活力的视觉升级。更为平面的图案设计、全新的配色方案等都带来了更温暖、舒适、愉悦的感官体验。
奥运会、温网、NBA……顶尖赛事的字体选择,如何带来惊艳视觉?
 
 
 
在字体应用方面,此次视觉升级也颇有考量。
官网标题字体选用了 Neue Haas Grotesk Display(这款字体正是 Helvetica 的前身),正文字体则是蕴含着德系干净严谨基因的 DIN。两款字体相辅相成,既展现年轻、现代的外观,又清晰鲜明地呈现大篇幅文字信息。
结语
体育赛事往往历史悠久,蕴含着深厚的品牌基因,也随着时代的发展进行视觉升级。字体在其中亦占据重要的视觉核心,不仅奠定了表达基础,也在赛场、网页、宣传广告等多种媒介上完善信息的呈现。
活力、坚韧、愉悦、希望……无论是使用字库字体抑或定制字体,更灵活、更大胆的字体策略,能将品牌声音传达更远,触达更多,设计表达与创意的可能性也正在于此。
 


作者:Monotype蒙纳
链接:https://www.zcool.com.cn/article/ZMTYyODM4NA==.html
来源:站酷
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。
 

蓝蓝设计(www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计B端界面设计桌面端界面设计APP界面设计图标定制用户体验设计交互设计UI咨询高端网站设计平面设计,以及相关的软件开发服务,咨询电话:01063334945。我们建立了一个微信群,每天分享国内外优秀的设计,有兴趣请加入一起学习成长,咨询及进群请加蓝小助微信ben_lanlan。

WechatIMG27.jpg

关键词:UI咨询UI设计服务公司软件界面设计公司、界面设计公司、UI设计公司UI交互设计公司数据可视化设计公司用户体验公司高端网站设计公司银行金融软件UI界面设计能源及监控软件UI界面设计气象行业UI界面设计轨道交通界面设计地理信息系统GIS UI界面设计航天军工软件UI界面设计医疗行业软件UI界面设计教育行业软件UI界面设计企业信息化UI界面设计、软件qt开发软件wpf开发软件vue开发

 

双钻模型全方位解读与实战案例

鹤鹤

目录
一、双钻模型简介
二、双钻模型的阶段
三、双钻模型生活中应用
四、双钻模型总结
 
一、双钻模型简介
双钻模型全方位解读与实战案例
 
 
双钻模型(Double Diamond Model)是由英国设计委员会(British Design Council)于2005年提出的。这一模型是用于描述设计过程的一种框架,它将设计过程分为四个阶段:发现(Discover)、定义(Define)、开发(Develop)和交付(Deliver)。
二、双钻模型的阶段
双钻模型全方位解读与实战案例
 
 
1.  发现(Discover):
a.  目标:收集和研究大量信息,理解问题的全貌。
b.  方法:用户调研、市场分析、观察、访谈、数据收集。
c.  结果:广泛的洞察和灵感,为问题定义阶段提供基础。
2.  定义(Define):
a.  目标:分析和综合发现阶段的信息,明确设计问题和机会。
b.  方法:数据分析、问题陈述、需求定义、设计准则制定。
c.  结果:一个清晰、具体的问题陈述和设计方向。
3.  开发(Develop):
a.  目标:产生和发展解决方案的过程,探索各种可能的设计方案。
b.  方法:头脑风暴、概念设计、原型制作、用户测试、迭代。
c.  结果:多个初步解决方案和原型,为最终选择提供依据。
4.  交付(Deliver):
a.  目标:验证和完善最终方案,准备产品的详细设计和生产。
b.  方法:详细设计、开发、测试、实施、发布。
c.  结果:一个成熟的解决方案,准备推向市场或交付给客户。
1、发现(Discover)
在发现阶段,设计团队的主要任务是广泛收集信息,理解用户需求、市场趋势和问题领域。这一阶段注重探索和发散,旨在获取尽可能多的洞察和灵感,为后续阶段提供丰富的基础。
发现阶段需要做什么:
双钻模型全方位解读与实战案例
 
 
1.  用户调研:
a.  访谈:与潜在用户进行一对一或小组访谈,了解他们的需求、期望、痛点和行为模式。
b.  问卷调查:通过结构化问卷收集大规模用户反馈,获取定量数据。
c.  观察:直接观察用户在自然环境中的行为,记录他们的操作方式和遇到的问题。
d.  用户旅程地图:绘制用户在使用产品或服务过程中的各个接触点,识别关键的用户体验。
2.  市场分析:
a.  竞争分析:研究竞争对手的产品和服务,了解其优势和劣势。
b.  趋势分析:识别行业和市场中的最新趋势和技术发展,预测未来变化。
3.  数据收集:
a.  文献研究:查阅相关的学术研究、行业报告和白皮书,获取背景信息和理论支持。
b.  数据挖掘:分析现有的数据资源,如用户反馈、支持请求、社交媒体评论等。
结果:
发现阶段的产出包括大量的用户洞察、问题陈述、机会识别以及设计灵感。这些信息将被用于定义阶段,以明确设计问题和机会。
案例:设计一款新的健康管理应用
背景:一家科技公司决定开发一款新的健康管理应用,旨在帮助用户更好地管理他们的健康数据和生活方式。
用户调研
双钻模型全方位解读与实战案例
 
 
1.  访谈:
a.  目标用户:20位年龄在25-45岁之间的潜在用户,涵盖不同的健康状况和生活方式。
b.  问题:了解他们目前如何管理健康数据,使用哪些工具,遇到的主要挑战是什么。
2.  问卷调查:
a.  规模:1000名目标用户,问卷内容包括健康管理习惯、对健康应用的期望、常见的使用场景等。
b.  结果:定量数据分析发现,70%的用户希望应用能提供个性化的健康建议,50%的用户认为当前的健康应用缺乏数据整合能力。
3.  观察:
a.  场景:观察用户在健身房、诊所和家中的健康管理行为,记录他们如何记录和分析健康数据。
b.  发现:大多数用户在健身房使用手动记录方式,而在家中则依赖多个设备和应用,导致数据分散和管理复杂。
市场分析
双钻模型全方位解读与实战案例
 
 
1.  竞争分析:
a.  竞品:研究当前市场上的主要健康应用,如MyFitnessPal、Fitbit、Apple Health等。
b.  分析:MyFitnessPal在饮食记录方面表现出色,但缺乏运动数据整合;Fitbit在运动数据追踪上有优势,但个性化建议不足。
2.  趋势分析:
a.  趋势:健康科技领域正朝着个性化和整合化发展,人工智能和机器学习在个性化健康建议中的应用越来越普遍。
b.  技术:可穿戴设备的数据整合和远程健康监测成为新的增长点。
数据收集
双钻模型全方位解读与实战案例
 
 
1.  文献研究:
a.  文献:查阅关于健康管理、行为改变和用户体验设计的相关研究,获取理论支持。
b.  发现:有效的健康管理应用需要兼顾用户动机和行为改变理论,提供即时反馈和鼓励。
2.  数据挖掘:
a.  来源:分析公司现有的用户反馈和支持请求,识别用户常见问题和需求。
b.  结果:用户普遍希望应用能提供更好的数据可视化和综合分析功能。
结果
通过发现阶段的调研和分析,设计团队收集了大量的用户需求和市场信息,明确了以下几个关键问题和机会:
1.  用户需要一个能够整合各种健康数据的平台。
2.  个性化健康建议是用户高度期望的功能。
3.  当前市场上的健康应用存在数据分散和管理复杂的问题。
这些洞察将指导下一阶段的定义和设计工作,确保新开发的健康管理应用能够真正满足用户需求并在市场中具有竞争力。
2、定义(Define)
定义阶段的主要目标是将发现阶段收集的广泛信息进行分析和综合,明确设计问题、用户需求和机会。这一阶段的重点是收敛信息,以确定一个明确的设计方向,为后续的开发阶段提供指导。
定义阶段需要做什么:
 
双钻模型全方位解读与实战案例
 
 
1.  数据分析:
a.  整理和分析发现阶段收集的信息和数据,识别关键趋势和模式。
b.  使用工具如Affinity Diagram(亲和图)、Personas(用户画像)和Customer Journey Maps(用户旅程图)进行信息整理。
2.  问题陈述:
a.  将用户需求和痛点转化为具体的设计问题和挑战。
b.  使用工具如How Might We(HMW)问题框架,将发现的机会转化为设计问题。
3.  需求定义:
a.  明确用户需求和功能需求,确定设计准则和约束条件。
b.  创建需求文档,列出所有必须满足的需求和优先级。
4.  设计方向:
a.  确定设计策略和方向,制定设计目标和成功标准。
b.  使用工具如SWOT分析(Strengths, Weaknesses, Opportunities, Threats),评估设计策略的可行性。
结果:
定义阶段的产出包括清晰的问题陈述、用户需求、设计准则和明确的设计方向。这些成果为开发阶段的概念设计和原型制作提供了基础。
案例:设计一款新的健康管理应用
背景:一家科技公司在发现阶段通过用户调研、市场分析和数据收集,了解到用户需要一个能够整合各种健康数据的平台,并希望该平台能提供个性化的健康建议。现进入定义阶段。
数据分析
双钻模型全方位解读与实战案例
 
 
1.  整理信息:
a.  使用亲和图(Affinity Diagram)整理用户调研中的关键发现,分类和识别主题。
b.  通过用户画像(Personas)总结不同用户群体的特征和需求,如忙碌的专业人士、健身爱好者和慢性病患者。
2.  用户旅程图(Customer Journey Map):
a.  绘制用户旅程图,显示用户在健康管理过程中各个接触点的体验和痛点。
b.  识别关键的接触点,如数据记录、数据分析、个性化建议和行为反馈。
问题陈述
1. How Might We(HMW)问题框架:HMW问题:如何使用户能够轻松整合和管理他们的健康数据?如何为用户提供个性化的健康建议?
a.  这些问题将指导设计团队在开发阶段探索具体的解决方案。
需求定义
双钻模型全方位解读与实战案例
 
 
1.  用户需求:
a.  用户需要一个平台能够整合多种健康数据来源(如可穿戴设备、手动输入、医疗记录等)。
b.  用户希望平台能提供个性化的健康建议,基于他们的健康数据和目标。
2.  功能需求:
a.  数据整合功能:支持多种数据来源的同步和管理。
b.  数据分析功能:提供清晰的健康数据可视化和分析报告。
c.  个性化建议:基于用户数据和目标,提供个性化的健康建议和计划。
3.  设计准则:
a.  界面简洁易用,符合用户的认知习惯。
b.  提供及时的反馈和鼓励,帮助用户保持积极的健康管理行为。
c.  确保数据隐私和安全,建立用户信任。
设计方向
双钻模型全方位解读与实战案例
 
 
1.  设计策略:
a.  采用模块化设计,允许用户根据自己的需求自定义平台功能。
b.  使用机器学习和人工智能技术,实现个性化建议和预测分析。
2.  成功标准:
a.  用户满意度和使用率:通过用户反馈和使用数据评估平台的用户体验。
b.  健康目标达成率:衡量用户在使用平台后的健康改善情况。
c.  数据安全性:确保用户数据的安全和隐私保护。
结果
定义阶段的结果包括:
1.  清晰的问题陈述:如何使用户能够轻松整合和管理他们的健康数据?如何为用户提供个性化的健康建议?
2.  用户需求和功能需求文档,列出整合数据、数据分析和个性化建议等关键功能。
3.  设计准则和策略,确保界面简洁易用,提供及时反馈,并保障数据隐私和安全。
4.  明确的设计方向和成功标准,为开发阶段的概念设计和原型制作提供指导。
通过定义阶段的工作,设计团队可以将广泛的信息和洞察转化为具体的设计要求和策略,为后续的开发和交付阶段奠定坚实的基础。
3、开发(Develop)
在开发阶段,设计团队的主要任务是产生和发展解决方案,探索各种可能的设计方案并进行验证和迭代。这一阶段的重点是创造性和实验性,旨在将定义阶段明确的问题转化为可行的设计解决方案。
开发阶段需要做什么:
 
双钻模型全方位解读与实战案例
 
 
1.  头脑风暴:
a.  目标:产生大量创意和概念。
b.  方法:团队成员自由发言,记录所有想法,不进行评判和筛选。
2.  概念设计:
a.  目标:将头脑风暴产生的创意转化为具体的设计方案。
b.  方法:绘制草图、创建故事板、编写用例场景。
3.  原型制作:
a.  目标:创建初步的设计原型,以便进行测试和验证。
b.  方法:使用低保真和高保真原型工具,如纸质原型、Axure、Sketch、Figma等。
4.  用户测试:
a.  目标:通过用户测试验证设计方案,收集用户反馈并进行迭代。
b.  方法:可用性测试、A/B测试、用户访谈等。
5.  迭代改进:
a.  目标:根据用户测试反馈不断改进设计方案。
b.  方法:调整和优化原型,进行多轮测试和验证。
结果:
开发阶段的产出包括多个初步解决方案和原型,经过反复的测试和迭代,最终确定一个成熟的设计方案,为交付阶段的详细设计和实现提供基础。
案例:设计一款新的健康管理应用
背景:一家科技公司在定义阶段明确了用户需求和设计方向,现在进入开发阶段,目标是探索和验证各种设计方案,以创建一个能够整合健康数据并提供个性化建议的健康管理应用。
头脑风暴
双钻模型全方位解读与实战案例
 
 
1.  创意产生:团队成员通过头脑风暴会议,提出了多种创意,例如:用户仪表板:提供整合所有健康数据的仪表板。
i.  个性化建议模块:基于用户数据和目标提供个性化的健康建议。
ii.  社交功能:允许用户与朋友和家人分享健康进展。
概念设计
双钻模型全方位解读与实战案例
 
 
1.  草图绘制:
a.  团队成员绘制了各个功能模块的草图,包括用户仪表板、数据输入界面、建议页面等。
2.  故事板:
a.  创建了用户使用应用的故事板,展示用户从登录到获取健康建议的完整流程。
3.  用例场景:
a.  编写了多个用例场景,如用户如何记录饮食、查看每日步数、接收健康建议等。
原型制作
双钻模型全方位解读与实战案例
 
 
1.  低保真原型:
a.  使用纸质原型和Sketch创建了低保真原型,展示基本界面布局和交互流程。
2.  高保真设计稿:
a.  使用Figma创建了高保真设计稿,展示详细的界面设计和交互细节。
用户测试
双钻模型全方位解读与实战案例
 
 
1.  可用性测试:
a.  招募10位目标用户进行可用性测试,观察他们使用原型的过程,记录他们的操作和反馈。
b.  发现:部分用户在数据输入界面遇到困难,需要简化输入流程。
2.  A/B测试
a.  创建了两个不同版本的个性化建议页面,进行A/B测试,比较用户对不同设计的偏好。
b.  结果:用户更喜欢简洁的建议页面,提供明确的行动步骤。
3.  用户访谈:
a.  进行深度用户访谈,了解用户对原型的整体体验和改进建议。
b.  反馈:用户希望增加数据导入功能,能够从其他健康应用和设备同步数据。
迭代改进
双钻模型全方位解读与实战案例
 
 
1.  调整和优化原型:
a.  根据用户测试和访谈反馈,优化数据输入界面,简化操作流程。
b.  增加数据导入功能,允许用户从其他应用和设备同步数据。
2.  多轮测试和验证:
a.  进行第二轮和第三轮可用性测试,验证改进后的原型是否满足用户需求。
b.  结果:用户体验显著提升,满意度提高,操作更加顺畅。
结果
开发阶段的结果包括:
1.  详细的概念设计和用例场景,展示用户使用应用的完整流程。
2.  低保真和高保真原型,展示各个功能模块的界面设计和交互细节。
3.  多轮用户测试和迭代改进,确保设计方案能够满足用户需求和期望。
4.  一个成熟的设计方案,为交付阶段的详细设计和实现提供基础。
通过开发阶段的工作,设计团队能够验证和优化设计方案,确保最终的健康管理应用既符合用户需求,又具有良好的用户体验。
4、交付(Deliver)
在交付阶段,设计团队的任务是验证和完善最终方案,进行详细设计、开发和测试,并将产品推向市场或交付给客户。这一阶段的重点是实现设计方案,确保其可用性和可行性,最终满足用户需求。
交付阶段需要做什么:
 
双钻模型全方位解读与实战案例
 
 
1.  详细设计:
a.  目标:将高保真原型转化为详细的设计规范,包括界面设计、交互细节和视觉元素。
b.  方法:创建设计规范文档,使用工具如Sketch、Figma等。
2.  开发和实现:
a.  目标:将设计方案转化为实际的产品,进行前端和后端开发。
b.  方法:使用编程语言和框架,如HTML/CSS、JavaScript、React、Node.js等,进行代码开发和实现。
3.  测试和验证:
a.  目标:通过多轮测试确保产品的功能和用户体验,修复BUG并进行性能优化。
b.  方法:单元测试、集成测试、用户验收测试(UAT)、A/B测试等。
4.  发布和部署:
a.  目标:将产品发布到市场,进行部署和上线,确保产品能够正常运行并满足用户需求。
b.  方法:选择合适的发布平台(如App Store、Google Play),进行发布和推广。
5.  用户反馈和改进:
a.  目标:收集用户反馈,进行产品的持续改进和优化。
b.  方法:用户调查、使用数据分析、版本更新等。
结果:
交付阶段的产出包括详细的设计规范、实现的产品、测试报告、上线的产品以及用户反馈和改进计划。
案例:设计一款新的健康管理应用
背景:一家科技公司在开发阶段确定了健康管理应用的成熟设计方案,现在进入交付阶段,目标是实现设计方案并将应用推向市场。
设计详情
双钻模型全方位解读与实战案例
 
 
1.  设计规范文档:
a.  创建详细的设计规范文档,包括界面布局、色彩方案、字体选择、图标和交互细节。
b.  确保所有设计元素的一致性,提供开发团队参考。
2.  设计工具:
a.  使用Figma制作高保真的界面设计和交互细节。
b.  制作设计交互原型,确保开发团队清晰了解设计意图。
开发和实现
双钻模型全方位解读与实战案例
 
 
1.  前端开发:
a.  使用React框架进行前端开发,创建用户界面和交互逻辑。
b.  编写CSS和JavaScript代码,实现设计规范中的视觉和交互效果。
2.  后端开发:
a.  使用Node.js和Express进行后端开发,构建服务器和数据库。
b.  实现数据同步和存储功能,确保用户数据的安全和可靠。
3.  集成开发:
a.  前端和后端开发团队紧密合作,进行接口集成和功能实现。
b.  确保前后端数据通信的准确性和实时性。
测试和验证
双钻模型全方位解读与实战案例
 
 
1.  单元测试:
a.  对各个功能模块进行单元测试,确保每个功能正常运行。
b.  使用Jest或Mocha等测试框架编写和运行测试用例。
2.  集成测试:
a.  对系统整体进行集成测试,确保各个模块之间的协同工作。
b.  发现并修复集成过程中出现的BUG和问题。
3.  用户验收测试(UAT):
a.  邀请目标用户进行用户验收测试,收集用户的使用反馈。
b.  根据用户反馈进行最后的调整和优化。
4.  性能优化:
a.  进行性能测试和优化,确保应用在各种设备上的运行速度和稳定性。
b.  使用工具如Lighthouse、WebPageTest进行性能分析和优化。
发布和部署
双钻模型全方位解读与实战案例
 
 
1.  发布平台选择:
a.  选择合适的发布平台,如App Store和Google Play。
b.  准备发布所需的材料,如应用描述、截图、宣传视频等。
2.  发布和推广:
a.  将应用发布到各大平台,进行推广和宣传。
b.  通过社交媒体、广告、合作等方式吸引用户下载和使用。
3.  监控和维护:
a.  监控应用的运行情况,确保服务器和服务的稳定性。
b.  提供用户支持和问题解决,及时发布更新和修复补丁。
用户反馈和改进
双钻模型全方位解读与实战案例
 
 
1.  用户调查:
a.  通过问卷调查、用户访谈等方式收集用户反馈。
b.  了解用户的使用体验、满意度和改进建议。
2.  使用数据分析:
a.  分析用户行为数据,了解用户的使用习惯和需求变化。
b.  使用工具如Google Analytics、Mixpanel进行数据分析。
3.  版本更新:
a.  根据用户反馈和数据分析,进行持续的改进和优化。
b.  定期发布版本更新,添加新功能、修复BUG和优化性能。
结果
交付阶段的结果包括:
1.  详细的设计规范:确保设计的一致性和可实现性。
2.  实现的产品:健康管理应用的完整实现,包括前端和后端功能。
3.  测试报告:详细记录测试过程、发现的问题和解决方案。
4.  上线的产品:应用在App Store和Google Play成功上线,用户可以下载和使用。
5.  用户反馈和改进计划:收集用户反馈,进行持续的改进和优化,确保产品的长期成功。
通过交付阶段的工作,设计团队能够将健康管理应用成功推向市场,满足用户需求,并通过持续的改进和优化,保持产品的竞争力和用户满意度。
三、双钻模型生活的应用
双钻模型除了可以用在设计项目中,也可以延展到生活中例如:计划一次大型家庭聚会
发现阶段(Discover)
双钻模型全方位解读与实战案例
 
 
目标:了解所有家庭成员的需求和期望,收集相关信息和灵感。
1.  家庭成员访谈:
a.  进行一对一或小组访谈,了解家庭成员的期望、喜好和特殊需求。
b.  问题示例:你希望在聚会上看到哪些活动?你对聚会地点有什么建议?有没有特别的饮食要求?
2.  历史数据回顾:
a.  回顾以往家庭聚会的反馈,总结成功之处和需要改进的地方。
b.  发现:之前的聚会中,户外活动受到大家的欢迎,而餐饮服务需要改进。
3.  灵感收集:
a.  搜索网上的聚会策划案例和灵感,获取创意和新颖的活动点子。
b.  结果:找到一些有趣的游戏和活动,如家庭问答、烧烤聚餐、DIY工坊等。
结果:
获取大量的家庭成员需求、期望和灵感,为后续阶段提供基础。
定义阶段(Define)
双钻模型全方位解读与实战案例
 
 
目标:分析和综合发现阶段的信息,明确聚会的具体需求和目标。
1.  数据分析:
a.  整理和分析收集到的信息,识别关键需求和共性。
b.  发现:大多数家庭成员希望有一个户外的聚会场所,有丰富的活动安排,并且有素食和非素食选项。
2.  问题陈述:
a.  将家庭成员的需求转化为具体的问题陈述。
b.  示例:如何找到一个适合户外活动的聚会地点?如何确保所有家庭成员的饮食需求得到满足?如何安排丰富多彩的活动?
3.  需求定义:
a.  明确聚会的具体需求和设计准则。
b.  示例:需要一个户外场地,有足够的空间供50人活动。餐饮需要提供素食和非素食选项。活动安排包括烧烤、游戏和DIY工坊。
结果:
一个清晰、具体的问题陈述和聚会规划方向。
开发阶段(Develop)
双钻模型全方位解读与实战案例
 
 
目标:产生和发展聚会方案,探索各种可能的安排并进行验证和迭代。
1.  头脑风暴:
a.  与家人或朋友一起进行头脑风暴,提出各种创意和方案。
b.  创意示例:不同的聚会场地选择、各种活动安排、不同的餐饮方案等。
2.  概念设计:
a.  将头脑风暴产生的创意转化为具体的聚会方案。
b.  示例:选择了一个乡村农场作为聚会场地,活动安排包括烧烤、家庭问答、户外运动和DIY工坊。
3.  原型制作:
a.  创建聚会的初步计划和日程安排。
b.  示例:制定详细的时间表,包括活动开始和结束的时间、餐饮安排等。
4.  用户测试:
a.  与核心家庭成员讨论初步计划,收集反馈并进行调整。
b.  结果:大家对农场场地表示满意,但建议增加一些儿童友好活动。
5.  迭代改进:
a.  根据反馈进行调整和优化,形成最终的聚会方案。
b.  示例:增加了儿童区和适合孩子的游戏活动。
结果:
一个成熟的聚会方案,准备进行最终实施。
交付阶段(Deliver)
双钻模型全方位解读与实战案例
 
 
目标:验证和完善最终方案,进行详细的准备和执行,确保聚会顺利进行。
1.  详细设计:
a.  制定详细的聚会安排和任务分配。
b.  示例:确定活动负责人,安排场地布置、餐饮准备、活动执行等具体任务。
2.  准备和执行:
a.  进行所有必要的准备工作,如预订场地、采购物品、联系餐饮服务等。
b.  示例:预订农场场地,采购烧烤食材和活动所需物品,联系餐饮供应商。
3.  测试和验证:
a.  在聚会前进行一次预演或检查,确保所有准备工作就绪。
b.  示例:核对活动安排,确保所有物品和设备齐全,检查场地布置。
4.  聚会当天执行:
a.  按照计划进行聚会活动,确保各项安排顺利进行。
b.  示例:按照时间表进行活动,引导家庭成员参与,确保餐饮服务及时到位。
5.  用户反馈和改进:
a.  在聚会结束后收集家庭成员的反馈,总结经验和改进建议。
b.  示例:通过问卷或访谈了解大家的满意度,记录成功之处和需要改进的地方。
结果:
一次成功的家庭聚会,家庭成员都享受了愉快的时光,并收集到宝贵的反馈,为未来的聚会提供参考。
四、双钻模型总结
双钻模型优势
 
双钻模型全方位解读与实战案例
 
 
1.  结构化的流程:
a.  双钻模型通过明确的四个阶段(发现、定义、开发、交付)提供了一个结构化的流程,使设计过程更加有序和系统化。
2.  鼓励广泛探索和聚焦解决方案:
a.  通过“发散-收敛-发散-收敛”的过程,双钻模型鼓励设计团队在初始阶段广泛探索所有可能性,然后逐步聚焦和精炼解决方案,确保最终方案的高质量。
3.  用户中心设计:
a.  模型强调用户需求和问题的发现与定义,确保设计过程始终以用户为中心,最终交付满足用户需求的解决方案。
4.  迭代和改进:
a.  在开发阶段,双钻模型提倡多次迭代,通过不断的测试和用户反馈,持续改进设计方案,提高最终产品的质量和用户体验。
5.  跨团队协作:
a.  通过明确的阶段和目标,双钻模型促进跨职能团队的协作,使不同专业的团队成员能够在设计过程中的各个阶段共同工作,提高项目的整体效率。
双钻模型的不足
双钻模型全方位解读与实战案例
 
 
1.  时间和资源消耗较大:
a.  双钻模型的四个阶段需要投入大量的时间和资源,特别是在发现和开发阶段,广泛的探索和反复的迭代可能会延长项目周期。
2.  复杂性管理:
a.  对于较小规模或简单的项目,双钻模型的复杂性可能显得过于繁琐,不适合资源有限或时间紧迫的情况。
3.  不确定性管理:
a.  在发现阶段的广泛探索和开发阶段的多次迭代中,可能会遇到较高的不确定性和风险,需要有效的管理策略来控制项目进度和预算。
4.  团队协调难度:
a.  由于涉及多个阶段和跨职能团队的协作,团队之间的沟通和协调可能会面临挑战,特别是在项目规模较大或团队分散的情况下。
5.  依赖用户反馈:
a.  双钻模型强调用户反馈和测试,但在某些情况下,获取真实和有效的用户反馈可能会有难度,影响设计方案的迭代和改进。
结论
双钻模型作为一种结构化的设计方法论,具有显著的优势,包括提供结构化流程、鼓励广泛探索和聚焦解决方案、强调用户中心设计、支持迭代和改进以及促进跨团队协作。然而,其不足也不容忽视,如时间和资源消耗较大、复杂性管理挑战、不确定性管理需求高、团队协调难度以及对用户反馈的依赖。根据项目的规模、复杂性和资源情况,设计团队需要权衡双钻模型的优势和不足,灵活应用,以实现最佳的设计效果。
参考文献:
https://medium.com/nyc-design/the-double-diamond-model-what-is-it-and-should-you-use-it-4ad28c522d28
https://medium.com/@james_raper/not-yet-another-double-diamond-model-874dcfda839e
https://cubyts.medium.com/adopting-the-double-diamond-design-process-a-complete-guide-cd8ae1c52199
https://www.cubyts.com/resources/blogs/double-diamond-design-process
https://www.uxmatters.com/mt/archives/2023/01/applying-the-double-diamond-model.php
https://www.uxmatters.com/mt/archives/2020/07/how-nondesigners-contribute-to-designing-the-right-things.php
https://medium.com/digital-experience-design/how-to-apply-a-design-thinking-hcd-ux-or-any-creative-process-from-scratch-b8786efbf812
https://bootcamp.uxdesign.cc/design-process-step-by-step-double-diamond-model-explained-e8da543848cc
 


作者:CANAAN8
链接:https://www.zcool.com.cn/article/ZMTYyOTM4OA==.html
来源:站酷
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。
 

蓝蓝设计(www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计B端界面设计桌面端界面设计APP界面设计图标定制用户体验设计交互设计UI咨询高端网站设计平面设计,以及相关的软件开发服务,咨询电话:01063334945。我们建立了一个微信群,每天分享国内外优秀的设计,有兴趣请加入一起学习成长,咨询及进群请加蓝小助微信ben_lanlan。

WechatIMG27.jpg

关键词:UI咨询UI设计服务公司软件界面设计公司、界面设计公司、UI设计公司UI交互设计公司数据可视化设计公司用户体验公司高端网站设计公司银行金融软件UI界面设计能源及监控软件UI界面设计气象行业UI界面设计轨道交通界面设计地理信息系统GIS UI界面设计航天军工软件UI界面设计医疗行业软件UI界面设计教育行业软件UI界面设计企业信息化UI界面设计、软件qt开发软件wpf开发软件vue开发

 

学会讲故事:体验设计方案的演示技巧

鹤鹤

学会讲故事:体验设计方案的演示技巧
 
 
在我刚刚成为一名体验设计师的时候,我发现自己处在一个迥异的战场之中——会议室坐满者领导们,一个个面露怀疑之色。我拿着最新设计的界面方案,投放在墙上,我站在这些恐怖的观众面前,手里的任务沉重的压的我喘不过气来。
我的任务不仅仅是演示一个设计方案,我在销售一个概念、需要说服一群人,解决一个复杂的问题。我渐渐意识到,这一过程和驾驭不可预知的情况如出一辙。需要我拥有战略思维、做事的耐心和面对未知的意愿。
阿尔伯特·爱因斯坦
阿尔伯特·爱因斯坦
 
历史是一幅多姿多彩的画卷,交织着无数杰出人物的故事 —— 他们通过战略思维和耐心,成功应对复杂的局面。在众多杰出人物当中,阿尔伯特·爱因斯坦是最闪耀的。爱因斯坦曾说过,“我们不能用制造问题的思维来解决问题”,这一句话也就呼应了战略思维的本质。他提出开创性的相对论理论,这可不是简单的从事实当中衍生出来的的粗略陈述。而是来自于耐心和战略思维深度,以一种让其他人能够理解宇宙的方式阐明相对论概念。
用户体验设计是理解用户和界面设计之间的复杂过程——界面不仅要满足用户的需求,同时也要符合设计目标。
这是一个充满同理心、沟通和解决问题的过程。但是,要达到这一点,设计出一个满足用户需求,并且呈现解决方案的设计,是需要战略思维的。作为一名用户体验设计师,我们必须超越眼前,沉浸在用户视角当中、分析他们的需求,并考虑这些需求如何和设计目标结合。这个艰苦的过程需要耐心,就像完成复杂的拼图游戏一样。
 
为了进一步理解这点,让我们来做个练习
学会讲故事:体验设计方案的演示技巧
 
 
想象一下,你拿到一块 1000 片的拼图,万花筒般的形状和颜色。你会一头扎进混乱中,随机摆放拼图碎片?还是会先定策略?你会先把类似的拼图碎片分组?也许从拼图的边缘或角落开始,然后逐渐往中心拼图?很有可能,你会选择战略方法。耐心和战略决策过程反映我们处理用户体验设计和生活中复杂问题的方式。我们一起来解剖问题,了解其中的复杂性,并制定战略计划,从而完成拼图(解决问题)。
胆小的人成为不了一名体验设计师。我们不仅需要持续不断的创造和展示作品,这需要我们证明方案的思考过程,需要面对评审,修改设计,并重新演示。反反复复,这个迭代过程是对耐心的考验,是一次严峻的考验,让设计师变得更加优秀,更加卓越。
同样,生活也常常给我们带来看上去高不可攀的挑战——一场个人危机,一次职场挫折,甚至全球疫情。克服这些困难的关键在于我们拥有战略性思考能力和解决问题耐心。
在用户体验设计师的世界里,作品演示不仅体现我们专业实力。是将用户需求、商业目标和设计解决方案所构建的故事。
掌握讲故事的艺术能够助力方案的演示。我们绘制一幅蓝图——将观众带入一个以用户为视角的世界,与他们共情,理解他们所遇到的挑战,自信满满地展示我们的设计方案,阐述我们的设计方案如何克服这些挑战。
这和我们的生活如出一辙,我们经常表达我们的经历和意图,通过讲述故事,解决复杂的人际关系和职业问题。
不是你眼睛的问题,文本真的很模糊!!!
不是你眼睛的问题,文本真的很模糊!!!
 
作为一名体验设计师,伴随着充斥着这些“冲突”时刻:怀疑的时刻、修改的时刻、重新思考的时刻、演示的时刻、捍卫设计方案的时刻等等。但是,这些时刻恰恰都是让我们通往行业专家的敲门砖和垫脚石。
我们要拥抱这些时刻,享受这些过程,因为这些过程正在塑造我们,让我们接下来的设计、演示、要解决的问题做好准备。其实,在生活中亦是如此,每一次,我们遇到的问题和挑战都是塑造我们,让我们对未来做好准备。培养我们的坚韧不拔的精神,教会我们看待自己和周遭事务的宝贵经验。
无论是作为一名用户体验设计师不断提升演示技巧,还是在生活上提升解决复杂问题的能力,我们应该始终牢记 2 条指导原则:坚持和战略规划。
这两个支柱(原则)将指引我们穿越最有挑战的地形,帮助我们克服最艰巨的障碍,并领我们走向成功。
成为照亮我们道路的明灯,指引我们朝我们目标方向的指南针。
罗伯特·舒勒
罗伯特·舒勒
 
罗伯特·舒勒(Robert H. Schuller) 曾说过“ 问题不是停止的信号牌,而是指导方针”。这是指引我整个职业和生活的箴言,这句话蕴含深奥的智慧成为我人生的指路灯塔,帮助我应对生活中的挑战,帮助我真正成为一名体验设计师,在演示复杂性中不断前行。
每当我们解决一个问题,每提出的一个设计想法,每克服一个挑战,都能让我们更接近最终目标。坚持不懈、战略规划、耐心、学习经验的意愿,都是指引我们通向成功的指南针,无论是用户体验设计还是在生活。
心之所向无往不前,积极面对,一步一个脚印不断前行。这条道路上充满挑战,铭记一句话,这些不是停止的信号牌,而是指引我们通向终点的指南针。
所以,保持前行,不断学习,不断成长。你的旅程是属于你自己的,是你一生之中最美丽的故事。
 


作者:三分设
链接:https://www.zcool.com.cn/article/ZMTYzMDk0MA==.html
来源:站酷
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。

蓝蓝设计(www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计B端界面设计桌面端界面设计APP界面设计图标定制用户体验设计交互设计UI咨询高端网站设计平面设计,以及相关的软件开发服务,咨询电话:01063334945。我们建立了一个微信群,每天分享国内外优秀的设计,有兴趣请加入一起学习成长,咨询及进群请加蓝小助微信ben_lanlan。

WechatIMG27.jpg

关键词:UI咨询UI设计服务公司软件界面设计公司、界面设计公司、UI设计公司UI交互设计公司数据可视化设计公司用户体验公司高端网站设计公司银行金融软件UI界面设计能源及监控软件UI界面设计气象行业UI界面设计轨道交通界面设计地理信息系统GIS UI界面设计航天军工软件UI界面设计医疗行业软件UI界面设计教育行业软件UI界面设计企业信息化UI界面设计、软件qt开发软件wpf开发软件vue开发

 

 

清晰展现关键信息,助力高效决策——数据图表

鹤鹤

合理使用数据图表可以帮助用户更好地理解复杂的数据,提高用户体验和数据的可读性。选择合适的图表类型并遵循最佳设计实践是确保图表有效传达信息的关键。
数据图表是一种非常重要的可视化工具,它能够
帮助用户更直观地理解和分析数据。
借助于图形化的手段,清晰、快捷有效的传达与沟通信息。从用户的角度,数据可视化可以让用户快速抓住要点信息,让关键的数据点从人类的眼睛快速通往心灵深处。数据可视化一般会具备以下几个特点:准确性、创新性、简洁性。
清晰展现关键信息,助力高效决策——数据图表
 
 
清晰展现关键信息,助力高效决策——数据图表
 
 
清晰展现关键信息,助力高效决策——数据图表
 
 
清晰展现关键信息,助力高效决策——数据图表
 
 
清晰展现关键信息,助力高效决策——数据图表
 
 
清晰展现关键信息,助力高效决策——数据图表
 
 
清晰展现关键信息,助力高效决策——数据图表
 
 
清晰展现关键信息,助力高效决策——数据图表
 
 
清晰展现关键信息,助力高效决策——数据图表
 
 
清晰展现关键信息,助力高效决策——数据图表
 
 
清晰展现关键信息,助力高效决策——数据图表
 
 
清晰展现关键信息,助力高效决策——数据图表
 
 
清晰展现关键信息,助力高效决策——数据图表
 
 
清晰展现关键信息,助力高效决策——数据图表
 
 
清晰展现关键信息,助力高效决策——数据图表
 
 
 


作者:Miao_C
链接:https://www.zcool.com.cn/article/ZMTYzMjk4NA==.html
来源:站酷
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。

蓝蓝设计(www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计B端界面设计桌面端界面设计APP界面设计图标定制用户体验设计交互设计UI咨询高端网站设计平面设计,以及相关的软件开发服务,咨询电话:01063334945。我们建立了一个微信群,每天分享国内外优秀的设计,有兴趣请加入一起学习成长,咨询及进群请加蓝小助微信ben_lanlan。

WechatIMG27.jpg

关键词:UI咨询UI设计服务公司软件界面设计公司、界面设计公司、UI设计公司UI交互设计公司数据可视化设计公司用户体验公司高端网站设计公司银行金融软件UI界面设计能源及监控软件UI界面设计气象行业UI界面设计轨道交通界面设计地理信息系统GIS UI界面设计航天军工软件UI界面设计医疗行业软件UI界面设计教育行业软件UI界面设计企业信息化UI界面设计、软件qt开发软件wpf开发软件vue开发

 

 

当设计遇上AI—百度APP个人中心AI重构

鹤鹤

前言
 
AI能力的迅猛发展,为产品设计带来了很多新的可能性和机会。百度作为AI领域的行业先锋,正在不断探索如何将AI技术深度融入到产品中,以赋能改进和提升产品的使用体验。
 
本文将以百度APP个人中心AI重构项目为例,讲述如何运用AI智能推荐和对话能力来解决问题重构体验,将一个传统的固定入口型的个人中心打造成为一个高效智能的AI版个人中心。
 
希望能为读者提供新的视角和思路,激发大家对于AI原生设计的理解和思考。
 
 
个人中心旧版
 
作为百度APP端内业务和基础功能设置的重要回访阵地,个人中心面临着三大核心问题:①功能入口多页面屏效低;②部分功能操作层级深;③资产更新提醒不直观。
 
针对这些问题,我们希望通过精简功能结构、破壳高频功能、强化信息提示,提升用户触达效率,优化整体使用体验。为此,我们计划运用AI能力进行设计重构来解决上述三大问题。
 
当设计遇上AI—百度APP个人中心AI重构
 
 
 
 
个人中心AI重构设计
 
目前行业内并没有一款运用AI能力对个人中心进行重构的产品,因此,设计师的挑战在于如何从0-1创新重构出“AI个人中心”新形态,来全面提升用户在端内的回访体验。我们依次从「框架、结构、内容、操作、对话」五部分出发定义,逐步搭建功能、丰满细节、拓展深度,创新重构出一个全新的AI版个人中心。
 
1.容器创新设计 打造AI感资产框架
 
基于上述问题和设计目标,首先对个人中心框架进行了重构设计,结合用户行为数据保留常用高频功能入口,去除原来众多类型的内容推荐卡,在页面内实现功能精简提效;其次结合AI智能推荐的能力,开辟出一个承载推荐内容的容器区域,破壳内容便于用户回访。
 
我们共计验证推敲出3种页面框架“嵌入式框架”“分层式框架”“卡片式框架”,选择与AI融合感更强、体验更沉浸的嵌入式框架继续深入,框架头部精简信息,中部保留高频功能便于用户回访,下方区域则通过AI智能推送用户所需内容。
 
当设计遇上AI—百度APP个人中心AI重构
 
 
 
2.结合用户行为 主动智能推荐
 
在框架下方承载推荐内容的容器区域内,个人中心可以结合用户在百度APP的使用行为数据,通过AI向用户智能推荐内容资源和功能操作。
 
当用户的内容资产有变更时,个人中心能够主动破壳内容,如用户最近下载了一部剧集但未看完,当该剧有更新时,主动提示用户继续观看。
 
当设计遇上AI—百度APP个人中心AI重构
 
 
 
当用户有设置类潜在需求时,个人中心能够推荐操作功能,如用户的手机经过一段时间使用,有系统垃圾冗余时,会主动推荐用户清理缓存。
 
当设计遇上AI—百度APP个人中心AI重构
 
 
 
3.构建全业务卡片的内容结构
 
我们将各业务需要展示的信息摘取出来,采用卡片形态进行聚合与承接,以保证AI智能推荐时的灵活性和可拓展性。卡片会采用对话式引导语拉近用户距离,破壳提示内容资源,如向用户主动推荐最近收藏的内容,支持跳转查看并在返回时更新状态;还会在资产变更时进行提醒,如当用户下载视频或备份文件后,对用户实时提醒并提供复访入口;支持用户直接设置功能,支持一键点击并实时反馈状态。
 
当设计遇上AI—百度APP个人中心AI重构
 
 
 
设计期间,我们从卡片分类方式、模板呈现、交互操作等维度进行了多方案探索,前后迭代实验了3款卡片形态,结合用户访谈测试和实验数据反馈,最终选择使用3.0版本的分卡聚合样式。这一版本采用了统一化模版来精简布局,通过一步操作来前置功能减步长,对功能和内容进行分类聚合来提高页面屏效、使用户更易理解。
 
当设计遇上AI—百度APP个人中心AI重构
 
 
 
共计为20+业务搭建了10类聚合卡片,定义归纳了3类卡片操作与更新方式,在个人中心选用最符合用户行为的卡片和内容进行智能推荐。目前我们更多业务正在接入推荐卡片体系中,大家敬请期待~
 
当设计遇上AI—百度APP个人中心AI重构
 
 
 
4.内容破壳提示 功能操作提效
 
回归用户实际使用场景来看,AI智能推荐卡片形式在用户操作上有了很大的提效。例如查看下载视频的步长由4步缩减为1步,原来用户想继续看视频时,可能会找不到、且寻找入口比较深,现在我们通过推荐卡片破壳了视频等内容,点击卡片即可一键直达视频页,一段时间后返回个人中心时卡片会更新用户的最新观看进度。既减少了用户操作步长,又沉浸式延续了用户在端内的使用行为。
 
当设计遇上AI—百度APP个人中心AI重构
 
 
 
同样,功能类的操作效率也大幅提升,之前当用户想清理时 ,入口深步骤多、体验非最佳,现在通过推荐卡片将清理缓存功能前置推出在个人中心,用户想清理缓存时,无需翻越层层入口,只需点击“清理”按钮即可一键完成缓存清理,实时告知用户清理进度,大幅提升用户操作效率。除此以外,像深色模式、字体大小等功能也都支持用户在个人中心一键操作。
 
当设计遇上AI—百度APP个人中心AI重构
 
 
 
5.拓展对话场景 触达用户长尾需求 
 
个人中心不仅可以结合用户行为智能推荐卡片,还支持用户主动发起提问,通过对话形式快捷触达长尾需求。用户点击卡片下方的“去提问”入口或上滑页面,即可从个人中心进入对话页。
 
当设计遇上AI—百度APP个人中心AI重构
 
 
 
进入对话页后,个人中心AI助手首先会推荐一些快捷指令,让用户快速了解对话提问方式和目前支持提问的功能。当用户发起提问后推出相关功能卡片,如在手机运行卡顿时询问“如何清理缓存”,AI助手会推出“清理缓存”卡片并引导用户前往清理,清理完成会再次回到对话页、为用户展示最新缓存状态。
 
以下是支持对话的部分功能卡片,这些卡片整体延续了推荐区域卡片的内容和体验,结合对话交互流程对卡片模版进行了差异化定制。
 
当设计遇上AI—百度APP个人中心AI重构
 
 
 
最终基于业务功能特点,结合对话交互规范,共计定义了“跳转操作并返回更新”“跳转查看”“当前操作”“当前操作并追加对话”4种交互操作和更新方式。目前我们接入的场景能力尚有限,后续我们将持续进行迭代与优化,提升用户在个人中心进行AI对话的体验。
 
当设计遇上AI—百度APP个人中心AI重构
 
 
 
 
AI个人中心实验上线效果
 
AI版本实验上线后,百度APP和个人中心的关键数据都有了显著提升,带来了正向收益,我们也于今年6月底上线全端,期待大家体验并给予反馈。
 
 
思考与展望
 
如今产品AI化已成为市场发展趋势,作为设计师,如何结合自己的业务,运用AI能力重构产品及体验是一个极具挑战和价值的课题。我们从百度APP个人中心AI重构项目中总结出了一些经验和小tips,在此向大家分享:
 
  •  
    在应用AI技术之前,首要任务是明确其能力范围与显著优势,如文中使用的AI智能推荐能力能够同时满足用户的个性化需求、提升信息获取效率,从而全方位提升用户体验和业务价值。
 
  •  
    我们需要大胆突破、勇于创新,在没有可参考借鉴的产品时应当打破惯性思维,尝试从框架、结构、内容等层面进行全新定义,然后通过持续打磨、深度探索等手段来不断完善产品形态。
 
  •  
    无论是否应用AI,设计底层思维是万变不离其宗的,我们需要始终站在用户视角分析并解决问题,而AI将会是每位设计师的一个趁手工具和灵感中心,它可以给我们更多思考问题的角度,日常工作中我们应当多积累总结然后不断迸发新思考,通过AI这个新工具来解决我们业务的已有问题,向用户提供更好的体验。
 
以上是我们的一些小小心得,希望能为同为设计师的你,在面对AI应用与重构设计时提供一些设计思路和借鉴。
后续,我们将持续聚焦提升个人中心的AI智能感知能力,围绕用户的偏好习惯及当前上下文环境,提供更精准的个性化服务,为用户升级更加智能、自然流畅的AI对话体验,通过结合更多场景逐步打造出一个全方位、个性化的百度APP AI助手,让每位用户都能享受到智能化的便捷与乐趣。
 
 


作者:百度MEUX
链接:https://www.zcool.com.cn/article/ZMTYzMzE4MA==.html
来源:站酷
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。

 

 

如何从产品角度发起交互设计?

鹤鹤

本文从产品角度出发,深入探讨了如何发起交互设计。通过明确产品目标与用户需求、进行用户研究、构建信息架构、设计流程与界面、进行原型测试以及持续优化等关键步骤,阐述了如何打造出满足用户期望、提升用户体验并实现产品目标的交互设计。
 
一、引言
 
在当今数字化的时代,产品的成功不仅仅取决于其功能的强大,更在于能否为用户提供流畅、愉悦且富有价值的交互体验。从产品角度发起交互设计,意味着将用户置于核心,以实现产品的商业目标和用户需求的完美融合。
如何从产品角度发起交互设计?
 
 
 
二、明确产品目标与用户需求
 
(一)定义产品目标
产品目标是交互设计的起点,它决定了设计的方向和重点。产品经理需要与团队共同明确产品的定位、市场需求以及预期的商业成果。例如,是旨在提高用户活跃度,还是增加用户转化率,或者是提升品牌形象。
如何从产品角度发起交互设计?
 
 
 
(二)挖掘用户需求
通过市场调研、用户反馈、竞品分析等手段,深入了解目标用户的行为习惯、痛点和期望。这不仅包括对用户显性需求的捕捉,还包括对潜在需求的挖掘。
如何从产品角度发起交互设计?
 
 
 
三、进行用户研究
 
(一)用户画像创建
基于收集到的数据,构建详细的用户画像,包括用户的年龄、性别、职业、教育背景、使用场景等特征,以便更精准地理解用户的行为和需求。
如何从产品角度发起交互设计?
 
 
 
(二)用户场景分析
模拟用户在不同场景下与产品的交互过程,发现可能存在的问题和优化点。
举例说明:
我们要知道,地铁周边美食,这是一个解决方案。真正的需求是什么?一个字一个字地找需求,地铁=快速方便出行,美食=和朋友一起吃饭/自己一人吃饭。这是一个和线下场景很相关的项目,我们要把不同目的核心用户的主要使用场景写出来。经过分析,我们得出了用户会选择我们产品,且产品未来可能存在的各种场景A、B、C、D、E。如下图所示:
如何从产品角度发起交互设计?
 
 
如果按照目标人群所在场景分类,进行细分,则为下图:
如何从产品角度发起交互设计?
 
 
乘地铁去地铁站和附近地铁站区别:前为用户会乘坐地铁去目的地寻找美食;后为用户不用地铁/吃完后使用地铁,地铁边美食没有其他美食团购产品有竞争力。
上班族和普通大众区别:上班族工作日使用固定地铁站上下班,时间可能紧急,快速获取食物;普通找美食吃的大众不使用固定地铁站,目的是通过地铁快速到达某目的地,就近享受目的地美食。
朋友们和个人区别:朋友们一起吃饭,容易出现喝多、吃过点等异常行为,并且在选择地铁旁吃饭地点时需要考虑朋友们家的位置就近选目的地。个人均不需要考虑以上,较为自由。
 
市场定位
经过领域场景的分析,我们知道了真场景都是用户有目的乘坐地铁去到某地铁站出站口寻找美食的。那么我们对这么一群大众进行用户人口统计学类的细分:
如何从产品角度发起交互设计?
 
 
  •  
    上图为前期定位的目标大众用户群,依靠地铁的工具属性,我们得出了具体的两个影响因素:时间+美食热爱程度。同时我们把直接竞品和间接竞品一同进行用户群比较。可以看到和大美团有相同和不同维度,这就是产品最初冷启动时期的差异化!也就是我们的前、中期场景的主要目标用户类型。
  •  
    红色部分即种子用户群,以这些群体为冷启动阶段,可以更快的向四周扩张。因为他们有使用地铁的时间属性,同时有较高的美食热爱程度,有利于带动其他时间+热爱程度的用户加入产品,实现快速并有质量的拉新、活跃的目标。
  •  
    低端直接竞品即用户群工具属性明显,只是搜地铁站,选择美食的用户,无明显其他行为;高端竞品即注重社交、ugc为起点,逼格高的搜寻美食工具。这部分开始很难,工作量巨大,且较脱离大众主流群体。
 
结合上图和要做的场景,我们得出了产品具体目标用户:乘坐地铁快速到达并寻找目的地美食的大众用户(上班族休息日,大学生,个人或一起),要求在地铁站附近便能方便享受目的地美食。且对美食有一定热爱程度。
 
(三)用户测试
邀请真实用户进行产品试用,观察他们的操作行为,收集反馈意见,为后续的设计提供依据。
1、需求接受
需求很有可能是在线上接到的,并不是面对面交流传递的,并且还会遇到很多坑,例如需求本身不具体,或者自己理解有偏差,因此在接到需求后,最好和交互、产品等同事进行面对面的交流和沟通。
详细了解测试目的和关键点,确定用户配比。
最好是让交互带着跑一下整个程序(半成品demo也好,交互稿也行),这样能在头脑中快速形成操作流程的认知,并把相应关键点对应上去。同时把大致的用户配比情况敲定一下,后续就可以直接招募用户了。
了解demo的完成进度,相应确定具体测试时间。
交互、视觉等完成demo的时间具有太多不确定因素,因此我们需要及时了解整个demo的完成进度,在尽可能快的情况下保险安排测试时间,如果邀请的是外部用户,结果用户到了而demo还没出来,那也是够了。
2、方案撰写和确定
让交互稿帮助自己
。在完成测试方案撰写的过程中demo还未诞生,具体程序细节记忆又很模糊,不好写测试方案,怎么办?不要慌,去看交互稿吧。
及时沟通
。在方案撰写过程中,如果有一些疑问,例如在看交互稿的时候还不是很理解某个具体操作过程,或者自己对产品有疑问的也可以跟交互等沟通,因为自己会遇到的问题,很有可能在测试用用户也会遇到,这样子用户如果问到了,就可以相应作出解释。
核实确定方案
。完成方案后,可以在公司沟通交流工具上和交互及产品等同事再确认一下,是否有什么地方遗漏或有不妥之处。
3、用户招募
这是一个大多数人都头疼的一个过程,希望看完了以下几点,可以稍微缓解一下大家的症状。
 
再次确定测试时间
方案定下来后,再跟交互确认测试时间,了解是否有变动和调整,尽量避免用户来了demo或者测试环境还不ok的情况。
 
撰写招募文案
需要把用户要求、测试日期和地点、报酬、大致的测试时长、用户需要在测试中做什么,以及报名方式等表达清楚。有以下几点可以注意一下,方便我们自己招募:
  •  
    详细列出测试安排的时间段
    。例如10:30-11:15、13:30-14:15,让用户自己挑选合适的时间段,这样就不用事后再协调不同用户测试时间了;
  •  
    优先人力、信息管理、行政等岗位同事
    。尽量避免相关产品人员、设计岗等同事。
  •  
    制作简单的招募海报,并检查。
    可以事先将“海报”用word或者ppt做好,然后保存成图片格式,记得检查核实一下是否有错。因为在公司IM群上直接黏贴确实方便,但是其排版往往不利于阅读,导致用户会遗漏重要信息。而制作成图片格式,可以更好地去避免这个问题,同时还可以显得整个招募过程比较正式,突出了对用户的尊重,也能在一定程度上体现我们用研工作的规范性。
 
多渠道投放招募海报
内部用户可以尝试先在公司IM群组上招募,之前招募样本量比较小,因此很快可以招到,其他途径暂时未尝试,公司论坛应该也可以,不过隐约感觉效率会比较低。外部用户可以在朋友圈试试,效果还不错,大家都很热情帮忙转发,群众的力量大无穷。也可以相应去搜索一些QQ群,加入并发布招募信息。另外还有一些社交论坛什么的,都可以尝试一下。方法很多,针对具体招募情况,大家就尽情发挥吧~
 
用户多了留到下次用
海报发出去后,有时也会出乎意料用户数量超过预期了,这是好事,不要担心,也不要急着拒绝,平和的跟对方说明情况,强调下次还会有测试,把用户相应信息了解一下做个记录,下次招募的时候可以直接先联系这几名用户。当然前提是你真的有下次测试需求,如果没有那还是老老实实说明情况。
 
确保自己和用户能彼此联系上
跟用户强调测试时间和地点,尤其是外部用户,如果招募和正式测试隔了几天,最好在测试前一天再通知一下。给出自己的联系电话,同时询问用户的联系电话。
 
第一个用户尽量安排公司内部同事
很多时候demo的完成情况会出现意外,到了测试时间demo还不能用,内部用户可以方便取消或者更换。另外,在第一次测试前谁都不确定用户会有什么反应,第一个测试是可以起到试水效果,而外部用户成本高,用来试水太奢侈。
4、测试准备
 
材料准备
需要准备的内容有:量表、报酬签收表、记录笔记本、录音笔、会议室借用,以及记录表格,如果是外部用户过来,相应准备一杯水,人家大老远过来也不容易。
 
测试内容准备
其实每次访谈用户自己都会挺紧张的,不知道用户是不是也很紧张(PS:好想当一回用户,体验一下被访的感觉)。为了消除这种紧张,同时也是为了更好的完成访谈,可以有尝试以下几点:
  •  
    尽可能多的去了解所需测试的产品
    。有时候demo出来的晚,下午要测试,demo中午才出来,自己都没玩过,测试还怎么搞?之前也说了,那就使劲去看交互稿吧,虽然比不上实际操作来的真实,但是也能有不小帮助,但也要给自己留足熟悉demo的时间。
  •  
    按照模块来列提纲
    。其实相当于组块策略,把同一个模块的问题放到一起更方便记忆,并且也在访谈中也方便自己和其他同事发现遗漏点。但模块不要太大,如果太大了就相应拆分一下。例如,在考拉新版测试的时候,有“首页”、“活动”、“购物车”等测试,但是光是首页内容也很多,作为一个模块还是太大了,可以拆分成“首页整体感知”、“商品详情”等几个方面来整理提纲。
  •  
    根据任务演练提纲
    。有了提纲后,按照任务大致过一下所有列出来的问题,这个过程会打乱按照模块列好的提纲,有一次这样的排练,在测试的时候更不容易漏掉题目,而且也相当于模拟了一下测试,自己心里会更踏实一点,在实际测试过程中也能有更好的应对。
 
相关人员通知
通知交互和产品的同事具体测试时间和地点,邀请他们一起参与。不建议交互和产品只是后期测试查阅报告,如果他们参与到测试中,能更近距离和用户接触,并能更加深刻感受到产品存在的问题,也能更好的推动产品的改进。
5、正式测试
主持人需要注意的点:
  •  
    划分我们和产品的关系。在测试之前跟用户说明清楚,我们并不是产品的设计者和开发者,我们只是受产品方委托来进行测试,以免用户不好意思当面如实评价产品。
  •  
    强调测试的是产品,而不是用户。要跟用户说明产品尚处于不完善阶段,因此邀请用户过来进行测试,帮助发现问题和改进产品设计,但请注意不是为了评价产品。
  •  
    注意访谈技巧。这个就不用多说了。
  •  
    尽可能深入的去挖掘用户的需求。不要停留在用户话述表面,更进一步去追问,用户为什么会这么说或这么问,例如,很多时候在测试中会碰到用户说“哦,原来这个按钮是xx功能,我还以为是xx功能“,这个时候可以再推进一步,了解用户为什么会这么认为。
  •  
    给其他在场的同时发言的机会。主持人如果觉得自己访谈的差不多了,可以询问一下记录者以及交互、产品等同事,了解他们是否还有问题需要补充。
  •  
    记得量表评分和报酬签收。长时间的测试和访谈后容易忘记量表评分和报酬签收,可以把这两份东西放在显眼的地方,另外可以让记录的同事打个招呼,帮忙提醒自己。
 
记录人员需要注意的点:
  •  
    仔细观察用户行为并记录。记录不仅仅是用户的观点、想法等,更重要的是记录用户的实际行为。
  •  
    按照模块记录。记录者可以按照测试方案中的模块来相应记录用户的行为和言语表述。
  •  
    查漏补缺。主持人可能会遗漏一些点,记录者作为旁观者需要提醒主持人遗漏了什么,或者自己有什么新的内容需要补充。
 
6、测试结束
欢送用户。对用户表示感谢,并开门送一下用户,对于外部用户,最好能送到大楼外面可以看见出口的地方。
测试后及时讨论。这个是重点!
在每一名用户测试后及时和交互、产品等同事快速过一下主要发现的问题点,这样做有以下优点:
  •  
    有效达成共识,确定解决方案。刚访谈结束印象最深刻,因此能快速有效达成对主要问题的共识,并讨论确定相应的解决方案。
  •  
    体现敏捷优势。确定了一些比较严重的问题后,交互和产品的同事就可以相应去改进产品设计,做到了边测边改,加快迭代速度。
  •  
    帮助优化访谈提纲,和测试用户安排。有些问题在事先撰写方案的时候可能没涉及到,在讨论后可以补充进去,而有些问题确定后则不需要再测。另外,也可以通过讨论对事先安排的测试用户进行相应调整,例如增删用户,或者调整新老用户测试顺序等。
  •  
    事后帮助我们自己快速撰写方案。通过讨论确定了关键问题,并且,交互和产品的同事也相应清楚了,因此在最后可以快速形成报告。
再次感谢用户。所有用户测试结束后,可以花几分钟时间简单感谢一下用户。
 
7、报告撰写
针对不同大小项目的用户测试,在完成报告撰写过程中有两种具体方式:
  •  
    小测试项目简单快速撰写报告。对于那些1-2天的小测试项目,由于在每次测试后都有讨论,已对主要问题达成共识,因此在报告撰写的时候就可以快速地将主要的问题和风险点呈现出来。
  •  
    大测试项目每天总结并反馈主要问题。大的测试项目持续时间比较久,针对每天的测试及讨论,简单总结一下主要发现的问题,并反馈给相关人员,如果到了最后再总结,容易遗忘掉一些内容,并且这样子也方便自己最后撰写报告。
 
四、构建信息架构
思考信息架构有三个核心关键词:用户角色、产品价值、使用场景。
1、明确用户角色
用户角色清晰揭示用户目标,帮助我们把握关键需求、关键任务、关键流程,看到产品哪些是主要的事,哪些是次要的事。我们应该尽可能丰富、形象化我们的用户角色,让它在设计决策过程中发挥作用,设计出更符合用户场景的产品。
2、了解产品的目标价值
作为产品的设计师一定要理解产品的价值,知道用户想要什么,把最重要的优先级提到最高,尽量移除无关紧要的信息,或降低其他优先级的权重,以免对用户造成干扰。
3、提炼产品的使用场景
要了解产品的业务流程,比如目标用户是谁、什么场景、如何使用,要把产品业务流程上的节点一个一个梳理出来,还要考虑这个产品对用户的价值是什么,不要仅仅考虑界面的元素规范、设计细节等等,要知道产品的目标价值体系。
4、信息架构优先级
基于三个核心点(用户角色、产品价值、使用场景)分析,把目标用户人群核心价值的功能点业务流程梳理出来,分清主次关系,切忌功能堆砌,具体方法可以把所有功能业务逻辑的主线列出来,然后根据业务的优先级做评级,分清楚这些功能哪些是主要的,哪些是次要的,然后通过数字做排序,这样我们就知道哪些功能设计需要明显,哪些功能设计需要低调。
5、信息归类及整合
从整体上思考信息类产品的分类及整合,比如用户资料相关的产品会有用户信息、资料、等逻辑,这样就要把所有跟用户相关的信息都归在同一个分类菜单下,不要让他们分散在各个页面中。也就是所谓的一级菜单、二级产品的处理逻辑。
6、要定期审视与迭代
随着产品规模与复杂度的提升,要随时关注信息架构是否满足当前的产品框架,不要等需要时候再去孤注一掷的全盘优化,这样会让项目陷入被动的局面,可以逐渐增强,循序渐进的优化,从小的细节对信息架构进行调整,提升产品的易用性。
 
六、进行原型测试
1、制作原型
使用快速原型工具制作可交互的原型,以便更直观地展示设计方案。
 
(二)内部测试
团队内部进行初步测试,检查功能的完整性和流程的合理性。
 
(三)用户测试
邀请外部用户进行测试,收集他们的意见和建议,发现潜在的问题和改进空间。
 
七、持续优化
 
(一)数据分析
通过收集和分析用户的使用数据,了解用户的行为路径和偏好,为优化提供数据支持。
 
(二)用户反馈处理
及时响应用户的反馈,将有价值的建议融入到后续的优化工作中。
 
(三)迭代更新
根据数据分析和用户反馈,不断对交互设计进行迭代更新,以适应市场和用户需求的变化。
 
八、结论
 
从产品角度发起交互设计是一个综合性的过程,需要充分考虑产品目标、用户需求、信息架构、流程界面、测试优化等多个方面。只有以用户为中心,不断追求卓越的用户体验,才能打造出具有竞争力的产品,在激烈的市场竞争中脱颖而出。
 
在未来的产品开发中,随着技术的不断进步和用户需求的不断变化,交互设计也将面临新的挑战和机遇。产品团队应保持敏锐的洞察力和创新精神,持续探索和优化交互设计,为用户创造更多的价值。
 


作者:Charlotte的嘻酱
链接:https://www.zcool.com.cn/article/ZMTYyNzM1Mg==.html
来源:站酷
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。
 

蓝蓝设计(www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计B端界面设计桌面端界面设计APP界面设计图标定制用户体验设计交互设计UI咨询高端网站设计平面设计,以及相关的软件开发服务,咨询电话:01063334945。我们建立了一个微信群,每天分享国内外优秀的设计,有兴趣请加入一起学习成长,咨询及进群请加蓝小助微信ben_lanlan。

WechatIMG27.jpg

关键词:UI咨询UI设计服务公司软件界面设计公司、界面设计公司、UI设计公司UI交互设计公司数据可视化设计公司用户体验公司高端网站设计公司银行金融软件UI界面设计能源及监控软件UI界面设计气象行业UI界面设计轨道交通界面设计地理信息系统GIS UI界面设计航天军工软件UI界面设计医疗行业软件UI界面设计教育行业软件UI界面设计企业信息化UI界面设计、软件qt开发软件wpf开发软件vue开发

如何抓住用户的眼睛

鹤鹤

浏览一个页面或阅读一篇文章时,我们的眼睛并不是随意地扫视,而是遵循一定的模式和规律。这些模式和规律被称为视觉动线。
视觉动线这个概念最初确实起源于室内设计,用来描述人们在室内空间中的移动模式和视线轨迹。通过了解人们的视觉动线,设计师可以更好地规划和优化室内空间的布局,以提供更舒适、便捷和高效的居住环境。
随着人机交互和界面设计的不断发展,视觉动线的概念也被引入到UI设计中。
目录:基本方法/文献信息收集/用户视觉习惯引导/信息层次结构的构建/最后总结
如何抓住用户的眼睛
 
 
收藏
如何抓住用户的眼睛
 
 
收藏
如何抓住用户的眼睛
 
 
收藏
如何抓住用户的眼睛
 
 
收藏
如何抓住用户的眼睛
 
 
收藏
如何抓住用户的眼睛
 
 
收藏
如何抓住用户的眼睛
 
 
收藏
如何抓住用户的眼睛
 
 
收藏
如何抓住用户的眼睛
 
 
收藏
如何抓住用户的眼睛
 
 
收藏
如何抓住用户的眼睛
 
 
收藏
如何抓住用户的眼睛
 
 
收藏
如何抓住用户的眼睛
 
 
收藏
如何抓住用户的眼睛
 
 
收藏
如何抓住用户的眼睛
 
 
收藏
如何抓住用户的眼睛
 
 
收藏
如何抓住用户的眼睛
 
 
收藏
如何抓住用户的眼睛
 
 
收藏
如何抓住用户的眼睛
 
 
收藏
如何抓住用户的眼睛
 
 
收藏
如何抓住用户的眼睛
 
 
收藏
如何抓住用户的眼睛
 
 
收藏
如何抓住用户的眼睛
 
 
收藏
如何抓住用户的眼睛
 
 
收藏
如何抓住用户的眼睛
 
 
收藏
如何抓住用户的眼睛
 
 
收藏
如何抓住用户的眼睛
 
 
收藏
如何抓住用户的眼睛
 
 
收藏
如何抓住用户的眼睛
 
 
收藏
如何抓住用户的眼睛
 
 
收藏
如何抓住用户的眼睛
 
 
收藏
如何抓住用户的眼睛
 
 
收藏
如何抓住用户的眼睛
 
 
收藏
如何抓住用户的眼睛
 
 
收藏
如何抓住用户的眼睛
 
 
收藏
如何抓住用户的眼睛
 
 
收藏
如何抓住用户的眼睛
 
 
收藏
如何抓住用户的眼睛
 
 
收藏
如何抓住用户的眼睛
 
 
收藏
如何抓住用户的眼睛
 
 
收藏
如何抓住用户的眼睛
 
 
收藏
如何抓住用户的眼睛
 
 
收藏
如何抓住用户的眼睛
 
 


作者:Miao_C
链接:https://www.zcool.com.cn/work/ZNjcyNDAyNjg=.html
来源:站酷
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。
 

蓝蓝设计(www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计B端界面设计桌面端界面设计APP界面设计图标定制用户体验设计交互设计UI咨询高端网站设计平面设计,以及相关的软件开发服务,咨询电话:01063334945。我们建立了一个微信群,每天分享国内外优秀的设计,有兴趣请加入一起学习成长,咨询及进群请加蓝小助微信ben_lanlan。

WechatIMG27.jpg

关键词:UI咨询UI设计服务公司软件界面设计公司、界面设计公司、UI设计公司UI交互设计公司数据可视化设计公司用户体验公司高端网站设计公司银行金融软件UI界面设计能源及监控软件UI界面设计气象行业UI界面设计轨道交通界面设计地理信息系统GIS UI界面设计航天军工软件UI界面设计医疗行业软件UI界面设计教育行业软件UI界面设计企业信息化UI界面设计、软件qt开发软件wpf开发软件vue开发

教你一文读懂暗色模式

鹤鹤

引言
  暗色模式(Dark Mode)的兴起是一个逐渐发展的过程,它涉及到
技术进步、用户体验优化以及设计趋势
的变化。
  随着iOS 13在2019年的发布,暗色模式开始成为用户关注的焦点;在用户体验方面,设计者们考虑到了环境光线与屏幕亮度的匹配问题,暗色模式可以有效减少视觉疲劳;在实际使用中,用户发现暗色模式在光线较暗的环境中更为舒适,这也促使了暗色模式的普及和发展。
  暗色模式在UI设计中的重要性体现在
改善视觉舒适度、节省电量以及提供个性化选择
上,其普及程度随着用户需求和技术发展不断提升。
  本文将从暗色模式的
基本概念、优势、设计原则和应用
三个维度,帮助各位同行更好地学习、理解并完成暗夜模式的UI设计工作。
(如果文中存在任何不准确或遗漏之处,我也非常期待各位专家的指正和建议)
本文目录
本文目录
 
「大厂设计师」教你一文读懂暗色模式
 
 
一、定义及其在UI设计中的表现形式
1.暗色模式的定义
  暗色模式是一种
低光用户界面(UI)设计
,也称为深色模式,是一种用户界面设计选项,它使用较深的颜色方案和背景,通常为黑色或深灰色,以减少屏幕亮度并提供更舒适的视觉体验。
iOS 13 亮色模式(左)与暗色模式(右)的对比
iOS 13 亮色模式(左)与暗色模式(右)的对比
 
2.暗色模式的定义
(1).暗色模式在UI设计中的表现形式
设计师需要为暗色模式
创建一个新的调色板
,这通常意味着降低颜色的饱和度,以适应深色背景。同时,
避免使用纯黑
作为主色调背景,而是选择接近纯黑的深灰色,以确保阅读体验的
舒适性和可读性
亮色/暗色模式下主色需要进行调整
亮色/暗色模式下主色需要进行调整
 
(2).对比度控制
暗色背景与文本颜色之间的对比度应该控制在
WCAG2.0AA级标准
以上,以保证内容的
清晰度和易读性
。对于彩色元素,也需要适当调整饱和度,确保整体色彩之间的对比度符合无障碍标准。
达到/未达到WCAG2.0AA标准的视觉效果对比
达到/未达到WCAG2.0AA标准的视觉效果对比
 
(3).视觉元素区分
在暗色模式下,设计师需要特别注意视觉元素的区分,通过足够的对比度来
保证文字和图形的清晰
可见。这不仅仅是简单的颜色反转,而是一种“弱光”主题的设计思考,旨在优化用户在低光环境下的视觉体验。
亮色模式中的按钮在暗色模式中显得太跳跃
亮色模式中的按钮在暗色模式中显得太跳跃
 
二、历史回顾及发展脉络
1.命令行界面时代
    在早期的计算机系统中,如DOS和Linux,
终端通常使用暗色模式
,这是因为早期的CRT显示器存在闪烁问题,暗色背景能够减少视觉疲劳,并提供较高的对比度。
Linux的终端界面
Linux的终端界面
 
2.个人电脑时代
    随着个人电脑的普及,
图形用户界面(GUI)逐渐成为标准
,此时大多数操作系统和应用程序采用了亮色模式,以模仿纸张的颜色并减少CRT显示器的眩光。
Windows2000的GUI
Windows2000的GUI
 
3.移动设备时代
    智能手机和平板电脑的兴起带来了OLED等先进显示技术,这些设备的
小屏幕和高分辨率
使得暗色模式再次变得实用和流行,特别是在
节省电量和减少眼睛疲劳
方面。
iOS13的暗色模式
iOS13的暗色模式
 
4.操作系统时代
    近年来,
各大操作系统开始正式支持暗色模式
。例如,Windows 10在2018年的更新中引入了暗色应用模式,macOS和iOS随后也推出了可以根据时间或环境自动切换的暗色模式。
Windows10的暗色模式
Windows10的暗色模式
 
三、设计趋势中暗色模式的地位
暗色模式在当前设计趋势中占据重要地位,以其
减轻眼睛疲劳、节省电量和聚焦内容
的优势受到青睐。它不仅适应低光环境,还提供美学上的新探索,响应了用户对舒适性和个性化选择的需求。随着技术发展和设计创新,暗色模式已成为现代界面设计不可或缺的一部分。许多顶级品牌和应用程序,如WhatsApp、Instagram、Google、Facebook等,都已经引入暗色模式设计,这表明暗色模式已经
成为了一种广泛接受的设计趋势
从左往右依次为:WhatsApp、Instagram、Google、Facebook
从左往右依次为:WhatsApp、Instagram、Google、Facebook
 
「大厂设计师」教你一文读懂暗色模式
 
 
一、用户体验层面
1.提高阅读舒适度
(1).对比度和可读性
在相同的对比度条件下,浅背景上的黑字比深背景上的浅色字
阅读效果更好
。这表明,优化对比度是提高阅读舒适度的关键因素之一。
浅背景上深字与深背景上浅字的视觉对比
浅背景上深字与深背景上浅字的视觉对比
 
(2).用户偏好和满意度
一项针对用户对暗色模式的使用体验的调查显示,与默认的白底模式相比,用户在使用暗色模式时报告了
更低的视觉疲劳和更高的满意度
。斯隆(Sloan)的一项研究在1977年就报告说,如果更多的光线通过混浊的透镜到达眼睛,则出现畸变的可能性更大,即
暗模式对视力障碍者更好
对于长时间从事屏幕工作的人来说,暗色模式对眼睛更加友好
对于长时间从事屏幕工作的人来说,暗色模式对眼睛更加友好
 
2.减少视觉疲劳
(1).人眼生理特性
暗色模式能
减少屏幕发出的光线
,这有利于减少眼睛疲劳和不适,特别是在低光环境下,人眼的虹膜会打开以接受更多光线,而暗色模式提高了减少的光源,
减少了对眼睛的刺激
亮/暗环境下瞳孔大小的变化
亮/暗环境下瞳孔大小的变化
 
(2).蓝光辐射减少
人们通过长期研究发现短波可见光,即紫光和蓝光对眼底视网膜有相当程度的破坏作用, 而人们通常把这种可见光波长中高能量波段(400- 470nm)对视网膜的损坏现象称为
“蓝光伤害现象”
。 还有研究关注了暗色模式对蓝光辐射的影响。由于暗色模式降低了屏幕的整体亮度,因此也
减少了蓝光的辐射
可见光波段分布
可见光波段分布
 
二、设备电池寿命
1.降低屏幕功耗
在OLED屏幕上,每个像素都是独立发光的,当
显示黑色时,相关的像素点会关闭,从而不消耗能量
。这意味着,显示大面积黑色内容的暗色模式能够显著减少屏幕的能量消耗。
OLED屏幕发光原理
OLED屏幕发光原理
 
2.实际省电效果
以 Google 测试数据为例,OLED 屏幕的 Pixel 手机在时间段内启用深色模式并在使用地图导航时保持屏幕最大亮度,手机的
电量消耗下降了 63%
Google的测试数据
Google的测试数据
 
三、降低屏幕功耗
1.促进睡眠
对于晚上喜欢在床上阅读或工作的用户来说,暗色背景有助于降低屏幕亮度,
减少对褪黑素分泌的干扰
,也有助于
减少蓝光对睡眠周期的影响
,从而帮助用户更快入睡并提高睡眠质量。
OPPO手机暗色模式广告
OPPO手机暗色模式广告
 
2.减少眩光
眩光是明亮的屏幕和低光环境之间恼人的对比现象,对眼睛具有一定的影响并造成眼部不适。暗色模式通过使用深色背景和亮色文字,整体降低了屏幕的亮度,这样在光线较亮的环境中,屏幕的亮光
与周围暗环境的对比度降低
从而减少了屏幕反射光线对眼睛的刺激
,降低不适。
有眩光与无眩光的显示器对比
有眩光与无眩光的显示器对比
 
四、打造沉浸式体验
1.减少视觉干扰
暗色模式提高了一种无干扰的工作环境,
有助于他们专注于手头的任务
,特别是在进行写作、编码或其他需要集中注意力的活动时,暗色模式能够减少视觉干扰。
暗色模式为视觉设计提供了更大的对比度,使得界面元素更为突出。这种高对比度不仅有利于内容的战士,也增强了用户的视觉聚焦,让用户更容易沉浸于应用或游戏的环境中。特别是在观看视频或进行游戏时,暗色背景能够使色彩更为鲜明,提升用户的视觉体验。
编码软件一般默认暗色界面,有利于专注工作
编码软件一般默认暗色界面,有利于专注工作
 
2.增强视觉聚焦
暗色模式为视觉设计提供了更大的对比度,使得
界面元素更为突出
。这种高对比度不仅有利于内容的战士,也增强了用户的视觉聚焦,
让用户更容易沉浸于应用或游戏的环境中
。特别是在观看视频或进行游戏时,暗色背景能够使色彩更为鲜明,提升用户的视觉体验。
手游王者荣耀UI界面
手游王者荣耀UI界面
 
「大厂设计师」教你一文读懂暗色模式
 
 
一、不同平台的设计原则
「大厂设计师」教你一文读懂暗色模式
 
 
1.WCAG最低标准
(1).WCAG的定义
Web Content Accessibility Guideline,译为
网页内容无障碍指南
,其中包含分为可感知性、可操作性、可理解性、可兼容性和一致性五大类的相关建议,这些建议可使网站内容更容易访问。iOS人机界面准则以及Android平台的Dark Theme都是基于WCGA之上。
WCAG的检测网站:WCAG - Contrast Checker
WCAG的检测网站:WCAG - Contrast Checker
 
(2).最小对比度(AA级)
对于普通的文本和文本图像,要求视觉呈现
至少具有4.5:1的对比度
。这意味着文本的颜色应该与背景颜色有足够的差异,以便用户能够轻松阅读。
(3).加强对比度(AAA级)
对于普通文本与背景的对比度,
要求不低于7:1
。这一级别的要求比AA级更高,提供了更强的视觉清晰度,特别有助于色觉缺陷或低视力用户的阅读。
不同层级的信息使用不同对比度
不同层级的信息使用不同对比度
 
2.Android平台
(1).使用深灰色而不是黑色
深色主题背景通常采用深灰色而非纯黑色,这是因为纯黑色可能会导致对比度过高,而深灰色可以提供
更为舒适的视觉体验。
背景颜色为 #121212
背景颜色为 #121212
 
(2).通过浅色表达深度
在深色主题中,为了构建清晰的视觉层次,通常会使用较浅的颜色来突出界面上的重要元素,如按钮和卡片。Dark Theme通过
浅色遮罩覆盖的形式凸显不同层级
,不同高度层对应不同透明度的规范如下。规范最高层是24dp,覆盖16%透明度的白色。
不同高度层对应的白色遮罩透明度
不同高度层对应的白色遮罩透明度
 
(3).颜色去饱和
在深色主题中,颜色的饱和度通常会降低,这样可以
减少视觉疲劳
,并提供一种更为舒适和专业的外观。
亮色/暗色模式中主色调的对比,降低了饱和度
亮色/暗色模式中主色调的对比,降低了饱和度
 
(4).使用深色及有限色彩
为了保持设计的一致性和专注性,深色主题中应使用有限的色彩,并且这些色彩应当与深色背景协调。
品牌颜色可以在深色主题中以完全饱和度使用,但应用应限于一个或两个品牌元素,例如徽标或品牌按钮。通过谨慎使用品牌颜色,使元素在层次结构中保持突出。不饱和的颜色仍应在黑暗主题UI的其余部分中使用。
背景色也需要有品牌色的颜色倾向
背景色也需要有品牌色的颜色倾向
 
3.iOS平台
(1).保持视觉风格的熟悉感
意味着即使在深色模式下,用户应能立即识别出应用程序的风格和布局,
确保用户体验的连贯性
。iOS 7之后苹果一直崇尚这种
毛玻璃般的透明材质
以映射UI界面与设备屏幕的关系,也可以使用户更好的感知上层元素与下层内容之间的关系,界面也不会过于枯燥乏味。
iOS 13提供了4个层级的材质,由厚重到轻薄,对应的暗色模式也保持了风格一致性
iOS 13提供了4个层级的材质,由厚重到轻薄,对应的暗色模式也保持了风格一致性
 
(2).平台一致性
设计时应遵循iOS的设计规范,确保在不同模式(浅色或深色)下都能
提供一致的用户体验
。这有助于用户在使用各种应用时能够获得统一的操作感受。iOS默认提供了9个彩色色板(TintColor),为了保证深色模式下的对比度效果,
每个颜色都新增了深浅模式两种版本
iOS 13 UI Sketch组件库
iOS 13 UI Sketch组件库
 
(3).清晰明确的信息层级
在深色背景下,原先利用阴影区分界面层次的方法可能不再适用,因此需要通过不同灰度的背景色和阴影来强化层次感。正确的层级关系有助于突出重要内容,引导用户的注意力。
在“通讯录”与“信息”中选择联系人的界面因为信息层级不同,背景颜色不同 左:#000000 右:#1C1C1E
在“通讯录”与“信息”中选择联系人的界面因为信息层级不同,背景颜色不同 左:#000000 右:#1C1C1E
 
(4).清晰明确的信息层级
深色模式应
聚焦于内容展示
,使主要内容突显,而
非核心的界面元素则相对隐退
,这有助于集中用户的注意力于重要信息上。在浅色主题中,我们经常使用大块的明亮颜色,这样最重要的元素可能会更加显眼。但在暗色模式中,这样就不行了,大块的亮颜色会让我们容易忽视更重要的元素。 
在Dark Mode中不能采用大面积的彩色
在Dark Mode中不能采用大面积的彩色
 
二、优秀案例解读
1.国内案例
(1).Ant Design
Ant Design 在其4.0版本中对暗黑模式进行了探索,提供了一套
适用于企业级应用的暗色主题设计
,旨在帮助设计师和开发者快速实现暗色模式的用户界面。
「大厂设计师」教你一文读懂暗色模式
 
 
(2).微信
微信作为国内领先的社交应用,其暗色模式设计不仅减少了屏幕的亮度,还对图标和文字颜色进行了优化,以确保在不同光线条件下的可读性和舒适性。
文字信息的对比度仅大于7:1。更多的是考虑微信的聊天场景
中,用户可能长时间沉浸式使用。这里微信将深色模式与夜间模式进行了兼容,
避免大的对比造成强烈的视觉刺激
,可以在深夜环境下获得更好的感知度。
 
微信文字信息对比度
微信文字信息对比度
 
(3).百度地图
百度地图的暗色模式主要是为了适应
在夜间使用导航时,减少屏幕亮度对驾驶员视觉的影响
避免产生视觉疲劳或短暂的视觉致盲现象
。开启这一模式后,百度地图的界面颜色会变为深色背景,以降低整体亮度,从而提供更舒适的视觉体验。
比亚迪上搭载的百度地图界面
比亚迪上搭载的百度地图界面
 
(4).淘宝
电商类应用上,大量的商品图片和视频都是以浅色背景为主。如果只是把背景变为深色就会十分刺眼,但是如果挨个调整商品图片,则工作量十分巨大。淘宝
通过“语义化颜色”(Semantic Colors)进行适配
。所谓语义化颜色,就是
不再通过某一色值来描述颜色,而是通过用途来描述
,让界面元素可以自动适配当前的外观。
淘宝的深色模式
淘宝的深色模式
 
(5).抖音
界面采用暗色模式是由于暗色背景在低光环境下对眼睛的刺激更小,用户在夜间使用应用时会觉得更加舒适。同时,采用暗色模式可以减少界面干扰,用更简单的交互方式
提高用户沉浸式观看体验
。这
促使用户在晚上更多地使用抖音
,从而延长用户在应用上停留的时间。
抖音的双色模式,默认为暗色模式
抖音的双色模式,默认为暗色模式
 
2.国外案例
(1).Google
Material Design的设计规范中新增了暗色主题,它使用大面积的深色来构成界面,
作为产品默认主题的补充
。这种设计不仅能改善视觉人体工程学,还能在某些情况下节省电池电量,特别是对于配备OLED屏幕的设备来说。
Google Material Design设计规范
Google Material Design设计规范
 
(2).X/Twitter
目前提供了两种深色模式
:分别是“昏暗(Dim)”和“熄灯(Light out)”,前者背景色为深灰色,后者基本是纯黑色。马斯克在X发文宣布,该平台很快将只有“暗黑”模式,它在各个方面都更好,改动后暗黑模式将成为默认且唯一可用的主题。
Dim与Light out的区别
Dim与Light out的区别
 
(3).Youtube
之前在IOS系统上的大量耗电一直被用户诟病,在推出深色模式后,相较于亮色模式
能节约60%的电量
。同时,浅色的留白容易引起视觉疲劳,与内容本身抢夺视觉重点,在深色模式下,
视频内容本身会被突出得更彻底
Youtube的全新暗色模式
Youtube的全新暗色模式
 
(2).E-Trade
在 2018 年的时候,一家客户关系管理(CRM) 软件服务提供商 SalesForce 的设计师想知道开发仪表板功能时采用哪种模式会最好。于是他们采访了许多用户,事实证明,
用户对黑暗主题下的图表反应会更快并且更精准。
这一点在股票交易软件上也得到了验证,目前来看
全世界绝大多数的股票软件采用的都是负极性,也就是暗色底的设计方式
。红色和绿色代表的涨或跌(不同国家颜色表示可能不一样)在这样的深色背景下就会特别显眼。还有一些颜色比如蓝色用于某些数据的走势图。
证券/股票交易类应用通常采用暗色界面
证券/股票交易类应用通常采用暗色界面
 
三、设计工具与资源
1.Sketch插件
(1).Sketch Midnight
Sketch Midnight Mac正式版是款针对Sketch打造的主题插件。Sketch Midnight Mac最新版为你的Sketch增加
精美的替换主题,自定义选择颜色,自定义画布黑暗等
。并且Sketch Midnight Mac中用户还可以设置画布的明度(纯黑或灰色调画布)以得到最佳主题展示效果。
「大厂设计师」教你一文读懂暗色模式
 
 
(2).Sketch Dark Mode Plugin
这是一个
专门用于生成深色模式版本的文档
的插件。它可以加快设计工作流程,并帮助你立即创建出精美的深色模式设计,而且操作简便,没有繁琐的界面。
「大厂设计师」教你一文读懂暗色模式
 
 
(3).Sketch Toolbox
虽然这个工具主要是用来管理和组织Sketch插件的,但它也
提供了一些与暗色模式相关的插件
,可以帮助设计师更好地管理和维护他们的设计项目。
「大厂设计师」教你一文读懂暗色模式
 
 
(4).Frontify
虽然Frontify主要是一个品牌管理工具,但它也提供了一些功能,如基于Web的样式规范和UI设计模式库,这些功能可以
帮助设计师在创建暗色模式设计时保持一致性和标准化
「大厂设计师」教你一文读懂暗色模式
 
 
2.在线工具
(1).Adobe Color
Adobe Color是一个在线工具,它可以
帮助设计师创建和测试色彩方案
,包括暗色模式的配色。您可以使用它来生成、预览和分享配色方案。
「大厂设计师」教你一文读懂暗色模式
 
 
(2).Coolors
Coolors是另一个在线配色方案生成器,它提供了
快速生成和调整配色方案
的功能,非常适合用于暗色模式的设计。
「大厂设计师」教你一文读懂暗色模式
 
 
(3).Material Design Color Tool
由Google提供的Material Design Color Tool可以帮助设计师根据Material Design指南
创建色彩方案,包括暗色主题的配色
「大厂设计师」教你一文读懂暗色模式
 
 
总结
    随着用户对界面设计要求的提高,暗色模式以其减少视觉疲劳和增强内容可读性的优势,在UI设计中越来越受欢迎。它不仅为用户带来了全新的视觉体验,也为设计师提供了创新的空间。
    未来,暗色模式有望成为更多应用和系统的标准配置,设计师们将更加重视其创新和优化,以提供更优质的用户体验。我们应紧跟这一趋势,探索新的色彩搭配和布局,满足用户的需求和偏好。
    总之,暗色模式在UI设计中的应用和优势已经得到了广泛的认可。作为设计师,我们应该把握这一趋势,不断提升自己的设计能力,为用户创造更加美好的数字生活。


作者:阿琳01
链接:https://www.zcool.com.cn/article/ZMTYxMzg5Mg==.html
来源:站酷
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。

蓝蓝设计(www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计B端界面设计桌面端界面设计APP界面设计图标定制用户体验设计交互设计UI咨询高端网站设计平面设计,以及相关的软件开发服务,咨询电话:01063334945。我们建立了一个微信群,每天分享国内外优秀的设计,有兴趣请加入一起学习成长,咨询及进群请加蓝小助微信ben_lanlan。

WechatIMG27.jpg

关键词:UI咨询UI设计服务公司软件界面设计公司、界面设计公司、UI设计公司UI交互设计公司数据可视化设计公司用户体验公司高端网站设计公司银行金融软件UI界面设计能源及监控软件UI界面设计气象行业UI界面设计轨道交通界面设计地理信息系统GIS UI界面设计航天军工软件UI界面设计医疗行业软件UI界面设计教育行业软件UI界面设计企业信息化UI界面设计、软件qt开发软件wpf开发软件vue开发

日历

链接

个人资料

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

存档