-
Notifications
You must be signed in to change notification settings - Fork 4
/
Copy pathindex.html
215 lines (205 loc) · 9.9 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
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
---
layout: default
title: Data Visualization
---
<style type="text/css">
.intro {
margin: 20px 0;
}
.class-calendar ol {
font-family: "Helvetica Neue";
width: 100%;
list-style-type: none;
padding: 0;
margin-top: 20px;
}
.class-calendar a {
position: relative;
text-decoration: none;
display: block;
margin-bottom: 20px;
line-height: 1.4em;
}
.class-calendar a:hover .title{
border-color: rgba(0, 0, 0, 0.6);
}
.class-calendar a:hover .title h4 {
text-decoration: underline;
}
.class-calendar .date {
font-weight: normal;
position: absolute;
width: 85px;
text-align: right;
color: rgba(0, 0, 0, 0.6);
}
.class-calendar .title {
border-left: solid 1px rgba(0, 0, 0, 0.2);
font-weight: bold;
padding: 0 0 0 15px;
margin-left: 100px;
display: block;
}
.class-calendar .description {
font-weight: normal;
color: rgba(0, 0, 0, 0.6);
margin-top: 5px;
display: block;
}
</style>
<header><span>UCB — Fall 2013</span></header>
<div class="main">
<h1>Data Visualization</h1>
<img style="width: 100%;-moz-transform: scaleX(-1);-o-transform: scaleX(-1);-webkit-transform: scaleX(-1);transform: scaleX(-1);" src="http://28.media.tumblr.com/tumblr_lmg4t59VZQ1qzekdio1_500.gif">
<div>
<h3>Class Schedule</h3>
<p>Class meets on Thursdays from 4 to 7 p.m. Kevin and I will also have weekly online office hours (time TBD).</p>
<div class="class-calendar">
<ol>
<li><a href="classes/sausage/">
<span class="date">Sept. 5</span>
<span class="title">
<h4>Internet sausage making basics</h4>
<span class="description">Overview of why we’re all here and getting up to speed with github, the terminal, R and node.</span>
</span>
</a></li>
<li><a href="classes/charts-intro">
<span class="date">Sept. 12</span>
<span class="title">
<h4>Basic charts and charting techniques</h4>
<span class="description">We'll start adding entries to our chartbook (a real thing) and make basic charts in R and D3.</span>
</span>
</a></li>
<li><a href="classes/thinking-critically-with-data">
<span class="date">Sept. 19</span>
<span class="title">
<h4>Thinking critically with data</h4>
<span class="description">We're going to ask some questions and get some answers.</span>
</span>
</a></li>
<!-- <li><a href="classes/lester-freamon">
<span class="date">Sept. 26</span>
<span class="title">
<h4>“This is the job.” -Lester Freamon</h4>
<span class="description">Most face-melting data visualizations are results of parsing, cleaning and formatting data. If you want to be good, you're going to have to get your hands dirty.</span>
</span>
</a></li> -->
<li><a href="classes/maps-intro">
<span class="date">Sept. 26</span>
<span class="title">
<h4>How and why to make maps</h4>
<span class="description">When you have spatial information, sometimes it's best to make a map. (And sometimes it's best not to.) We'll discuss best practices and make basic maps in R and D3.</span>
</span>
</a></li>
<li><a href="classes/interactive-maps">
<span class="date">Oct. 3</span>
<span class="title">
<h4>Interactive Maps</h4>
<span class="description">Last week we made some static maps in R — time to make them dance.</span>
</span>
</a></li>
<li><a href="classes/kobayashi-maru">
<span class="date">Oct. 10</span>
<span class="title">
<h4>Breaking news exercise</h4>
<span class="description">You've learned a few techniques by now; today, you'll make your own</span>
<!-- http://badatsports.com/blog/wp-content/uploads/2012/06/putabirdonit.jpg -->
</span>
</a></li>
<li><a href="classes/data-practice">
<span class="date">Oct. 17</span>
<span class="title">
<h4>Thinking like a robot, taming wild data</h4>
<span class="description">Skills that will seem pointless now — until you’re in the ring by yourself.</span>
</span>
</a></li>
<li><a href="classes/handy">
<span class="date">Oct. 24</span>
<span class="title">
<h4>Handy</h4>
<span class="description">We'll use R's XML package and the Chrome Inspector to help automate the process of getting data.</span>
</span>
</a></li>
<li><a href="classes/grab-bag/">
<span class="date">Oct. 31</span>
<span class="title">
<h4>Miscellany</h4>
<span class="description"></span>
</span>
</a></li>
<li><a href="classes/facing-the-abyss/">
<span class="date">Nov. 7</span>
<span class="title">
<h4>Facing the abyss</h4>
<span class="description">You've done some reporting and you finally have your data. Now what?</span>
</span>
</a></li>
<li>
<span class="date">Nov. 14</span>
<span class="title">
<h4>Bostock Visits</h4>
<span class="description"></span>
</span>
</li>
<li><a href="classes/tools">
<span class="date">Nov. 21</span>
<span class="title">
<h4>Geo data overview</h4>
<span class="description">Where to get some shapefiles.</span>
</span>
</a></li>
<li><a href="#">
<span class="date">Dec. 5</span>
<span class="title">
<h4>Project Lab</h4>
<span class="description"></span>
</span>
</a></li>
<li><a href="#">
<span class="date">Dec. 12</span>
<span class="title">
<h4>Presentations</h4>
<span class="description"></span>
</span>
</a></li>
</ol>
</div>
</div>
<div class="intro">
<h3>Overview</h3>
<p>This course teaches some of the skills and techniques necessary for displaying statistical information effectively in journalism. Students will scrutinize techniques used in previously published projects and will also analyze data on their own, evaluating and producing static and interactive visualizations using a mix of desktop applications, <a href="http://en.wikipedia.org/wiki/Command-line_interface">command-line tools</a> and basic programming, with an emphasis on <a href="http://office.microsoft.com/en-us/excel/">Excel</a>, <a href="http://cran.us.r-project.org/">R</a> and <a href="http://d3js.org/">D3</a>.</p>
<p>Most classes will begin with a short lecture and discussion about a technique or type of data visualization, showing places where it’s useful and not useful, good and bad, and show some recent uses. We will then do an exercise together based on a news event or editorial topic. “A report today says Hispanics will be the majority in California in 2030”, for instance. From here we will discuss, as a class, which approach we think is best and then individually build a visualization.</p>
<p>This will be a very technical course — even the most basic data visualization involves getting down and dirty with your computer, and the best examples usually involve getting pretty dirty.</p>
<p>However, we hope not to get too bogged down in the fiddly bits of the latest technologies in this course. We will cover how to build visualizations for the web, but more importantly, we will focus on data visualization as it applies to journalism — which means asking good questions of datasets, learning how to get answers from them and the best ways to communicate those answers to a general audience.</p>
<p>Basically, if you hate Excel or loathe programming, then maybe this is not the course for you. On the other hand, if you think you’ll get a rush out of answering questions by mapping a million-row dataset and aren't afraid to stretch your brain in some very technical ways, this course will put you on a good path no matter your technical background.</p>
</div>
<div class="policies">
<h3>Grading</h3>
<div>
<h4>Homework (25%)</h4>
<p>We expect you to post all of your work on a Web site. You should have one index page with links to your assignments. You will be responsible for updating this page. Late homework will not be accepted.</p>
</div>
<div>
<h4>Lab (45%)</h4>
<p>Lab sessions are one of the most important aspects of this class. If you need to miss class, you are responsible for obtaining any materials or assignments from one of your classmates.</p>
</div>
<div>
<h4>Critique (5%)</h4>
<p>Once during the semester, you will present a brief (5 minutes) critique of a piece of data journalism. What's good about it? What could be improved? This will serve as a chance to see and discuss work that’s being published around the web.</p>
</div>
<div>
<h4><a href="projects/index.html">Final project</a> (25%)</h4>
<p>At the end of the class, you will produce a piece of explanatory journalism, demonstrating the skills you have learned. The project will primarily consist of written and/or visual work, posted online, and it will also include a brief presentation. More details about the project are <a href="projects/index.html">here »</a> </p>
</div>
</div>
<div class="forms">
<h3>Chart forms</h3>
<p>We'll keep an index of chart forms we'll work on in class <a href="chart-forms">here</a>.</p>
</div>
<div class="about">
<h3>Your Professors</h3>
<p><a href="http://kpq.github.io/">Kevin Quealy</a> — Bald, Minnesotan, talks too much.</p>
<p><a href="http://shancarter.com/">Shan Carter</a> — Has hair, Californian, doesn’t talk as much.</p>
</div>
</div>
</body>