别闹了，微软！磁贴不是这样搞的

   <div id="news_body">     <p>        相信大家已经看到今天凌晨微软发布的 Windows Phone 8 了。相比前两天某水果公司新版 Mackbook Pro 的发布引来掌声一片，WP8却惹得各种吐槽此起彼伏，不胜唏嘘。</p>     <p>        问题多了反而容易让人进入 “债多不愁，虱子多了不咬”的状态，那么，我们就一条一条地说吧。今天说说磁贴（Tile）。</p>     <p style="text-align:center;"><a rel="attachment wp-att-1744"><img alt="别闹了，微软！磁贴不是这样搞的" src="https://simg.open-open.com/show/e2b26e5775e723582e13a51df6731e5a.jpg" width="512" height="288" /></a></p>     <p style="text-align:left;">        耶稣基督，别闹了，磁贴不是酱紫搞的！</p>     <p>        <strong>1. 大小磁贴混搭让用户更累</strong></p>     <p>        大磁贴，小磁贴，大小磁贴塞满屏。多好看呀，这叫个性化，怎么会累呢？粉丝们如是说……。Oh Yeah？果真如此么？先说说个性化吧。个性化是指在普适的标准里提供相对的可配置性。例如各操作系统的换肤功能，就是个性化的好例子：边框的颜色，背景 图，图标的风格等，都可以拿来做文章，但没人会把图标的大小弄得乱七八糟。同样的形状和大小，是在暗示人们这些图标属于同一级别，而微软今天开始要挑战这 一自然规律了。我听见有人反驳说“尺寸大小是为了突出偏好性”。好吧，让我告诉你，WP7在这方面就做得很好，它把大图标（磁贴）放到首页，把小图标 （App Icon）列举在首页旁边的页面。懂什么叫上下文么，在同一个上下文当中，尺寸不一的图标带给人的感觉只有一个字——“乱”！</p>     <p>        让我用图文并茂的方式，解释一下这“大小磁贴”究竟是为何让用户感觉更累的：</p>     <p>        用户在图形阵列中识别一个目标，就需要进行一次相当复杂的运算（不要因为你每天都在进行这一过程就认为这是简单的过程，它实际上是调用了你N根眼球肌肉和N个脑细胞共同协作才完成的）。</p>     <p style="text-align:center;"><a rel="attachment wp-att-1741"><img alt="别闹了，微软！磁贴不是这样搞的" src="https://simg.open-open.com/show/b60a80e6d1d7ba0df3b2a42a955ced21.png" width="199" height="300" /></a></p>     <p>        好了，当我们通过一次复杂的计算而成功找到一块目标区域，试图点击的时候，微软告诉你说：“别急呀，还有一步哪”！</p>     <p style="text-align:center;"><a rel="attachment wp-att-1742"><img alt="别闹了，微软！磁贴不是这样搞的" src="https://simg.open-open.com/show/d1cc52a0f525ae24c6464b65ef02bc69.png" width="150" height="150" /></a></p>     <p>        论概率，每次寻找一个图标时造成“冗余运算”的机会是 50%。但闹心事儿还没完。由于图标大小的不同，用户在每次点击图标之前，其实还要再做一次“运算”，用以引导手指落在正确的目标区域里。而在统一尺寸的上下文中，这一运算就省了。</p>     <p>        平均下来，每次点击图标要进行2.5次运算（其实运算本身的复杂度有区别，但为了方便问题描述，在此粗化其粒度）。相比以往的体验（平均 1 次运算）要麻烦不止一倍以上。小差别而已？想想你一天点击多少次图标，一周，一个月，一年呢？又有人说了，我会养成习惯的，习惯了就好了。这样说的朋友， 其实是没有听懂我在说什么，上述三种“运算”之所以是运算，就是因为它不能够形成固定的行为模式（习惯），才需要大脑的计算来辅助引导的。</p>     <p>        <strong>2. 留白啊留白</strong></p>     <p>        人机交互大师 <a href="/misc/goto?guid=4958345454600307110">Jako Nielsen</a> 非常强调留白（Margin）的作用。留白用得恰到好处，不仅在排版界面上给人以“可呼吸余地”，还能引导用户根据留白的宽窄，对齐等因素去识别内容的边 界与逻辑关系。就连 Windows 8 的 UX Guideline 都提醒设计师注意合理运用留白（说明写文档的哥们还是清醒的）。现在妥了，WP8里没留白了，这许多神奇功效灰飞烟灭了。什么？磁贴与磁贴之间的间距就是 留白？你是说上下左右哪儿都一样宽的那几像素吗？Come on baby，那东西就是个分割线，连边框都不如的下三滥，在中国有个更贴切的名字：田字格！</p>     <p>        Metro 的核心思想是“Content before chrome”（摒弃边框，突出内容），但突出内容的方式必须借由留白来完成，而不一股脑儿把所有像素都用内容填满。</p>     <p>        <strong>3. 磁贴不是单纯的列表</strong></p>     <p>        微软，我不得不把磁贴的本质定义拿出来跟你讲一遍了（尽管这是当初你教我的）。磁贴是个人个人偏好的体现，是重点关注的“应用小窗口”，是内容 可更新的活物。换句话说，磁贴不是简简单单的快些方式列表。无论你曾经在 WP7 上的磁贴大小是否是有意设计的，事实证明那个尺寸是恰到好处的，大家认可和接受的。而今你尝到甜头就忘了形，搞什么小磁贴出来，这不明摆着是鼓励用户拿磁 贴当列表用么？</p>     <p>        尺寸小了照样是磁贴？这么想你就太外行了。尺寸对于人机交互有多么重要，还要咱在这里废口舌么？贴一张图吧（图标尺寸与可识别度之间的曲线关系）：</p>     <p style="text-align:center;"><a rel="attachment wp-att-1747"><img alt="别闹了，微软！磁贴不是这样搞的" src="https://simg.open-open.com/show/69fdd204a68aa851c90648e376b7f032.png" width="600" height="432" /></a></p>     <p style="text-align:center;">        上图中，4号顶点所指的“特大号”是 Windows Phone 里横跨屏幕的宽磁贴。</p>     <p>        磁贴就像是客厅，应该把赏心悦目的、值得炫耀的家具错落有致地摆设开来。如果把所有家当都紧凑地堆砌在一起，那就不是客厅，充其量是个仓库。如果不小心夹杂点“海天”应用，那就甚至连仓库都不如，而是垃圾站。</p>     <p>        <strong>4. 别偷懒，我们不笨</strong></p>     <p>        想想 WP7、Windows 8、WP8这一系列，不禁觉得好笑。磁贴的概念在 WP7 上获得成功，于是 Windows 8 借鉴了过去，并做了适当地调整。发现大家对 Windows 8 的反响似乎不错，他们竟把 Windows 8 那套“同比缩放”插回 WP8。</p>     <p>        想点新茬儿真的有那么难吗？脑子里能想出来的词儿就只有 Surface 了吗？我努力考虑为什么会这样，唯一合理地解释就是：设计师们“为了改变而改变”，因为“改变”才能带来业绩。至于为什么拿磁贴开刀，是因为磁贴上做点手 脚，可以迅速获得“眨一看上去挺炫目”的效果，于业绩而言事半功倍。</p>     <p>        在这里我仅代表对 UI 吹毛求疵的蹩脚用户们说一句：微软，别偷懒，我们不笨。毕竟钱包攥在客户手里，如果难以接受，就不会买你的账。</p>     <div id="come_from">     来自:      <a id="link_source2" href="/misc/goto?guid=4958345455411997418" target="_blank">apphub.fm</a>     </div>    </div>