UI风水学:你该知道的9个UI设计门道

好风水称之“顺”,其中一元叫气,精气/气场在于风水之中:“气遇风则走,遇水则停。”讲究个气顺心畅;
好交互称之“理”,其中一元叫情,情感/情怀在于场景之中:“情遇杂则乱,遇简则通。”讲究个通情达理。好风水称之“顺”,其中一元叫气,精气/气场在于风水之中:“气遇风则走,遇水则停。”讲究个气顺心畅;
好交互称之“理”,其中一元叫情,情感/情怀在于场景之中:“情遇杂则乱,遇简则通。”讲究个通情达理。


好风水称之“顺”,其中一元叫气,精气/气场在于风水之中:“气遇风则走,遇水则停。”讲究个气顺心畅;

好交互称之“理”,其中一元叫情,情感/情怀在于场景之中:“情遇杂则乱,遇简则通。”讲究个通情达理。

UI风水学:你该知道的9个UI设计门道

印象

一副罗盘,一桶竹签,一把神仙胡。电影里的风水先生,给足了我们算命卜卦的印象。我不是风水中人,只是听过昔日老友的一些风水之道,关于风/水/气势对与人的影响,里面有透着一种“以人为本”的气息。像极了我们行内的交互设计,所以今天我也来一挂,信不信由你。

话说UI并不是研发(早期)流程的必要环节,产品也不能单靠UI成功,国内UI的兴起,离不开IT行业日益激烈的竞争,后来企业为了与网络接轨,终于从国外引进了交互的概念,为了融合本土文化,笔者尝试从风水的角度重新审视和探索这个我们曾经熟悉的“未知空间”。

史例

在英国伦敦郊外,一座叫布莱克弗赖尔的黑色大桥,每年总有不少厌世者跑到桥上投河,民间盛传这座桥上总是有幽灵游荡……后来政府把黑色的桥漆成绿色,试行后发现桥上自杀事件骤然降到原来的一半。有人说这是典型色彩应用的设计案例,和风水无关。但放在风水里,似乎也有着相似的讲究。

UI风水学:你该知道的9个UI设计门道

门道讲究甚多

1.阴阳——“阴阳交感而生宇宙万物”

阴阳学说来自于《易经》,黑白两极又称正负空间,UI的发展正是将原有复杂的事物信息扁平后呈现,表面上减掉了很多视觉信息,实质上却将产品重心回归到了内容和功能上,为设计开辟了一个新的纵深空间。

UI风水学:你该知道的9个UI设计门道

2.布阵——“太极生两仪,两仪生四象,四象生八卦。”

界面中任何图形/交互的样式都有影响全局的作用,前期的交互规范决定了每一种样式的属性和有效的层级关系,从体验上帮助用户理解信息,从格局上奠定语言生态,从情感上建立产品信任度。

UI风水学:你该知道的9个UI设计门道

3.方位——“辩方位而正则”

上下左右,常用控件到底摆在哪里合适?如“关闭”键是大家最熟悉的BUTTON,一般摆放于界面右上角的位置(通用),这样既好找又能减少了误操作。就像中国人喜欢朝南的房子一样(采光),背后有着很多科学的解释。

UI风水学:你该知道的9个UI设计门道

4.时辰——“子、 丑、寅、卯、辰、巳、午、未、申、酉、辛、亥12时辰”

因为睡眠的原因,我们在家里待的最久的地方不是客厅而是起居室(卧室),风水的布置不免费心,从建筑规划也能看出,加配独卫的主卧早成卖点。所以一个成熟的产品设计,更离不开对用户各种时间节点的分析和运用。

UI风水学:你该知道的9个UI设计门道

5.声音——“五音六律十三徽”

视觉传达的概念中文字被喻为一种平面声音,同样的视觉范围,不一样大小的文字有着不同的音量,像声音一样,较大音量具备明显的辐射效应,大号的文字标题干扰和穿透力更强。

UI风水学:你该知道的9个UI设计门道

6.风/水——“藏风聚气,得水为上”

风代表灵动,用来改变僵地的平淡;水代表净洁,用来冲洗多余的繁华,“动静有致”的画/界面,既能拉开信息的层次,也符合了人眼本能处理信息的方式;

UI风水学:你该知道的9个UI设计门道

7.规矩——“心如规矩,志如尺衡”

刻量与标记虽然是UI交付中一个很不起眼的工作环节,但在团队协作中却发挥了重要的作用,再好的界面也离不开精细的前端呈现,每一像素的标注都关系最终产品的品质。

UI风水学:你该知道的9个UI设计门道

8.玄关——“玄关幽键,喻法藏也”

加载或登录界面是UI中最有趣也最容易忽视的地方,如同玄关,一个过渡的空间,表面可有可无,但此处为用户出入的必经之地,使用频率之高,足以承载整体UI的第一感受。

UI风水学:你该知道的9个UI设计门道

9.靠山——“有其象必其应”

俗话说:“耳听为虚,眼见为实!”生活中人们为了避免失利,更愿意接受自己所认知的事物,经验和习惯像一座大山一样难以撼动,所以交互中最常见的操作如“返回”键的ICON,箭头和对齐的方向永远指向左边,依靠的都是人们长期的阅读和使用习惯。

UI风水学:你该知道的9个UI设计门道

UI之风水忌讳

关键性功能不宜放在高频操作区域(避免误操作)

犹如“大路对冲”,指屋/门正对一条笔直街道,影响健康。

同一个功能的操作或显示不宜呈现多种样式(避免认知摩擦)

犹如“门向不一”,指屋内开门的方向左右不一致,影响运势。

设计完稿后不宜直接提交(避免闭门造车)

