B端界面设计文章及欣赏

B端设计—常见问题&解决方式

博博

一、UI设计师在B端产品界面设计时,可能会遇到的问题。
 
1.1复杂的数据可视化需求
B端应用往往涉及复杂数据,设计师需要创造清晰且有效的方式来显示这些信息。
对于B端产品设计中复杂的数据可视化需求,一个详细的解决方案需要从不同层面进行考虑和实施:
理解用户需求:
首先,进行深入的用户研究以理解不同用户的数据需求。这可能包括用户访谈、观察和问卷调查,以收集关于他们如何理解和使用数据的信息。
选择合适的图表类型:
根据数据类型和用户需求选择最合适的图表类型。例如,时间序列数据适合折线图,而比较数据则可能更适合条形图或饼图。同时,对于更复杂的数据关系,可能需要使用散点图、热图或树状图。
简化设计:
避免过度装饰的图表。使用清晰的轴标签、标题和图例,确保用户能够轻松读懂图表。选择合适的颜色方案来增强可读性,同时避免使用令人分心或误解的颜色组合。
增加交互性:
交互式元素可以大大增强数据可视化的效果。例如,当用户将鼠标悬停在图表的某个部分时,可以显示详细的数据点信息。此外,可以允许用户通过筛选、排序或拖动来自定义视图。
提供上下文和引导:
确保每个图表都有足够的上下文信息,比如引导性文本或简短的分析,帮助用户理解数据背后的故事。这不仅包括图表本身的解释,还包括如何使用图表进行有效决策的指导。
优化性能:
对于处理大量数据的可视化,确保性能优化是至关重要的。这可能涉及后端数据处理优化、前端渲染优化以及合理的数据加载策略。
用户测试和反馈:
设计完成后,进行用户测试以收集反馈。观察用户如何与数据可视化交互,并根据他们的反馈进行调整。这是一个持续的过程,旨在不断提高可视化工具的有效性和用户满意度。
B端设计—常见问题&解决方式
可以找到大量的参考选择适用自己产品风格的可视化,之后进行修改。
 
1.2深层级的功能集成
与C端产品相比,B端产品可能有更深层次和复杂的功能,难以设计简洁直观的用户界面。
对于UI设计师在进行B端产品界面设计时遇到的“深层级的功能集成”问题,一个详细的解决方案需要包括以下几个关键策略:
模块化设计:
通过将复杂功能分解为独立、可重用的模块,可以简化界面并提高可维护性。每个模块应专注于单一功能或任务,从而使整体系统更加清晰易懂。
清晰的信息架构:
建立一个逻辑清晰的信息架构是至关重要的。这包括创建一个分层的菜单结构,将相关功能组织在一起,并通过适当的命名来指导用户。
分层的导航系统:
为不同层级的功能提供清晰的导航路径。这可能包括主导航菜单、次级导航以及面包屑导航等,帮助用户理解他们在应用中的位置以及如何访问特定的功能。
搜索功能:
随着功能数量的增加,提供一个强大的搜索工具变得尤为重要。这可以帮助用户快速找到他们需要的特定功能或信息。
自定义和个性化设置:
允许用户根据自己的工作流程和偏好来自定义界面。这包括选择要显示的模块、调整布局以及设置快捷方式等。
交互式教程和帮助文档:
为新用户提供交互式教程,帮助他们快速了解如何使用应用。同时,提供详细的帮助文档和FAQ,以便用户可以自助解决问题。
用户测试和反馈:
持续进行用户测试和收集反馈,了解哪些功能集成方式有效,哪些需要改进。根据用户的反馈不断调整和优化界面设计。 通过实施这些策略,UI设计师可以有效解决深层级功能集成的问题,创造出既强大又易于使用的B端产品界面。
B端设计—常见问题&解决方式
 
1.3用户习惯差异
B端用户可能来自不同行业,具有不同的操作习惯和偏好,满足所有用户的需求挑战较大。
针对B端产品界面设计中的“用户习惯差异”问题,一个详细的解决方案应包括以下几个步骤:
深入用户研究:
通过访谈、问卷调查、用户观察和分析用户数据来理解不同用户群体的习惯和需求。这些研究帮助揭示不同行业、角色和经验水平的用户如何与产品互动。
多样化的设计解决方案:
根据研究结果,设计可以适应不同用户需求的界面。这可能涉及提供多种布局、导航样式和交互方式供用户选择。
个性化和定制功能:
允许用户根据个人偏好调整界面,包括主题、布局、快捷方式和默认设置等。
清晰的指导和帮助:
为了帮助用户理解如何使用产品,提供详细的帮助文档、FAQ和交互式教程。
持续的反馈循环:
设立机制收集用户反馈,定期进行用户测试,并根据反馈迭代优化产品。
通过这些策略,UI设计师可以更好地应对用户习惯的差异,创造出既满足用户需求又易于使用的B端产品界面。
 
