<?xml version="1.0" encoding="UTF-8"?><rss xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:content="http://purl.org/rss/1.0/modules/content/" xmlns:atom="http://www.w3.org/2005/Atom" version="2.0" xmlns:media="http://search.yahoo.com/mrss/"><channel><title><![CDATA[UX - 葵中剑]]></title><description><![CDATA[Just Sword Wang's Blog]]></description><link>https://swordair.com/</link><image><url>https://swordair.com/favicon.png</url><title>UX - 葵中剑</title><link>https://swordair.com/</link></image><generator>Ghost 3.42</generator><lastBuildDate>Sat, 28 Jun 2025 10:41:46 GMT</lastBuildDate><atom:link href="https://swordair.com/tag/ux/rss/" rel="self" type="application/rss+xml"/><ttl>60</ttl><item><title><![CDATA[滚动 VS 点击]]></title><description><![CDATA[<!--kg-card-begin: markdown--><p><strong>译自</strong> <a href="http://uxmovement.com/navigation/why-scrolling-is-the-new-click/">Why Scrolling is the New Click</a> by anthony</p>
<p>点击和滚动，哪一个对用户更友好？这是一个设计师在设计页面浏览过程时必须考虑的问题。使用点击，给用户一堆链接并把他们带到新的页面；使用滚动，则把所有内容按区块展示在一个单一的页面上。</p>
<p>许多年前，这个问题最简单的回答就是使用点击。通常的考虑是，如果你使得你的你的页面过长，那么用户只会去看去读上半部分而可能只是扫一眼、甚至是忽略下半部分。而今，这有了一些变化，许多用户可以毫无问题的从头滚到尾。相比点击滚动现在变得越来越自然。因为用户的行为一直在变化着，设计师需要在他们的设计里考虑到这些问题。</p>
<p><img src="https://swordair.com/content/images/2013/Dec/scrolling_vs_clicking.png" alt="scrolling vs clicking"></p>
<p>无论是滚动还是点击，都有其优缺点。然而，对于滚动来说，优点多于缺点。对于用户而言，滚动更快。随着鼠标滚轮的滚动以及触摸板滑动，用户可以仅仅通过一根手指的挥动滚过所有的内容，相比之下，点击需要用户找到链接、识别链接、鼠标移动到链接、点击链接然后等待页面加载。</p>
<p>滚动模式里，用户循序获取内容，并能一眼瞥知全貌。点击模式里，用户可以跳过某个链接到达下一页，而避免浏览他们跳过的页面。</p>
<p>滚动保持了用户阅读的连贯性。他们滚动然后继续阅读直到读到了页面的底部。</p>]]></description><link>https://swordair.com/why-scrolling-is-the-new-click-translation/</link><guid isPermaLink="false">59fe0cf19855590d8c914733</guid><category><![CDATA[UX]]></category><dc:creator><![CDATA[Sword Wang]]></dc:creator><pubDate>Sun, 29 Jan 2012 13:40:53 GMT</pubDate><content:encoded><![CDATA[<!--kg-card-begin: markdown--><p><strong>译自</strong> <a href="http://uxmovement.com/navigation/why-scrolling-is-the-new-click/">Why Scrolling is the New Click</a> by anthony</p>
<p>点击和滚动，哪一个对用户更友好？这是一个设计师在设计页面浏览过程时必须考虑的问题。使用点击，给用户一堆链接并把他们带到新的页面；使用滚动，则把所有内容按区块展示在一个单一的页面上。</p>
<p>许多年前，这个问题最简单的回答就是使用点击。通常的考虑是，如果你使得你的你的页面过长，那么用户只会去看去读上半部分而可能只是扫一眼、甚至是忽略下半部分。而今，这有了一些变化，许多用户可以毫无问题的从头滚到尾。相比点击滚动现在变得越来越自然。因为用户的行为一直在变化着，设计师需要在他们的设计里考虑到这些问题。</p>
<p><img src="https://swordair.com/content/images/2013/Dec/scrolling_vs_clicking.png" alt="scrolling vs clicking"></p>
<p>无论是滚动还是点击，都有其优缺点。然而，对于滚动来说，优点多于缺点。对于用户而言，滚动更快。随着鼠标滚轮的滚动以及触摸板滑动，用户可以仅仅通过一根手指的挥动滚过所有的内容，相比之下，点击需要用户找到链接、识别链接、鼠标移动到链接、点击链接然后等待页面加载。</p>
<p>滚动模式里，用户循序获取内容，并能一眼瞥知全貌。点击模式里，用户可以跳过某个链接到达下一页，而避免浏览他们跳过的页面。</p>
<p>滚动保持了用户阅读的连贯性。他们滚动然后继续阅读直到读到了页面的底部。而点击打断了用户的阅读流程，因为他们必须停下来，点击链接到下一个页面。在滚动过程中，用户也不需要等待新页面的加载(页面加载更加严重的打算了阅读)。他们只需要单一滚动到下一个区域并继续阅读。</p>
<p>点击在速度和易用性上毫无优势，但它也有自己的优势。点击允许我们跟踪用户的点击行为来做分析，而在滚动里无法做到这一点，你只能跟踪到顶层页面而不是子区域。</p>
<p>每个页面都有一个与他人分享的链接，这个链接也同时被搜索引擎收录。但在滚动模式里，页面只能被收录1页。</p>
<p>在点击和滚动里需要一个权衡。看起来滚动的可使用性更加。但是点击模式更适合数据分析以及搜索引擎。作为一个设计师，你的工作就是权衡哪个更加重要。了解它们的优势可以帮助你做出明智的选择。然而，如果你始终跟随用户体验，那么滚动模式就是答案。</p>
<h2 id>译后语</h2>
<p>原来的标题应该是：“为什么滚动是一种新的点击”，不过看起来不够直接。这篇通篇废话比较多，但是光看结论：其作者认为滚动相比点击更具优势。并认为这是一种新的趋势。</p>
<p>随着类iPad设备的流行，滚动操作，或者说滑动操作的习惯，已经被广泛地分发到终端使用者身上。使用习惯会在多个系统中传染，加之用户已经开始习惯无限滚动等交互方式，滚动操作已经在可用性的很多方面占据优势。</p>
<p>举一个个人的例子：太平洋和泡泡网是我常上的IT类网站，但是我可能更喜欢看PCPOP的评测，因为PCPOP有一个“在本页阅读全文”的功能，使得单页滚动代替了分页，让我可以不用总是点下一页看完整个评测过程——作为一篇完整的顺序性很强的文章，打断阅读连续性其实非常非常糟糕——而“分页”，这个我们看似理所当然的过程，未必是必须的。</p>
<!--kg-card-end: markdown-->]]></content:encoded></item><item><title><![CDATA[为什么圆角更易识别]]></title><description><![CDATA[<!--kg-card-begin: markdown--><p><strong>译自</strong> <a href="http://uxmovement.com/thinking/why-rounded-corners-are-easier-on-the-eyes/">Why Rounded Corners are Easier on the Eyes</a> by anthony</p>
<p>如今，设计师大量使用圆角以至于这看起来像是工业标准而非什么设计趋势。圆角不仅被应用在软件用户界面上，也同时被应用到硬件产品的设计上。那么是圆角的什么方面使得它们如此流行？确实，它们看起来很吸引人，但原因远不仅如此。</p>
<h2 id>人眼处理圆角更容易</h2>
<p>任何人都能意识到圆角艺术上的美感，但不是每个人都能准确的解释这种美感从何而来。这个问题的答案其实就在于你的眼睛。</p>
<p>一些专家说，眼睛更容易接受圆角矩形而不是直角矩形，因为圆角矩形在视觉过程中更易认知。中央凹(fovea centralis，是视网膜中视觉最敏锐的区域)在处理圆形时最快，处理边缘则需要涉及更多的大脑中的“神经影像工具”<sup>[1]</sup>。于是，人眼处理圆角更容易，因为它们看起来比普通矩形更接近于圆。</p>
<p>巴罗(Barrow)神经学研究所完成的关于“角(corners)”的科学研究发现，“角的突显性感知与角的度数的线性变化，锐角比钝角产生更强的虚幻的突显性”<sup>[2]</sup>。换句话说，角越锐利，看起来就越显而易见。而角出现的越凸显，</p>]]></description><link>https://swordair.com/why-rounded-corners-are-easier-on-the-eyes-translation/</link><guid isPermaLink="false">59fe0cf19855590d8c914731</guid><category><![CDATA[UX]]></category><dc:creator><![CDATA[Sword Wang]]></dc:creator><pubDate>Sat, 21 Jan 2012 10:39:48 GMT</pubDate><content:encoded><![CDATA[<!--kg-card-begin: markdown--><p><strong>译自</strong> <a href="http://uxmovement.com/thinking/why-rounded-corners-are-easier-on-the-eyes/">Why Rounded Corners are Easier on the Eyes</a> by anthony</p>
<p>如今，设计师大量使用圆角以至于这看起来像是工业标准而非什么设计趋势。圆角不仅被应用在软件用户界面上，也同时被应用到硬件产品的设计上。那么是圆角的什么方面使得它们如此流行？确实，它们看起来很吸引人，但原因远不仅如此。</p>
<h2 id>人眼处理圆角更容易</h2>
<p>任何人都能意识到圆角艺术上的美感，但不是每个人都能准确的解释这种美感从何而来。这个问题的答案其实就在于你的眼睛。</p>
<p>一些专家说，眼睛更容易接受圆角矩形而不是直角矩形，因为圆角矩形在视觉过程中更易认知。中央凹(fovea centralis，是视网膜中视觉最敏锐的区域)在处理圆形时最快，处理边缘则需要涉及更多的大脑中的“神经影像工具”<sup>[1]</sup>。于是，人眼处理圆角更容易，因为它们看起来比普通矩形更接近于圆。</p>
<p>巴罗(Barrow)神经学研究所完成的关于“角(corners)”的科学研究发现，“角的突显性感知与角的度数的线性变化，锐角比钝角产生更强的虚幻的突显性”<sup>[2]</sup>。换句话说，角越锐利，看起来就越显而易见。而角出现的越凸显，就越多对视觉过程产生影响。</p>
<p>哪个看起来更容易？</p>
<p><img src="https://swordair.com/content/images/2013/Dec/sharp_edges.png" alt="sharp edges"></p>
<h2 id>我们更适于圆角</h2>
<p>另一个关于为什么我们的眼睛更适合圆角，这与我们如何使用在物理世界中的日常物品更为相关<sup>[3]</sup>。圆角无处不在。当还是孩子的时候，我们就很快学到尖锐的东西有危险，而圆润的东西才比较安全。那也是为什么当一个小孩在玩一个球的时候，大多数家长不会惊慌。但是如果小孩在玩一个叉子，父母会因为担心孩子伤到自己而把叉子拿走。这激起了对于锐利的边缘的神经科学所谓的“回避反应” 。因此，我们倾向于“避免锋利的边缘，因为在自然界中，它们可以构成威胁”<sup>[4]</sup>。</p>
<p>你相信哪个可以拿给你的孩子？<br>
<img src="https://swordair.com/content/images/2013/Dec/sharp_fork_rounded_beachball.png" alt="sharp fork rounded beachball"></p>
<h3>圆角使得信息更易于处理</h3>
圆角对于地图和图表更有效果，因为它们使得我们的眼睛更容易跟随着线条，它更好地适合了头部和眼睛的自然运动<sup>[5]</sup>。锐角将你的视线从线径上移开使得你在线径改变方向时仿佛经历一种突然的暂停。但是圆角，则引导你的视线平滑地连续地在边角上过渡。
<p>对你来说哪个更舒服？</p>
<p><img src="https://swordair.com/content/images/2013/Dec/rounded_diagram_edges.gif" alt="rounded diagram edges"></p>
<p>圆角在内容容器上也很有作用。这是因为圆角向内指向矩形的中心。这会突显矩形内的内容。这也使得当两个矩形并排时，我们更容易分清哪一条边属于哪一个矩形。尖角指向矩形的外部所以对内部的内容突出相对更少。尖角也同时使得两个矩形并排时区分它们的边界变得相对困难。因为每个矩形都是完全相似的直线条。而圆角矩形的临近边都不相同因为这些线只曲向其所属的矩形。</p>
<p><img src="https://swordair.com/content/images/2013/Dec/rounded_corners.png" alt="rounded corners"></p>
<h2 id>结论</h2>
<p>关于圆角更适合眼睛还有更多可以说。我们的眼睛处理圆角不仅更容易，圆角也同时使得信息更易被处理。毫无疑问圆角很吸引人，但上述这些使得使用圆角更加有理由。现在当你与客户谈论圆角的时候，你可以告诉他更多，而不仅仅是因为“圆角看起来很漂亮”。</p>
<h2 id>参考资料</h2>
<p>[1] <a href="http://www.uiandus.com/blog/2009/7/26/realizations-of-rounded-rectangles.html">圆角矩形的实现</a><br>
[2] <a href="http://macknik.neuralcorrelate.com/pdf/articles/troncoso_et_al_Art_and_Perception_chapter.pdf">闪烁增强对比度时角的凸显性与角度的线性变化</a><br>
[3] <a href="http://www.basement.org/2005/11/why_do_we_love_rounded_corners.html">为什么我们喜爱圆角</a><br>
[4] <a href="http://neurofocus.com/pdfs/BrainGap_Release_NF.pdf">NeuroFocus研究揭示Gap的新Logo哪里错了</a><br>
[5] <a href="http://www.fmc-modeling.org/visualization_guidelines">FMC的可视化指南</a></p>
<h2 id>译后语</h2>
<p>第一次翻译这类文章，感觉难度比起前端技术类要高，因为出现了很多其他领域的专业术语，而这些术语我并不熟悉，需要重新查阅资料。UX的文章很大程度上有一种共同的特点，就是看完之后似乎并无所获，很多都是显而易见的。然而并不是每个人都清楚地知道为什么，并且在可能出现的下一个项目里怎么做。</p>
<p>本文中提到了圆角的诸多优势，但即使其再有优势，任何一样东西都不应该被滥用。从形状上说，直角和圆角相辅相成。很多交互设计里，圆角都专门被用在按钮、tab，特别是按钮。将按钮从各种直线分割的内容块里快速地用独特的形状表现出来很有必要，而圆角，将用户的视线聚集在按钮的本身内容上，并暗示按钮的“安全性”，这对吸引用户点击的注册按钮、促销Landing上的分流链接等额外重要。这也是为什么，有些设计里按钮明显突兀，和整体设计不合。</p>
<p>作为前端，我向来讨厌圆角，尽管CSS3只需要一句代码。但不可否认，直角的严谨性和专业性可能适合大部分Programmer。</p>
<!--kg-card-end: markdown-->]]></content:encoded></item><item><title><![CDATA[UX是Web的灵魂]]></title><description><![CDATA[<!--kg-card-begin: markdown--><p>一直以来我作为一名前端攻城师，把大部分的精力都放在了代码上，伴随着轻微的代码洁癖以及偶尔的吹毛求疵敲着键盘与世无争。但这种状态显然已经悄然改变，Web开发者所需要的知识面远不止几行代码那么简单——UX，用户体验，才是Web的灵魂。</p>
<p>但UX难以衡量，可能只是一个idea，但也可以是一个庞大的范式性的知识集合约束出来的页面细节。就如同交互在UED中的作用一样，虽然很多团队甚至没有专人负责交互，但交互却无处不在。交互差直接导致易用性差，这对功能性页面几乎就是致命的。很多团队，交互总是最为缺乏的一类人，其工作内容被或平均或不平均地分散到产品、设计、前端的各个环节。也正因为此，产品的可用性直接和这些被分散的非专业交互设计挂钩，虽然不是绝对，但常常因此留下了隐患。</p>
<p>前几天我打算写几篇关于UX的文章，但两篇草稿都在写了400字刚过的时候断了思路，这才发觉，虽然很想表达自己这些年对于交互对于UX的理解，但往往写之前觉得很有用，写完之后甚觉鸡肋——可能是自己一直以来看轻UX的本质的劣根性在作祟。于是我删除了自己词不达意的草稿，转而开始翻译现有的国外的文章。</p>
<p>这过程中，发觉自己毕竟不是做交互的，所以写出来的和UX相关的东西的细腻度非常匮乏，最终要的是，<strong>缺乏支持某些现象的根本证据</strong>。而这点上，国外的优秀作品就做的非常好，不仅说明现象，还会引述各种文献资料(很多都是生物学、人体工程学、心理学的著作)论证本质。面对如此专业的UX研究和总结，我只能是望尘莫及。所以我这个半吊子还是先边译边学，</p>]]></description><link>https://swordair.com/ux-is-the-soul-of-web/</link><guid isPermaLink="false">59fe0cf19855590d8c914730</guid><category><![CDATA[Blog]]></category><category><![CDATA[UX]]></category><dc:creator><![CDATA[Sword Wang]]></dc:creator><pubDate>Fri, 20 Jan 2012 16:22:25 GMT</pubDate><content:encoded><![CDATA[<!--kg-card-begin: markdown--><p>一直以来我作为一名前端攻城师，把大部分的精力都放在了代码上，伴随着轻微的代码洁癖以及偶尔的吹毛求疵敲着键盘与世无争。但这种状态显然已经悄然改变，Web开发者所需要的知识面远不止几行代码那么简单——UX，用户体验，才是Web的灵魂。</p>
<p>但UX难以衡量，可能只是一个idea，但也可以是一个庞大的范式性的知识集合约束出来的页面细节。就如同交互在UED中的作用一样，虽然很多团队甚至没有专人负责交互，但交互却无处不在。交互差直接导致易用性差，这对功能性页面几乎就是致命的。很多团队，交互总是最为缺乏的一类人，其工作内容被或平均或不平均地分散到产品、设计、前端的各个环节。也正因为此，产品的可用性直接和这些被分散的非专业交互设计挂钩，虽然不是绝对，但常常因此留下了隐患。</p>
<p>前几天我打算写几篇关于UX的文章，但两篇草稿都在写了400字刚过的时候断了思路，这才发觉，虽然很想表达自己这些年对于交互对于UX的理解，但往往写之前觉得很有用，写完之后甚觉鸡肋——可能是自己一直以来看轻UX的本质的劣根性在作祟。于是我删除了自己词不达意的草稿，转而开始翻译现有的国外的文章。</p>
<p>这过程中，发觉自己毕竟不是做交互的，所以写出来的和UX相关的东西的细腻度非常匮乏，最终要的是，<strong>缺乏支持某些现象的根本证据</strong>。而这点上，国外的优秀作品就做的非常好，不仅说明现象，还会引述各种文献资料(很多都是生物学、人体工程学、心理学的著作)论证本质。面对如此专业的UX研究和总结，我只能是望尘莫及。所以我这个半吊子还是先边译边学，今后我的博客也会开始翻译UX相关文章(我对自己的翻译质量还是很有信心)，并且已经有几篇提上进程，到时欢迎讨论。</p>
<p>这2年博客已经存在19个分类，自己的关注点也越来越多，虽然注意力分散通常不是什么好事，但我已经成了自由的佣兵，身上必将积蓄更多的旁骛——反过来想，注意力分散，也算是生活更加丰富多彩不是么？UX作为我博客的第20个分类，龙年一定给力。</p>
<!--kg-card-end: markdown-->]]></content:encoded></item></channel></rss>