-
Notifications
You must be signed in to change notification settings - Fork 5
/
index.html
181 lines (180 loc) · 9.17 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-J5NHVLY7TP"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-J5NHVLY7TP');
</script>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width">
<title>Flat在线教室_个人老师在线授课_Flat开源教室</title>
<script>
if (!localStorage.getItem("flat:language") && navigator.language !== "zh-CN") {
window.location.href = "/en/";
}
</script>
<link rel="shortcut icon" href="./favicon.ico">
<link rel="stylesheet" href="./style.css">
</head>
<body>
<header class="navheader flex pa2">
<img src="./image/flat-icon.svg" alt="logo">
<div class="flex-1"></div>
<nav>
<ul class="inline-flex list-none ma0 pa0">
<li class="pl2"><a href="#download">下载</a></li>
<li class="pl2">
<label for="lang">🌐</label>
<select id="lang">
<option>简体中文</option>
</select>
</li>
</ul>
</nav>
</header>
<main>
<header class="hero">
<div class="content">
<p class="dim f1">基于 MIT 开源协议</p>
<h1 class="normal">Flat 在线教室</h1>
<p class="desc">个人老师可直接使用的在线授课软件，开箱即用</p>
<p class="desc last">前后端完全开源，快速搭建简约美观的在线教室</p>
<div class="image">
<img src="./image/hero-image.png" alt="big image">
</div>
<div class="flex btn-group">
<a href="https://flat-web.whiteboard.agora.io/" target="_blank" class="start-btn start-btn--first inline-flex capsule">
<span>立即体验</span>
</a>
<a href="https://github.com/netless-io/flat" target="_blank" class="get-source-btn inline-flex capsule">
<img src="./image/github.svg" alt="GitHub">
GitHub
</a>
</div>
</div>
</header>
<section class="opensource pa2">
<h2 class="flex content-center mt3">
<img src="./image/source.svg" alt="source">
<span class="normal">Flat 与开源</span>
</h2>
<p class="indent">Flat 诞生于我们在调研客户需求与用户体验过程中的一个探索项目。</p>
<p class="indent">在得到良好的内部反馈之后，我们认为 Flat 有潜力成为一款能够真正帮助到大家、并且拥有较好用户体验的在线课堂产品。</p>
<p class="indent">我们希望通过 Flat 的实时互动让知识的传递变得更高效、丰富，随时随地，充满趣味性。</p>
<p class="indent">我们清楚仅仅依靠我们的力量是远远不够的，因此我们决定开源，让更多的开发者有机会参与进来，汇聚社区的想法和力量，让 Flat 成为有用的东西。</p>
<p class="indent">目前 Flat 正在积极开发中。它在一天天长大，我们很高兴与你分享这份喜悦。</p>
</section>
<section class="pa2 pb3" id="download">
<h2 class="flex content-center mt3">
<img src="./image/download.svg" alt="download">
<p class="normal">下载体验</p>
</h2>
<div class="download-list">
<a href="https://flat-storage.oss-accelerate.aliyuncs.com/versions/latest/stable/mac/Flat-x64-2.3.5.dmg">
<img src="./image/mac.svg" alt="mac">
<span>macOS</span>
</a>
<a href="https://flat-storage.oss-accelerate.aliyuncs.com/versions/latest/stable/win/Flat-x64-2.3.5.exe">
<img src="./image/windows.svg" alt="windows">
<span>Windows</span>
</a>
<a target="_blank" href="https://flat-web.whiteboard.agora.io/">
<img src="./image/web.svg" alt="web">
<span>Web</span>
</a>
<a href="https://flat-storage.oss-accelerate.aliyuncs.com/versions/latest/stable/android/app-flat-release-v2.12.0.apk">
<img src="./image/android.svg" alt="android">
<span>Android</span>
</a>
<a href="https://apps.apple.com/cn/app/flat/id1598891661">
<img src="./image/ios.svg" alt="ios">
<span>iOS</span>
</a>
<div class="download-list-extra">
<a href="https://flat-storage.oss-accelerate.aliyuncs.com/versions/latest/stable/mac/Flat-arm64-2.3.5.dmg">
<span>Apple silicon</span>
</a>
</div>
</div>
</section>
<section class="kinds pa2">
<h2 class="flex content-center mt3">
<img src="./image/bigclass.svg" alt="bigclass">
<span class="normal">轻松创建丰富多样的在线教室</span>
</h2>
<p class="dim center">多场景灵活切换，实现高质量教学。</p>
<div class="tabs flex">
<div class="items">
<div class="item active">
<div class="flex">
<img class="icon" src="./image/bigclass.svg" alt="bigclass">
<span class="f3">大班课</span>
</div>
<p class="dim">适用于大型课堂授课，知识传递效率更高。学生可举手发言参与在线互动。</p>
</div>
<div class="item">
<div class="flex">
<img class="icon" src="./image/smallclass.svg" alt="bigclass">
<span class="f3">小班课</span>
</div>
<p class="dim">适用于 1 名教师和 2～16 名学生进行在线教学，互动性更及时，趣味性更高，提高教学效率的同时保证质量。</p>
</div>
<div class="item">
<div class="flex">
<img class="icon" src="./image/onetoone.svg" alt="bigclass">
<span class="f3">一对一</span>
</div>
<p class="dim">适用于 1 名老师对 1 名学生，沉浸式的个性化课堂教学，学习效果更加明显。</p>
</div>
</div>
<div class="images flex-1">
<img src="./image/bigclass.png" alt="big">
<img src="./image/smallclass.png" alt="small" style="display: none;">
<img src="./image/onetoone.png" alt="one2one" style="display: none;">
</div>
</div>
</section>
<section class="skin pa2">
<h2 class="flex content-center mt3">
<img src="./image/skin.svg" alt="skin">
<span class="normal">支持自定义主题和 UI</span>
<small class="dim normal pl1">(开发中)</small>
</h2>
<p class="dim center">内置多种经过专业设计的精美主题，无需专业设计经验。</p>
<div class="center">
<img src="./image/skin.png" alt="skin">
</div>
</section>
<section class="plugin pa2">
<h2 class="flex content-center mt3">
<img src="./image/plugin.svg" alt="plugin">
<span class="normal">场景插件：无限的组合，无限的可能</span>
</h2>
<p class="dim center">支持将多种功能封装成白板插件，满足多样需求。</p>
<div class="center">
<img src="./image/plugin.png" alt="sec_6">
</div>
</section>
<section class="start pa2 pb3">
<p class="dim center mt3">无论你是想搭建自有品牌在线教室，还是为客户提供在线教育产品与解决方案，都可以使用 Flat 达成目标。</p>
<div class="center mt3">
<a href="https://flat-web.whiteboard.agora.io/" target="_blank" class="start-btn inline-flex capsule">立即体验</a>
</div>
</section>
</main>
<footer class="copyright flex">
<div>沪ICP备14053584号 沪公网安备 31011002002951 上海兆言网络有限公司</div>
<div class="flex">
<a href="privacy.html">隐私政策</a>
<a href="service.html">服务协议</a>
<img src="./image/email.svg" alt="email">
<a href="mailto:[email protected]">[email protected]</a>
</div>
</footer>
<script src="./main.js"></script>
</body>
</html>