要我说贵国网络实在是太自由了，自由到你不想让这个新闻置顶都不行啊，一只手就把你掐死了。同时又让我见识了五毛大规模出动的力量，网友那素质叫一个高，平日里变着法骂街的P民消失了，一股浩然正气充斥“新闻评论界”。

原来我每天接到那么多宣传提示和删帖通知，感情我是在和自由做斗争啊！

这身新衣，觉得穿得舒服就可以了，别出来裸奔，我看着膈应。

本片的剧情大概是这样——影片从一个为苏族印第安人翻案的观点，描述美国白人军官邓巴在南北战争之后自愿到西部前线驻守，结果跟语言不通文化不同的苏族战士交上了朋友，双方时相往还。后来前往当地的白人军队反而将他视为叛徒，对他暴力相向。邓巴从此以身为白人为耻，彻底投向苏族人的阵营，并坚持自己的名字叫“与狼共舞”。

不好意思，弄错了，以上是凯文科斯特纳的代表作——《与狼共舞》。

不过，从某种Web前端的职业病角度剖析，这两部电影真的只是内容、样式和行为的分离再组合。单纯说内容的话，可能还是90年的《与狼共舞》来得更加真实和现实，只不过《阿凡达》用上了超越Ajax的炫丽技术外衣，成为电影工业时代的又一个巅峰。98年，《铁达尼》是让观众哭着走出，技术烘托氛围，为情感的堆积爆发而做足铺垫；2010年，《阿凡达》是让观众摘下3D眼镜走出，155分钟，我们无须交出心灵，带上视网膜即可。

当然，《阿凡达》绝对值得我们等待和观看，我想要不是东莞的特色产业如此昌盛，也许我还真愿意前往“膜拜”IMAX巨幕的神力。

有一点值得注意的是，与阿凡达共舞的不光有我们这些观众，还有那些“生不逢时”的其他影片。除非哪部电影蠢到意图和《阿凡达》拼票房，否则大家都有口汤喝——例如《午夜出租车》，设想一对情侣扑向售票窗口，发现《阿凡达》全部满场时，这种小本经营的影片就成为男人可以和女人继续共处2个小时的最后一根稻草。

再扯就要说到阿凡提和巴依老爷了，就此打住，洗洗睡了。

《十月围城》是部好片，在摆明立场的这一点上我和大多数人的观点类似。而且抛开一切装B的理由，可以说《十》是一部看的很过瘾的电影，虽然其核心还是香港的江湖片，简化的说就是A势头很大，成为利益集团B的眼中钉，于是一群C前去干掉A，而一群D要拼命保护A的故事，把A换成任何一个黑帮大佬，这个故事都成立，97年以前可以这么拍，现在也可以但不和谐。

从唯物的角度来看，演员阵容、动作戏码、音响音效等等都是今年华语电影的上乘之作，特别是甄子丹，自从《导火索》中的那个抱摔，我就觉得他在动作武术这一块已然成为一哥。至于主观上的情节和演员的表现，只能是见仁见智了。如果我说看见春哥登台的时候掉了一地鸡皮疙瘩，可能会招来玉米的怒斥。但整本电影的唯一笑场的确是发生在李宇春露面的那一刻，这种“偷笑”可能是缘于“信春哥原地满血复活”的不自觉的心理对照吧。

其他角色方面，巴特尔的确让人眼前一亮；劳模范冰冰就是个小花瓶，这点分量的细分对她来说已经不是难事，驾轻就熟之余也不会让她再有什么突破；谢霆锋和黎明算是为演出牺牲了比较大的形象了，唯一不同的是，黎明最后在孙母屋前楼梯的打戏还是比较有范儿，只是总让我有种步惊云在演《功夫》的错觉；老戏骨王学圻明显是台柱子，梁家辉也不差。

绕了一圈，回到张涵予演的这个孙中山身上，其实想明白了就是电影的操作，什么四个版本啊，什么朝伟兄也演过啊……谁演都一样，一是戏份太少，就是用来升华电影革命主题的；二是这化妆化的，要不是前期宣传铺天盖地和张涵予特有的独白配音，谁知道这是张涵予啊！

但是坏就坏在狠命的宣传张涵予了，看电影时，我旁边一个明显没做功课的女生，从开始就一直期盼胡军，直到电影结束字幕翻滚的时候还在发出疑问——“不是说有胡军吗？咋不见胡军呢？”

