同理心案例及故事分享_神经形态,视觉可及性和同理心

同理心案例及故事分享

“A good UX designer has empathy”.

“优秀的UX设计人员具有同理心”。

This is something every UX designer has heard at some point in their career. Empathy helps us get into the mindset of the user and build solutions that solve real problems. By having empathy, designers gain a deeper understanding of the user and can advocate for what’s truly important to them.

这是每个UX设计师在职业生涯中都曾听到的东西。 同理心可以帮助我们进入用户的思维定势,并建立解决实际问题的解决方案。 通过同理心,设计师可以更深入地了解用户,并可以倡导对他们真正重要的东西。

Neumorphism is the modern derivation of skeuomorphism, the concept of modeling designs after their real-world equivalent. Empathy is embedded in the idea of skeuomorphism. It’s about taking something novel to your users and designing in a way they already understand. This can be an excellent way for designers to help build a conceptual model that their users can understand and relate to. An example of this is the computer “desktop” as designed by Steve Jobs in the '80s, which uses the idea of a real-life desktop as a metaphor, complete with a trash can to move unwanted ‘files’ into, files as places to put content into and folders to put files into.

拟态是拟态的现代派生,拟态是在现实世界中对设计进行建模的概念。 同理心植于拟态思想中。 这是关于为您的用户带来新颖的东西,并以他们已经理解的方式进行设计。 对于设计师来说,这可能是一种极好的方式,可以帮助他们构建一个用户可以理解和联系的概念模型。 一个例子就是80年代史蒂夫·乔布斯(Steve Jobs)设计的计算机“桌面”,它以现实生活中的桌面为隐喻,并带有垃圾桶,可将不需要的“文件”移入文件中放入内容和文件夹以放入文件。

What started out as an effort to assimilate users into an uncertain environment has led to what we now know as “Neumorphism”, a low contrast, pastel color doting, minimalistic version of its predecessor. As designers, it is our job to design inclusive interfaces and as the golden saying goes, “You are not your users”. This is why the trend of Neumorphism has been so fascinating; it breaks affordances and sacrifices usability and accessibility for the sake of visual design. It tears down all of the empathy that went into skeuomorphism.

最初是为了将用户吸收到不确定的环境中而导致的,现在我们称为“ Neumorphism”,即低对比度,柔和的颜色点缀,其前身的简约版本。 作为设计师,设计包容性界面是我们的工作,俗话说“您不是您的用户”。 这就是为什么神经变态趋势如此迷人的原因。 为了视觉设计,它破坏了功能并牺牲了可用性和可访问性。 它推翻了所有进入拟态的同理心。

As new trends in visual design come into the limelight, we can sometimes be lost in their shiny newness and end up getting caught up in trends that can hurt our users. As humans, the things we cannot experience for ourselves are foreign and often reside in the back of our minds, but with 217 million people worldwide with vision impairments, it’s essential for us to design for accessibility and bring these problems to the forefront.

随着视觉设计的新趋势成为众人瞩目的焦点,我们有时可能会因为它们闪亮的新颖性而迷失方向,最终陷入会伤害用户的趋势。 作为人类,我们自己无法体验的事物是陌生的,通常驻留在我们的脑海中,但是全球有2.17亿视力障碍的人,对我们而言,设计无障碍环境并将这些问题置于最前沿至关重要。

By now, you’ve probably read many articles and comments detailing exactly why Neumorphism is an affront to accessibility. Still, I want to reframe the problem, bring in empathy, and put us all in the shoes of our users. Let’s experience the Neumorphic user experience from the eyes of people with visual impairments.

到目前为止,您可能已经阅读了许多文章和评论,详细说明了为什么Neumorphism冒犯了可访问性。 尽管如此,我还是想重新构想问题,带来同情心,并让我们所有人都为我们所接受。 让我们从视觉障碍者的眼中体验Neumorphic用户体验。

For this experiment, I used the No Coffee Visual Simulator. This is a cool web extension that lets you simulate what different visual impairments might be like.

在此实验中,我使用了No Coffee Visual Simulator。 这是一个很酷的Web扩展程序,可让您模拟不同的视觉障碍。

NOTE: These simulations may not be 100% accurate, but they provide an idea of what low visibility might look like.

注意:这些模拟可能不是100%准确的,但是它们提供了低能见度的概念。

白内障 (Cataracts)

A cataract is the cloudiness of the eye lens. The symptoms can also be double vision and blurriness. I set the cataract feature to 10, which is about 50% on the extension.

