创新总是很少，互相借鉴总是特别多，我们一起来看看那些被滥用但有时并没那么好的设计，给大家敲响警钟，参考无罪，但是多独立思考，自主设计。如果你是一位有经验的设计师，你也许常会在其他界面中获取设计灵感，这并不等同于抄袭。这是在做最佳案例研究，可以套用常用的设计模式，也符合主流的设计规范，而且使用用户熟知的UI组件，可以让界面变得更加易用。也许有人会说太依赖于设计规范而且抄来抄去的，完全扼杀了创造力，而且最终，所有的应用都长成一样了。然而从体验的角度来说，我看到了另外一个问题。习惯于复用那些常见的UI组件会让你慢慢陷入一个误区，你会认为Google、Facebook、Instagram等你喜欢的应用总是对的，他们的设计意图和你的想法一致，你会完全忘了带着质疑的态度来看他们的设计。这里我列举一些UI组件，他们被认为（或是曾经被认为）是非常好的设计，然而他们也许并没有那么好。一、“深藏不露”的导航过去一段时间，有无数关于汉堡菜单的文章，大部分设计师都在抵制使用他，然而这件事的本质并非是图标的错，而是将导航隐藏在图标之下的问题。这种设计方案对于设计师来说特别省事，根本不用担心有限的屏幕大小，只需要将你所有的菜单项排个序然后放进这个可滚动的浮层中，藏在汉堡菜单里。然而实践证明，使用可视化的菜单项会提高用户的参与度、满意度甚至是商业利益。这也是为什么现在主流的应用都从汉堡菜单改成底部导航的可见菜单 ...继续阅读 (14)

应用交互效果中，动画效果是应用的锦上添花效果，比起死板的页面切换，动画过渡效果还是会让人感觉自然，不那么生硬，也是一款优秀应用的加分项。我们以几个例子来说明一下如何应用axure里的动画效果。幻灯片效果我们要做的是一个自动轮播的幻灯片效果，也就是会自动从第一张片子开始，停留几秒后自动切换到下一个片子，显示到最后一个时再返回到第一个片子。几个着关键点说明如下：1. 自动轮播需要使用到动态面板的两个重要事件，“载入时”和“动态面板状态改变时”，状态切换时的动画效果设置如下：并且注意勾选上“从最后一个到第一个自动跳转”2. 左右滑动我们还可以给动态面板添加左右滑动事件，这两个事件是动态面板特有的，这样可以模拟手指向左或向右滑动。3. 指示器的动态效果在切换片子的时候，我们希望下方的指示器也能自动指示当前选中的片子，并且有动态的移动效果。这里为了处理方法通用，使用了一点小小的技巧，用一个变量来控制当前的索引，然后索引整除3，根据得出的余数移动指示器的位置。自定义下拉弹出菜单axure自带的菜单样式太丑了，我们完全可以自己实现一个下拉弹出菜单，可以设置自己想要的样式。下面的例子是单击按钮时，如果菜单没显示，则向下弹出菜单，如果显示了，则向上收起菜单。1）弹出菜单我们使用了同一个按钮来控制弹出和隐藏，因此需要在事件上添加条件判断，判断的依据就是下拉菜单动态面板是否处于显示状态。2）隐藏菜单如果 ...继续阅读 (18)

吉萨金字塔、蒙娜丽莎、Twitter和百事可乐有什么共同点？答案很简单，它们的设计都遵循了黄金比例。作为一个常见的数学比例，黄金比例实际上是从自然界中总结并发现的，用于设计中的时候能赋予作品更多的设计美感，赏心悦目。那么，黄金比例到底是怎么样的比例，它又是如何运用到设计中并提升设计作品的呢？什么是黄金比例？黄金比例是一个比较特殊的数学比例，通常我们会用线段分割来解释这个比例：把一条线段分割为两部分，较短部分与较长部分长度之比等于较长部分与整体长度之比，其比值是一个无理数，取其前三位数字的近似值是0.618。当然，我们今天探讨的并非是数学问题，而是设计和美。黄金比例之所以被冠名以“黄金”二字，自然是因为这个比例带来的和谐与美感。当你应用到设计作品中的时候，这种比例会营造出艺术感。黄金比例已经被我们的先辈运用了几千年，从埃及的吉萨金字塔的设计比例到雅典的巴特农神殿，从米开郎琪罗为西斯廷教堂所雕刻的亚当到达芬奇的蒙娜丽莎，从百事可乐的LOGO到推特的LOGO设计，甚至我们的面孔都遵循这个数学比例：事实上，我们的大脑似乎先天就比较青睐使用黄金比例的对象和图片。这几乎是下意识的吸引力，大脑甚至会对眼睛看到的事物进行小幅度的微调以靠近黄金比例，提高我们自身对于外物的记忆和印象。黄金比例无疑可以应用于各种图形。如果你将一个正方形拉伸为一个矩形，让长是宽的1.618倍，就可以获得一个“完美”的矩形 ...继续阅读 (2)

