首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >设计+科学,我们这么玩!

设计+科学,我们这么玩!

作者头像
腾讯技术工程官方号
发布2020-01-08 17:10:47
4040
发布2020-01-08 17:10:47
举报

2019年腾讯科学WE大会以「小宇宙」揭开了序幕,给大家带来了一场精彩绝伦的科学盛会。而在色彩斑斓的「小宇宙」背后,是策划团队与设计团队历经千锤百炼才孵化成型的。

本文将细细阐述这段孵化之路中所经历的种种艰难险阻与过关斩将的历程。

项目背景

腾讯科学WE大会在历经数年的品牌积累与沉淀,已然成为中国最具影响力的科学盛会之一。从首届的「为未来而来」至今年的「小宇宙」,WE大会每年皆以不同的主题表述对未知领域的洞察,以此逐渐地建构出其独特的品牌形象。要如何利用视觉语言阐释主题内涵,进而延续并拓展品牌形象,是设计团队的首要任务。

品牌定位

从2015年开始,设计团队对WE大会进行系统化的品牌管理:

基于大会的定位与属性,我们首先确立了大会的视觉基调——前瞻的实验风格,并以此调性去探索合适的视觉表达式来演绎大会主题的核心内涵。如此不走寻常路的设计方式是期望将科学探索那般的求知精神融入至设计过程中,以契合科学WE大会多维度、实验性及探索性的形象特质。 

以下是往届基于品牌形象的设定,所创造出来的视觉演绎:

主题思考

1. 锁定主题方向 

在「小宇宙」未拟定为本次的大会主题以前,设计团队与策划团队经历了多次头脑风暴,大海捞针式地搜罗合适的主题词。在拟定数个不同的主题方向后,我们觉得以微观视角为切入点的主题方向较为可行,原因有二:

1. 本次大会所邀请的嘉宾多为对微观世界或事物内部的钻研,以「微」为题较为契合本次大会所要探讨的议题内容。

2. 历届主题多以宏观视角命题,另辟蹊径地以「微」为题会是个崭新的拓展。

2. 提炼主题词  

锁定了以「微」为题后,我们开始往这个方向去搜寻合适的主题词:

经过层层筛选后,我们最终相中了「小宇宙」这词,因为:

1.  此词浅显易懂,降低了理解成本;

2.  此词具有亲和力,能拉近大会与群众间的距离;

3.  此词具有蕴含巨大内在能量的寓意,在表达上的可塑性强。

设计思考

1. 分析设计难点

在确立大会的主题为「小宇宙」后,我们首先分析此次的设计难点:

1.  「小宇宙」这词为主语,在字面上无法被直接解读出其背后所要阐述的涵义。此主题所要表达的核心主旨为何?

2.  要使用什么视觉表达式来演绎本次的主题?

2. 明确主题主旨

基于以上的两个设计难点,我们开始着手与策划团队探讨本次大会主题背后所要阐述的内涵。这是整个项目最为紧要的环节,因为双方必须对此主题的理念达成共识才能继续往下去寻找合适的视觉表达式去实现。若在共识上差之毫厘,将会导致最终的视觉表达式无法很好地体现主题的涵义。

经过多次的沟通与对齐后,我们最终确立了「小宇宙」所要表述的主旨是:

3. 搜索合适的视觉表达式  

明确了主题的主旨后,我们快速地抓到本次设计的关键词:宏观、微观。这两个关键词在字面上除了可以解读成大与小之间的对立关系外,亦可以解读成观察事物时向内及向外的两个视角。有了这初步的概念框架后,我们便开始搜索合适的视觉表达式:

经过以上三个步骤的推导后,我们找到了本次的视觉表达式:培养皿 + 生命形态。

4. 找出视觉表达式的应用方式

要如何利用这道表达式演绎本次大会主题「小宇宙」的内涵是我们接下来要解决的难点。为此,我们尝试用文本的方式协助我们形塑出「小宇宙」的故事。正当我们挤尽脑子去搜寻更为贴切、契合的关键文句时,一段在展览厅墙上的文句让我们豁然开朗:

这道很有画面感的文句,与本次大会主题所要阐述的内涵不谋而合:

「小宇宙」之所以为「小」,是因为它与比它更大之物同时存在。这个主题所要阐述的意义除了字面上的「小」外,亦还有隐藏于字面背后的「大」。