1.4访问权限管理
需要设计复杂的权限设置界面,确保不同级别的用户只能访问特定信息。
针对B端产品界面设计中的“访问权限管理”问题,一个详细的解决方案应该包括以下几个关键策略:
深入理解不同角色的需求:
与产品的各种用户群体(如管理者、普通用户、审计员等)进行交流,了解他们对权限管理的需求和期望。
设计灵活的权限框架:
创建一个可以灵活适应不同用户和角色需求的权限系统。这包括定义不同级别的权限,如查看、编辑、管理等,并允许细粒度的控制。
直观的权限配置界面:
为管理员设计一个清晰、直观的界面,让他们可以轻松分配和调整权限。提供明确的指示和反馈,确保管理员理解每种权限的含义。
透明的用户权限指引:
向用户清晰显示他们的权限等级和可以访问的内容。当用户尝试进行超出权限的操作时,提供友好的错误消息和指引。
权限变更的审计和记录:
记录所有权限的更改历史,以便于追踪和审计。这对于保障系统安全和满足合规要求非常关键。
持续的测试和反馈:
定期进行权限系统的用户测试,收集反馈并根据反馈调整和优化设计。
通过实施这些策略,可以构建一个既强大又易于管理的访问权限系统,从而提升B端产品的安全性、灵活性和用户满意度。
 
1.5多设备兼容
必须确保界面在各种设备和屏幕尺寸上均表现良好,
尤其是需要在宽为1440px和1920px下有效运行。
针对B端产品界面设计中的“多设备兼容性”问题,一个详细的解决方案涉及多个层面。
首先,采用响应式设计原则
,确保界面元素和布局能够根据不同的屏幕尺寸和分辨率自动调整。
其次,对于关键功能,进行彻底的跨平台测试,包括不同操作系统、浏览器和设备类型,确保功能的一致性和稳定性。
另外,考虑到触控和非触控设备的交互差异
,设计时应确保按钮和其他控件大小适中,易于操作。
通过这些综合策略,可以有效解决多设备兼容性问题,提升用户的整体体验。
 
1.6专业术语和内容
针对B端产品界面设计中的“专业术语和内容”问题,一个详细的解决方案包括深入行业研究,确保使用对目标用户群来说准确、相关的术语。
与此同时,与行业专家合作,以验证内容的准确性和适用性,确保信息传达清晰无误。
设计时,考虑到不同用户的知识背景,提供容易理解的解释或工具提示,对复杂术语进行简化。此外,创建全面的帮助文档和在线教育资源,帮助用户深入理解专业内容。
定期更新内容,确保与行业发展保持同步,同时收集用户反馈,不断优化和调整术语和内容的使用。通过这些方法,UI设计师可以在确保专业准确性的同时,提升用户的理解和操作效率
 
1.7交互复杂性
了解用户:
深入理解B端用户的工作流程和任务需求。B端用户往往更关注效率和功能,因此设计师需要明确用户的专业性和任务目标。
简化流程:
尽管B端应用可能功能复杂,但设计师应努力简化用户流程。这包括创建直观的导航系统,减少不必要的步骤,以及提供清晰的指引。
模块化设计:
将复杂功能拆分成独立的模块或组件。每个模块专注于一个具体任务或功能,用户可以根据需要组合使用它们。
定制化和个性化:
允许用户根据自己的需求和偏好定制界面和功能。例如,提供可定制的仪表板,让用户可以选择对他们最重要的信息和工具。
清晰的视觉层级:
通过颜色、大小和布局等视觉元素创建清晰的层级,帮助用户理解信息的重要性和操作的先后顺序。
 
二、不同的B端产品所面对的问题也不一样
 
