可视化设计落地丨设计想法如何被高质量还原？原创

欢迎大家来到瑞LA光源课堂，我是本期课程的讲师，来自光曲园的视效设计专家，我叫吕晶。回到今天的主题，本节课程是系列课程，第五讲设计师的想法如何被高质量的还原，想知道答案的同学咱们就开始吧。又和大家见面了，那上节课我们讲了如何高质量实现设计想法的第一步，解析设计目标，那今天我们就来讲一下第二部分啊，我们怎么做才能实现设计目标，以及实现的标准是什么？之前提过，我们做实际项目的时候比较难找到同类型的参考，那我们怎么证明我们这个设计想法可行呢？那其实有一个方法就是快速做出来，然后去验证是否合适。在这个过程中，我们其实会发现实现后的结果与之前的想法相比是有一些偏差的，那偏差也分类型啊，它有可能是还原度的偏差，那也有可能是整合后风格适合度的偏差。造成还原度偏差的原因有可能是跟手头上的基础功夫不到位有关，那适合度偏差的原因大多数跟个人经验预判有关，在实际的工作中，我们要尽量缩小这种偏差。

避免造成项目交付延误。那怎么缩小呢？对个人来讲，就是提升个人的专业程度嘛，那对制作团队来说呢，项目的制作流程和技术选型其实也比较重要啊。我先说一下我们的项目制作流程，我们的流程里面主要有四个阶段，与设计质量相关，从拿到需求后进入设计稿阶段，然后然后需要通过设计评审，再进入设计实现阶段，最后是通过交付评审才能进入项目整合阶段。在这个流程中就会延伸出两个要求。第一个是敏捷性开发快速迭代，第二个是设计需要被高度还原。我先说一下第一个敏捷开发快速迭代，因为设计稿到设计评审这个过程，其实就需要设计师快速的演示设计想法，比如你有了设计想法并找了参考图，那就得做出来放进项目里面，看看到底合不合适不合适咱们就换个方向继续。

前期尝试的速度越快，试错的速度越快，就能预留出足够的时间去调整这种适合度的偏差。那怎么快呢？那我就推荐用瑞商业版实时渲染引擎，所见即所得，我在PPT上列了一下我们常规项目的平均制作时间，嗯，一个人一个场景大概几天啊，自己看图表，一个人一夜再加上实现是需要多少天，大家也可以看啊，这些天数是给大家一个参考。

对团队来说，用商业版又快在哪里呢？那它其实是快，在不同制作部门可以同时开始啊原型评审会以后，UI设计师和场景内容设计师可以开始一起做设计稿了。数据组的同事们开始处理数据，模型组就开始制作模型，逻辑组就开始做一些功能架构。模型做好以后，给渲染组开始场景的渲染制作，数据写好以后给UI的同事和场景内容设计师接数据，接好后给主设计师进行整合，整合里面也包含了交互，有些交互的效果啊，功能按钮啊等等，设计师都会一起做好的，最后交付给逻辑组的同事们进行更复杂的功能整合。然后再输出系统发给开发经理啊，或者是产品经理进行内容完整性的审核，审核后就可以发到客户现场进行部署使用了。

这个。这个是我之前做的一个项目，内容就是上节课我们说的给身份验证合格的用户推出可享用的服务里面的服务。为了演示一下这个内容的文件搭建啊，我把它从总项目里面拿了出来，自己做了一个交互按钮，然后输出到触摸屏里面展示，整个过程其实只花了十几分钟，大半个小时。我给大家演示这个商业版的文件，其实是想说一下，商业版在动画上对设计师是相对友好的，它支持时间线的帧动画，也支持逻辑事件动画，设计师在帧动画的模式下可发挥的余地很多，并且做好后直接可导出播放端部署，那这样就很快。那看现在屏幕上，这里就是一个事件的状态动画。

