|
|
|
|
|
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
|
|
|
|
|
<html xmlns="http://www.w3.org/1999/xhtml">
|
|
|
|
|
|
<head>
|
|
|
|
|
|
<meta charset="utf-8">
|
|
|
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes">
|
|
|
|
|
|
<title>twitter sonification</title>
|
|
|
|
|
|
|
|
|
|
|
|
<style>
|
|
|
|
|
|
.background {
|
|
|
|
|
|
background-image: url('stemicoon.svg');
|
|
|
|
|
|
background-repeat: no-repeat;
|
|
|
|
|
|
background-size: contain;
|
|
|
|
|
|
background-position: center;
|
|
|
|
|
|
position: fixed;
|
|
|
|
|
|
top: 0;
|
|
|
|
|
|
left: 0;
|
|
|
|
|
|
height: 90vh;
|
|
|
|
|
|
width: 90vw;
|
|
|
|
|
|
margin: 5vh 5vw;
|
|
|
|
|
|
opacity: .2; /* PAS HIER DE OPACITY AAN VOOR DE TRANSPARANTIE VAN HET ICOON */
|
|
|
|
|
|
z-index: -1;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
h1,
|
|
|
|
|
|
h2,
|
|
|
|
|
|
h3,
|
|
|
|
|
|
h4,
|
|
|
|
|
|
h5,
|
|
|
|
|
|
h6,
|
|
|
|
|
|
p,
|
|
|
|
|
|
blockquote {
|
|
|
|
|
|
margin: 0;
|
|
|
|
|
|
padding: 0;
|
|
|
|
|
|
}
|
|
|
|
|
|
body {
|
|
|
|
|
|
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
|
|
|
|
|
|
font-size: 13px;
|
|
|
|
|
|
line-height: 18px;
|
|
|
|
|
|
margin: 10px 13px 10px 13px;
|
|
|
|
|
|
background-color: rgb(173,169,169); /* PAS DEZE KLEUR AAN VOOR DE ACHTERGRONDKLEUR VAN DE GEHELE PAGINA */
|
|
|
|
|
|
}
|
|
|
|
|
|
table {
|
|
|
|
|
|
margin: 10px 0 15px 0;
|
|
|
|
|
|
border-collapse: collapse;
|
|
|
|
|
|
}
|
|
|
|
|
|
td,th {
|
|
|
|
|
|
border: 1px solid #ddd;
|
|
|
|
|
|
padding: 3px 10px;
|
|
|
|
|
|
}
|
|
|
|
|
|
th {
|
|
|
|
|
|
padding: 5px 10px;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
a {
|
|
|
|
|
|
color: #d64646;
|
|
|
|
|
|
}
|
|
|
|
|
|
a:hover {
|
|
|
|
|
|
color: #0050a3;
|
|
|
|
|
|
text-decoration: none;
|
|
|
|
|
|
}
|
|
|
|
|
|
a img {
|
|
|
|
|
|
border: none;
|
|
|
|
|
|
}
|
|
|
|
|
|
p {
|
|
|
|
|
|
margin-bottom: 9px;
|
|
|
|
|
|
}
|
|
|
|
|
|
h1,
|
|
|
|
|
|
h2,
|
|
|
|
|
|
h3,
|
|
|
|
|
|
h4,
|
|
|
|
|
|
h5,
|
|
|
|
|
|
h6 {
|
|
|
|
|
|
color: #f4eded;
|
|
|
|
|
|
line-height: 36px;
|
|
|
|
|
|
}
|
|
|
|
|
|
h1 {
|
|
|
|
|
|
margin-bottom: 18px;
|
|
|
|
|
|
font-size: 30px;
|
|
|
|
|
|
}
|
|
|
|
|
|
h2 {
|
|
|
|
|
|
font-size: 24px;
|
|
|
|
|
|
}
|
|
|
|
|
|
h3 {
|
|
|
|
|
|
font-size: 18px;
|
|
|
|
|
|
}
|
|
|
|
|
|
h4 {
|
|
|
|
|
|
font-size: 16px;
|
|
|
|
|
|
}
|
|
|
|
|
|
h5 {
|
|
|
|
|
|
font-size: 14px;
|
|
|
|
|
|
}
|
|
|
|
|
|
h6 {
|
|
|
|
|
|
font-size: 13px;
|
|
|
|
|
|
}
|
|
|
|
|
|
hr {
|
|
|
|
|
|
margin: 0 0 19px;
|
|
|
|
|
|
border: 0;
|
|
|
|
|
|
border-bottom: 1px solid #ccc;
|
|
|
|
|
|
}
|
|
|
|
|
|
blockquote {
|
|
|
|
|
|
padding: 13px 13px 21px 15px;
|
|
|
|
|
|
margin-bottom: 18px;
|
|
|
|
|
|
font-family:georgia,serif;
|
|
|
|
|
|
font-style: italic;
|
|
|
|
|
|
}
|
|
|
|
|
|
blockquote:before {
|
|
|
|
|
|
content:"\201C";
|
|
|
|
|
|
font-size:30px;
|
|
|
|
|
|
margin-left:-10px;
|
|
|
|
|
|
font-family:georgia,serif;
|
|
|
|
|
|
color:#eee;
|
|
|
|
|
|
}
|
|
|
|
|
|
blockquote p {
|
|
|
|
|
|
font-size: 14px;
|
|
|
|
|
|
font-weight: 300;
|
|
|
|
|
|
line-height: 18px;
|
|
|
|
|
|
margin-bottom: 0;
|
|
|
|
|
|
font-style: italic;
|
|
|
|
|
|
}
|
|
|
|
|
|
code, pre {
|
|
|
|
|
|
font-family: Monaco, Andale Mono, Courier New, monospace;
|
|
|
|
|
|
}
|
|
|
|
|
|
code {
|
|
|
|
|
|
background-color: #fee9cc;
|
|
|
|
|
|
color: rgba(0, 0, 0, 0.75);
|
|
|
|
|
|
padding: 1px 3px;
|
|
|
|
|
|
font-size: 12px;
|
|
|
|
|
|
-webkit-border-radius: 3px;
|
|
|
|
|
|
-moz-border-radius: 3px;
|
|
|
|
|
|
border-radius: 3px;
|
|
|
|
|
|
}
|
|
|
|
|
|
pre {
|
|
|
|
|
|
display: block;
|
|
|
|
|
|
padding: 14px;
|
|
|
|
|
|
margin: 0 0 18px;
|
|
|
|
|
|
line-height: 16px;
|
|
|
|
|
|
font-size: 11px;
|
|
|
|
|
|
border: 1px solid #d9d9d9;
|
|
|
|
|
|
white-space: pre-wrap;
|
|
|
|
|
|
word-wrap: break-word;
|
|
|
|
|
|
}
|
|
|
|
|
|
pre code {
|
|
|
|
|
|
background-color: #fff;
|
|
|
|
|
|
color:#737373;
|
|
|
|
|
|
font-size: 11px;
|
|
|
|
|
|
padding: 0;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
b, strong {
|
|
|
|
|
|
color: red;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
sup {
|
|
|
|
|
|
font-size: 0.83em;
|
|
|
|
|
|
vertical-align: super;
|
|
|
|
|
|
line-height: 0;
|
|
|
|
|
|
}
|
|
|
|
|
|
* {
|
|
|
|
|
|
-webkit-print-color-adjust: exact;
|
|
|
|
|
|
}
|
|
|
|
|
|
@media screen and (min-width: 914px) {
|
|
|
|
|
|
body {
|
|
|
|
|
|
width: 854px;
|
|
|
|
|
|
margin:10px auto;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
@media print {
|
|
|
|
|
|
body,code,pre code,h1,h2,h3,h4,h5,h6 {
|
|
|
|
|
|
color: black;
|
|
|
|
|
|
}
|
|
|
|
|
|
table, pre {
|
|
|
|
|
|
page-break-inside: avoid;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
</style>
|
|
|
|
|
|
<title>Sonification of the Dutch elections 2017</title>
|
|
|
|
|
|
|
|
|
|
|
|
</head>
|
|
|
|
|
|
<body>
|
|
|
|
|
|
<div class="background"></div>
|
|
|
|
|
|
<h1>Sonification of the Dutch elections 2017</h1>
|
|
|
|
|
|
|
|
|
|
|
|
<p>In the run up to the 2017 general elections in the Netherlands last Wednesday, the 15 of March 2017, a lot of Twitter<sup id="fnref:1"><a href="#fn:1" rel="footnote">1</a></sup> traffic was generated. Literally millions of tweets were send that day over the Internet.</p>
|
|
|
|
|
|
</p>
|
|
|
|
|
|
<br>
|
|
|
|
|
|
<h1>The online political battle</h1>
|
|
|
|
|
|
|
|
|
|
|
|
<blockquote><p>En meteen is daar de tweet: #waarwasBuma<sup id="fnref:2"><a href="#fn:2" rel="footnote">2</a></sup>
|
|
|
|
|
|
(And right after there was the tweet: #wherewasBuma)</p></blockquote>
|
|
|
|
|
|
|
|
|
|
|
|
<p>This research is inspired on an article in the NRC (27 februari 2017) about the online political battle. Just like in the United States, parties attempt to reach voters through social media and to frame political opponents. The parties use social media more than ever this year’s elections. They try to convey their message to the unprecedented number of undecided voters and they try to frame opponents with catchy slogans or hashtags.</p>
|
|
|
|
|
|
|
|
|
|
|
|
<p>Seeing all these tweets passing so quickly it reminds me of a cascade of data, the starting point of a sonification<sup id="fnref:3"><a href="#fn:3" rel="footnote">3</a></sup> to perceptualize this huge amount of data in a <em>score</em>.</p>
|
|
|
|
|
|
<br>
|
|
|
|
|
|
|
|
|
|
|
|
<h1>Pushing the score</h1>
|
|
|
|
|
|
|
|
|
|
|
|
<p>This sonifiction entails three kinds of scores; a) for the whole tweet, b) for the hashtag ikstem (#ikstem), and c) for the hashtag gestemd (#gestemd).</p>
|
|
|
|
|
|
|
|
|
|
|
|
<p>a) It captures tweets sed during the day of the elections, between 07.30 and 21.00, when the polling stations were open. In total there are 47613 tweets captured. Some examples of tweets send:</p>
|
|
|
|
|
|
|
|
|
|
|
|
<blockquote><p>Ik wist niet wat ik moest stemmen, dus heb ik uiteindelijk maar een bootje gevouwen van het stembiljet <strong>#ikstem</strong> #tk2017 <strong>#gestemd</strong> https://t.co/KBqLBkYrpV</p>
|
|
|
|
|
|
|
|
|
|
|
|
<p>Grappig! RT @Mvan_berkel: In Leiden is rekening gehouden met zwevende kiezers. <strong>#ikstem</strong> #TweedeKamerverkiezingen https://t.co/Un8uJfNZ0v</p>
|
|
|
|
|
|
|
|
|
|
|
|
<p>Met volle trotst en vrolijkheid voor de eerste keer gaan stemmen vandaag <strong>#ikstem</strong></p></blockquote>
|
|
|
|
|
|
|
|
|
|
|
|
<p>b + c) A hash tag is used to streamline relevant topics by keyword or phrase by grouping them together to make it easier to find and follow tweets from people who are talking about the same thing. In this sonificatoin I used #ikstem and #gestemd. Both are given a different kind of sound.</p>
|
|
|
|
|
|
<br>
|
|
|
|
|
|
<br>
|
|
|
|
|
|
<h1>Used hardware and software</h1>
|
|
|
|
|
|
|
|
|
|
|
|
<p><a href="https://www.python.org">Python</a> , specific libraries: <a href="https://www.python.org/dev/peps/pep-0305/">csv</a>, <a href="https://docs.python.org/2/library/os.html">os</a> and <a href="https://pypi.python.org/pypi/python-osc">OSC</a></p>
|
|
|
|
|
|
|
|
|
|
|
|
<p><a href="https://puredata.info">Pure Data</p>
|
|
|
|
|
|
|
|
|
|
|
|
<p><a href="https://pzwiki.wdka.nl/mediadesign/The_Ultimate_RPi_Installation_Guide">RaspberryPi</a> and <a href="https://pzwiki.wdka.nl/mediadesign/Pi_skin_conductivity">Pi skin conductivity</a></p>
|
|
|
|
|
|
|
|
|
|
|
|
<p>Flyer: <a href="https://issue.xpub.nl/02/">https://issue.xpub.nl/02/</a></p>
|
|
|
|
|
|
<br>
|
|
|
|
|
|
|
|
|
|
|
|
<h1>References</h1>
|
|
|
|
|
|
<div class="footnotes">
|
|
|
|
|
|
<hr/>
|
|
|
|
|
|
<ol>
|
|
|
|
|
|
<li id="fn:1">
|
|
|
|
|
|
<p>Twitter is an online news and social networking service where users post and interact with messages, “tweets,” restricted to 140 characters, (<a href="http://twitter.com">http://twitter.com</a>).<a href="#fnref:1" rev="footnote">↩</a></p></li>
|
|
|
|
|
|
<li id="fn:2">
|
|
|
|
|
|
<p>En meteen is daar de tweet: #waarwasBuma, De politieke strijd online, door Andreas Kouwenhoven & Hugo Logtenberg, 27 februari 2017, 21:05 (<a href="https://www.nrc.nl/nieuws/2017/02/27/en-meteen-is-daar-de-tweet-waarwasbuma-7033073-a1547979">https://www.nrc.nl/nieuws/2017/02/27/en-meteen-is-daar-de-tweet-waarwasbuma-7033073-a1547979</a>).<a href="#fnref:2" rev="footnote">↩</a></p></li>
|
|
|
|
|
|
<li id="fn:3">
|
|
|
|
|
|
<p>Sonification is the use of non-speech audio to convey information or perceptualize data. Auditory perception (the sensory system for the sense of hearing) has advantages in temporal, spatial, amplitude, and frequency resolution that open possibilities as an alternative to visualization techniques.<a href="#fnref:3" rev="footnote">↩</a></p></li>
|
|
|
|
|
|
</ol>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
</body>
|
|
|
|
|
|
</html>
|
