Figma将Webflow

今年开始与一个21天的投资组合的挑战

初学者——高级
6小时14分钟

在本课程中,我们将使用我们的可靠的工作流从头开始创建一个网站。我们首先在Figma低和mid-fidelity设计迭代。然后,我们将创建和渲染3 d产品在电影4 d和辛烷的资产。欧宝体育在线首页影响出口后我们将使用它们作为洛蒂JSON文件,构建我们的着陆页完成Webflow的动画和交互。最后,我们会用一个自定义的领域,将其绑定到一起然后点击发布,让全世界都可以看到!

了解整个设计过程从想法到最终输出我们带你通过Figma,电影4 d和辛烷和Webflow。

暂停背景视频
Webflow是免费为学生和教育工作者
学习更多与应用

总结

课程进度

很好的工作,我们做了一些时间旅行到未来,这是惊人的!

0
%

完成

0
10

课程完成

在本课程中,我们将使用我们的可靠的工作流从头开始创建一个网站。我们首先在Figma低和mid-fidelity设计迭代。然后,我们将创建和渲染3 d产品在电影4 d和辛烷的资产。欧宝体育在线首页影响出口后我们将使用它们作为洛蒂JSON文件,构建我们的着陆页完成Webflow的动画和交互。最后,我们会用一个自定义的领域,将其绑定到一起然后点击发布,让全世界都可以看到!

所面临的挑战

挑战
一天
做一个网站的英雄
01
最终的导航条
02
神奇的CMS布局
03
制定引导和科学
04
虚拟的鞋子为你的网站
05年
你好,这是响应性
06
展示你的项目的页面
07年
项目页面工作无处不在,任何地方
08年
最佳联系页面
09年
告诉我们你的联系页面
10
测试你打开图设置
11
一束光照耀
12
把你的投资组合
13
失去了,但永远不会忘记
14
有密码保护
15
实践的可访问性
16
分享你的设计进展
17
准备,设置、发布!
18
投资组合验证
19
更新你的网站管理系统
20.
展示你的投资组合
21

准备好认证吗?

一旦你完成了Webflow专家认证课程,你们都将成为一个Webflow的下一步专家。请注意:通过专业考试并不能保证进入Webflow专家项目。

去Webflow专家考试

课程大纲

开始

Figma将Webflow

10
教训
开始
开始

介绍和概述

在本课程中,我们贯穿整个设计过程,从概念到完成。我们开始在Figma,创建一些惊人的3 d电影4 d和辛烷,资产创建动画洛蒂文件后效果,最后,我们建立我们的网站在Webflow交互。

网页设计在Figma

在这节课中,我们要经历一个过程中,我们使用内部所有的时间:我们将使用Figma协同设计和迭代所有的东西会让我们的项目从no-fidelity,低保真,最后,mid-fidelity。

奖金的教训:安装辛烷电影4 d

工业设计在电影4 d

这节课是一个引物对如何使用电影4 d模型和动画的3 d设计我们虚构的碳酸水瓶子的产品。欧宝体育在线首页然后添加表面纹理和光与辛烷呈现3 d设计。

奖金的教训:减少发射结构噪声

网络动画后的效果

后生成3 d产品呈现在电影4 d和辛烷,然后将其欧宝体育在线首页转换成JSON洛蒂文件-动画设计我们可以用在我们的网站上使用后的效果和Bodymovin的插件。

奖金的教训:完整的资产准备

Web开发的Webflow

现在,我们有了自己的线框图设计和3 d的资产,我们可以建立我们的网站在Webflow。我们使用Figma线框图设计和三维洛蒂文件构建网站的Webflow丰富的交互与我们的客户。

连接一个自定义的域

现在我们有我们的网站建于Webflow,是时候发布网站定制域。我们通过设置自定义的过程域与Webflow。

最后回顾&注意事项

在这节课中,我们汇集所有的元素的设计流程,并强调一些细微差别,帮助你完善自己的设计工作流程。

需求

每一课:

教训2:
Figma(或类似的工具像Adobe XD,素描,Photoshop, Illustrator,或纸和笔)

第三课:

Maxon电影4 d- - - - - -链接
辛烷呈现,链接

第四课:
Adobe After Effects

第五课:
Figma(或类似的工具像Adobe XD,素描,Photoshop, Illustrator,或纸和笔)链接
Maxon电影4 d -链接
辛烷呈现,链接
Adobe After Effects
Webflow

第六课:
Webflow

克隆这个项目
使用这个版本克隆完成的项目
克隆这个项目
空白页没有达到页面限制

相关的课程

有更多的未来

很快我们推出更多的教训。报名让早期访问额外的Webflow的课程和课程。

射击,没用的东西。稍后再试,芽。
Baidu
map