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

同理心案例及故事分享

“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…

帝国cms 打开打开转换表文件失败!

帝国cms 升级到最新版6.6 后 生成列表页面和 搜索 时出现 “打开打开转换表文件失败!” 跟踪文件找到 include($file); 这行代码时出错非常纳闷,这个是php的内部命令啊,跟帝国的编码应该没有关系一直没有再往下细找,只好根据错误提…

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

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

linux raw限制端口访出,使用Linux raw socket时需要注意的一些问题

本文的copyleft归gfree.windgmail.com所有,使用GPL发布,可以自由拷贝,转载。但转载请保持文档的完整性,注明原作者及原链接,严禁用于任何商业用途。作者:gfree.windgmail.com博客:linuxfocus.bl…

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

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

小程序背景图片的坑

本人是前端菜鸟一个,比小白还要白,这完全是自己的经验总结,并不是要给各位分享什么宝贵经验哈,各位大佬不喜勿喷,不然会打击到我的哈哈因为公司要求做几个小程序的页面,我不得不拾起丢弃了几个月的小程序开…

SimpleAdapter类使用方法

SimpleAdapter的构造函数是&#xff1a; public SimpleAdapter (Context context, List<? extends Map<String, ?>> data, int resource, String[] from, int[] to) 官方说明了其各个参数含义&#xff0c;我这里根据自己的理解解释下&#xff1a; 第一个context&…

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

小程序 富文本自适应屏幕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 之间如何实现代码移植?

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

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

配置mariadb远程访问权限&#xff1a;1)登录数据库:# mysql -uroot -p2)配置授权数据库用户远程访问权限&#xff0c;%表示所有远程IP&#xff0c;也可以指定IP。WITH GRANT OPTION表示mysql数据库的grant表中重新加载权限数据&#xff1a;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…

从零开发一个命令行脚手架工具 等

大家好&#xff0c;我是若川。今天周末&#xff0c;话不多说&#xff0c;这一次花了几小时精心为大家挑选了20余篇好文&#xff0c;供大家阅读学习。本文阅读技巧&#xff0c;先粗看标题&#xff0c;感兴趣可以都关注一波&#xff0c;绝对不亏。前端宇宙小编就职于某大厂&#…

linux的HAL库函数,STM32 HAL库 IIC 协议库函数

/* 第1个参数为I2C操作句柄第2个参数为从机设备地址第3个参数为从机寄存器地址第4个参数为从机寄存器地址长度第5个参数为发送的数据的起始地址第6个参数为传输数据的大小第7个参数为操作超时时间 */HAL_I2C_Mem_Write(&hi2c2,salve_add,0,0,PA_BUFF,sizeof(PA_BUFF),0x10)…

pku acm 2140 Herd Sums http://acm.pku.edu.cn/JudgeOnline/problem?id=2140

2140代码短小精悍&#xff1a;#include<stdio.h> int main() { int cnt0,i; long s; scanf("%ld",&s); for(i1;(i1)*i/2<s;i)if((s-(i-1)*i/2)%i0)cnt; printf("%d\n",cnt); return 0; }转载于:https://www.cnblogs.com/Chinese-Coder-C…

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…

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

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

linux下svn relocate,如何进行svn relocate 操作

1。进入工作复本&#xff03;> cd ~/test2。查看仓库地址(URL)&#xff03;> svn info路径&#xff1a;.地址(URL)&#xff1a;http://192.168.28.1/repos/test档案库 UUID&#xff1a;a81f9bed-3506-0410-b369-e50476f75162修订版&#xff1a;44节点种类&#xff1a;目录…