-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathgraphr.html
80 lines (59 loc) · 2.94 KB
/
graphr.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
<!DOCTYPE html>
<html lang="en-GB">
<head>
<meta charset="utf-8">
<title>Graphr - Rattle</title>
<meta name="viewport" content="width=device-width">
<link rel="stylesheet" href="styles.css">
<link rel="canonical" href="http://www.rattlecentral.com/graphr">
<meta name="twitter:url" content="http://www.rattlecentral.com/graphr">
<meta property="og:url" content="http://www.rattlecentral.com/graphr">
<meta property="og:title" content="Graphr">
<meta name="twitter:title" content="Graphr">
<meta name="description" content="A live-updating graph of people’s experiences at an event.">
<meta property="og:description" content="A live-updating graph of people’s experiences at an event.">
<meta name="twitter:description" content="A live-updating graph of people’s experiences at an event.">
<meta name="twitter:card" content="summary">
<meta name="twitter:site" content="@rattlecentral">
<meta property="og:site_name" content="Rattle">
</head>
<body class="project">
<div class="container">
<header role="banner">
<h1><a href="./"><img src="images/logo.png"> <span>Rattle</span></a></h1>
</header>
<article>
<header>
<h2>Graphr</h2>
</header>
<section role="complementary">
<figure>
<img src="images/graphr-main.png" alt="">
</figure>
<ul>
<li><span><img src="images/graphr-thumb1.png"></span></li>
</ul>
</section>
<section role="main">
<p>Prompted by the impending en masse attendance of the Rattle team at the dConstruct 2010 conference, we thought it'd be interesting to somehow compare our different experiences of the event - which is after all a cross-disciplinary affair.</p>
<p>Given our obsession with data visualisations, we decided to construct an online graph, which would be updated live during the conference with our comments and scores of different moments throughout the day.</p>
<p>The resulting graph proved interesting and insightful, with times of convergence and divergence of experiences amongst the team. It also attracted plenty of attention, and allowed some of our friends not at the conference to follow through our visualisation.</p>
<p>We reused the software behind the chart for a couple of subsequent events, including Playful 2010, and released it as open source for others to use too.</p>
</section>
<aside>
<h3>Project information</h3>
<dl>
<dt>Launched</dt>
<dd>September 2010</dd>
<dt>Team</dt>
<dd>
<a href="http://palefire.com/">Andrew Pendrick</a>,
<a href="http://www.frankieroberto.com/">Frankie Roberto</a>,
<a href="http://www.technogoggles.com/">James Boardwell</a>
</dd>
</dl>
</aside>
</article>
</div>
</body>
</html>