不同B端产品可能面临的问题包括用户角色多样化、数据密集、严格的安全要求、高度定制的工作流程和快速变化的行业规范。在B端产品设计中,UI设计师可能面临的问题和注意事项举例:
ERP系统:
可能出现的问题包括复杂的数据集成和大量的用户角色。设计时应注重清晰的数据可视化和灵活的权限设置。
医疗保健平台:
面临严格的合规和隐私要求。设计应确保数据安全性,同时提供易于理解的导航和专业术语解释。
金融管理软件:
需要处理复杂的交易和报告。应关注于精确的数据展示和高效的任务流程设计。
CRM系统:
需管理大量客户数据和销售流程,可能面临数据整合和用户个性化需求的问题。设计时应侧重于清晰的数据组织和自定义视图。
供应链管理软件:
可能面临复杂的物流数据和多级用户访问问题。解决方案包括强大的数据过滤功能和灵活的权限设置。
项目管理工具:
需处理不同项目和任务的组织,可能面临用户协作和进度追踪的挑战。设计应侧重于简化的任务管理界面和实时更新功能。
财务报告系统:
可能遇到的问题包括复杂的财务数据展示和各种报告格式的需求。设计时应注重灵活的报告工具和定制的数据仪表板。
教育管理平台:
面临多样化的用户群体和教育内容的问题。设计应提供清晰的课程导航和易于访问的教学资源。
工业监控系统:
可能面临实时数据流和高级监控功能的需求。设计时应重视数据实时更新和高效的警报系统。
作者:张阳光Designer
来源:站酷

 

 

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

关键词:UI咨询UI设计服务公司软件界面设计公司、界面设计公司、UI设计公司UI交互设计公司数据可视化设计公司用户体验公司高端网站设计公司

银行金融软件UI界面设计能源及监控软件UI界面设计气象行业UI界面设计轨道交通界面设计地理信息系统GIS UI界面设计航天军工软件UI界面设计医疗行业软件UI界面设计教育行业软件UI界面设计企业信息化UI界面设计、软件qt开发软件wpf开发软件vue开发

 

4个步骤,总结B端设计师的竞品分析方法|北京蓝蓝UI设计公司

周周

竞品分析方法很多,但大多数是偏向 B 端产品经理方面的或者是 C 端设计师的,真正在 B 端设计中的方法比较少,这次为大家介绍适合 B 端设计师使用的竞品分析方法。

高端网站设计公司蓝蓝设计:关注并改善残疾人用户体验

博博

在医疗行业中,残疾人用户面临着许多挑战,例如身体不便、视觉障碍、听力障碍等等。为了让他们能够更加方便地使用医疗服务,UI设计师需要考虑到各种不同的因素,并采取相应的措施来提高用户体验。

高端网站设计公司蓝蓝设计:如何将创新技术融入医疗界面设计

博博

随着科技的不断发展,医疗界面设计也正面临着新的挑战和机遇。本文将介绍一些将创新技术融入医疗界面设计的技巧和实例,帮助大家把握未来医疗界面设计的趋势。

高端网站设计公司蓝蓝设计:如何运用色彩提升界面吸引力

博博

在界面设计中,色彩搭配是至关重要的一环。合适的色彩搭配能够让界面更加吸引人,提高用户体验。本文将介绍一些色彩搭配技巧,帮助你提升界面吸引力。

高端网站设计公司蓝蓝设计:引领未来的交互设计

博博

在飞速发展的数字时代,用户界面(UI)设计已经成为一项至关重要的任务。。本文将带你探讨UI设计的最新趋势,如何引领未来的交互设计,创造更加自然、直观且吸引人的用户体验。无论你是UI设计师、开发人员,还是产品经理,都能从中获得启发和灵感。

 

B端设计攻略!16000字干货帮你掌握通用/布局/数据展示三大组件|北京蓝蓝UI设计公司

周周

B 端设计的文章和资料参考,缺少系统性的说明,这是我总结第五篇。本文主要阐述——通用样式、布局和数据展示。

UI咨询公司-蓝蓝设计:顶级秘籍:提升UI设计吸引力的3大绝招

博博

想要让你的UI设计在海量应用中脱颖而出,吸引用户眼球吗?如果你正在寻找提升UI设计吸引力的绝妙方法,那么你绝对不能错过本文!我们将为你揭示顶级UI设计师都不会告诉你的3大绝招,让你轻松掌握提升UI设计吸引力的关键技巧,让你的设计在竞争激烈的市场中独树一帜!

回顾飞书管理后台的更新,这就是一个B端产品的发展史

