先看效果: https://www.byewind.com/ 另外两种背景: https://cloud.byewind.com/ , https://halo.byewind.com/
感谢:@OkotoO @cha0sCat @0o0O0o0O0o 帮我优化代码
步骤:
具体的加载背景动效的方法请查看:https://byewind.notion.site/Cloudflare-Workers-Framer-8e1b5a09b4d448c2ad1d6c74b5ed3d21
用到的工具和服务都是免费的,用 Framer 制作网站的原因在于 Framer 对设计师非常友好,上手难度低, 且能做出很多不错的效果.
 |
1
xfxz Jan 2, 2023
效果不错，感谢分享。想问下这个有导出代码的功能吗？付费的也行。
|
 |
2
byewind OP  1
@xfxz 哪个? Framer 软件吗? 这个软件没有导出代码的功能. 程序员可以用它来开发很多有趣的组件, 组件可以分享. 用它开发的网站和组件都不能导出代码.
|
|
4
byewind OP @xfxz 是托管在 Framer 上的, 你可以试试国内访问, 我目前访问还可以.
Framer 的优势在于不用写代码, 设计操作方式和 Figma 非常接近, 所以体验很好. |
 |
5
OkotoO Jan 3, 2023
@xfxz #3 你可以理解为 Framer 上的是源站, 而 Workers 是用来反代并对网站内容进行修改来添加背景动效. 所以你最终网站是否稳定和使用 Cloudflare CDN 在国内稳不稳定是直接挂钩的
|
|
6
byewind OP 其实用 Framer 制作的网站自定义域名, 加载 JS, 都不需要用到 Cloudflare. 完全可以通过升级成为 Framer 付费账号来做到这些. 用 Cloudflare 的原因就在于免费.
为了免费, 所以才需要额外折腾很多东西. 包括像我这样完全不会编程的人要去折腾写 Worker, 结果是看了半天没学会, 然后就放弃了, 来这求助了. 还好得到了 @OkotoO 等人的帮助, 不然我是搞不定的. |
 |
7
sillydaddy Jan 3, 2023
> “ Framer 对设计师非常友好,上手难度低”
楼主用的是 FramerWeb 吗？我之前专门看过 Framer X ，感觉对设计师很不友好，要懂 React 那一套。 是 FramerWeb 又改进了吗？ |
|
8
byewind OP @sillydaddy 你说的 FramerWeb 是什么? Framer 现在就是叫 Framer 👉https://www.framer.com/ . 这个软件前身是和 Figma 类似的软件, 后来竞争不过 Figma 就改成了现在这样. 现在的产品重心放在了开发网页, 尤其是官网和落地页上.
使用下来体验比目前其他的网站开发软件都要好. 比如 webflow, wix 这些虽然功能强大, 但是使用体验并不好. 使用 Framer 则可以像用 Figma 等设计工具那样来设计网站. |
|
9
sillydaddy Jan 3, 2023
@byewind 感谢回复。虽然它的名字一直叫 Framer ，但是功能一直在变 🤷♂️，一开始是原型工具 Framer.js ，后来大改了一次思路变成了 Framer X ，现在看起来又转型了。
|
|
10
byewind OP @sillydaddy 因为竞争太激烈了吧, 每个工具都能找出好几个类似的. Figma 也是在这样的围剿下杀出来的. 做网站的工具除了 webflow, wix, Framer 外还有很多. 比如 Canva, 能做非常简单的网站, 虽然功能很少, 但是却非常好用.
|
|
11
byewind OP 不知道现在是开发网站的开发者多还是开发 App 的开发者多, 有谁知道的话麻烦说下噢
|
 |
12
blankmiss Jan 3, 2023
chrome 得开硬件加速不然网站渲染有点卡
|
 |
14
mikixinyuel Nov 5, 2023
真的可以！感谢分享！虽然捣鼓半天但是每月立省！
|
|
15
byewind OP @mikixinyuel 是啊
|
Select Language