首页

如何组合元素,才能搭配出好看有设计感的画面?|北京蓝蓝UI设计公司

周周

咱们这章就重点说说如何组合元素搭配出有设计感又实用的构图,希望你看完之后能有所收获。

个人主页头部,应该如何设计?

博博

个人主页头部与其说是一个组件,不如说是「在个人页中一块聚合信息的区域」,因为绝大多数带个人社交主页的App,都采用了类似的做法,或有相似的框架,所以我们可以在这里讨论这一区域的通用设计方法。

弹窗设计方式详解

博博

弹窗是一种瞬态的交互式视图,它会在“合适”的时间弹出到页面的最顶层,并借由用户的一次点击完成关闭。

 

学会这个思路,什么图片素材都能拿来用!|北京蓝蓝UI设计公司

周周

今天要讨论的话题主要是关于点线面分布分析,这部分知识主要是针对空间层面的,学会后真的可以做到任何一张图都能拿来直接做。好啦闲话不多说下面开始今天的内容。

 

如何快速提高版式设计能力?总结了3个方面!|北京蓝蓝UI设计公司

周周

下面将从 01、版式的组成;02、构图的平衡;03、设计的原则三个方面介绍版式设计的创作思路。

UI必看!帮你快速掌握弹窗组件的设计方式|北京蓝蓝UI设计公司

周周

弹窗是一种瞬态的交互式视图,它会在“合适”的时间弹出到页面的最顶层,并借由用户的一次点击完成关闭。在我们习惯的语境中,弹窗仅指模态弹窗,故这里不讨论那些看上去也是弹出式却非模态弹窗,那些控件均有自己专门的分类,例如 Toast (吐司提示)。

 

web设计-弹窗/抽屉的使用

博博

弹窗最主要的功能就是服务于当前主任务之外的支线任务,包括信息传递,操作反馈等。对话框,警告框,toast......都属于弹窗,但是使用场景都不一样。在合适的业务场景选择合适的弹窗组件,能够保证最基础的用户体验。因为像强干扰类弹窗的使用,对用户而言,更是一种强加的任务,很容易导致用户丧失耐心而流失

如何判断一位设计师是否具有产品思维|北京蓝蓝UI设计公司

周周

产品思维是设计师在设计产品时所需具备的关键能力之一。拥有强大的产品思维能力可以帮助设计师更好地理解客户需求,使设计效果更加符合市场需求,从而实现商业成功。那么如何判断一位设计师是否具有产品思维能力呢?

关于一个数据概览的复盘|北京蓝蓝UI设计公司

ui设计分享达人

前言在B端的业务之中,数据概览页面属于常见的页面,对主管有快速查看/查询/决策的左右,对于执行也能查询到KPI是否完成的,防止遗漏的作用。今天就结合业务之中的一个案例,跟大家做一个分享,有不同的意见可以留言或者是私聊沟通(谢谢大家)。业务需求我们团队主要做的OA类型的项目,主要是服务于公司内部的开发团队。随着业务的逐步拓展、用户的角色需求的多样化、角色数量的多样化、团队内部开发团队难度、设计师人手有限等矛盾不断递增,8个数据概览模块面临着体验复杂以及设计开发难度大的问题。涉及到的元素

业务:涉及8个应用,40个页面。
角色分解:QA,IPM,SPM,TMDE,TES,模块owner。
使用场景:管理者汇总团队信息、向上汇报以及分析数据。

现有问题体验不一致,提高管理成本:

架构组件以及样式不同的模块完全不相同,缺少规范性

开发低效,沟通成本高:

组件重复开发,开发成本高
设计师与开发沟通成本高

解决问题解决流程分为:找高频框架通过收集40个页面的布局,结合对执行者与决策者的角色行为进行分析,将所有的页面分为:

数据概览
数据分析
详情查看

重复组件将可视化按照空间分成;

底层:背景
内容层:页头+筛选+图表+表格
顶层:动作按钮

高频样式现有的样式杂乱无章,因此针对现有的样式进行收集和整理分类为布局,色板,字体,将所有的页面所有的元素进行拆解,统计高频样式。分成:

布局:按照业务流程顺序区分
高度:统计导航栏的高度重新计算高度
走向:统计现有浏览器导航高度重新定高度
字体:现有字体尤其是在数字的展现方式区分度不够

组架构组合3个场景并且对页面进行分类,提取其中高频的进行整理继续布局:

数据概览:图表+页头
数据分析:页头+筛选+指标+图表
详情查看:页头+筛选+图表+详细表格

组件组合模块根据业务进行“总-分”形式的:

功能模块
子模块
子功能

上面是针对于常规的功能模块,针对非常规的模块「例如:结果页面」进行更加细化的区分“图表”“表格”“筛选”,再度细分成为主体和变体进行区分。样式组合

布局:将7个常规的布局手链成为2个:“字-左上,图表右下”,“图表左右,注释右边”
高度:以win为例,导航栏分为3栏,再去保证页面的报告率格急性型分组:1920对应的是440,1600对应的是360px,1366对应的是280px
走向:根据统计的数据来,3个模块会出现超过20字的注释或者是标签名,因此延伸出2套解决方案:“自上而下”,和“自下而上”,经过验证邀请几个同学发现自上而下阅读成本低,理解成本更低
字体:现有字体中,常规的默认字体区区分度不高,所以引入了Din作为支持数字呈现的

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

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

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

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

如何通过HMI设计优化驾驶员的注意力和分心|北京蓝蓝UI设计公司

博博

 

一、注意力的定义与其重要性