也难怪，把胡军硬生生打扮成计春华，这部戏明眼人一看就是冲着奥斯卡最佳化妆去的。

今年的杭州烟花大会再次回归西湖，京杭运河也顺道沾了光，也恰巧我正居于运河河畔，否则光是去苏堤上去挤人潮，就失去了拍摄的兴趣。

爬上屋顶，匆忙中胡乱拍了上百张，回家后才发现绝大多数都是乱七八糟，决不可拿出来丢人的。原来的那一番努力，只是去凑了热闹。

于是我挑选了一个具有代表性的页面截屏以纪念：

如果你也曾真正访问过这个网站，你也许会有和我一样的感受：在第一次访问该页面的时候，我实在不清楚这花花绿绿的颜色代表的意义，五色让人目迷。

好吧，让我们先来聊聊色彩。随着不断在社会中成长，我们逐渐对色彩形成完整的认知，有一些认知形成是天然的，比如红色，因为我们的血液是红色，红色天然的代表了鲜血，引申为危险，还有绿色象征着生命，蓝色象征着深远等等；另一些则是基于地缘和文化的，比如还是红色，在中国，红色代表吉祥，黄色象征高贵。如果展开说，我就显得有些班门弄斧了，所以就此打住。（《每天懂一点色彩心理学》是近期上市，并且读起来很轻松的关于色彩方面的一本小书。）

回到订票这件事情上，在我看到这些色彩后，我的第一反应是这些色彩是为了区分出些什么，那么是什么呢？

时间？因为我知道，对于用户而言，订票只需要了解三件事情，电影名称、场次和票价。电影名称是显而易见的，那么是用来做场次的时间区分吗？不是，我发现《乐火男孩》11：15的那一场是淡橙色，而紧接的《可爱的中国》11：40的那一场是淡紫色，再往下《气喘吁吁》11：50是几乎融入背景色中的深紫色……我想知道了，这些颜色代表的应该是价格了。

但是另一个问题又摆在我眼前——不同的颜色代表不同的价格，这些价格到底是什么呢？在我将鼠标滚轮翻转数圈后，我终于，终于的来到了页面的底部，答案出现了：

如果我眼睛没有大碍的话，上图中应该出现了四种不同色度和明度的紫色，以及三种不同色度、明度以及色相的绿色，当然还有两种偏米色的黄色。请原谅我无法用语言精确的描述每种颜色代表的价格，因为它们毫无规律——准确的说是，它们以一种毫无规律的色彩排列试图告诉用户票价的等差规律。

这让我想起了我刚刚翻译的《用户界面设计10原则》，其中第四条将的是“运用视觉等级”，作者Kyle在文章中告诫设计者“清晰的层级关系将对降低外观的复杂性起到重要作用”。我想，这个页面的设计者一定想要通过色彩让用户了解到价格的区分，而且是可以“一目了然”的，当然结果不如愿。在我看来，这仅仅是为了区分而区分，就像有些界面是为了图形化而图形化一样。

如果我们想要告诉用户，从最低票价到最高票价是可以通过色彩辨识的，那么我们应当去寻找一种被人们普遍接受的色彩认知。那么中国人对于等级区分的普遍色彩认知是怎样的呢（原谅我抛弃了国外用户）？

一 用什么色彩

比如，白，虽然本义象征着纯洁、无邪，但是在等级中，因为我们常常用白丁、白衣来形容平民，白色在我们的文化环境下代表的是比较低的等级，和便宜挂钩。那么类似的，我们可以明白为什么黄色代表着高贵了。但我们要注意的，又不能是嫩黄，那只能是黄口小儿的象征，因此色彩的饱和度也是重要一环，白色和黑色给人带来的厚重感完全两样，一个从白色到黑色的完美渐变可以很好的反映出视觉等级的变化，但是我们需要色彩。

二 用多少色彩

那么我们要用多少色彩呢？向上面页面那样用到三大色系，九种颜色么？这几乎是George A. Miller提出的7±2效应的上限。除非是雨人，否则大部分用户只能在短时间内记住7个左右的信息，更何况这7种颜色是多么的抽象，多么的……难记。（感兴趣的同学，可以点击这张图片，然后关掉）

换句话说，具体到这个例子，当你有九种价位的电影票，试图用色彩来做等级区分和让用户做记忆力测试没什么区别。如果你刚才点开了那张意大利国旗的图片，你还能第一时间记起它的绿色是下图中的哪一种吗？

