B端界面设计文章及欣赏

超全面、超详细的B端筛选设计|北京蓝蓝UI设计公司

分享达人

当然产品本身也是随着实际业务场景的变化,从而考虑设计不同的形式来达到该功能的使用。产品需要优化,交互和布局同样需要优化,所以在B端产品中并不是一个同样的功能就仅限于只有一种解决方案。

对于产品而言,只有参与的项目越多,设计和思考的场景越全面,了解的产品越多,才能更好的掌握一个功能的多种类型和使用场景,这一次能够在原来的基础上更加全面的总结同一个功能的类型和场景,主要是在工作中也有遇到类似的业务场景,加上对其他产品的体验,从而让我更加全面的了解到该功能的多样性。

区块组件-表格页的设计梳理|北京蓝蓝UI设计公司

分享达人

表格的设计,虽然看似简单,但是作为用户最常用的组件之一,我们需要对视觉和交互的精准把握,才能保证用户在使用表格时更加高效表格被公认是展现结构化数据最为清晰、高效的形式。常和按钮、搜索、筛选、分页等其他元素一起协同,构成表格页。表格的设计,虽然看似简单,但是作为用户最常用的组件之一,我们需要对视觉和交互的精准把握,才能保证用户在使用表格时更加高效。

如何给界面做减法,实现B端设计提效效果?|北京蓝蓝UI设计公司

分享达人

首先看我们这次改版的对象:

如何给界面做减法,实现B端设计提效效果?

光凭第一印象,整体效果是还不错的,落实到每个局部的话,布局也是合理的,可以看到是有设计的细节在里面.jpg。

但是,再多看几眼,就会发现整体的效果似乎有点不和谐,但又找不出来问题具体在哪,不知道怎么改下去。问题的根源就是 —— 过度设计。

我们强调过很多次,表盘页的设计是作品集项目中最重要的页面,因为观看者对整体视觉和设计水准的印象是通过它建立起来的,不管你分析怎么写,我们首先关注的肯定也是设计的效果。

但重要不代表需要过度倾注和堆叠视觉元素,过度的设计会让界面看起来有 “飞机” 敢,不仅不真实的印象产生了,还会显得业余不够自信。同时任何项目中表盘页过度设计都会对整个项目造成负担,后续的页面要怎么设计才能不和它产生隔阂,保持一致性。

下面,我们根据原页面进行分析,来找出问题并优化:

问题 1:导航栏的图标

导航的顶部 LOGO 描边没有太大必要,以及图标的设计在这个尺寸下非常的局促,因为细节较多,不仅复杂性提升了,也缺乏图形辨识。

所以改动中,将多余的背景去掉,再简化图标本身的样式。


如何给界面做减法,实现B端设计提效效果?

问题 2:顶栏的设计

顶部栏本身设计单看是没有问题的,但是作为全局栏目和导航栏颜色缺乏区分,而且用了投影来强化层次,就让这个模块的权重被过度放大。

所以我们去掉了背景色,并适当增高栏目的高度,让局部更舒展。

如何给界面做减法,实现B端设计提效效果?

问题 3:统计数字的问题

统计数字在作品展示里用特殊字体很常见,因为要用更美观的字体来呈现重要的信息。但任何页面中的信息权重都要保持阶梯性,不能让加粗、深色、特殊字体几个要素作用在过多的信息上,这就让画面显得非常的“吵”。

所以要对字重和色彩做控制,创造对比来降低视觉的压力。

如何给界面做减法,实现B端设计提效效果?

问题 4:图表的应用

原图中的图表应用有一定的问题,第一个柱状的堆叠类型并不是太符合实际数据应用,下方的环形图中起始位置显然不对,并且色彩比较混乱。

所以是答案对它们做出优化,并调整了一些小细节。

如何给界面做减法,实现B端设计提效效果?

问题 5:配图类型选择

在引导卡片中,用的扁平插画素材一方面不高级,另一方面内容太碎,再加上用奇怪的字体和倾斜,使得这个卡片看起来非常别扭。

改动中替换新的图片素材(临时找的,理解意思就行),同时使用一般黑体的标题,以及增加背景色,来形成新的卡片样式。

如何给界面做减法,实现B端设计提效效果?

问题 6:装饰图标应用

在快速入口和日程模块中,都有使用装饰图标,显然大家也能理解他们对于目前的语境来讲还是细节过多了,所以需要做一些调整,让它们简化。

如何给界面做减法,实现B端设计提效效果?

最后,再加上一些细节的小改动,最终的样式就完成了。


如何给界面做减法,实现B端设计提效效果?

表盘的设计一定要在最后做检查,一些设计感强的元素是否有必要这么做,尤其是类似图标元素,做得很花哨是否对信息的识别能带来帮助?如果不行,那就可以果断的放弃。

表盘页的设计感来自 —— 全局元素和色彩的控制,而不是单一某个局部内容的加强。

文章来源:优设
作者:酸梅干超人