说完敏捷开发，那就说一下第二个要求啊，就是设计需要被高度还原，因为实现的时候我们要尽量去减少还原度的偏差，最后才能顺利交付。那就延伸出一个问题，怎么才能高质量的还原设计想法呢？在我们公司里边有个概念。就是高质量的设计还原，最好是设计师自己去做，因为设计师会对自己的设计负责。然后red商业版低代码的这个软件也满足这个要求。设计师不用会太多代码，也不用老是请前端喝茶了，也是因为设计师自己去实现，这对设计师的综合能力要求也很高的。我在这里列了一下UI设计师和场景设计师需要会和精通的一些专业技能范围吧，因为我们都是使用的同一个软件啊，所以UI设计师和渲染工程师，也就是场景设计师，他们的技能范围是有相交的地方的，UI设计师需要精通界面设计，但是渲染工程师也需要会界面的设计，因为场景里的一些内容制作会用到界面设计的知识，比如说排版呐等等。

稍微空间感是渲染工程师们在行的，但是UI设计师也需要具备空间感觉，因为有可能他做的东西需要放在场景里边，然后在场景里面触发。另外UI设计师还需要会材质贴图，要去理解商业版里的材质系统。因为在这个软件里面，我们要去实现一些质感的制作，就是需要材质贴图去调试的动画，不管是UI还是渲染，其实都是需要精通的，这是属于基础的技能，其他的基础逻辑节点啊，基础的数据知识，还有模型其实也是都是要会的。

那在实际的项目制作中，其实有一个容易被大家忽略的能力啊，就是三维空间布局的能力。我一直在强调制作前要想清楚我们的设计目标，要用参考图去塑造画面感，但是我发现大多数人一说的制作，想的都是风格啊，色彩啊，排版啊，质感啊，或者是装饰啊这些内容，这些因素其实是很重要，但是一开始其实最先要想的应该是布局和构图，因为我们做的是2D和3D结合的可视化交互系统，所以就是需要三维空间的布局能力。从理解我们要展现的内容有哪些开始，比如说我们要展示建筑，建筑群，或者说是我们有一些模型的打点，位置打点，或者是或者说是我们有一些字排，还有2D界面等等，然后我们需要去组织他们排列分布，然后再去定好镜头景别，去构思，如果我是这个系统的用户，我怎么去查看这些内容，然后在体验上会好一点呢？

镜头是近一些还是拉远一些？如果近一些，那模型的量是否够精致？那如果远一些，那模型是否已经延伸出去了？所以其实我在看到屏幕上的这个画面的时候啊，我脑子里面其实是这一张黑白灰的框架图，从这张图来看，这个场景其实还有调整布局的空间啊，你看右上角不是就空了一些吗？其实是可以再调整的，当然我拿的这一版它不是最终版，我拿的是中间的一个阶段的版本，主要是想来讲一下我们可以怎么去检查它，怎么去调整它的布局，怎么查看它的布局。另外就是我们经常会做一些拓扑图的场景，我们通常拿到的就是左边的这一张结构拓扑图，但我们设计的时候就得在脑子里面想一下，在身为空间里面怎么展示清楚它的结构和关系，这就直接决定了这个拓扑场景的造型美观程度了。

这就是上一章top场景完成后的效果，给大家看一下这个复杂的场景里的文件结构是什么样的。其实也是一个组件一个组件搭起来的，每个组件单独做，最后合在一起做出厂动画，这也就蛮需要设计师具备能把控整体场景和项目质量的能力了。刚刚讲的是空间布局能力啊，那直接影响了造型的美观。

那第二个设计实现里面需要注意的就是质感的表现和体积感的塑造，因为我们在设计稿阶段是在平面软件里面做的。当你发现。把平面设计的内容直接放在三维场景里面后，你会发现太薄了，根本显示不出来，它会隐没在这个场景里面。这就要求设计师具备二维的设计能力，但是要用三维的思考方式和制作方式去还原我们的设计，从质感还有体积感去凸显场景内的信息和位置。打点图中的这个例子就是当时我做一个地图项目，里面有个交通主题。左边是我在AI里面做的设计稿，用了透明渐变的背板，然后在里面实现的时候，我发现使用透明渐变的背板文字看不清了，于是我就换成了模型背板倾斜一些角度，增加了体积感，光影质感更加厚重，才使这几组信息在场景里面凸显了出来。