分享达人

前言

如何了解一款产品是如何发展的?

我从 19 年到 23 年一直在关注飞书,4 年的变化,看到了我们作为设计师,在一款业务不断发展的产品、日益庞大的产品线中,它是如何进行设计的优化。

 

今天我们会结合 4 年产品的竞品截图,通过图片的方式来讲解飞书的交互更新。

 

并且我也是深度使用用户,也尝试揣测每一个改版背后设计师有哪些思考~ 「文末给大家准备了一点小福利,所以一定要看到最后」

 

小 Tips:今天我们主要说的是飞书管理后台,和飞书的客户端无关,这里为了方便描述,就以飞书代替。

初代丨第一版是如何设计的?

 

我记得第一次使用飞书是我司的产品想要寻找新的平台上架,那时候正是飞书刚刚面市商业化,我们老板去参加了飞书内部的无限大会,会议回来后就准备将我们产品上线到飞书,从那时开始我就对它有了个基础的了解。所以我是被迫的~

 

设计特点

在初代版本当中,飞书的设计其实十分有个性,因为当时很少看到如此设计的管理后台。

 

- 卡片内容区域:将飞书的内容区域变为一个圆角的卡片,这种做法即觉得很时髦(当时确实没见过),同时又感觉很不妥,看上去品牌调性不够严谨,果然后面这个方案就被优化了。证明刚开始一个产品问世,也不是做得非常的完美~

 

 

 

- 高饱和度的配色:整体颜色还是以高饱和度为主,无论是 图标 或者是 整体设计,颜色都用的十分靓丽,充斥着大量的 红、橙、黄、绿、紫,这也给人一种不够严谨的视觉形象。

 

 

- 全局导航:这是一个非常新颖的交互,当我们点击右上角的全局导航过后,会展开对应所有的导航信息,按照设计师的结构进行安排,这样我们就能预览所有的导航内容。这种做法当时觉得十分奇特,我也反复使用,但整体的使用感受不佳,因为我的导航信息所有都在左侧,而我要使用全局导航反而在右侧,不太符合使用习惯,后面你会发现这个功能也被砍掉了。

 

 

- 页面区分:页面的区分是整体设计非常重要的一环, 第一版本的飞书主要是通过分割线+投影来解决,你就会发现整体的页面分割不够明确,感觉像分了又没有完全分,也就导致页面当中很难聚焦,用户总是在漫无目的地不停寻找。

 

 

 

整体感受

通过初代的设计你会发现,即使是飞书在第一个版本的时候做得也不算特别好,并且还会有很多优化的空间,因此我们自己在实际的项目当中,刚开始主要还是以快速产出为主,不要有太多顾虑,完美主义也会有很多不完美的情况,就留在后续进行调整。

 

 

过渡丨业务发展是如何设计的

这次管理后台的迭代我记得是在2020年前后,那时候正是疫情的高峰期,也就导致了协同办公类的软件迎来了发展的黄金时期。而之前设计当中的很多问题,都在这一个时候勉强解决。

 

设计特点

- 前后台风格统一:在之前的飞书当中,你会发现 管理后台与桌面端 非常割裂,感觉像是两个产品。而现在通过统一的品牌色,尽可能将它们俩拉到同一起,看上去才像是一个统一的管理后台。

 

 

 

- 布局调整:在整体的交互结构上,做了相应的优化。比如之前的 tabs 与 标题 在整体导航的顶部,感觉其与内容毫无关联,现在的设计将标题下放,更适合大多数产品的使用场景。

 

 

- 面包屑的出现:从截图上我们其实能看到,这个时期的导航菜单已经非常多了,同时层级也会特别的深,因此在设计上通过面包屑来进行优化,先解决目前的燃眉之急,等后续产品业务发展成熟后再统一进行优化。

 

整体感受

这一时期很明显的能够感受到飞书就是在调整过渡,一方面业务发展十分迅速,需要响应;另一方面知道设计存在问题,但是没有太多精力,无法进行大改。这时候就会将用户反馈的所有问题记录下来,站在设计的角度思考方案可能就是我们应该做的。所以有的时候我们目前的方案哪怕有些瑕疵并不要紧,更重要的是如何解决这些瑕疵,汇总记录,等待时机。(毕竟研发资源很难争取...)

 

 

确定丨明确的设计思路