蓝蓝设计建立了UI设计分享群,每天会分享国内外的一些优秀设计,如果有兴趣的话,可以进入一起成长学习,请加蓝小助,微信号:ben_lanlan,报下信息,蓝小助会请您入群。欢迎您加入噢~希望得到建议咨询、商务合作,也请与我们联系01063334945

分享此文一切功德,皆悉回向给文章原作者及众读者.
免责声明:蓝蓝设计尊重原作者,文章的版权归原作者。如涉及版权问题,请及时与我们取得联系,我们立即更正或删除。

蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的UI界面设计BS界面设计 cs界面设计ipad界面设计包装设计图标定制 用户体验交互设计网站建设 平面设计服务UI设计公司界面设计公司UI设计服务公司数据可视化设计公司UI交互设计公司高端网站设计公司UI咨询用户体验公司软件界面设计公司

AIGC | B端视觉设计全攻略-手把手教程|北京蓝蓝UI设计公司

分享达人

人工智能的崭新概念正在逐渐改变我们对设计的认识和实践方式。在这个数字化时代,AI不再仅仅是一种辅助工具,它已经成为设计师的得力助手,能够提供更高效、更智能的设计方案。在B端设计视觉中,AI的应用为我们开辟了一条通向更优质设计的道路,本文将深入探讨如何借助AI技术,辅助设计师完成B端设计视觉。无论你是刚刚踏入设计领域的小白,还是经验丰富的资深设计师,都可以利用AI工具来提升设计效率、优化视觉效果。

B端表单帮助系统多场景应用

分享达人

我们很多时候会在选择设计方案上摇摆不定。自己觉得好的方案,看到别人是另外一种形式,又会觉得自己的是不是不太好。其实没必要,每一种方案都有好与坏,很难做到100%完美,只能说在当前这个阶段里接近完美。

就像小孩有了虫牙,去医院治疗,医生也会说有很多种方案。具体用哪一种会根据年龄、性别、牙齿生长情况来决定。比如:一个6岁的女孩,在不严重的情况下,医生可能就建议清理后补一下;如果是一个5岁的男孩,当前牙齿还不错,距离换牙还有比较长的一段时间,可能会给你放个普通点的牙套保护起来

【B端设计】表单设计的模式及使用场景

分享达人

在B端设计中,表单设计是常见的需求设计,对于B端来说,表单的信息复杂程度会根据业务的实际情况而定,常见的简单表单设计只需要将表单的字段平铺在页面中,用户输入相关信息即可完成表单的任务。但是B端的实际业务中,表单的需求有简单也有非常复杂的场景,如果都采用简单的平铺方式,必定会让表单填写任务变得难以操作。对于不同的表单模式使用的业务场景不同,但是表单的呈现方式也具有多种选择,并且适用的场景也不同。下面我总结了三种不同的表单展示方式,四中表单的呈现方式以及应用场景。

如何进行表单体验优化-中台系统

分享达人

本篇文章将分享Web端表单体验优化等相关内容,分析设计师在设计B端类产品时如何让用户愉悦并高效的填写表单。表单作为基础通用组件,也是在各个企业级中台中出现频率最高的元素之一。在用户界面中表单无处不在,比如:用户注册登陆页、支付页、用户反馈、共享信息数据录入等不同类型的表单。当我们使用/设计表单页面时看似是按钮、输入框等表单组件进行组合搭配使用,看似简单,但是在实际业务使用中却有着无数可推敲的细节冒出来,常常给设计师造成较多的困扰。

后台表单设计中的思考

分享达人

表单页作为B端设计中常见页面之一,在设计过程中如何解决用户的问题如何降低使用者的录入负荷。一点小小的经验供大家参考~在使用表单组件、或设计表单页面时,很多设计者都是根据自己的直觉或者个人经验本能驱动解决排列、布局的一些问题。但又会有很多的疑惑会从过程中冒出来困惑设计师,导致自己的设计很难使产品、开发等信服。每一个设计都离不开解决某问题或达到某个预期,好的表单设计往往都能让用户快速get到关键信息同时快速准确录入信息,降低使用者填写负荷。带着这样的设计目的结合业务内容将表单进行分组,结合适当的设计策略,这样能使设计方案更加有理有据。

网页后台设计:列表设计、表单设计

分享达人

一个完整的后台,由菜单/导航、数据/图形展示、表格、表单、控件/组件以及弹窗等构成,下面跟大家分享后台中的表格和表单的设计细节当接到一个全新的网页后台项目时,首先确定设计风格,然后考虑这个后台尺寸是做居中固定式,还是全屏响应式(上一篇文章已经跟大家分享了网页设计的画布尺寸)。全屏响应式的网页设计,选择怎么样的屏幕来做效果,就显得有些主观了,除非有规定,否则你可以选择任意主流尺寸作为基尺寸来设计网页。当然,不管选择什么尺寸,都得基于做好一个后台而开展工作。

日历

链接

blogger

蓝蓝 http://www.lanlanwork.com

存档