内容看清了，那我们就要想怎么让这个内容看起来还有意思。叙事动画是一个不错的方法之一。这是当时我做的一个人物关系图的流程动画，讲的是人群分类和部分人群的危险程度。这种叙事动画的方式是不是比直接给你一个表，那表上写着谁谁谁和谁谁谁有关系，他们的危险程度是123？是吧，就是这种叙事动画会比列表的形式或者是文字说明的形式有意思。那总结一下，我们要达到设计目标，可视化行业的设计师的综合能力是相对高的，从这个技能范围也就能看出来，但这些不是立马要求你们大家都会的啊。想入这一行的设计师可以选择自己擅长的方向作为切入点，我们常说T字型人才嘛，先专研一下自己擅长的和喜欢的，我们把我们擅长和喜欢的作为钉子的那一部分盯稳了以后。

在横向扩展技能，然后进一步的去稳固自己。前面我们讲了一个个体的设计师去做设计和实现的时候，需要具备哪些能力和技能，那在实际的项目制作中，我们是一个团队的协作，我们的常态就是属于铁打的项目随机匹配的制作设计人员。有时候就会出现在这个项目上，上次是这个人做的，下次就是另外一个人接手做了。这种情况下对每一个的设计师的能力要求都是不低的，因为我们得做到一定的标准化和一定的质量，项目才能顺利的转手，但相对的还是会出现一些问题。

那我在这里列了一下团队合作的过程中通常会出现的三个问题，那就是设计风格不统一，设计质量难以把控。设计进度难以统筹。这些问题都是对主设计师的挑战，那同时也是对主设计师的要求，要求主设计师要带领团队去理解项目，并且达到高度一致的理解程度。另外就是主设计师要有效的把设计意图传达给所有参与项目制作的人。为了让大家对项目有统一的理解，我们会要求主设计师在制作开始前组织设计研讨会。设计研讨会的目的是去建立该项目的制作目标和画面感。我在这里列了六个步骤，第一个就是内容梳理。交互逻辑。

数据接入和功能技术难点排查设计重点内容表现形式思考样式参考，那第一个内容梳理。就是资料整合，我们要明白我们制作的内容范围有哪些，那第二个就是明确交互形式有哪几种，以及我们要怎样去展现我们的内容。那第三个就是如果我们设想了一个新的功能，或者是降低性能消耗的一些做法，以前是没有做过的，那这一次会不会在技术上有些难度，如果有难度的话，那我们就得去咨询技术的小伙伴了。第四个就是梳理设计重点了，其实这个就是要归纳项目的一些特点以及制作难度，然后去配比不同水平和擅长不同设计点的制作人员。那第五个呢，就是我们要思考能不能有新的那种表现形式，上一次是那样做了，那这一次我们能不能换一个形式去做，每次做点不一样的东西出来。

最后就是样式参考了，主要就是风格统一嘛，不能说场景设计师做个牌子是这个样子的，那UI设计师又做成另外一个样子，那就不行啊。经过这六个步骤，我们每一步都会发现一些问题啊，或者是我们有新的想法，需要去跟上下游部门沟通。比如内容梳理完了，我们就有可能会发现信息不太理解，有的信息他太专业了，它是属于行业类的东西，不理解呢，我们就要去问呢，或者是或者是自己查，那有时候我们会发现资料缺失了，你需要找对应的人，比如开发经理啊，产品经理啊等等，我们要去要资料的。然后就是交互逻辑。这里主要是理解怎么展示和查看内容，比如说这个项目有一个主场景，然后是附带了几个小场景，那这几个小场景该怎么出场呢？还是从这个板块升起来，还是说我们单独一个板块出现另外一个消失，还是说我在转换镜头的过程中，这个模型切换了？

