-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
108 lines (106 loc) · 6.43 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
<meta name="description" content="" />
<meta name="author" content="" />
<title>Assessments for K-12 AI</title>
<link rel="icon" type="image/x-icon" href="assets/img/favicon.ico" />
<!-- Font Awesome icons (free version)-->
<script src="https://use.fontawesome.com/releases/v6.1.0/js/all.js" crossorigin="anonymous"></script>
<!-- Google fonts-->
<link href="https://fonts.googleapis.com/css?family=Saira+Extra+Condensed:500,700" rel="stylesheet" type="text/css" />
<link href="https://fonts.googleapis.com/css?family=Muli:400,400i,800,800i" rel="stylesheet" type="text/css" />
<!-- Core theme CSS (includes Bootstrap)-->
<link href="css/styles.css" rel="stylesheet" />
<!-- Interactive data table-->
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.13.1/css/jquery.dataTables.css"/>
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/responsive/2.4.0/css/responsive.dataTables.min.css"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script>
<script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/1.13.1/js/jquery.dataTables.js"></script>
<script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/responsive/2.4.0/js/dataTables.responsive.min.js"></script>
</head>
<body id="page-top">
<!-- Navigation-->
<nav class="navbar navbar-expand-lg navbar-dark bg-primary fixed-top" id="sideNav">
<a class="navbar-brand js-scroll-trigger" href="#page-top">
<span class="d-block d-lg-none">Assessments for K-12 AI</span>
<span class="d-none d-lg-block"><img class="img-fluid img-profile rounded-circle mx-auto mb-2" src="assets/img/profile.jpg" alt="..." /></span>
</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation"><span class="navbar-toggler-icon"></span></button>
<div class="collapse navbar-collapse" id="navbarResponsive">
<ul class="navbar-nav">
<li class="nav-item"><a class="nav-link js-scroll-trigger" href="#about">About</a></li>
<!-- Brief introduction -->
<!-- License and usage -->
<li class="nav-item"><a class="nav-link js-scroll-trigger" href="#articles">Articles</a></li>
<!-- Interactive table of articles, selection method -->
<li class="nav-item"><a class="nav-link js-scroll-trigger" href="#cps">Assessing Concepts and Practices</a></li>
<!-- Section for summative assessments (with examples), formative assessments (with examples) -->
<li class="nav-item"><a class="nav-link js-scroll-trigger" href="#ps">Assessing Perspectives</a></li>
<li class="nav-item"><a class="nav-link js-scroll-trigger" href="#conclusions">Conclusions</a></li>
</ul>
</div>
</nav>
<!-- Page Content-->
<div class="container p-0">
<!-- About-->
<section class="resume-section" id="about">
<div class="resume-section-content">
<h1 class="mb-0">
A Review of
<span class="text-primary">K-12 AI Literacy Curricula</span>
</h1>
<div class="subheading mb-5">
Randi Williams, Cynthia Breazeal · Personal Robots Group, MIT Media Lab</div>
<p class="lead mb-5">Over the past several years, there has been an increase in research about K-12 AI literacy curricula to prepare the next generation to participate in the future. However, there is little alignment from researchers on what to teach students or how to evaluate that learning. In this work, we examined 64 peer-reviewed articles on K-12 AI literacy curricula to catalog their approach to assessing students’ AI knowledge and perspectives. </p>
</div>
</section>
<hr class="m-0" />
<!-- Reviewed Articles -->
<section class="resume-section" id="articles">
<div class="resume-section-content">
<h2 class="mb-5">Articles</h2>
<div>
<table id="all_studies" class="hover row-border order-column" style="width:90%"></table>
</div>
<h3>Selection Criteria</h3>
<p>Here's how we found so many</p>
</div>
</section>
<hr class="m-0" />
<!-- Concepts & Practices-->
<section class="resume-section" id="cps">
<div class="resume-section-content">
<h2 class="mb-5">Assessing Concepts and Practices</h2>
<p>Overview of this section</p>
<h3>Summative Assessments</h3>
<p>Awesome table with pictures and information.</p>
<h3>Formative Assessments</h3>
<p>Awesome table with pictures and information</p>
</section>
<hr class="m-0" />
<!-- Perspectives-->
<section class="resume-section" id="ps">
<div class="resume-section-content">
<h2 class="mb-5">Assessing Perspectives</h2>
<p>Overview of this section</p>
<p>Awesome table with pictures and information.</p>
</section>
<hr class="m-0" />
<!-- Conclusions-->
<section class="resume-section" id="conclusions">
<div class="resume-section-content">
<h2 class="mb-5">Conclusions</h2>
<p>Here are all the things we learned.</p>
</div>
</section>
<hr class="m-0" />
</div>
<!-- Bootstrap core JS-->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"></script>
<!-- Core theme JS-->
<script src="js/scripts.js"></script>
</body>
</html>