这次改动应该是在 2021 年,明确了未来设计的方向,开始进行大刀阔斧的改动。首先这一时期的飞书产品线急剧增加,据我了解就会有 「考勤、OKR、招聘、绩效、打卡」等多个产品线需要独立的管理后台,因此需要提供一个统一的设计方案,来将这些产品线的风格统一。

 

 

 

 

 

设计特点

 

- 纯白风格:内容部分主要是以纯白风格为主,同时 导航、功能 等辅助信息使用灰色进行呈现,这样我们可以更为聚焦。对比前两个版本发现确实要清晰很多。

 

 

- 降低饱和度:对比之前的设计方案,你会发现目前的设计整体降低了页面的饱和度,同时也明确的品牌的主题色 蓝色,其他颜色进行辅助,这样设计上更为明确,哪些内容为重点一目了然。其实这种风格是值得很多设计师借鉴的,因为现在有太多设计师产出的内容过于视觉,导致和整个品牌调性不相符,就会发现你的设计稿其实挺好,但就是不适合我们产品。

 

- 框架设计更清晰:这时候的内容与结构就会更为清晰,整体的白色突出的是内容部分,我们可以将内容完整的凸显出来。

 

整体感受

这一阶段其实已经非常完整,设计风格上没什么可挑剔的,同时交互结构上没有进行大的调整,更多是将 常用/新加 的功能进行呈现,比如 帮助中心、配置任务 等,都是为了满足特定的业务场景设计的。同时由于产品业务功能较多,你会发现他们提供了一个查看全部的按钮,用于一些 低频 隐藏功能的展示,在导航上尽可能的优化用户的使用体验。

 

整体来说这次改版比较成功,后面也会有很多产品前仆后继的采取这种风格形式,流行了一段时间。

 

 

优化丨基于业务再优化

就在前几天,飞书又进行了设计调整,从这一次改版发现 业务层面 还是有一些问题亟待解决,产品导航过多需要优化,看看飞书它的做法。

 

设计特点

- 导航优化:在之前的版本当中,一级导航菜单有 20+ 个,同时还有会很多其他产品线的管理后台,也就导致飞书管理后台非常的散乱,经常会出现来回不停的跳转。

面对这种情况,之前是采取隐藏+全部导航的思路,但是现如今已经不太能够解决这样的问题,同时飞书的很多产品都需要单独独立的配置项,因此采取页面的拆分,将导航分为 企业管理 与 产品设置。企业管理为产品的基础配置;产品设置则为对于附属产品的设置配置,这样就能让用户更为清晰的理解导航。

 

最后说说,面对导航如此之多,即使再自身的设计师来了也只能增加层级进行优化。木有太多灵丹妙药~ 

 

 

- 视觉调整:因为导航层级的增加,也就导致现在需要凸显顶部导航部分,所以将之前的灰色调整为白色。但感觉目前这个方案理解的难度依然较大,在座的同学们也可以思考一下能否有其他的解决方案。

 

 

 

整体感受

这次飞书将多条产品线打通,满足我能够在一个管理后台里,去配置多个产品的业务。其实这个问题我在之前体验飞书招聘时就发现,这样就能避免产品之前的割裂感,同时统一的交互在后续的 功能业务面市时,也能够快速的产出和响应。

这次的迭代由于有动画的效果,以及新颖的新手引导,整体还是感受还是十分不错。你会发现设计是没有一个终点,我们会根据业务的情况进行设计上的调整。而我们能做的,就是根据一次次的业务要求,去做出合适的设计。

 



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

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

关键词:UI咨询UI设计服务公司软件界面设计公司、界面设计公司、UI设计公司UI交互设计公司数据可视化设计公司用户体验公司高端网站设计公司

银行金融软件UI界面设计能源及监控软件UI界面设计气象行业UI界面设计轨道交通界面设计地理信息系统GIS UI界面设计航天军工软件UI界面设计医疗行业软件UI界面设计教育行业软件UI界面设计企业信息化UI界面设计

软件qt开发软件wpf开发软件vue开发

B端图表设计方法及思考

分享达人

随着大数据的兴起,数据价值的不断挖掘,图表作为数据呈现与分析的有效手段,正扮演着越来越重要的角色,我们在进行B端平台设计时也在思考:如何让图表清晰的传达信息,同时带来美观的视觉感受。

日历

链接

blogger

蓝蓝 http://www.lanlanwork.com

存档