说老实话，时代院线的订票页面我也反复上过数十次了，但是我至今也不记得到底是绿色的票便宜还是紫色的票便宜。因为我最终买到的票都是粉红色的。

关于如何改进，展开来又是长长一段了，如果是我，我也许会取消色彩区分，转用数据表的形式，但是BOSS也许会觉得页面不够炫（就国情而言，100条设计原则敌不过BOSS一句话）；也许我会考虑网站上的色彩和实际票面印刷对应，长久让用户形成色彩的对应关系，比如黑色的信用卡一般都是等级较高的，但是BOSS也许会觉得这样增加成本了吧:-D

方法会有很多，就看你的了……

原文标题：10 User Interface Design Fundamentals

原文地址：http://carsonified.com/blog/design/10-user-interface-design-fundamentals/

作者：Kyle Sollenberger 版权所有

翻译：UCDChina翻译小组，Roc

设计真正伟大的用户界面没有什么伟大的奥秘可言，做到保持简单易用就可以。

‘保持简单易用’意味着不要让用户分心。恰恰相反，好的UI让用户达成目标。结果如何？你的培训和维护费用降低，并获得更开心、满足和高效率的用户。

当你面对一个全新的界面设计时，别忘了这些原则。

编辑手记：Kyle将在纽约举行的Web设计趋势上继续探讨用户界面设计的内容。

1. 了解你的用户

“关注用户：如果在关注竞争对手还是用户之间选择，答案总是后者。工作总是首先从用户开始。”——Jeff Bezos

了解用户，因为用户的目标就是你的目标。试着重述用户，了解他们的技能水平和体验，以及什么是他们需要的。找出用户偏好什么样的界面，并观察他们在界面中如何操作。不要迷恋于追逐设计趋势的更新，或是不断添加新的功能。首要的任务是关注你的用户，这样才能创造出一个能让用户达成目标的界面。

2. 重视模型

用户的大部分时间都消耗在界面中，而不是他们自身上（Facebook，MySpace，Blogger，美国银行，学校/大学，新闻网站，等等）。我们无需画蛇添足，用户在你正在创造的界面中看到的正是那些（已有的）界面已经解决的同样问题。利用已成惯例的UI模型，你将使用户感觉像在家中一样熟悉。

CoTweet在邮件应用中运用了广为人知的UI模型。

3. 保持一致性

“用户期望越多的被正确验证，用户就越觉得系统在自己掌控之中，从而也就更喜爱它（系统）。”——Jakob Nielson

用户需要一致性。他们需要知道一旦他们学会做某项操作，那么下次也同样可行。语言、布局和设计是需要保持一致性的几个界面元素。一致性的界面可以让用户对于如何操作有更好的理解，从而提升效率。

4. 运用视觉等级

“设计师可以从混乱中找到统一；他们可以通过组织操控文字、图片从而清晰地传达设计意图。”—— Jeffery Veen，Web设计艺术家和研究者

设计时，要让用户把注意力放在最重要的地方。每一个元素的尺寸、颜色还有位置，它们为理解界面共同指明了道路。清晰的层级关系将对降低外观的复杂性起到重要作用（甚至当行为本身也同样复杂的时候）。

5. 提供反馈

界面要始终保持和用户的沟通，不管是当他/她们的行为对错与否。随时提示用户的行为：状态更改、出现错误或者异常信息。视觉提示或是简单文字提醒都能告诉用户，他/她的行为是否能够达到预期的结果。

BantamLive在界面中为大多数行为提供了一种嵌入式的载入提示。

6. （对用户）宽容

无论你的设计有多么的清晰明了，用户都会犯错。你的UI应当允许并宽容的对待用户的错误。要为用户提供可以撤销行为的方式，并且对五花八门的输入数据尽量宽容（没人愿意只是因为填错了生日的格式而重头再来）。同样，如果用户的行为引起了一个错误，在恰当的时机运用信息显示什么行为是错误的，并确保他/她明白如何防止这种错误的再次发生。

如何利用简单的验证码提高注册率一文中讲述了一个绝佳的例子。

7. 鼓励用户

一旦用户对界面有了经验之后,要奖励他/她们，使之进价。把复杂任务分解为若干简单步骤将会更显繁复和让人精力分散。提供更多的抽象方式——如键盘快捷键——完成任务，这样会让你的设计变得简洁易用。

8. 融入用户的语言

