Animations on Here

Amagi,4 min read

新的一期

Animations on The Web

开放注册啦,只是很可惜,尽管很难启齿,但坦白的承认,目前个人作为自由职业者收入不是很稳定,199$ 的收费现在还是比较难以负担。尽管客观分析后能够知道购买后的好处不止这些。从

Introduction

的介绍视频里可以看到,Emil 精心制作了动画和课程外,包括了动画基础概念和设计原则,还从「如何能让大家能够充分学习」这个目的出发准备了学习挑战。除了课程外,付费还能够加入社区、看到 Emil 个人为大家整理的「vault 网络收藏品」、能跟 Emil 和 Vercel 的人产生连接,做模拟面试。

尽管我很想买,但为了不会在后面的日子因拮据而惶惶度日,客观分析后还是忍住了按下购买的冲动。但我很想学,怎么办捏?于是有了这篇文章,我会尝试根据 Emil 的公开内容自己动手尝试复现同样的动画效果。同时我希望能将学到的知识应用于当前网站的阅读体验上,做一些 Web 阅读内容类的创新尝试。

我这么做也不难算是白嫖…这就很像其实 Udacity、OpenCourseWare 和 Coursera 很多课程都是免费的,但证书是收费的一样的模式,我想他们的核心主旨都是为了让知识更加开放,但同时也需要想办法让这种模式能够持续下去做了商业化的策略。理解了他们的初心让人觉得这很好,也希望 Open Course 能一直持续下去。

条件允许的话当然可以购买课程,能有与作者和社区深入接触是一个很好的机会,除此之外如果作者知道后愿意降价或者调整和优化课程的商业模式,对大家而言是皆大欢喜的好事。

好了,不管如何,让我们开始吧。

Prelog

在开始挑战之前,我想先与大家分析下 Animations 课程网站的设计,会探讨到营销、增长、留存与网站所使用的技术。

为了方便,后面会将「Animations on the Web」简称为「AotW」。

先看看课程页。

Animations on The Web Course Page Tech Stacks

网站的设计很干净,技术栈也很简单。可以确定是从

FumaDocs

的旧版改的,在 Docs 的基础上加了 Auth Gated 功能、视频则使用了

MuxPlayer

由于不知道付费后的效果,但以文档和 FumaDocs 的基础,付费后应该就能使用 Search 搜索功能,FumaDocs 在新版添加了「Ask AI」Chat 功能,这里不知道 AotW 会不会有。

随后就是单独的 Interview 和 Vault 页面。

那么问题来了,加了鉴权了的页面 SEO 怎么做?信息会不会暴露给 Google 和 爬虫?答案是没有,不做 SEO。

所以就来到了关于营销的探讨,Emil 从

CC BY-NC 4.0©Amagi. ᕕ( ᐛ )ᕗRSS