产品插画设计中,都有哪些比喻技巧?

Shopify是一家位于加拿大渥太华的电商软件开发公司,专门为中小零售商提供建立网店的Saas服务,能对接主流ERP系统,为客户提供打单、发货、运单号自动回传、订单业绩汇总、利润计算、仓储、采购及供货管理等一体化管理流程,按月收取咨询服务费用。
本文作者对产品插画中“如何利用比喻来找准信息传达的关键,提供有价值的无形体验”有自己独特的见解,在视觉设计角度对大家应该有一些启示。


Shopify是一家位于加拿大渥太华的电商软件开发公司,专门为中小零售商提供建立网店的Saas服务,能对接主流ERP系统,为客户提供打单、发货、运单号自动回传、订单业绩汇总、利润计算、仓储、采购及供货管理等一体化管理流程,按月收取咨询服务费用。

本文作者对产品插画中“如何利用比喻来找准信息传达的关键,提供有价值的无形体验”有自己独特的见解,在视觉设计角度对大家应该有一些启示。

产品插画设计中,都有哪些比喻技巧?

在产品插画中合理使用比喻既不是在插画中使用比喻的修辞方式,也不是在把比喻内容用插画表现出来这么简单。

最近我被问到蛮多的一个问题是:在招聘插画师时你主要考核什么方面?

既不是拥有独特的个人特质,也不是深谙多种风格,更不是曾服务过的知名客户列表或者作品出展过的地方,当然拥有这些资质也挺不错的。我的答案是:设计师对比喻的使用程度。为团队招聘插画师的时候,我最想了解候选人是否理解如何通过愉悦轻松易懂的方式,借助比喻来传递复杂的想法。

对使用比喻的能力如此看重使得我的学生及同事们都很惊讶,那么我还是解释一下在Shopify插画团队里我们如何使用和理解比喻

除了铅笔、手写笔或者咖啡,比喻叙词表(更实在点说,我们电脑里保留了一份比喻使用的参照文档)也是是插画师经常使用的工具。冒着“插画师有一定的创作套路”被外人熟知的风险,我们在辅助设计师进行插画设计关键创意时也使用这种方法。插画设计的确有一种捷径。尽管立场坚定的站在设计阵营,顶着设计师的尊敬称呼,我也得承认:插画本身就是一种内容表达。正如作家撰写的故事里,产品是如何无缝融入我们生活的,插画师使用比喻这类文学工具将复杂的想法与背后相关体验连接起来,努力挖掘深层原因,使得用户被产品的无形利益吸引。

在产品设计中熟练有效的使用比喻,首先得找到需要传递的核心信息。常见的错误包括:在图形中传递了多重目标或信息;允许一个图标包含两个物体而不是一个;允许一个背景物品吸引了场景中大量的注意力(因为大部分设计师偏爱这样)。从16像素的图标设计到精致入微的场景设计,比喻都可以作为一个优秀工具。但无论如何都要通过比喻赋予图形具体意义,以帮助用户更方便的进行产品导航。随着插画复杂度的增加,我们需要定义视觉层级,其中每个层级的元素为插画传递核心信息的整体故事服务。当你为插画添加元素时,必须反问自己“这个元素对整个画面表达的故事有帮助么?”“这部分有益于核心信息传递么?”,如果答案为否,请准备好删掉它们。

产品设计比喻的类型

好吧,在没有理解什么是比喻之前,我不确定大家能读懂后文。在未说明定义之前就谈论分类听起来很怪,以防万一我还是解释一下。比喻(隐喻或明喻)是文学中以非字面意思连接两个想法的修辞方式,而不是单纯的夸大想法本身或者夸大表现互动方式。

一、标准比喻

这个元素与那个元素在某刻具备相似性。如下图所示,它不需要展示实际产品就能让用户理解。图中并不是真正在讨论冰激凌,而是通过插画以比喻的方式传递了“正如用户能够按口味喜好用配料调制成个人专属的冰激凌一样,你也能根据自己的需要为利用我们提供的服务(App)来打造你的专属店铺”的理念。

这招在产品设计中特别管用,尤其是那种无形、复杂的数字产品。

产品插画设计中,都有哪些比喻技巧?

二、融合比喻

这个元素与那个元素融合,就能表达我们想要传递的内容。可能这类比喻使用起来需要更老道的经验,但在产品插画里的确更受重视,或者说一般设计都会考虑它,因为它是让用户获知你的产品或功能卖点的捷径。如下图所示,没错,你知道我们提供了“购买”的按钮,但瞧瞧旁边摆放的画笔,基于对画笔的了解,你就会明白你能定制“购买”按钮的颜色。将刷子的功能与按钮的功能混合起来,刷子可以自定义颜色,因此我们的按钮也可以。与品牌和营销设计一样,这种比喻在图标设计中也时常出现。