现在的UI设计团队通常先设计组件，多数界面几乎就是各种组件的结合。这会在用户的“异常路径”上留下不容小觑的断档。由于我们构建的是整个系统，而非几个页面，我们必须投入精力打磨这些常常被忽略的状态的设计，创造出组件的整个生命周期，来适应每一个人。我所理解的生命周期是这样的：1. 初始状态一个组件做任何事情之前是怎样的？可能这是用户首次看到它。或者它还没被激活。根本上说就是这个组件存在，但还没有启动。Jonas Treub的设计能确保你了解framer的最新动向。2. 加载中令人厌恶的一种状态。在理想状况下，没人会看到这个。哎，可我们这里是现实世界。有许多方法能使加载状态微妙而含蓄。Facebook在这方面做得很好：Facebook使用“假文章”来代替传统的转圈圈。3. 空状态组件已经初始化，但是空无一物。没有数据，没有项目。这时候正适合引导用户采取行动（“点这里！”），或者给他们鼓励（“好样的，一切正常”）。Luke Seeley就将它作为了一种捷径。4. 单一项目开始有些数据了。在输入界面中，这或许是按下第一个键的状态。在列表中，可能是只有一项（或仅剩一项）时的状态。又是Luke Seeley，MetaLab项目。5. 有一些数据这通常是你首先考虑的状态。某个组件的最理想状态是怎样的？数据加载了，也有内容输入，正是用户熟悉的状态。UENO.舒适的大仪表盘。6. 数据过多哇！用户似乎操 ...继续阅读 (18)

译者注：本文译自苹果官方人机界面指南 iOS Human Interface Guidelines (2015年10 月21日)，由腾讯ISUX设计师翻译整理，非发文者一人之作。译文首发于ISUX博客，如在阅读过程中发现错误与疏漏之处，欢迎不吝指出。后续章节会陆续更新，敬请期待。上期：《iOS 9人机界面指南（一）：UI设计基础》文章索引2.1 设计原则(Design Principles)2.1.1 美学完整性(Aesthetic Integrity)2.1.2 一致性(Consistency)2.1.3 直接操作(Direct Manipulation)2.1.4 反馈(Feedback)2.1.5 隐喻(Metaphors)2.1.6 用户控制(User Control)2.2 从概念到产品(From Concept to Product)2.2.1 定义应用(Define Your App)2.2.2 为任务量身订制界面(Tailor Customization to the Task)2.2.3 原型 & 迭代(Prototype & Iterate)2.3 案例学习：从桌面到iOS(Case Study: From Desktop to iOS)2.3.1 iPad版Keynote应用(Keynote on iPad)2.3.2 iPhone版邮件应用 ...继续阅读 (16)

刚开始接触移动页面重构，是不是很迷惑应该按照多大的尺寸制作？320、640还是720？按照640的设计稿重构完页面，是不是还需要写其他尺寸来适配不同的屏幕大小？—— 这源于对viewport和px的不了解。已经重构了好多移动页面，但是对为什么要按照640的大小来设计页面，不清楚答案。给元素赋予固定的像素值，但是奇怪的是在不同的手机里看起来都差不多大小，不需要另外去适配，真是太爽了。为什么？不知道耶。——这源于对viewport和px的不了解。先来罗列下学习移动页面重构的过程中可能看到过迷糊过放弃过的一些单位：px、pt、pc、sp、em、rem、dp、dip、ppi、dpi、ldpi、mdpi、hdpi、xhdpi、xxhdpi……接下来分类给大家介绍下：① 什么是绝对长度单位？什么是相对长度单位？② 什么是屏幕尺寸、屏幕分辨率、屏幕像素密度？③ 什么是ppi、dpi、dp、dip、sp、px？他们之间的关系是什么？④ 什么是mdpi、hdpi、xdpi、xxdpi？如何计算和区分？1、什么是绝对长度单位？什么是相对长度单位？绝对长度单位：in（inch英寸）、cm（厘米）、mm（毫米）、pt（磅）、pc（pica）。in、cm、mm和实际中的常用单位完全相同。pt是标准印刷上常用的单位，72pt的长度为1英寸。pc也是印刷上用的单位，1pc的长度为12磅。绝对长度单位，虽然理解起 ...继续阅读 (12)