白内障是眼镜的浑浊。 症状还可能是双眼和模糊。 我将白内障功能设置为10,大约是扩展的50%。

Cataracts: Neumorphism vs Higher contrast interface — higher contrast is easier to see

糖尿病性视网膜病变 (Diabetic Retinopathy)

Diabetic Retinopathy is the vision loss associated with diabetes, and it’s characterized by spots and floaters in the vision. I set the diabetic Retinopathy setting at 50%.

糖尿病性视网膜病是与糖尿病相关的视力丧失,其特征是视力中有斑点和漂浮物。 我将糖尿病性视网膜病变设置为50%。

Diabetic Retinopathy: Neumorphism vs Higher contrast interface — higher contrast is easier to see

青光眼 (Glaucoma)

Glaucoma results from damage to the optic nerve. It is characterized by tunnel vision in advanced cases. I set the glaucoma setting to 50%.

青光眼起因于视神经损伤。 在晚期病例中,其特征是隧道视野。 我将青光眼设置为50%。

Glaucoma: Neumorphism vs Higher contrast interface — higher contrast is easier to see

低敏度和低对比度 (Low Acuity & Low Contrast)

This experiment tested blurry vision and low contrast at levels 4 for both settings.

该实验测试了两种设置下4级的视力模糊和低对比度。

Low acuity & Low contrast vision: Neumorphism vs Higher contrast interface — higher contrast is easier to see

As depicted, in every variation, the higher contrast design is easier to see. The low contrast colors famously used in Neuromorphism blend together and make it harder to understand the interface.

如图所示,在每个变体中,较高对比度的设计都更容易看到。 在Neuromorphism中使用的著名的低对比度颜色混合在一起,使界面难以理解。

This is just a cursory look into why Neumorphism is getting so much hate. Although I visually showed the visual accessibility issues with Neumorphism, there are other issues with affordance and cognitive load.

这只是粗略研究一下为什么同态性会引起如此多的憎恶。 尽管我从视觉上展示了神经变形的视觉可及性问题,但在负担能力和认知负担方面还有其他问题。

With 217 million individuals with moderate to full vision impairment and 1.1 billion individuals with near-visual impairment, it is vital to consider the needs of these users.

有2.17亿中度至全视力障碍者和11亿近视力障碍者,考虑这些用户的需求至关重要。

I hope these images helped you empathize with people with visual impairments and see why Neumorphism, although beautiful, is harmful in the long run.

我希望这些图像能帮助您对视力障碍的人产生同情,并了解为什么“神经形态”虽然美丽,但从长远来看却有害。

翻译自: https://uxdesign.cc/neumorphism-visual-accessibility-and-empathy-d1c5ed2a1f03

同理心案例及故事分享

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/275525.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

纯CSS实现beautiful按钮

大家好,我是若川。邀你进源码共读群学习交流。今天分享一篇好文。可收藏~近期工作中遇到一个需求——实现一些酷炫的按钮,看到效果图之后,按钮确实漂亮,有弹跳、颜色渐变、扫光、霓虹灯,瞬间激起了我的好奇…

linux的内核有多小,Linux 内核有小bug?

今天读着读着Linux代码,竟然无意中发现Linux 0.11内核有个小bug,呵呵,人非圣贤孰能无过。// 在目录项数据块中搜索匹配指定文件名的目录项,首先让de 指向数据块,并在不超过目录中目录项数// 的条件下,循环执…

菜单窗口_菜单

菜单窗口The Hamburger Menu widget is on every other site nowadays. It has become synonymous with the web and, perhaps even more so, with web development. Have, for instance, a look at Dribbble or Codepen. There you’ll find a fair share of examples. They c…

怎么在PDF上修改文字,PDF修改文字的步骤

怎么在PDF文件上修改文字呢?其实现在的很多的PDF文件上会出现文字错误的情况,想要修改PDF文件上面的文字却不知道怎么修改,想要修改PDF文件还是比较简单的,使用专业的PDF编辑器就可以进行操作了,下面小编就为大家分享一…

读完 Vue 发布源码,小姐姐回答了 leader 的提问,并优化了项目发布流程~

大家好,我是若川。这是 源码共读 第三期活动,纪年小姐姐的第三次投稿。纪年小姐姐学习完优化了自己的项目发布流程,而且回答了leader对她的提问,来看看她的思考和实践。第三期是 Vue 3.2 发布了,那尤雨溪是怎么发布 Vu…

小程序 富文本自适应屏幕_自适应文本:跨屏幕尺寸构建可读文本