犹如“乔迁未暧”,指搬入新居时过于冷清,影响财运

根文化

风水源自《易经》,载于商周之际,后推崇于道家(老子-开创),与道家有着密不可分的关系,道家哲学不同于儒家社会哲学的进路,道家重视人性,创立了“人本”的思想观点,“天道运行有其自然而然的原理在”。

UI风水学:你该知道的9个UI设计门道

小结

  • 道学的一面为人性,以无形胜有形;
  • UI是内容的载体,拓展的核心在空间;
  • “风水轮流转”强调不断借鉴与包容的心态。

好风水称之“顺”,其中一元叫气,精气/气场在于风水之中:“气遇风则走,遇水则停。”讲究个气顺心畅;

好交互称之“理”,其中一元叫情,情感/情怀在于场景之中:“情遇杂则乱,遇简则通。”讲究个通情达理。

“风水”之说至今未被科学证实,江湖传言也仅为道听途说,生活中我们正逐渐远离这些古老的“迷信”……只待有识之士,着起研之!

UI风水学:你该知道的9个UI设计门道

 

本文由 @WET 原创发布于人人都是产品经理。未经许可,禁止转载。

原创文章,作者:Catherine,如若转载,请注明出处:https://www.iamue.com/25835/

(0)
CatherineCatherine
上一篇 2017-05-12 13:16
下一篇 2017-05-12 15:13

相关推荐

  • 真实案例:如何量化生活服务中的用户体验?

    能把用户体验量化起来么?这算是做好优化用户体验行为的一个前提吧。如果我们能把某件事物的用户体验量化起来,就有了尺度和标杆,这样就能更好的优化UED活动。碰巧最近我碰到了一个同类服务的不同体验,在五家银行更新证件有效期,就以此为例子来分享下我个人对用户体验的量化见解。

    2017-05-26
  • 设计规范如何写?这20个精选案例让你大开眼界

    如下为规范汇总页,里面囊括了许多大家熟知品牌的规范。1.Brand Style Guide Examples

    2017-06-02
  • 交互设计私人资料大集合-赠送

    交互设计,算是一个很新兴的职业,但是目前在市场上并没有找到很多关于交互设计方面的干货。百度一下都是一些培训机构的推广软文,给很多想要入行的同学们造成了很多困扰。所以我发了一些时间去找一些交互设计方面比较系统和正规的学习资料和网站,希望对大家有帮助,拿走不谢!第一:各大互联网公司ued部门阿里妈妈MUX文章分享:http://mux.alimama.com/posts/1300蚂蚁设计:https://ant.design/docs/sp...

    2018-03-05
  • Android界面设计视觉规范

    当你拿到Android的设计需求后,开始着手进行界面的设计,却不知道如何设计才能让用户对界面感到满意,设计出来的界面差强人意,返稿无数以至于一遍遍的修改?如果这就是你现在的状况,那么先别急着重新进行界面的设计,因为你首先得静下心来看一看这篇Android的界面设计规范。

    2017-05-31
  • seeds对话未来丨李斌:重新定义用户体验

    对话未来丨seeds系列分享会seeds, 由蔚来原创打造,是一个分享有趣观点、新知与灵感的讲堂,它寓意着每一个思想的火花都像一颗种子,被灵感浇灌后,汇成大树。2015年3月seeds诞生,从一个面向蔚来全球员工的内部讲演平台,发展到不断吸引各行各业的主讲人,并且在蔚来App公开直播的产品。到目前为止,seeds 已举办了13场演讲。今年,seeds会走进我们各个城市的蔚来中心,成为常设活动。我们也欢迎各位用户成为seeds的主讲人。4...

    2018-05-03
  • IOS 10人机界面设计指南[中文版]

    随着iPhone7的发布,iOS10普及起来已经不远,所以iOS10的人机交互规范大家也需要学习起来了,分享的是迄今为止翻译得最全面的,iOS10人机界面设计指南[中文版],希望能帮到大家,enjoy!

    2016-10-24
  • 7种方式玩转信息可视化中的时间线设计

    时间常常被认为是一种主观的体验,然而在可视化的表达中,时间却成为了结构化维度。时间帮助我们构建稳健而直观的框架,使我们更好地建立事件间的联系。 按照时间线的方式阐述信息已经广泛应用于企业传播、营销的各…

    交互设计 2015-08-27
  • 三个维度解析一个产品的交互设计

    作者:飞起就是一jio链接:http://www.jianshu.com/p/ad13cebe513b本文以“微信首页”为例,用三个维度系统地解析一个产品的交互设计的方方面面首先我们来做个互动,请各位看官打开自己的微信,然后看到你的微信首页…

    2017-08-04
  • “看起来不错”,但是如何让用户购买?

    到底是什么触发人们的购买欲?什么东西促使用户快速购买?线下很多的销售人员和老板都在思考如何将自己的产品卖给客户,那么线上的产品经理应该如何思考,用好的交互体验来迎合用户,打动用户为你的商品付费呢?

    2017-05-19
  • Adobe放大招!Sketch有的功能都上了!

    (本文内容来源知友:不知语冰,感谢~)关于 Photoshop的UI-DNA工具很久就有传闻了!昨天据MICU了解,这个强大的工具终于开放测试啦~~虽然说很多设计师比较推荐sketch,可是这回了不得!sketch有的功能,PS都能实现了!也许有很多同学还不太了解 UI-DNA 是个什么样的工具,说白了,就是 Photoshop 上拥有更强大的属性编辑功能。现在来说说UI-DNA都有神马强大的功能。打开Photoshop 中的UI-DN...

    2018-03-02