扁平化设计从2012年开始风行，直到今天仍是炙手可热。然凡事过犹不及，在某些时候这种风格会造成严重的可用性问题。其中之一便是行动按钮的可见性缺失。扁平化2.0则能为我们解决这类问题，今天从可用性角度帮大家重新梳理一下从拟物化到扁平化2.0的变迁历史。何谓扁平化设计？光泽、三维视觉效果不俱存的图形元素便是。很多设计师都倾向于把它当做极简网页设计的一个分支。立体效果、拟物化设计、现实主义在明确扁平化设计之前，我们先来看一下有哪些元素是和其绝缘的。扁平化设计通常被认为是和那些立体效果、拟物化设计和现实主义唱反调的一种风格。在一个纯粹的扁平化设计里你绝不会见到上述元素。立体效果立体效果能在界面上制造深浅不一的感觉，这能帮助用户理解视觉层级以及哪些元素是可以互动的。上浮的元素看上去就好像是可以被按下去的（用鼠标）。这种设计通常被应用在按键上。下陷的元素看起来就好像能够被填塞。这通常被应用在输入框里，比如搜索框。鉴于早期的图形化用户界面中，立体效果被大肆用在所有地方，这还包含了阴影、渐变和高光等一系列的效果，其目的是为了让用户能第一眼就识别出行动按键。然而，早期的GUI把这些伪3D效果应用得太过火了，在视觉上造成了相当的干扰，并极富侵略性。Windows 95的对话窗口使用了大量的阴影和高光来创建3D效果（注意这些按键的上凸和输入框的下凹）。同时我们也能清晰地看到上方的三个tab中哪个盖在最上 ...继续阅读 (15)

“ 故事也许是人类最早的叙事方法。大多数人在童年时，故事用来引导他们的行为，了解历史文化和培养社会认同感。”－Form Wikipedia1.什么是故事（WHAT）在讨论如何打造故事感体验之前，我们先聊聊什么是故事。故事（Storytelling）是通过文字，声音或图像来传播的事件。它在各种文化扮演着娱乐，教育，传播文化和价值观的作用。讲故事或许是人类最早的叙事方法。大多数人在童年时，成人都会用故事来引导他们的行为，传授历史文化和培养社会认同感。注1讲故事是一种解释和分享的方法。这在我们生活中非常普遍。它们可以弥合文化，语言和年龄之间的分歧。例如在教育中，可以通过故事让人更加容易理解。又如远古社会，人类使用壁画纪录和传播故事，这些壁画即使过了上千年，依旧能理解其中部分含义。古埃及金字塔中的壁画。图片来自 forum.china.com.cn甚至在工作中，通过讲故事的形式，也可以让信息在人与人之间更加高效的传输。比如说在讨论用户需求的会议上，通过讲故事的手法，产品设计可以将用户需求转化为一个个场景故事，便可以准确的让别人理解。 人类从古至今一直深受故事影响。从圣经到现代小说无不是故事。因此当人的大脑在听到故事时，会产生特别的反应。在论文《A Theory of Narrative Empathy》中描述到，当人类听到故事时，大脑中的”镜像神经细胞“（一种神经细胞，使人们学会从简单模仿 ...继续阅读 (5)

