-
Notifications
You must be signed in to change notification settings - Fork 1
/
index.html
180 lines (156 loc) · 6.71 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>CS247 StoryAlive</title>
<meta name="description" content="CS247 Final Project: StoryAlive">
<meta name="author" content="Cindy Chang Jessica Kung Adam Raudonis Gavin Kho">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="">
<meta name="author" content="">
<!-- Le styles -->
<link href="css/bootstrap.css" rel="stylesheet">
<link href="css/custom.css" rel="stylesheet">
<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,300' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Lato:300,400' rel='stylesheet' type='text/css'>
<style type="text/css">
body {
padding-top: 60px;
padding-bottom: 40px;
}
.sidebar-nav {
padding: 9px 0;
}
@media (max-width: 980px) {
/* Enable use of floated navbar text */
.navbar-text.pull-right {
float: none;
padding-left: 5px;
padding-right: 5px;
}
}
</style>
<!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
<!--[if lt IE 9]>
<script src="../assets/js/html5shiv.js"></script>
<![endif]-->
</head>
<body>
<div class="navbar navbar-inverse navbar-fixed-top">
<div class="navbar-inner">
<div class="container-fluid">
<button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="brand" href="./index.html">StoryAlive</a>
<div class="nav-collapse collapse">
<p class="navbar-text pull-right">
CS247 Final Project Winter 2013
</p>
<ul class="nav">
<li><a href="./team.html">Team</a></li>
<li><a href="./week5.html">Week 5</a></li>
<li><a href="./week6.html">Week 6</a></li>
<li><a href="./week7.html">Week 7</a></li>
<li><a href="./week8.html">Week 8</a></li>
<li><a href="./week9.html">Week 9</a></li>
<li><a href="./week10.html">Week 10</a></li>
</ul>
</div><!--/.nav-collapse -->
</div>
</div>
</div>
<div class="container-fluid">
<div class="row-fluid">
<div class="span12">
<div id="banner">
<img src="./img/storyalive_logo.png" id="storyalive_logo"/>
<p id="tagline">The interactive children's book that empowers and engages first graders in reading.</p>
</div>
</div>
</div>
<div class="row-fluid">
<div class="span6" align="middle">
<p class="info">Demo Day Poster</p>
<a href="./img/CS247-StoryAlive-Poster.pdf"><img src="./img/CS247-StoryAlive-Poster.jpg" /></a>
</div>
<div class="span6" align="middle">
<p class="info">Demo Day Video</p>
<p><iframe width="570" height="391" src="http://www.youtube.com/embed/EQcUSn6d-zY" frameborder="0" allowfullscreen></iframe></p>
</div>
</div>
<br /><br />
<div class="row-fluid">
<div class="hero-unit">
<p>First grade is a critical time for young readers - the time where most children define
themselves as either good or poor readers. Students generally strive to learn to read simple
books by mid-year and to understand that letters represent sounds that form words, sounding out
unfamiliar words when reading. Reading is an important part of the daily curriculum. In many
elementary schools, teachers have story time where they read to all of their students at once.
The problem though is that during story time, many students often sit back passively as the
teacher reads, only looking at the pictures when the book is turned their way. They
sometimes get bored and may lose
interest in the story, listening to the teacher's voice out of one ear. Students also may not be
familiar with some of the words in the book, but feel like they cannot interrupt the story to ask, or
feel too shy or afraid to do so. While students are sitting in a group with others, often they each
sit in passive isolation and don't get to physically engage with the book themselves. When the first
graders do get to read picture books on their own or in small groups, they often don't think critically
about what they are reading and just look at pictures, or they lose interest quickly because something else
grabs their attention. </p>
<br />
<p>From research and observations in the first grade classroom, we have thus found our
need: first graders learning how to read need to feel more engaged in the books they read in small
groups, feeling in control of what and when they read.
Our application is an immersive, interactive reading experience using Leap Motion technology
that seeks to enhance story time by engaging, entertaining, and empowering first grade students
to read.
</p>
</div>
</div>
<div class="row-fluid">
<div class="span4">
<h2>Week 5</h2>
<p><a class="btn" href="./week5.html">Milestone 1: Team Formation and Prototyping »</a></p>
</div><!--/span-->
<div class="span4">
<h2>Week 6</h2>
<p><a class="btn" href="./week6.html">Milestone 2: Wizard-of-Oz Testing »</a></p>
</div><!--/span-->
<div class="span4">
<h2>Week 7</h2>
<p><a class="btn" href="./week7.html">Milestone 3: Functional Prototype I »</a></p>
</div><!--/span-->
</div><!--/row-->
<div class="row-fluid">
<div class="span4">
<h2>Week 8</h2>
<p><a class="btn" href="./week8.html">Milestone 4: User Testing »</a></p>
</div><!--/span-->
<div class="span4">
<h2>Week 9</h2>
<p><a class="btn" href="./week9.html">Milestone 5: Functional Prototype II »</a></p>
</div><!--/span-->
<div class="span4">
<h2>Week 10</h2>
<p><a class="btn" href="./week10.html">Milestone 6: Demo and Presentation »</a></p>
</div><!--/span-->
</div><!--/row-fluid-->
<hr>
<div class="row-fluid">
<footer>
<p>by <a href="./team.html">Cindy Chang</a>,
<a href="./team.html">Jessica Kung</a>,
<a href="./team.html"> Adam Raudonis</a>, and
<a href="./team.html">Gavin Kho</a></p>
</footer>
</div>
</div><!--fluid container -->
<!-- Le javascript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script src="js/jquery.js"></script>
<script src="js/bootstrap.js"></script>
</body>
</html>