产品插画设计中,都有哪些比喻技巧?

三、相似类比

这个元素在线上和线下有相似之处。尽管我不认为它是一类比喻,但在产品设计中我还是将它单独拿出来说。比喻常用来展现触动人心的部分,那是一件事情或者一个行动产生的积极感觉。

不过,对于内容传递给用户的方式,团队更倾向于中立精确的写实表达。不必告诉用户我们的感受如何,只需简洁传达信息。用插画的专业术语来表达则是:我们只愿意通过绘制写实状态下的物品,来帮助用户理解线上的内容。

当然,谈到产品时,我们大多是在电脑上作画,比如,你可以绘制20多个互相连接的空状态页面,来表达重复性。这也是我们在为用户传达内容时增加的一种类比方式。

比如下图的例子,线上电子商务可以让用户通过优惠码输入实现折扣,那么线下实体销售折扣该如何表达呢?可能是一堆贴纸和带着折扣价格的红色标记。我们能借助全新怀旧风格的插画为用户带来愉悦,同时还能保持中立,只是简单清晰的表达信息。

产品插画设计中,都有哪些比喻技巧?

提醒:使用陈旧或过时的物品做相似类比时,信息会有误传风险。

在产品设计中使用比喻

当有了新想法,试图找到合适的切入点来讲个好故事时,我们通常问自己“为什么商家在乎?”,接着就是“这种无形的体验究竟是什么?”“如何把故事讲好?”这些问题。

【案例:用插画表达用户能够购买自定义域名的功能】

备注:这些想法来自我们极具才华的插画实习生Erin,他现在负责通过插画宣传自定义域名的功能。早上我们有过交流,我认为与其绞尽脑汁编一个,还不如直接用身边这个触动我的完美案例。

Q:为什么商家在乎?

他们在乎该功能因为他们不再愿意告诉用户他们的冗长域名breadpoetsociety.myshopify.com。像他们承诺提供稞麦粉出售、松脆饼打包、甜甜圈贩卖服务一样,商家希望购买自定义域名也能被认真对待。

Q:这种无形的体验究竟是什么?

插画要能体现用户以下感受:他们已经为“打造面包诗人公社”的目标做好一切准备,这不再是周末萌发的天真想法,而是一个成熟的业务,包括随之而来的激情与期待。

Q:如何把故事讲好?从哪里切入?

1、标准比喻。

首先绘制一个小屋或店面,因为线上与线下类似。一个设计概念能以多种方式传达,取决于你打算聚焦于哪些元素,以及你如何从宏观和微观角度表达它们。

例如,对整个店面,经纪人标识,店铺里的装修的视觉表达。

2、融合比喻。

将“家/店铺”与“域名/线上”的概念以任何穷举组合的方式融合起来。

例如,将家与路由器、店铺与一系列结点、符号与网络的特点进行融合。

3、相似类比。

可以从名片切入,模拟现实里将承诺的个性化名称与有形物品的结合实现。无论是线下打印出来还是线上展示,尝试用插画去捕捉和表达“客户看到定制的业务名字被写出来,初次被当做自己的生意提及时的那种激动感受”。

用户通过我们的产品,基于数据对定价策略、销售渠道和潜在买家行为进行有形决策。而我们则使用插画来表达那份无形的体验:用户掌控日程的自由,打造专属物品的满足,初次销售后发自内心的喜悦。这些无形的体验或许不会成为用户界面的一部分,也不会成为对老板汇报的内容,更不容易以实打实的可见产品价值论证自身的设计价值,但它们不仅是产品设计的重要内容,也是我们所倡导的设计方式。产品插画中的比喻逐渐成为这部分从未尝试过的触动人心体验的代表,超越了那些使得用户爱上产品的有形功能内核,升华了整个故事。

 

原文地址:https://medium.com/shopify-ux/effectively-using-metaphor-in-product-illustration-62bdccbe14e4#.ljarg9a16

译者:阿里巴巴/1688UED/无线交互/舒舟

译文地址:阿里巴巴用户体验中心

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

(0)
CatherineCatherine
上一篇 2017-05-14 05:24
下一篇 2017-05-14 07:21