如何打造一款看起来非常惊艳的应用，我想大家应该有所了解，借助有趣的故事、流畅的流程和令人难忘的视觉设计就好。但是仅有这些并不够，你需要拿出一些真正能打动用户心灵，产生情感联系的东西，让他们感受到应用真正鲜活的一面。这个时候，就需要微交互登场了。那些真正让人沉迷的优秀应用很大程度上是因为微交互的存在。微交互出现的瞬间，用户会感受到更强烈的互动和参与感，这些微小而自然的变化会创造出不同凡响的愉悦感，不过通常这些微小的互动并不是那么显眼。当然，对于设计师而言并非如此。如果你用心观察，每天会遭遇数百次微交互。早上关闭闹钟时的动效，看到新短信在界面上闪现，在播放器中切换歌曲的时候，结束游戏回合的时候的提示信息，甚至是用手机导航的时候交通信息的提示，这些时刻都会有微交互出现。也许你不会知道到底是谁创造出这些，但是确实是这些愉悦的瞬间堆积起来让你忍不住打开这些有趣的应用。什么是微交互那么什么是微交互呢？我们可以这么界定：微交互是同数码设备进行的基于任务的单个交互。值得注意的是，绝大多数的的这类交互都是微小而不引人注意的，但是它会为你提供平滑、自然的感觉。正如Dan Saffer在他的那本《微交互》中所说的，微交互微的出现填补了下面的三种功用：·快速沟通时的状态呈现和反馈·将某个动作所产生的结果视觉化地呈现出来·帮助用户操作屏幕上的某些元素Slack 的界面中，微交互的三个职能都有所体现。Slac ...继续阅读 (16)

2015年7月19日，由国际体验设计协会（IXDC）主办的亚洲最具影响力体验设计盛宴“国际体验设计大会” 在北京•国家会议中心圆满闭幕。在17日的大会主题演讲上，IXDC副会长胡晓分享了《2015用户体验行业调查报告》，报告通过从业者画像、薪资、跳槽、满意度、企业团队、核心竞争力六个方面的全面调查，对整个行业情况进行了系统的分析，为用户体验从业者了解行业现状和发展提供了客观有力的参考。本次行业调查报告由IXDC 联合腾讯 CDC 共同完成，本文以图表方式对报告核心内容进行解读。一、同行都是谁？用户体验行业从业者年龄普遍偏小，从业时间较短，年轻化趋势明显；学历偏高，本科以上从业者占比大，行业专业要求在不断提高。此外，大部分从业者在民营或者外企工作，市场对于体验行业的需求旺盛。当前用户体验行业的主要工作岗位包括，管理、视觉设计、交互设计、用户研究、产品等，不同工作岗位的从业者有着鲜明的特点。二、同行的薪资水平是多少？用户体验行业超过三成从业者税前薪资收入在5～15w，工作类别不同，薪资水平有一定区别。团队和项目管理薪资分布范围较广，高于其他岗位。影响从业者薪资水平的主要因素是工作岗位、从业年限、公司规模；影响薪资涨幅的主要因素是公司规模和行业所属领域，企业规模越大，薪资涨幅相对较高。三、哪些人想跳槽？从业者跳槽的调查分析显示，有六成以上的从业者有过跳槽经历，未来一年有五成从业者考虑换工 ...继续阅读 (6)

前些日子买奶茶扫码时，发现支付宝再次迭代了，给我印象最深刻的就是“生活圈”，我当时第一反应：支付宝傻X！搜了一些业内文章，更加坚定我开始的想法，自负值就差爆表了。最近在刷UI中国，又发现一篇关于支付宝9.2的文章，本来想点评（PS：我实在想不到有什么合适的词语，或者说“探讨”吧）一下那篇文章里面的一些交互分析，在组织语言的时候，突然意识到，我们大多数人好像都掉进了一个自己营造的梦境里——觉得支付宝是不是想依仗着强大的用户量的优势去搞搞社交副业。如果把支付宝9.0那次的迭代比作一场“9.0级的大地震”，那么从9.0到9.2我们其实还处于这场“余震”当中——“他是不是想搞微信？”、“他是不是还是社交之心不死？”而恰恰是这些“余震”蒙蔽了我们那双善于发现事物本质的智慧之眼。既然我们一直为“余震”所蒙蔽，那支付宝9.2背后的真相又是什么呢？或者说支付宝9.2给我们带来的真正思考又应该是什么？ 1.简而美不意味着“减”而美“简”的目的保证用户对个人功能/内容的识别更加直接和清晰，而“减”只是实现“简”过程中的一个手段，除了“减”去不必要的功能/信息，还需“加”一些曾经因为PCD导向而忽略的重要功能/信息，走到这一步方可称之为“简”。 简之前先学会做减法相比于9.0版，9.2版“减”去了“个人信息”，按照前面提到的“减法”逻辑，“个人信息”属于不重要的功能，这一点支付宝Te ...继续阅读 (6)