其实这个东西是我们需要去想的，想好以后去找模型组、逻辑组一起去沟通。还有数据接入和功能技术难点排查，就是我们如果想了一个新的内容表现形式，或者是一个新的功能。那我们可能会想一下，我们怎么去实现它，用什么样的技术，但是我们最好还是再去咨询一下技术的小伙伴，他们有没有可实现的更节能的，或者说是更可用的技术方案。还有我们要去探讨出项目的设计重点，我们要针对每个内容都去找出它的设计重点，这里面就包括信息层级，然后我们还要填写团队制作表，针对一个内容，我们可能是会有不同的解决方案，但是我们的设计想法或者解决方案客户能不能接受呢？这个是有待验证的，我们就得把设计想法传达出去。

让产品经理或者是开发经理去跟客户确认，最好是有反馈以后我们再进行制作。最后再确定项目风格上，不仅界面风格和场景风格需要统一，需要确定，那我们其实确定不是我们自己，他不是我们自己商量好就好了，而是要去跟行业负责人确认这样是否可行，等所有的问题都扫荡一遍以后，人员调配合适了，制作时间排好了，项目就可以开工了。其实到这里啊，我们三个设计日常我就已经讲完了，总结一下，我从日常一里面得出了设计目标，然后日常二是在找设计实现的方法以及实现的标准，最后日常三呢是团队协作，我们一起去把这个项目落地了。接下来我们讲最后一盘，前面我讲了用商业版实现设计想法，UI设计师和渲染工程师需要哪些的技能，但是那只是针对项目内容制作而言的。

对主设计师而言，他是需要做完上面三节课的所有步骤。从找出设计目标，要实现标准，再到带领团队交付项目，那主设计师需要有哪些能力要求和范围呢？其实从设计目标到设计落地，他就是一个具象技能和抽象技能的进阶，那具象技能是指的什么呢？具象技能其实就是一个设计表现的基础技能。就比如你是学交互的，我是学UI的，你更擅长三维制作。那我更在意动画制作是吧？这些都是归属于专业的分类，那肯定主设计师首先得把自己擅长的技能给达标吧，这些具象的基础技能啊，都是看得见的，你做的好不好，你东西一出来，其实我们大家都知道了。

但是设计落地就需要设计师具备更多的横向技能的，其中一个比较重要的前提就是理解产品，也就是我们常说的产品思维。你要是不知道产品设计的思考方式，那对项目的理解就不一定是很精准的，也就不能带着团队一起去理解了。然后还有用户体验设计、交互设计手法等等，这些横向知识都是需要学习的，因为那些都是利于我们理解客户的真实需求，提升我们交付项目的能力。那具象的话说起那么多，那其实把它提炼出来也就是这六个维度了，具体的六个维度就是指形色字、构置、动画，那这个其实要展开讲也还蛮多的，有机会的话我们下次开课再讲吧。但抽象的话，其实我想表达的就是产品设计和用户体验设计，他们其实是帮助我们去洞察一些真实的问题，以及这个问题背后本质的规律和原因。

也就是说，他是在帮助我们去找到目的，我们做这件事的行为目的。然后交互设计、项目管理，还有我们的设计表现手法，他们都是属于技法类的。是可以辅助我们去达到这个行为目的的。其实这个就是我们的能力范围了，以及他们之间的关系，展开讲的话，那他涉及的知识面也挺多的，以后我们有机会开课再讲讲，那其实课到这里呢，揭秘视效设计流程的三节课我就全部讲完了，希望这三节课对大家都有帮助。我们的设计工作其实总结起来就是三个大的步骤。

找到设计目标，提炼提炼实现标准，最后再动手落地，然后这三个步骤之间是需要我们具备一些具象或是抽象的能力，辅助我们去完成设计工作的。这里延伸出了两个话题啊。设计表现维度有哪些？他在项目里面只是怎么提现的呢？横向扩展能力又可以怎样去提升呢？我们如何找快速的找到设计目标，什么时候用什么样的技法去达到目标等等这些问题，以后也许有机会再给大家上课，或者是欢迎大家下载我们APP的个人版，来社区里与我交流啊，谢谢大家的收听和观看。好了，今天的课程就到这里了，我们下次再见。