小程序 富文本自适应屏幕Many of you may already know about responsive web design. Cited from Wikipedia, responsive web design (RWD) is an approach to web design that makes web pages render well on a variety of devices and windows or screen sizes. The respon…

Vue、React 之间如何实现代码移植?

大家好,我是若川。面对前端最火的两个框架,学 React 还是 Vue ?这可能是每个前端人都曾纠结过的问题。不过,现在你不用纠结了——因为很多公司都是两个框架都有大量的应用,取决于不同团队的技术选型,特别是…

linux mariadb 乱码,配置mariadb远程访问权限,解决数据库乱码问题

配置mariadb远程访问权限:1)登录数据库:# mysql -uroot -p2)配置授权数据库用户远程访问权限,%表示所有远程IP,也可以指定IP。WITH GRANT OPTION表示mysql数据库的grant表中重新加载权限数据:GRANT ALL PRIVILEGES ON *.* TO 用户…

平面设计师和ui设计师_游戏设计师的平面设计

平面设计师和ui设计师Design is a very ancient practice, but graphic design really found its core principles post World War One. Games are also very ancient but video games are still finding their feet. I think graphic design has a few things to teach people…

java合成海报的工具类

2019独角兽企业重金招聘Python工程师标准>>> package io.renren.common.utils;import cn.hutool.core.lang.Console; import io.renren.modules.oss.cloud.OSSFactory;import javax.imageio.ImageIO; import javax.imageio.stream.ImageOutputStream; import java.a…

a说b说谎b说c说谎说d说_说谎的眼睛及其同伙

a说b说谎b说c说谎说d说The eye is a complex and temperamental organ. By the end of this article, designers will have a better understanding of how the eye works with the brain, how it deconstructs images that the brain stitches back up again, and how the two…

一名运营,自学一年前端,成功入职杭州某独角兽企业,他的面试经验和学习方法等分享...

大家好,我是若川。这是我的微信群里小伙伴年年 的投稿。他是19年毕业,之前做的是运营相关的工作,在我的交流群里非常活跃,自学一年前端,目前成功转行入职杭州一家独角兽企业。相信他的文章能带给大家一些启发和激励。0…

百度指数可视化_可视化指数

百度指数可视化Abstract:– Analysis of the visual representations of exponentials.– Proposals to solve current visualization issues.– Call to discussion to come up with a better visual representation convention.抽象: –分析指数的视觉表示形式。…

阿里云谦大佬:时间精力有限的情况下如何高效学习前端?

大家好,我是若川。最近组织了源码共读活动1个月,200人,一起读了4周源码,欢迎加我微信 ruochuan12 进群参与。今天分享一篇阿里云谦大佬的文章。昨天在群里也有小伙伴说到:大佬们是需要什么学什么,新手一般是…

sketch钢笔工具_Sketch和Figma,不同的工具等于不同的结果

sketch钢笔工具We like to compare the difference between various design programs and debate about which one is the most powerful. But we often forget to reflect on how using one of these tools is impacting our product. A powerful artist would say that he ca…

程序下载

Zaxis终端前置机 版 本下 载特 性1.20.1104.102ZaxisSetup.rar 分类: 程序下载转载于:https://www.cnblogs.com/baijinlong/archive/2011/05/13/2045263.html

提升效率的Vue组件开发和实战技巧

大家好我是若川。现在的大前端时代,是一个动荡纷争的时代,江湖中已经分成了很多门派,主要以Vue,React还有Angular为首,形成前端框架三足鼎立的局势。Vue在前端框架中的地位就像曾经的 jQuery,由于其简单易懂…

linux下telnet失败怎么处理,CentOS下telnet退出失败的解决办法

最近有CentOS用户反映在调试网络程序时出现了问题,服务虽然启动了,但客户端却无法连接上,用telnet连接后发现是Windows防火墙的问题,可是用telnet命令连接成功后发现退不出去了,这该怎么办?下面小编就给大家…

figma下载_Figma中的动态内容和颜色

figma下载First off, why use dynamic data?首先,为什么要使用动态数据? It’s easy to create and manage long lists of content 创建和管理一长串内容很容易 You get a better idea of what your product will look like with actual data 通过实际…

你可能不知道的package.json

大家好,我是若川。最近组织了源码共度活动:1个月,200人,一起读了4周源码,参与的小伙伴都表示收获很大。如果感兴趣可以点击链接扫码加我微信 ruochuan12。今天推荐一篇相对简单的文章。前言在上一篇npm init vitejs/ap…