译者注：本文译自苹果官方人机界面指南 iOS Human Interface Guidelines (2015年10 月21日)，由腾讯ISUX设计师翻译整理，非发文者一人之作。译文首发于ISUX博客，如在阅读过程中发现错误与疏漏之处，欢迎不吝指出。后续章节会陆续更新，敬请期待。文章索引1.1 为iOS而设计（Designing for iOS）1.1.1 设计跟随内容 (Defer to Content)1.1.2 保证清晰 （Provide Clarity）1.1.3 用深度层次来进行交流 （Use Depth to Communicate）1.2 iOS应用解析 （iOS App Anatomy）1.3 适应性和布局（Adaptivity and Layout）1.3.1 为自适应而开发（Build In Adaptivity）1.3.2 在不同环境提供良好体验（Provide a Great Experience in Each Environment）1.3.3 使用布局来沟通（Use Layout to Communicate）1.4 启动与停止（Starting and Stopping）1.4.1 即时启动（Start Instantly）1.4.2 时刻准备好停止（Always Be Prepared to Stop）1.5 导航（Navigation）1.6 ...继续阅读 (30)

前言：设计师Paul Rand曾说：“理解人最本质的需求，并且认识到必须寻找一个合适的场景以满足这些需求，是设计师教育的基础。”使用设计原型为我们揭示并探索这些需求，为我们提供有意义的交互及友善的设计方案打开了一扇门。特别需要指出的是，低保真原型是在设计初期帮助我们验证想法的粗略表述。本文中，我们将着眼于那些使低保真原型成为设计利器的特点，而这些特点能够从根本上提升工作质量并搭建实现用户需求的场景。本文关注于在设计中使用低保真原型的实践经验和通用法则，涵盖范围从平面、网页和用户体验设计到商业和服务设计。什么是低保真原型及为什么它能够改进你的工作方式？你是否曾经花了大量的时间和资源却设计出了一些不论需求方还是用户都在几秒钟内就放弃的东西？这样的事情我已见过太多次，并总是令我们感到沮丧和挫败，但这种事是可以避免的。进行无法持续验证的产品设计就像你被蒙上了双眼走在一块通向深渊的木板上。即便是多次宣称反对使用焦点小组进行产品设计的苹果公司，亦开创了名为Apple new product process （ANPP）的苹果新产品开发流程，该流程涉及建立和测试数以百计的早期原型。我们当中有些人过早地投入到杰出产品的设计中去，甚至达到像素级完美的地步，而从未停下来问问我们的用户或需求方是否持同样看法。事实上，如果没有引入潜在用户对我们原始设计的看法，那么这样的设计是不友好且无用的。另一方面，过分 ...继续阅读 (20)

在去年，Apple针对新时代用户彻底更新了其设计语言。现在的设计语言相对之前大为简化，能够让设计师将精力集中到动画和功能上，而不是繁复的视觉细节上。很多人都曾问过我：设计应当如何入门？成为一名优秀设计师有没有捷径可走？要我说，虽然没有捷径，但确实有几个适用于iOS的设计技巧和规则能够从全局角度改变你的设计方式。当然，即便你目前的设计目标是完全不同于iOS的平台，相互之间的设计理念也是相通的，你可以将在web和印刷领域学习到的技巧运用到iOS设计中去。iOS 8是一个让设计寻回根源的平台，它给人一种类似现代杂志的感觉，文字精美、布局简单。本书中所介绍的内容将在你未来设计优秀产品的旅程中给你带来巨大的裨益。iOS 8人机界面指南在开始设计之前，我们需要先了解一下都有哪些资源可为我们所用。幸运的是，这方面资源还是很多的。如果你还没读过iOS 8人机界面指南，我强烈建议你快速浏览一遍，让自己从整体上了解一下新版本进行了哪些改变和改进。核心理念iOS 8包含3大核心理念：遵从、明晰与深度。下面我将这几项设计原则的含义细化成能够实际操作的内容进行解释，当然，我解释的深度将远甚于Apple指南。顺从以内容为主角，其他都是配角。所使用的元素应当作为内容的补充，不要使用会分散人注意力的视觉元素与内容争抢目光。简化将用户界面简化到只保留最核心的美感。每次在你要添加新元素时都应自问：是否必要？如果你的应 ...继续阅读 (15)