相关推荐

  • 思路总结:从体验设计角度做有效竞品分析

    本文作者总结了自己在实践中学习和应用过的竞品分析思路,一起来看看~

    2017-05-05
  • 在网页设计中运用柔和色调

    小编推荐:看一些让人舒服的设计的时候 总是会发现,人家的用色大部分都很柔和,一些温暖人心的设计总是有一些共同特点,网页设计中也有一些使用柔和色调的方式~

    2015-01-08
  • 现在交互设计是时候走出迷茫

    交互设计的定义:交互这个词,英文是interaction,其中inter是互相的意思,action就是行动,所以inter-action直面上看就是“互相的行动”,也就是你行动一下,对方再行动一下,你来我往。交互设计,就是在设计这一些列的“互相行动”,使用户能更好得使用物品,物品能更好得服务用户。献给深夜中孤注一掷的设计师们来自无可设计00:0002:30下面小编想向大家介绍一位交互设计大师————————Lucian Bernhard...

    2018-03-27
  • UI交互设计专业-第三十六期学员作品

    专业:UI交互设计班级:第三十六期学员学员:李银学校:湖南理工学院

    2018-03-12
  • 帅气的YouTube改版交互设计,获Adobe大奖

    美国设计师Ziarekenya Smith为Youtube制作的概念交互设计,获得2014年Adobe设计大奖。项目视频↓↓↓Ziarekenya Smith一人承担了设计、动画、音效所有内容.新Logo,一个简洁的取景器,更强调用户UGC特色新的登录页面新…

    2017-08-02
  • 实例分享:交互设计如何赋予产品安全感

    作者:高广淦全文共 4235 字,阅读需要 8 分钟—— BEGIN ——做互联网金融交互设计的这两年,也算是用过上百款竞品了。尤其是一开始做设计的时候,满世界的下载注册体验竞品,以至于我这两年的投资收益还是很可观的,…

    2017-08-04
  • 好的设计:存在于无形当中

    东东导读:对于社交类产品来说,优秀的设计,应该是不争强好胜般凸显在用户面前的,而电商类和社交类产品很不一样,电商类的产品经理想的首先是GMV(成交金额),一切是为着GMV转的举例:用户刚购买了眼镜,那么给用户推荐眼镜盒,而不是推荐洗脚盆;用户刚订了周六上午的话剧,那么给用户推荐话剧院旁边的餐厅,而不是继续推荐其他的话剧;当用户刚购买了一张飞往巴黎的机票,那么给用户推荐机场的接送机,而不是一股脑的推荐旅游产品。举例:用户明天飞往曼谷,提前一天发短信提醒用户航班信息,告知用户曼谷明天的天气,若有紧急新闻事件也可一并告知(比如曼谷突然发生恐怖爆炸事件,只要跟用户切身相关的,请第一时间告知用户)。然后顺带可以推荐接送机服务。

    2017-06-03
  • 怎样才算是好的用户体验?

    说今天是一个体验为王的时代,一点也不过分。做大众消费品的人可能已经感觉到,今天消费者的话语权越来越强,如果你的产品做得好,不久就会口口相传;如果你的产品做得烂,不久就会骂声一片。所有这一切在过去是不…

    2014-10-28
  • 阿里UED:优秀阿里设计师如何养成

    编者按:一个优秀的专业交互设计师该具备哪9个素质?一个完整的交互设计流程该经历哪12个阶段?今天阿里的交互设计师从零开始一一帮你解答这两个问题,非常适合新人入门哟。一直以来,交互设计师都是一个受到广泛质疑的岗位,很多人不了解交互设计师的价值,更直接的说,我们大多数的交互设计师没有表现出足够的、令人信服的专业度。大约五年前选择了这个职业,一路走来,质疑过、探讨过,也争辩过。和很多交互设计师一样,我也有过盲目自信和茫然失措,历经时间的鞭挞后...

    2018-03-09
  • 用户体验是家电实体店独享红利

    不可盲目自信,也不能过度自卑。对于众多的家电实体店来说,满足用户的体验、持续带来新的用户体验,是应对一切外来不利因素挑战和冲击的最大筹码,也是生存的底线。蔓欣||撰稿现在,主题乐园正成为现在人们选择度假的方式,在春节旅游大报告中,上海迪士尼赫然位于“最热门景点”第四,而其他像常州中华恐龙园、顺德长鹿农庄、上海长风海洋世界、武汉欢乐谷等也是今年春节期间最热门的主题公园。尽管,现在基本上所有的购物、娱乐和消费,都可以在线上解决。但是,更多的...

    2018-03-09