顺着这条思路,我们很快地就找到了应用视觉表达式的方式:将培养皿作为载具,装入不同大小的生命形态。如此,哪怕再大的形态在被装进培养皿中的那刹那,也终将变得渺小,仿佛是一个个独立的小宇宙。

5. 选定视觉元素及实现手法  

在以上的设计思路基础上,我们选出了六个不同大小的生命形态作为主要的视觉演绎元素:细胞、草履虫、地貌、太阳系、星云、宇宙大爆炸。

在视觉的实现上,我们延续过往一贯的实验风格,尝试用各种不同的媒材碰撞、堆叠、变化出这六个视觉形态。

设计执行

1.  色彩规划  

此次的主视觉设计选用了多个复杂的视觉元素呈现,且这些元素的色系皆不尽相同,若将其同时摆放在一起将会使整个画面变得凌乱无序。因此,我们在进入执行阶段前首先进行色彩规划:将这条递进链中的视觉画面规范成由冷色调至暖色调的过渡关系。 

2. 执行过程 

没有一步就到位的成功。我们花了很长的时间反复试验,从一次次失败中摸索每个媒材的特性、与其他媒材碰撞后所产生的变化,才逐渐找到每一个视觉形态实现的诀窍。

部分的视觉试验成果

幕后花絮

3. 视觉编排

试验后所变化出的视觉素材就像是一堆散乱无序的单词,我们需要对这些尚未被定义的单词进行排列组合,透过编排组织出它们的视觉语言。这是个有趣却痛苦的设计阶段——有趣的是,不同的组合、大小关系都会赋予这些单词不同的词性,可以组织出不同的视觉语言;痛苦的是,我们需要不断地进行各种尝试,以找到最合适的排列方式。

视觉编排尝试

经过多次的编排尝试后,我们发现由于素材的复杂程度高,所以不宜在画面中摆放多个视觉元素,也不适合使用复杂的空间构图。最终,我们在这条由小至大的递进关系链中选择一个叙事的立足点,将这段空间关系拆分成向内及向外的视角维度去呈现。

4. 标准字设计  

在标准字的设计上,我们首分别以宋体及黑体这两个字型为基础进行设计。经过层层试验后发现,无衬线的黑体风格利落、沉稳,较贴合本次的视觉风格。因此,我们进一步地在黑体的字型结构上做各种变化,如:简化笔画、折角的方式、字高、字距等。最终,我们挑选了以斜切为折角、高挑、简约、稳重的字型设计作为本次视觉的标准字。

视觉延展

1. 官网设计 

若细细观察,可以发现设计团队在视觉延展上做了许多小巧思!我们将本次的品牌基因提炼并巧妙地融合至官网的界面设计上:我们选取了视觉概念中的「星系」元素,基于「星系」能反映内外皆有乾坤的概念,延展出「无尽的圆环」、「微妙的星系体」两个基础图形造型概念。

应用:此造型概念沿用主品牌中的色彩体系,运用于界面的标题、按钮、卡片模块及背景体系。

动效:界面中会存在鼠标悬停、关键按钮等区域,会需要加入动效来保证关注点的暂时聚焦。此处运用了「绕转」+「扩散」,当前场景应有的聚焦感,在寓意上契合宇宙生命力的意境。

官网展示:

2. 物料设计

3. 会场屏幕设计

本文参与 腾讯云自媒体分享计划,分享自微信公众号。
原始发表:2020-01-05,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 腾讯技术工程 微信公众号,前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 1. 锁定主题方向 
  • 2. 提炼主题词  
  • 1. 分析设计难点
  • 2. 明确主题主旨
  • 3. 搜索合适的视觉表达式  
  • 4. 找出视觉表达式的应用方式
  • 5. 选定视觉元素及实现手法  
  • 1.  色彩规划  
  • 2. 执行过程 
  • 3. 视觉编排
  • 试验后所变化出的视觉素材就像是一堆散乱无序的单词,我们需要对这些尚未被定义的单词进行排列组合,透过编排组织出它们的视觉语言。这是个有趣却痛苦的设计阶段——有趣的是,不同的组合、大小关系都会赋予这些单词不同的词性,可以组织出不同的视觉语言;痛苦的是,我们需要不断地进行各种尝试,以找到最合适的排列方式。
  • 4. 标准字设计  
  • 1. 官网设计 
  • 2. 物料设计
  • 3. 会场屏幕设计
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档