自上次用户持握手机的研究之后，终于又完成了另一篇系列文章的翻译了。同样来自Steven Hoober，这篇更加关注于细节——用户具体使用时的手势，例如点击和滚动，研究结果对设计有着重要的指导意义。相关阅读：移动设备手持分析——用户到底是怎么使用手机的？阅读原文请戳传送门欢迎关注我的微信公众号“开卷有译”获得新文章推送。本文为原创译文，如需转载请联系作者，注明出处微信公众号“开卷有译”或简书原文地址。—————–我是分割线—————-虽然在过去的几年间，我们在用户如何使用触屏设备的研究中有了许多的发现，然而我十分确信我们仍然有许多未知需要探索。触屏设备这个领域还相当的新。许多新的交互模式仍在研究中，而我们也才刚刚了解到用户是如何理解并且使用他们的触屏设备的。自从一年半前我第一次研究用户是如何持握和使用手机之后，我一直在继续早先的研究，并且还探索了移动触屏交互人性化的一面。下一步我该做的就是去试图了解用户的动机，并确定是否能够找到用户交互行为与不同情景及操作之间的关系。我的研究方法我与在ZIPPGUN工作的朋友一同合作，设计开发了一款移动应用，以帮助我看到用户使用手机或是平板的不同方式。通过此应用，我一共观察了31个用户，其中三分之二使用的是手机，剩下的是 ...继续阅读 (12)

编者按：Facebook 产品设计总监 Julie Zhuo 的个人私货！光修炼视觉功夫是技，想跃升总监，得有些心法，今天总监级人物出马，分享五个最常见的设计思维错误，小编特意将相关的解决方法附上了，即刻改变，现在开始咯。曾经发表过多篇关于管理、设计和产品团队运作相关文章的 Facebook 产品设计总监 Julie Zhuo，最近发表了一篇文章 〈The 5 Most Common Design Mistakes〉，直译虽然是「五个最常见的设计错误」，不过仔细读文章，会发现，其实 Julie 指的应是设计思维，特别是在设计软件产品时，设计师与产品经理需特别要注意这五大错误：我们在学习的过程中难免会犯错。我做错（也看过别人做错）下列的事情很多次。很幸运地，有个叫「网络」的东西，以及这个叫「文章」的媒介，可以让我指出、讨论这些事情背后的错误，并且推到聚光灯之下，才不会让这些错误浪费我们时间、将我们带往差劲的解决方案。一、过分限制了设计上的探索为什么设计上的探索会过分被限制？有两个主要原因：时间：对产品团队来说，没什么比迅速对产品做出正面改变的承诺更具吸引力的事情。在「三个月内对产品做出小改变并取得一点正面成果」与「半年内大改产品并取得更大的正面回响」之间做选择，大部分我见过的团队都是选择前者，也因此需要限制设计师们在设计上的探索。你需要大师级的耐心才有办法选择后者。三个月可以设计、打 ...继续阅读 (13)

本文来自UXmatters，虽然是一篇老文，当再次看到的时候，我无法不去翻译它来分享给大家。虽然已经过了几年，但是我认为文中的研究和数据一点也没有过时，是一篇实打实的“干货”。希望对大家有帮助。阅读原文请戳传送门欢迎关注我的微信公众号“开卷有译”获得新文章推送。本文为原创译文，如需转载请联系作者，注明出处微信公众号“开卷有译”或简书原文地址。—————–我是分割线—————-作为用户体验的从业人士，我们都对“用户需求”十分关注。而我们都知道在为移动设备进行设计时，有一些额外的事项是我们必须考虑的，比如用户在使用这些移动设备时的情境，以及它们是如何影响交互行为以及用户的使用模式的。然而，前段时间我才注意到我们的理解有些遗漏：用户究竟是如何使用以及手持他们的移动设备的？这些设备并不像电脑那样固定在桌子上。相反，人们可以在任何时候使用移动设备，在站立时，行走时，乘公车或是做其他任何事情的时候。用户必须要以某种方式持握设备，以便于浏览屏幕，还有输入。在过去一年左右的时间(译者注：本文是2013年撰写的，所以这里指的是2012年)，已经有许多关于用户如何手持移动设备的讨论，最为突出的则是Josh Clark的著作。但我不禁要质疑我们都看到过的某些内容是否偏离了真 ...继续阅读 (12)