驾驶员的注意力和分心因素在车辆行驶过程中起着至关重要的作用。理解这些因素可以帮助我们更好地设计车载界面,优化驾驶员的注意力和减少分心。
1、注意力的定义注意力是指个体对特定信息的选择性关注和处理能力。在驾驶过程中,驾驶员需要将注意力集中在道路、交通状况和车辆操作上,以保持对驾驶环境的全面感知和准确判断。驾驶员的注意力是驾驶安全的重要保障,它直接影响着驾驶员对道路情况的感知和对紧急情况的反应能力。
2、注意力的重要性驾驶员的注意力是驾驶安全的关键因素。当驾驶员的注意力集中在道路和交通环境上时,他们能够更好地应对突发状况、减少事故的发生。
然而,许多车辆的控制面板上充斥着过多的按钮、图标和信息,驾驶员往往需要分心去操作和获取所需的信息,这会增加驾驶员的认知负荷,降低他们对道路的关注度。此外,娱乐系统、通信设备和导航系统等功能的设计也可能分散驾驶员的注意力,进一步增加驾驶风险。

二、驾驶分心的分类及最佳实践

1、视觉分心

当驾驶员的注意力从道路上转移到车辆内部或周围环境时,就会发生视觉分心。例如,看手机、调整收音机或寻找物品等。最佳实践:
设计清晰明了的界面,减少对驾驶员视觉注意力的分散。
提供语音控制和手势识别功能,减少对视觉操作的需求。
提供重要信息的高亮显示,引导驾驶员的注意力。

2、听觉分心

当驾驶员的听觉注意力被车内或外部的声音干扰时,就会发生听觉分心。例如,响亮的音乐、电话铃声或警报声等。最佳实践:
提供音量控制和静音功能,使驾驶员能够调整或暂时关闭声音。
使用清晰而明确的声音提示,以帮助驾驶员理解重要信息。
提供语音交互和语音反馈功能,减少对视觉操作和听觉注意力的需求。

3、操作分心

当驾驶员需要进行复杂或分散注意力的操作时,就会发生操作分心。例如,调节座椅、操作车载系统或寻找特定的按钮等。最佳实践:
设计简单易用的界面和操作控件,减少操作的复杂性和误触发的可能性。
提供大而易于点击的按钮和触摸屏,减少操作时的错误和分心情况。
提供语音控制和手势识别功能,使驾驶员能够通过自然的方式与车辆进行交互。

4、认知分心

当驾驶员的思维或注意力被其他事物或任务占据时,就会发生认知分心。例如,担心工作、家庭问题或沉思等。最佳实践:
提供驾驶辅助功能,如盲点监测和自动紧急制动等,以减轻驾驶员的认知负荷。
提供语音提醒和警示功能,帮助驾驶员保持对道路的关注。

三、车上分心动作的风险指数评估

1、分心动作的风险指数评估指标

注意力分散程度:行为会导致驾驶员的注意力从道路上转移出去吗?如果是的话,分散注意力的程度有多大?
执行动作的复杂性:行为需要驾驶员进行多个步骤或操作吗?操作的难度有多大?
执行动作的时机:行为发生的时机会增加驾驶员的负担吗?例如,在交通繁忙或高速驾驶时进行某个动作可能会增加风险。
行为的频率和持续时间:行为的频率和持续时间会对驾驶员的分心程度产生影响。频繁和持续的分心行为可能会增加事故的风险。
行为的紧迫性:行为是否需要立即执行?如果不是紧急情况,驾驶员可以选择将其推迟到安全的停车点。基于以上因素,可以将分心动作的风险指数划分为不同的级别,例如低风险、中风险和高风险。

2、车上常见的行为风险指数

然而,需要注意的是,风险指数是一个相对的指标,不同的驾驶员可能会因其驾驶技能、经验和个人特点而对同一行为产生不同的反应和风险感知。因此,驾驶员应该始终遵守交通规则和法律,尽量避免分心行为,以确保自己和他人的安全。

四、减少用户分心的设计原则

1、直观性和简洁性

界面布局清晰:将重要的信息和功能放置在易于寻找和操作的位置,避免过多的菜单和子菜单层级。
易于理解的图标和标识:使用直观和易于理解的图标和标识,减少对驾驶员的学习和认知负荷。

2、易用性和可操作性

大按钮和简单操作:设计大而易于点击的按钮,减少操作时的误触发和分心情况。
语音控制和手势识别:提供语音控制和手势识别功能,使驾驶员能够通过自然的方式与车辆进行交互,减少对视觉操作的依赖。

3、信息分层和优先级

重要信息的突出显示:将重要的信息以醒目的方式显示在界面上,引导驾驶员的注意力。
信息的分层和分类:根据信息的重要性和紧急程度,将信息进行分层和分类展示,减少驾驶员的注意力转移。

4、视觉引导和反馈

清晰的视觉引导:通过合适的颜色、图标、动画等视觉元素,引导驾驶员进行正确的操作。
即时的反馈和确认:在驾驶员进行操作后,及时给予反馈和确认,确保驾驶员的操作得到正确执行。
遵循这些车载界面设计原则,可以帮助驾驶员更轻松地操作车辆控制面板,减少对信息的解读和理解时间,降低驾驶员的认知负荷,并提高驾驶员对道路情况的关注度。同时,合理分层和展示信息,以及提供清晰的视觉引导和反馈,可以帮助驾驶员更好地理解和处理信息,减少分心情况的发生。

作者:飞凡实验室
来源:站酷

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

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

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

日历

链接

个人资料

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

存档