“如果你对每个像素、每个图标、每个字体都考虑再三，那么你同样需要斟酌每个词语。” —— Getting Real

所有的界面或多或少都有文字在其上。让文稿尽量口语化，而不是华美辞藻的堆砌。为行为提供清晰、简明的标签，保持简朴的文字叙述。用户对此将会很赞赏，因为他们不再是听命于他人的官腔——他们听到的是如朋友般甚至自己说话的表述方式。

9. 保持简洁

“一个现代的悖论就是：创造复杂的界面很简单，因为复杂到必须简化它们”—— Pär Almqvist

正所谓：大音希声、大象无形。最上乘的设计中，你看不到华而不实的UI修饰，或是用不到的设计元素。换而是，其必须的元素一定是简洁且有意义的。当你想着是否要再界面上加一个心功能或是元素的时候，问问自己，“用户真的需要这些吗？”或者是“为什么用户想要这个小巧的动态图标？”。你是否只是因为出于自我喜好而添加这些元素？记住，永远不要在UI设计中给自己出风头。

10. 不断向前

爷爷：如果每次失败我都放弃的话，那么我将永远不会发明耐火裤！【这时裤子烧光了，露出了底裤】

爷爷：接缝处还在改良中……

节选自《未来小子》

《未来小子》一片是我最喜爱的电影之一。贯穿影片的主角Lewis一直在挑战着“不断向前”。这正是UI设计的关键准则。

人们常说，当开发界面的时候，你往往需要失败的快一点，这样就能频繁迭代。当创建UI之时，你总会碰到错误。没关系，只要不断向前，并且要牢记让你的UI简单易用。

也算是最近业内的一件值得关注的事情吧。

到底是什么驱动着新浪去做这个微博呢？仅仅是指望着博客积累的名人资源么？

反正在内测期，大家都可以去注册折腾。

邀请码也不值钱，需要的mail我~

我的微博：http://t.sina.com.cn/rocchow

配图一副，纪念一下：

吾甚以为佳，然鄙人德薄才疏，造字一事乃仓颉所为，岂可造次。吾辗转一念，遂得下图：

当然，还有其他神人造的其他神字，给出链接，请君点击。

原文：Creating a Vinyl Record In Photoshop

作者：Arik

先来看看效果：

步骤1：

新建一个300x300像素的文档。填充一个柔和的渐变背景。

步骤2：

接着新建组“黑胶唱片”，在组内新建一个图层“黑胶盘面”，从深灰色（#111111）填充图层。

步骤3：

对该图层使用滤镜效果：滤镜>杂色>添加杂色。参数设置如下图：

步骤4：

继续应用滤镜>模糊>径向模糊，参数设置如下图：

步骤5：

复制刚才“黑胶盘面”层，重命名为“黑胶盘面 调节层”，混合模式改为“叠加”，最后调节一下亮度/对比度（目前看上去黑乎乎一片）。

步骤6：

选择形状工具（U）中的椭圆工具，记得选择形状，而不是路径，以便我们后面进行图层对齐。

填充的颜色任意，只要能区分背景方便我们辨识就行。然后把它对齐到整个画布的正中央。

接着复制这个“遮罩层”，将得到的“遮罩层 副本”缩小到5%的大小，得到中央的孔洞。将这个路径复制到“遮罩层”路径中，利用形状工具的布尔运算（重叠形状除外），得到合并的形状。

步骤7：

按住Ctrl键点击“遮罩层”的缩略图，获得选区。再点击到“黑胶唱片”组，点击“添加图层蒙版”，让整个图层组置于蒙版之下。

然后，我们要开始制作盘面上的反光效果。

新建一个长方形的形状，命名为“反光”，填充改为0%，图层样式中设置如图的透明到白色的线性渐变。

步骤8：

栅格化“反光”图层后，Ctrl+T对该图层进行透视变形——按住Ctrl键，将鼠标移至左上的控制点上，按住鼠标向下移动，直到如图的交叉效果出现。

步骤9：

把“反光”图层混合模式改为柔光，隐约的光影效果便出现了。

将“反光”图层复制两次，你可以根据自己的喜好调整旋转角度和不透明度，或者更改其大小。最终得到如下效果：

步骤10：

为了让唱片更加真实，我们继续给它添加一些附加的修饰。

步骤11：

你可以在盘面中央添加你喜欢的图案，这里我添加的是披头士的Logo。

最后，扩大画布，增加一个投影让唱片看上去像是浮在空中。OK，完工。