我们进行了研究发现，老年人如何使用他们的手机，并已确定了它们的局限性，引入关键设计建议作为其结果，并创建一个新的简化手机界面。老年人到底想要什么样的手机界面？老年人的障碍是什么？人物调查与分析，得出如何创建一个好的界面利于老人的手机界面。并非如此“智能”的手机目前市场上大多数手机都有一个触摸屏。基于触摸的界面可能会困惑很多人。有一种可能的解决方式是虚拟显示器上的按钮和手势与电话交互。这些界面大多在视觉和运动方面的问题上没有被优化。虽然字体可以在某些手机上被放大，但这并不能解决所有问题。界面和设置依然复杂，与屏幕看起来不相符。图标下有一些微小的文字和用着不舒服的小键盘。我们进行了研究发现，老年人如何使用他们的手机，并已确定了它们的局限性，引入关键设计建议作为其结果，并创建一个新的简化手机界面。我们的奶奶不觉得自己老了第一个想法从和我与奶奶的谈话来的，她很烦用她的手机。她不会读我们发给他的短信，或找出谁打电话给她的。我们得在纸上写下所有的说明告诉她如何使用手机。我们甚至买给她一个简单高级的手机。它有大的按钮和文本便于阅读，但她不喜欢这个手机。她是外向的，喜欢旅游，拍照和朋友聊天。她没觉得自己老了。安卓Launcher作为解决方案我们研究了一些可行的解决方案。 Android是一个很好的平台;整个手机的用户界面可通过安卓Launcher代替。我们发现了几个简化的Launcher，例如BI ...继续阅读 (23)

这是最近很流行的，对未来交互设计发展的一个观点 — 各种大大小小的用手指操作的触摸屏。下面还有很多这种例子：我的看法应该说站在了对立面上 — 这个视频所表现出来的东西，从交互设计的角度来说，还不够有远见。它只是在现状的基础上，小小的往前跨了一小步。而从交互设计的角度来说，现在的交互设计和交互媒介是相当糟糕的。我希望这种展望未来的视频能带来正确的影响，因为他们能给人们指引方向，带给他们灵感。而正式其中一小撮被激发的人们，真正改变了世界。无论你是正在追寻梦想的年轻人，还是准备投资新领域的老者，我都希望这些“视频”能起到他们应该起的积极作用 — 真正的进步和改变我们的交互行为。这篇小文章并不涉及任何详细的“未来发展规划”。 我只是提供一些可供参考的点子。在开始构想应该怎样同我们的工具互动的时候，让我们先想一想“工具”到底是什么。我喜欢这样的定义：工具通过扩展人类的能力来满足人类的需求。换句话说，工具把“我们能做的”转化为“我们想做的”。一个好的工具可以往往可以兼顾这两个方面。在接下来的文章中，我会着重谈一下人类的需求。每个人都喜欢聊需求，这已经成为了大热的一个话题。但是我不会去讨论科技，因为那是最简单的部分。科技是可以被创造的，是可控的，而人类的本性却是难以琢磨的，是问题的所在。我准备谈谈被被忽视的第三要素，人的能力。因为，如果工具被设计出来但是却超出了人的使用能力范围，这绝对不是个好工 ...继续阅读 (19)

