Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Creating interactive learning interfaces at Khan Academy
Search
spicyj
September 15, 2014
Technology
0
100
Creating interactive learning interfaces at Khan Academy
For @Scale 2014 on September 15, 2014.
spicyj
September 15, 2014
Tweet
Share
More Decks by spicyj
See All by spicyj
React: What Lies Ahead
spicyj
6
320
Understanding state in React
spicyj
1
91
ndb
spicyj
0
87
css
spicyj
2
680
Other Decks in Technology
See All in Technology
NgRx Signal Store
rainerhahnekamp
0
150
開発生産性向上サービスを作るFindyが自分たちで開発生産性を爆上げした組織づくりの歩み / Findy's path to boosting its own development productivity 2024-04-17
ma3tk
3
610
Reducing Cross-Zone Egress at Spotify with Custom gRPC Load Balancing Recap
koh_naga
0
200
開発生産性大幅アップ!Postman VS Code拡張機能
nagix
2
360
サーバー間 GraphQL と webmock-graphql の話 / server-to-server graphql and webmock-graphql
qsona
2
180
ServiceNow Knowledge 24の歩き方 EYストラテジー・アンド・コンサルティング
manarobot
0
180
Azure犬駆動開発の記録/GlobalAzureFukuoka2024_20240420
nina01
1
200
Terraformあれやこれ/terraform-this-and-that
emiki
8
1.3k
Java EE/Jakarta EEの現状と将来―クラウドネイティブ時代にJava EEは対応できるのか?―
takakiyo
1
130
データベース02: データベースの概念
trycycle
0
150
コンパウンドスタートアップのためのスケーラブルでセキュアなInfrastructure as Codeパイプラインを考える / Scalable and Secure Infrastructure as Code Pipeline for a Compound Startup
yuyatakeyama
4
4.7k
Next'24 事例セッションの紹介とクラウド資格を活用したキャリア形成について語りMuscle
yasumuusan
1
430
Featured
See All Featured
Statistics for Hackers
jakevdp
789
220k
How to Ace a Technical Interview
jacobian
272
22k
Facilitating Awesome Meetings
lara
42
5.6k
The Mythical Team-Month
searls
216
42k
A Modern Web Designer's Workflow
chriscoyier
689
190k
Bash Introduction
62gerente
604
210k
Dealing with People You Can't Stand - Big Design 2015
cassininazir
357
22k
Building Your Own Lightsaber
phodgson
99
5.7k
Building a Modern Day E-commerce SEO Strategy
aleyda
17
6.4k
WebSockets: Embracing the real-time Web
robhawkes
59
7k
XXLCSS - How to scale CSS and keep your sanity
sugarenia
241
1.2M
Gamification - CAS2011
davidbonilla
76
4.6k
Transcript
Creating interactive learning interfaces at Khan Academy Ben Alpert and
Pamela Fox
None
None
None
Constraints are liberating.
“khan-exercises”
<div class="vars"> <var id="X">randRange(5, 10)</var> <var id="Y">randRange(5, 10)</var> </div> !
<div class="problem"> <p>Bob has <var>X</var> apples...</p> </div>
<div class="graphie"> graphInit({ range: 10, scale: 20 }); ! plot(function(x)
{ return 2 * sin(x); }, [-10, 10]); </div>
None
<label> <input checked name="dashradio" onclick="javascript: KhanUtil.currentGraph.graph.dasharray = ''; KhanUtil.currentGraph.graph.update(); "
type="radio" value="solid"> Solid line </label> <label> <input name="dashradio" onclick="javascript: KhanUtil.currentGraph.graph.dasharray = '- '; KhanUtil.currentGraph.graph.update(); " type="radio" value="dashed"> Dashed line </label>
Too much power.
“Perseus”
None
What about pictures?
For diagrams, we want… • Simple to create • Consistent
look and feel • Flexibility to draw anything
None
Diagrams turn into image files that any browser can render,
but we save the source too.
Constraining yourself can be liberating too.
var MissionDashboard = React.createClass({ render: function() { return ( <div
className="dashboard-root"> <MissionProgress mission={this.props.mission} /> <TaskArea mission={this.props.mission} /> </div> ); } });
“Falling into the“ “pit of success” Jeff Atwood
Unthematic announcement time.
f ( x ) = Z 1 1 ˆ f
( ⇠ ) e 2 ⇡i⇠x d⇠
None
• Used in production since last summer • Beautiful math
typesetting • About 50x faster than MathJax • http://khan.github.io/KaTeX/
None
Thanks.