视觉

  • 听Google设计团队讲述新logo是如何被设计出来的

    [核心提示] Google 为什么要换 logo,这个新 logo 是以什么样的理念和思路设计出来的?来听听 Google 设计团队自己的解释吧~

    2017-06-04
  • 传递数据背后的故事——图表设计

    7大洲中最高的山峰:
    南极洲,文森峰,16050呎 4892米
    南美洲,阿空加瓜山,22841呎 6962米
    非洲,乞力马扎罗山,19340呎 5892米
    亚洲,珠穆朗玛峰,29035呎 8848米
    欧洲,厄尔布鲁士山18510呎 5642米
    北美洲,麦金利山20320呎 6194米
    大洋洲,卡斯滕土山16024呎 4884米

    2017-06-04
  • 视觉冲击 | 颜色vs反差,哪一个更能吸引眼球?

    大多数的人们都熟悉色彩心理学;成百上千的文章、案例研究、甚至是从不同角度进行分析的图表。颜色对我们的影响,将影响我们决策过程中的每一个选择。这点是毫无争议的。但是,我们不应该盲目的遵循某一个原则去辨别。今天,我们就一起来测试对比度在吸引关注中的作用。

    2017-06-04
  • 设计思考模式(一):删除、组织、隐藏、附加

    “删除每个页面上一半的文字,然后把剩下的文字再去掉一半。”(《Don’t make me think》中Krug可用性第三定律)“先假定所有内容都是视觉噪音,除非你证明它们不是。”(《Don’t make me think》)“点击多少次都没关系,只要每次点击都是无须思考,明确无误的选择。”(《Don’t make me think》中Krug可用性第二定律》)

    2017-06-03
  • 苹果旧金山字体的秘密

    iOS 9如今已公开发布。带来了一些细微的变化,但iOS 9的系统字体变成了苹果新推出的旧金山字体,代替了之前用的Helvetica Neue。

    2017-06-03
  • 干货!如何做一个让人闻风丧胆的Html5页面

    Specifies the initial zoom factor for the window or viewing area. This is a magnifying glass type of zoom. Interactively changing the zoom factor from the initial zoom factor does not affect the size of the initial or the actual viewport.A two-dimensional transformation is applied to the coordinate system an element renders in through the ‘transform’ property. This property contains a list of transform functions. The final transformation value for a coordinate system is obtained by converting each function in the list to its corresponding matrix (either defined in this specification or by reference to the SVG specification), then multiplying the matrices.The value of the transform property is a list of applied in the order provided. … specifies a scale operation using the [sx,1] scaling vector, where sx is given as the parameter. … specifies a scale operation using the [1,sy] scaling vector, where sy is given as the parameter.

    2017-06-03
  • Web用户体验设计总结

    最近一直在做APM报表的重构,记录和分享一些看法。希望可以坚持,今天先做Web用户体验设计的总结。因为重点再重构上,所以可能所说的内容有局限性。

    交互设计 2017-06-03
  • 请记住,视觉设计远不止“好看”这么简单

    设计师和理发师其实有点像,理发师基本分为三种:一种是只会搞基础发型的,比如寸头、中规中矩的长发、老太太卷头等;一种是只会剪流行发型的(这种发型师还很容易 摇身一变成为造型大师,告诉你你应该改变,应该剪目前最流行的某款发型,但实际上可能是他只擅长这款发型);还有一种是最可遇不可求的,他根据你的脸型、 性格等,用最简单的手法量身设计发型,让顾客的气质度立刻得到提升。

    2017-06-03
  • 如何合理的在移动应用中使用动效

    译者语:本文是我在Smashing Magazine看到的一篇关于如何在移动应用设计中运用微动效的译文。初次翻译文章,很多词句用的可能不太妥当,在这里给大家作揖了!knock knock……

    2017-06-03
  • 别逗了,真正的“用户体验”并不如你们所说!

    User Experience is “a person’s perceptions and responses that result from the use or anticipated use of a product, system or service”.— ISO 9241-210The extent to which a product can be used by specified users to achieve specified goals with effectiveness, efficiency and satisfaction in a specified context of use.— ISO 9241-11— Baekdal, T., 2006. The Battle Between Usability and User-Experience [Online] Available at: The Battle Between Usability and User-Experience–Nielsen Norman Group, 2007. User Experience – Our Definition [Online] Available at: http://www.nngroup.com/about/userexperience.htmlBy Alan Penn, director of the Virtual Reality Centre for the Built Environment at University College LondonReference:Why User Experience Cannot Be DesignediA | Can Experience be Designed?文章一:Eric Baczuk, Design and the (Ir)Rational Mind: The Rise of Affective Sensing
    https://designmind.frogdesign.com/2014/05/design-irrational-mind-rise-affective-sensing-2;
    文章二:Daniel H. Pink, A Whole New Mind Moving from the Information Age to the Conceptual Age
    http://www.goodreads.com/book/show/99315.A_Whole_New_Mind“做项目久了,难免就会职业病发,没成想现在最大的爱好就是拆字玩儿,总想着能从字本身的意思去弄点洞察出来。现在哪哪儿都在说用户体验,说实话,这个概念本人听的是真有点腻了,凡是个东西都要扯上“体验”二字。顺手在网上搜了下在线词典,这下面倒是有对于体验的几种原生态解释:1.亲自处于某种环境而产生认识2.指通过亲身实践所获得的经验3.所谓亲身经历与实地领会4.也含有查核,考察的意思
    从这些个解释里不难看出,从1,2,3的解释中,体验是包含有时间概念的:体验当下的那一刻,体验后的回想总结,以及建立下一次体验的心理预期和评判标准,其中反复强调的是“亲身”一词,这个时候,人的概念就被带出来了,不难看出所谓“体验”又包含了多少亲历者的主观意识;从4的解释中,个人觉得特有嚼头,这似乎是来了个总结:大多数的人都是带着“挑刺儿”的情怀去走完整个时间线的。
    最后,简单的总结下我想说的1.体验设计的who 是别人,体验包含太多主观因素,设计师要懂得如何充分提炼每个人情怀背后的深层共性。2.体验设计是围绕过去,现在和将来这条完整时间线的设计,绝对不是一锤子买卖。3.只要是人,就会对你为他们所架构的体验进行“审核”,所以作为设计师,千万要宽容要大度,那个被“骂”的点或许就是支撑前行的机会。文章中揭示的“互联网产业中对于User Experience和Interaction Design的混淆”可谓是一针见血。作为一名有着一点用户体验sense的互联网从业者,我往往会花费很多时间去说服决策者将投入更多地精力去研究用户,用更加宏观的角度去看待用户体验,但由于自己对于用户体验理解和阐述的局限性,这样的尝试往往无疾而终。我觉得这篇文章提供了很好的逻辑结构和对比佐证,让设计师能够更好地理解用户体验的同时也可以更好地把这个概念传输给别人。
    对于文章中提到的两个工具,Customer Journey Map和User Experience Questionnaire,在我看来虽然被证明在设计咨询和设计用户研究领域非常有效。但是在产品迭代迅速的互联网行业,决策者往往会更倾向于快速地推出产品、快速地试错、快速地更新迭代这样的“野蛮”方式来获取更加直接与准确的用户反馈。在这样的一种大环境下,相对传统的用户研究工具似乎因为周期长与结论的不确定性显得有些“笨重”,这也间接导致了部门互联网公司的决策者对于类似调研方式的抵触。如何做出改变,让这些有效地工具和理论在这样相对“野蛮”的环境中显得“接地气”,我觉得是作为一名设计师需要思考的问题。这篇文章很是解答了大家对于“用户体验”,“易用性”,包括“体验设计”的差别。非常赞同对于未来设计世界和人类世界对于情感化消费需求的方向,很多时候人们看似理性的消费实际上也是出于背后难以明状的亦或是潜意识亦或是外界的多重的信息刺激。神经科学(neuro science) 主张的决策下达从来都不是由内而外的,而是由外而内的。从这一点看,似乎“体验“还是可以被”设计“的,这种预设,结果当然越接近最终的现实越好。在《Thinking fast and slow》这本书中提到了诸多人们下决定的包括背后存在的偏见,所谓主观的意见实际也掺杂了背后潜意识的,本能的,直觉的迅速的判断,在这样的情况下,消费者的“体验”可以”被操控”的因素也大大增加了。说到底,人都是很有同理心(empathy)的动物,再正经地挣扎表现出理性的样子,也不过是那层薄如蝉翼的外壳罢了。“用户体验”就是在不停地触碰这层外壳,让“体验”直入你心。作为一个Service Design背景的设计策略师,用户体验之与我并不是虚拟产品中的手势,按钮,和A/B测试。用户体验融合在一整套服务系统里无形或有型的用户触点中。正如文章所提到的,实体体验的内容层级要远远超越互联网产品的易用性,它是一个更加复杂而庞大的系统,它需要深入挖掘人类需求的本源与动机,而并非只是依照某种需求本身位用户提供某类的便捷工具。
    正如Pine II和Gilmore在The Experience Economy一书中所述,任何企业在喝消费者互动时都是在导演体验,以一种个性化,令人难忘的方式与消费者建立联系,以服务为舞台,产品为道具,以品牌故事为剧本,当我们购买的是体验时,我们花钱享受的事商家为我们提供的一场难忘的回忆,就如同参与一场戏剧演出,其价值将长久地存在于我们的心里。
    试想一下MM巧克力世界,乐高积木世界,苹果体验中心,以及把体验做到极致的迪斯尼。他们永远不可能收到互联网产品的冲击。许多人说随着互联网服务的发展,电影院,商场,美容院,餐厅,所有的产业都将受到影响。然而,良好的体验是在一个人心理,生理,智力和精神水平处于高度刺激状态下形成的,这并非是互联网产品的良好易用性就可以轻易满足的需求。
    对于“用户体验”而言,“易用性”是衡量整个体验过程中所需要的某一工具的标准之一,而体验则应该思考如何通过全方位的营造让服务变乃至于整个生活状态变的更加丰满和人性。“用户体验”被广泛的使用和探讨,说明随着经济发展,消费者的需求已不再单薄。以设计为主导商业创新挑战才刚刚开始,作为这个时代的设计师,我们更应该以开放和学习的心态来迎接新的挑战!关于用户体验的未来的展望非常有趣。说到底是对人的更深入的了解是用户体验的根本。传统上来说,用户体验是基于对于用户更深切的研究,是以用户研究为基础的。也就是根据用户的所说,所做,所想,甚至所感挖掘出真实的用户的能力,需求和期待。而从上文用户体验不能被设计上来说,Context of use和User两个都是影响的因素。也就是说,未来对于User本身的了解的加深, 以及Context of use的改变也会对用户体验本身有着极大的影响。

    2017-06-03
  • 转行学设计?新手必读的五大误区+三大秘籍

    经常看到一些讲如何学习设计的文章,坦白讲感觉有些千篇一律、且不痛不痒,都说要看点书、学点画、练软件、多观察……唉,练软件这事还要说么,难道你还需要告诉一个人学开发是需要学习编程语言的?

    2017-06-03
  • 超实用的响应式排版快速指南

    译者语:无论是对于印刷、网站或是电视广告来说,排版都是我们用来沟通信息的主要方式。排版之重要性我想已无须赘述。然而,“理解”和“实践”还是相差十万 八千里的,特别是在网页设计中,“一个字号走天下”的想法可以歇歇了。我们或许都听说过响应式网站,但我想你们中可能很少有人知道什么是响应式排版吧。

    2017-06-02
  • 一组能切实提高转化率的网站着陆页设计

    网页设计 师目前在设计界是一个最为尴尬的存在,一方面他们被视为和GEEK党混在代码堆里不懂审美的怪咖,另一方面他们又苦于网页中被局限的自由而无法在创意上得到最大延伸,设计师本人无法给自己准确定位。

    2017-06-02
  • 交互设计的未来:技术的改变使交互设计的可能性愈加丰富

    Terry Cao是UXPin(一款线框图与原型制作APP)的内容策略专家。要了解如何掌握现在交互设计的艺术,可以参考免费的电子书籍《Interaction Design Best Practices》。这本书中含AirBnB、 Google、 Apple、Etsy 以及其他诸多公司的30多余交互案例。“Modality Interactivity对用户来说更有说服力。因为这使用户在浏览网站的时候更有趣,更吸引他们,并且帮助用户对网站信息产生更积极的态度。” 一位来自罗伯特·莫里斯大学的通讯系助理教授Jeeyun Oh如是说,“交互(Interactivity)通过让用户更深层次地理解网站信息而更具说服力。”欲更多地了解现代交互设计的艺术,可以阅读《Interaction Design Best Practices》一书。

    2017-06-02
  • 几种常见移动导航模式详析

    虽说一款应用的生死不是由导航决定,但毋庸置疑,导航模式的选择在产品用户体验上占有很大的比重。就导航本身来说,没有优劣之分,端看你的应用适合哪种。下面是我罗列的一些常见的移动导航模式,接下来会对其一一举例说明(注:重要模式会重点分析,其余简略,篇幅略长,不喜可跳过)

    2017-06-02
  • 界面设计 | 如何打造整体性的产品设计方案

    界面设计工作当中的很多纠结来自于怎样在这三者之间进行权衡。对于不同的功能与内容,如果拿捏不清它们各自的特点及适宜的呈现方式,那么你便很难打造出具有整体性的产品设计方案。

    2017-06-02
  • 设计师的像素眼是怎样炼成的?

    传说的像素眼,也就是可以快速分辨出 1px 以上差异的双眼,往往由资深设计师所 get√,想要练就一双迷人的像素眼,除了常年累月的经验之外,还是有些技巧可以快速掌握的。今天分享7个像素眼的常用场合,按图索骥,用心观察,你也可以修炼成功!

    2017-06-02
  • 如何建立用户评价模型,量化用户体验

    在互联网趋势盛行的当下​,我们不得不思考: 用户体验是个很重要的事情,要真正领会其精髓并将其发挥到极致, 绝不是通过简单的模仿就能实现的。同样, 一个网站受欢迎的程度远不只与精美程度相关,更重要的是用户在登陆网站的过程中是否能够得到愉悦的体验。

    2017-06-02
  • iOS8 Human Interface Guidelines 精选阅读(中英对照)

    用了两个星期时间断断续续读完iOS的guidelines英文原版,原文是写得有点啰嗦,所以精选了以下觉得比较重要的点,并加以自己的解释;当然如果你有时间,还是推荐阅读英文原文。首先是因为翻译的版本基本是不全的、旧的,就像ISUX的翻译的对比原文就会发现中间省略了好多。本文的作用并不像多数的翻译那样,让你粗略地了解里面的内容,而是精选出一些点使你体会到苹果的设计思想。 我读guidelines的目的不仅仅是要看他们是怎样规定的,而是要看他们为什么这样规定,在了解了制定规则背后的原因之后不仅便于记忆规则本身,还能了解苹果的设计思路,当吸收了设计思路之后,就不再是墨守成规,而是更自信和灵活地运用规则,甚至创造属于自己的规则。就像tweetie发明下拉刷新手势之后苹果反而把这种手势加进了自己的guidelines。 读英文原版还有一个显然易见的好处就是熟悉专业英语表达,guildlines的措辞显得优美而精确,值得去读读。

    2017-06-02