王铎（@Micu设计）:“人家设计得真好！”可是好在什么地方呢，却说不出来。这是阻挡你成为优秀设计师的一大障碍。设计是我们的本行，不会用设计语言来解构画面，是说不过去的。移动互联网设计发展到今天，有很多传统的设计规律可以遵循，也提出了新的挑战。因为手持设备屏幕较小，如何在有限的页面内呈现或引导有效信息，又不显得杂乱臃肿，考验着设计师的能力。为什么有的主题或App界面就那么舒服，那么清新，那么有情怀？里面蕴含着哪些最基础的版式设计理念，让我们一块梳理梳理，给初入UI设计的同学做个参考。今天和大家讲讲构图。构图版式三板斧问题一：为什么要讲版式设计？有必要么？就以我刚入行UI设计失败经历为鉴吧，那时候，一拿到需求就马上开始设计，根本就不管什么版式，结果设计出来方案总是很别扭，显得特别乱，往往被扣上“风格不统一”“用户体验差”的帽子。最开始我也是说服不了自己，觉得别人不理解自己的作品。现在想想确实当时存在问题。UI设计必然离不开设计师的天马行空，但是它毕竟是要面向大众市场，做成全世界只有自己能理解的孤品有什么意义呢，UI里的“用户体验”又体现在什么地方呢？而这样的设计又反过来阻碍了你的设计生涯，长期的失败设计很容易带来挫败感和麻木感。尤其是作为初入行的UI设计师，更有必要学习一些版式设计思路。所谓创新，也仍然需要在了解已有的好设计基础之上进行，这里说这些不是让你生搬硬套，是让你站在前人的肩 ...继续阅读 (10)

设计师：怎么我设计的动态表情，上线以后周围多了这么多白色的噪点！更多请查看这里前端：GIF本来就会有锯齿，跟我没关系呀。设计师：太丑了，你不是万能的前端么？这个问题我用ps解决都是分分钟的事情呀！前端： ……（you can you up） 其实，在很久很久以前…2004年，mozilla社区也意识到这个问题，所以当时他们提出了一种新的图片格式——APNG。APNG又叫动态PNG（Animated PNG），第1帧为标准PNG图像，剩余的动画和帧速等数据放在PNG扩展数据块里，因此只支持原版PNG的软件会正确显示第1帧。更多资料请查看http://zh.wikipedia.org/wiki/APNG。由于APNG是PNG的扩展，所以它支持半透明，自然就不会有锯齿的问题。设计师：能说人话么？前端：- -！ APNG比GIF牛逼多了，妈妈再也不用担心锯齿的问题了。设计师：那就赶紧用起呀！这时产品出现了…产品： 不会有锯齿，那是不是APNG会比GIF的体积大呀！前端：just try it…拿一组图片进行测试，会发现有些APNG比GIF要大，如下图：再通过大批量的图片对比可以发现，APNG平均会比GIF的体积大一点点（3%左右）。更多请查看这里产品：只是大一点点而已，那也很不错了呀！前端：却多嘛得，如果APNG可以比GIF还要小，这样用户体验不就更好了。先看看APNG的原理：—————— ...继续阅读 (20)

原研哉在他的《设计中的设计》中有介绍过这样一个案例：日本机场原来是用一个圆圈和一个方块表示出入的区别，形式简单并且好用，但设计师佐藤雅彦却用一个更“温暖”的方式来重新设计了出入境的印章：入境章是一架向左的飞机，出境章则是个向右的飞机。通过一次次的盖章，将这种“温暖”的情绪传递给每一位进关的旅行者们。在他们的视线与印章相交的那一刻，会将这种温暖转化为小小的惊喜，而不由自主且充满善意的『啊哈』一下。一千一万次的『啊哈』就会伴随着这一千一万次对旅行者的善意与好客。这便是产品中的细节与用户直接情感化传递的结果。一兰拉面是在日本非常受欢迎的拉面店，在顾客吃完面并把汤喝完会看下碗底有这样几个字“この一滴が 最高喜びです（你最后一口是对我们最大的肯定）”，他们用这种简单的细节打通了产品与顾客感情的传递，顾客在喝完最后一口面汤是对店主的肯定，并也因为对店主的肯定同时获得了店主的感谢。产品中的情感化的细节经常会成为产品与用户之间情感传递的桥梁，这种传递情感的细节不仅可以增加用户对产品的好感度，更可以让产品更加深入人心，利于产品口碑的传播，有时候可能仅仅一句文案，一个动画，一个彩蛋都可以打动用户，使其与产品产生情感上的共鸣，这便是产品细节中的情感化设计的作用。以下便是情感化设计在网页或者App上的实际运用：情感化设计可以加强用户对产品气质的定位Timehop是一款让你回顾那年今日的App，它可以帮你把 ...继续阅读 (72)