added % size in widescreen.css and improved texts and transcriptions

master
Angeliki 5 years ago
parent 10307c3a42
commit e985b465eb

@ -43,7 +43,7 @@
</div>
<div class="draggable scaleable-wrapper"style="top:3%;left:72%; width: 25%; font-size: 100%">
<h2 style="font-size: 120%;"><a href="amplification.php" >Amplification of female voices</a></h2>
<h2 style="font-size: 150%;"><a href="amplification.php" >Amplification of female voices</a></h2>
<div class="drag-content">
<?php include 'texts/amplification.txt'; ?>
</div>
@ -83,20 +83,13 @@
</div>
</div>
<div class="draggable scaleable-wrapper active-draggable" style="top:18%;left:6%;" >
<h2><a class="active" href="index.php" >About</a></h2>
<div class="drag-content">
<?php include 'texts/about.txt'; ?>
</div>
</div>
<!-- colophon -->
<div class="draggable scaleable-wrapper box_metadata" style="top:81%;left:3%;" >
<h2>Colophon</h2>
<li>This work has been produced in the context of the graduation research of Angeliki Diakrousi from the Experimental Publishing (XPUB) Master course at the Piet Zwart Institute, Willem de Kooning Academy, Rotterdam University of Applied Sciences.</li>
<li>XPUB is a two year Master of Arts in Fine Art and Design that focuses on the intents, means and consequences of making things public and creating publics in the age of post-digital networks.</li>
<li>https://xpub.nl</li>
<li>This publication is based on the graduation thesis <em>Let's Talk About Unspeakable Things</em>, written under the supervision of Steve Rushton.</li><li>Special thanks to my tutors, Alex for his enormous help in XPUB comrades and all my friends with whom I had interesting discussions that pushed my research further.</li>
<li>This publication is based on the graduation thesis <em>Let's Talk About Unspeakable Things</em>, written under the supervision of Steve Rushton.</li><li>Special thanks to my tutors, XPUB comrades and all my friends with whom I had interesting discussions that pushed my research further.</li>
</div>
<div class="draggable scaleable-wrapper" style="top:64%;left:25%;" >
@ -105,6 +98,14 @@
<?php include 'texts/thesis-summary.txt'; ?>
</div>
</div>
<div class="draggable scaleable-wrapper active-draggable" style="top:18%;left:6%;" >
<h2><a class="active" href="index.php" >About</a></h2>
<div class="drag-content">
<?php include 'texts/about.txt'; ?>
</div>
</div>
<!-- end draggable -->

@ -91,38 +91,6 @@ for (var i=0, l=links.length; i<l; i++) {
var interrupt = document.getElementById("interrupt");
butI = document.getElementById("butI");
butI.addEventListener("click", function () {
if (interrupt.paused) {
b1.pause();
b2.pause();
b3.pause();
a1.pause();
a2.pause();
a3.pause();
a4.pause();
interrupt.play();
} else {
interrupt.pause();
a1.play();
a2.play();
a3.play();
a4.play();
b1.play();
b2.play();
b3.play();
}
})
interrupt.addEventListener("play", function(){
butI.innerHTML="stop interrupt"
})
interrupt.addEventListener("pause", function(){
butI.innerHTML="interrupt"
})

@ -15,6 +15,7 @@
<body>
<section style="margin-bottom: 20%;">
<!-- draggable youtube links and other -->
<!-- sources -->
<div id="show1" class="draggable"><span onclick="this.parentElement.style.display='none'" class="topleft">&times</span><iframe width="500px" height="400px" src="https://www.youtube.com/embed/HlvfPizooII" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div>
@ -71,18 +72,9 @@ $("#katalin").click(function(){
console.log("around")
});
</script>
<!-- draggable audio tags/images -->
<section>
<div class="draggable" style="position:absolute; top:6%; left:51%;width: 13%">
<audio controls src="audio/leeszaal-meetings-warming.mp3" class="audio-tag"></audio>
<a href="images/meeting-20190328-leeszaal-6.jpg" target="_blank">
@ -275,158 +267,161 @@ $("#katalin").click(function(){
<!-- soundwalk player -->
<section style="margin-top: 60% !important;">
<div class="tooltip-wrap">
<audio style="width: 100%;" id="a1" controls src="audio/selection-track-extracts-1.mp3" class="audio-tag"></audio><a href="" target="_blank">
<div class="tooltip-content-up">
<!-- have to add id="transcriptWrapper..." -->
<div>selection of recordings while wandering around Leeszaal</div>
</div>
</div>
<div class="draggable full-width" style="top: 140%; left:0.2%">
<div class="tooltip-wrap">
<audio style="width: 100%;" id="a1" controls src="audio/selection-track-extracts-1.mp3" class="audio-tag"></audio><a href="" target="_blank">
<div class="tooltip-content-up">
<!-- have to add id="transcriptWrapper..." -->
<div>selection of audio recordings collected while wandering around the area of Leeszaal</div>
</div>
</div>
<div class="tooltip-wrap">
<audio ontimeupdate="playTranscript()" style="width: 100%; background: #222;" id="a2" controls src="audio/description-lidia-CUT.mp3" class="audio-tag"></audio><a href="" target="_blank">
<div class="tooltip-content-up">
<div id="transcriptWrapper" class='sub'>
<h3>Lidia</h3>
<div id="transcript">
<div><a data-start="0.4" href="#">00:00:00,400</a> A vint</div>
<div><a data-start="8.18" href="#">00:00:08,180</a> A bag</div>
<div><a data-start="16.54" href="#">00:00:16,540</a> Someone with a bag</div>
<div><a data-start="28.52" href="#">00:00:28,520</a> Ok. Music</div>
<div><a data-start="33.16" href="#">00:00:33,160</a> Nice music</div>
<div><a data-start="50.86" href="#">00:00:50,860</a> What is that? Oh, the car, the market. I think</div>
<div><a data-start="77.68" href="#">00:01:17,680</a> Wind</div>
<div><a data-start="120.6" href="#">00:02:00,600</a> Wow</div>
<div><a data-start="136.68" href="#">00:02:16,680</a> Children?</div>
</div></div>
</div></div>
<div class="tooltip-wrap">
<audio ontimeupdate="playTranscript3()" style="width: 100%; background: #222;" id="a3" controls src="audio/description-eugenie-CUT-SHORT.mp3" class="audio-tag"></audio><a href="" target="_blank">
<div class="tooltip-content-up">
<div id="transcriptWrapper3" class='sub'>
<h3>Eugenie</h3>
<div id="transcript3">
<div><a data-start="1.8" href="#">00:00:01,800</a> Children outside</div>
<div><a data-start="10.76" href="#">00:00:10,760</a> I think it's outside</div>
<div><a data-start="13.7" href="#">00:00:13,700</a> Shoes, walking people</div>
<div><a data-start="20.44" href="#">00:00:20,440</a> Or maybe papers</div>
<div><a data-start="27.48" href="#">00:00:27,480</a> Music inside</div>
<div><a data-start="31.38" href="#">00:00:31,380</a> Chilling up</div>
<div><a data-start="53.06" href="#">00:00:53,060</a> This is outside. It's a troll, it's a bag</div>
<div><a data-start="58.24" href="#">00:00:58,240</a> Wheels</div>
<div><a data-start="75.7" href="#">00:01:15,700</a> Water</div>
<div><a data-start="90.9" href="#">00:01:30,900</a> People in a room. Inside. They are moving, close</div>
<div><a data-start="114.62" href="#">00:01:54,620</a> It's inside somewhere, somewhere...</div>
<div><a data-start="135.4" href="#">00:02:15,400</a> Children in a swimming pool</div>
</div></div>
</div></div>
<div class="tooltip-wrap">
<!-- have to add ontimeupdate="playTranscript3()" -->
<audio style="width: 100%; background: #222;" id="a4" controls src="audio/description-alex1.mp3" class="audio-tag"></audio><a href="" target="_blank">
<div class="tooltip-content-up">
<!-- have to add id="transcriptWrapper..." -->
<div class='sub'>
<h3>Alex</h3>
<div><a data-start="11.74" href="#">00:00:11,740</a> Em... I hear... It sounds like walking and it's quite windy outside</div>
<div><a data-start="18.62" href="#">00:00:18,620</a> But it sounds like... It's... The microphone is inside or something</div>
<div><a data-start="26.98" href="#">00:00:26,980</a> It's probably music</div>
<div><a data-start="30.32" href="#">00:00:30,320</a> From a car maybe or from some radio?</div>
<div><a data-start="37.6" href="#">00:00:37,600</a> It's outside on the street. I hear some cars in the background</div>
<div><a data-start="48.7" href="#">00:00:48,700</a> Mmmm... It sounds like gardening sounds</div>
<div><a data-start="54.82" href="#">00:00:54,820</a> There are people in the background or maybe it's bikes</div>
<div><a data-start="65.84" href="#">00:01:05,840</a> Oh I hear a bird in the background</div>
<div><a data-start="72.12" href="#">00:01:12,120</a> A very monotone sound</div>
<div><a data-start="76.74" href="#">00:01:16,740</a> It's like driving, maybe driving in a car</div>
<div><a data-start="95.12" href="#">00:01:35,120</a> And some wind around
It seems like outside but there is some noise in the background</div>
<div><a data-start="96.58" href="#">00:01:36,580</a> It seems like outside but there is some noise in the background</div>
<div><a data-start="106.34" href="#">00:01:46,340</a> It's outside</div>
<div><a data-start="124.92" href="#">00:02:04,920</a> Oh, I hear children in the background crying</div>
<div><a data-start="124.94" href="#">00:02:04,940</a> There is some weird sound in the foreground, which I... It's hard to describe [chuckling]
Oh, I hear children in the background crying</div>
<div><a data-start="128.36" href="#">00:02:08,360</a> There is some weird sound in the foreground, which I... It's hard to describe [chuckling]</div>
<div><a data-start="134.9" href="#">00:02:14,900</a> Again it sounds like there is a kindergarten or school nearby</div>
</div>
</div></div>
<button id="but">listen</button>
</div>
<br><br>
<div class="draggable full-width" style="top: 170%; left:0.2%">
<!-- second sounwalk player -->
<div class="tooltip-wrap">
<audio style="width: 100%; background: #FFFFFF;" id="b1" controls src="audio/selectionB.mp3" class="audio-tag"></audio><a href="" target="_blank">
<div class="tooltip-content-up">
<div>selection of audio recordings collected while wandering around the area of Leeszaal</div>
</div>
</div>
<div class="tooltip-wrap">
<!-- have to add ontimeupdate="playTranscript3()" -->
<audio style="width: 100%; background: #222;" id="b2" controls src="audio/description-tommi.mp3" class="audio-tag"></audio><a href="" target="_blank">
<div class="tooltip-content-up">
<!-- have to add id="transcriptWrapper..." -->
<div class='subB'>
<h3>Tommi</h3>
<div><a data-start="12.98" href="#">00:00:12,980</a> This is some water ** maybe from a fountain</div>
<div><a data-start="61.48" href="#">00:01:01,480</a> Plates</div>
<div><a data-start="64.44" href="#">00:01:04,440</a> A bus at stand by at a bus stop</div>
<div><a data-start="70.02" href="#">00:01:10,020</a> Some people are chatting</div>
<div><a data-start="76.94" href="#">00:01:16,940</a> Some kids talking talking while they are playing in the sand or something</div>
<div><a data-start="87.94" href="#">00:01:27,940</a> Two people having a conversation on a street</div>
<div><a data-start="96.28" href="#">00:01:36,280</a> One of them is walking away [chuckling]</div>
<div><a data-start="102.1" href="#">00:01:42,100</a> And now a car is passing</div>
<div><a data-start="110.6" href="#">00:01:50,600</a> It's a construction site</div>
<div><a data-start="113.3" href="#">00:01:53,300</a> Something is being hammered</div>
<div><a data-start="121.2" href="#">00:02:01,200</a> Some sports match or something</div>
<div><a data-start="124.16" href="#">00:02:04,160</a> Everyone is **</div>
<div><a data-start="132.54" href="#">00:02:12,540</a> Someone is speaking Arabic</div>
<div><a data-start="138.76" href="#">00:02:18,760</a> To a group of people</div>
<div><a data-start="142.76" href="#">00:02:22,760</a> It's like a very large voluminous space [chuckling] cause it's echoing a lot</div>
<div><a data-start="156.76" href="#">00:02:36,760</a> Some people are shouting at something at a distance</div>
<div><a data-start="163.76" href="#">00:02:43,760</a> It sounds like in a courtyard</div>
<div><a data-start="166.54" href="#">00:02:46,540</a> A baby crying</div>
</div>
</div></div>
<div class="tooltip-wrap">
<!-- have to add ontimeupdate="playTranscript3()" -->
<audio style="width: 100%; background: #222;" id="b3" controls src="audio/description-alex2.mp3" class="audio-tag"></audio><a href="" target="_blank">
<div class="tooltip-content-up">
<!-- have to add id="transcriptWrapper..." -->
<div class='subB'>
<h3>Alex</h3>
<div><a data-start="7.82" href="#">00:00:07,820</a> There is teenagers nearby and it's walking</div>
<div><a data-start="11.7" href="#">00:00:11,700</a> Oh, there is water</div>
<div><a data-start="15.24" href="#">00:00:15,240</a> That's running</div>
<div><a data-start="20.66" href="#">00:00:20,660</a> Outside probably</div>
<div><a data-start="28.88" href="#">00:00:28,880</a> Oh, that's... It sounds like there is something clapping or like hitting against a surface</div>
<div><a data-start="38.52" href="#">00:00:38,520</a> And it's very repetitive sound</div>
<div><a data-start="46.6" href="#">00:00:46,600</a> Oh, I can hear some, some radio or some music or broadcast</div>
<div><a data-start="60.2" href="#">00:01:00,200</a> That was too short. I don't know [chuckling]</div>
<div><a data-start="64.44" href="#">00:01:04,440</a> Oh, it's quite loud. It's... Maybe it's in some kind of transport</div>
<div><a data-start="76.22" href="#">00:01:16,220</a> Oh, there is a child speaking</div>
<div><a data-start="85.74" href="#">00:01:25,740</a> There are people talking outside... In a foreign language</div>
<div><a data-start="96.28" href="#">00:01:36,280</a> It's not Dutch and there is some wind</div>
<div><a data-start="102.32" href="#">00:01:42,320</a> There are more people talking</div>
<div><a data-start="112.76" href="#">00:01:52,760</a> Oh, there is sounds like there are construction works</div>
<div><a data-start="116.72" href="#">00:01:56,720</a> Or hammering</div>
<div><a data-start="120.92" href="#">00:02:00,920</a> Oh, it's very loud. Oh [chuckling], it's applause or... a crowd of people. I don't know [chuckling]</div>
<div><a data-start="132.06" href="#">00:02:12,060</a> It's inside. It sounds like a hallway... I don't know. Like inside</div>
<div><a data-start="138.26" href="#">00:02:18,260</a> Because I hear some echoing</div>
<div><a data-start="142.56" href="#">00:02:22,560</a> Ot it's inside a tunnel, where people are passing by</div>
<div><a data-start="158.2" href="#">00:02:38,200</a> It sounds like near some street outside and I hear some kids in the background</div>
<div><a data-start="166.6" href="#">00:02:46,600</a> Again, there is a child screaming or crying</div>
</div>
</div></div>
<button id="butB">listen</button>
<div class="tooltip-wrap">
<audio ontimeupdate="playTranscript()" style="width: 100%; background: #222;" id="a2" controls src="audio/description-lidia-CUT.mp3" class="audio-tag"></audio><a href="" target="_blank">
<div class="tooltip-content-up">
<div id="transcriptWrapper" class='sub'>
<h3>Lidia</h3>
<div id="transcript">
<div><a data-start="0.4" href="#">00:00:00,400</a> A vint</div>
<div><a data-start="8.18" href="#">00:00:08,180</a> A bag</div>
<div><a data-start="16.54" href="#">00:00:16,540</a> Someone with a bag</div>
<div><a data-start="28.52" href="#">00:00:28,520</a> Ok. Music</div>
<div><a data-start="33.16" href="#">00:00:33,160</a> Nice music</div>
<div><a data-start="50.86" href="#">00:00:50,860</a> What is that? Oh, the car, the market. I think</div>
<div><a data-start="77.68" href="#">00:01:17,680</a> Wind</div>
<div><a data-start="120.6" href="#">00:02:00,600</a> Wow</div>
<div><a data-start="136.68" href="#">00:02:16,680</a> Children?</div>
</div></div>
</div></div>
<div class="tooltip-wrap">
<audio ontimeupdate="playTranscript3()" style="width: 100%; background: #222;" id="a3" controls src="audio/description-eugenie-CUT-SHORT.mp3" class="audio-tag"></audio><a href="" target="_blank">
<div class="tooltip-content-up">
<div id="transcriptWrapper3" class='sub'>
<h3>Eugenie</h3>
<div id="transcript3">
<div><a data-start="1.8" href="#">00:00:01,800</a> Children outside</div>
<div><a data-start="10.76" href="#">00:00:10,760</a> I think it's outside</div>
<div><a data-start="13.7" href="#">00:00:13,700</a> Shoes, walking people</div>
<div><a data-start="20.44" href="#">00:00:20,440</a> Or maybe papers</div>
<div><a data-start="27.48" href="#">00:00:27,480</a> Music inside</div>
<div><a data-start="31.38" href="#">00:00:31,380</a> Chilling up</div>
<div><a data-start="53.06" href="#">00:00:53,060</a> This is outside. It's a troll, it's a bag</div>
<div><a data-start="58.24" href="#">00:00:58,240</a> Wheels</div>
<div><a data-start="75.7" href="#">00:01:15,700</a> Water</div>
<div><a data-start="90.9" href="#">00:01:30,900</a> People in a room. Inside. They are moving, close</div>
<div><a data-start="114.62" href="#">00:01:54,620</a> It's inside somewhere, somewhere...</div>
<div><a data-start="135.4" href="#">00:02:15,400</a> Children in a swimming pool</div>
</div></div>
</div></div>
<div class="tooltip-wrap">
<!-- have to add ontimeupdate="playTranscript3()" -->
<audio style="width: 100%; background: #222;" id="a4" controls src="audio/description-alex1.mp3" class="audio-tag"></audio><a href="" target="_blank">
<div class="tooltip-content-up">
<!-- have to add id="transcriptWrapper..." -->
<div class='sub'>
<h3>Alex</h3>
<div><a data-start="11.74" href="#">00:00:11,740</a> Em... I hear... It sounds like walking and it's quite windy outside</div>
<div><a data-start="18.62" href="#">00:00:18,620</a> But it sounds like... It's... The microphone is inside or something</div>
<div><a data-start="26.98" href="#">00:00:26,980</a> It's probably music</div>
<div><a data-start="30.32" href="#">00:00:30,320</a> From a car maybe or from some radio?</div>
<div><a data-start="37.6" href="#">00:00:37,600</a> It's outside on the street. I hear some cars in the background</div>
<div><a data-start="48.7" href="#">00:00:48,700</a> Mmmm... It sounds like gardening sounds</div>
<div><a data-start="54.82" href="#">00:00:54,820</a> There are people in the background or maybe it's bikes</div>
<div><a data-start="65.84" href="#">00:01:05,840</a> Oh I hear a bird in the background</div>
<div><a data-start="72.12" href="#">00:01:12,120</a> A very monotone sound</div>
<div><a data-start="76.74" href="#">00:01:16,740</a> It's like driving, maybe driving in a car</div>
<div><a data-start="95.12" href="#">00:01:35,120</a> And some wind around
It seems like outside but there is some noise in the background</div>
<div><a data-start="96.58" href="#">00:01:36,580</a> It seems like outside but there is some noise in the background</div>
<div><a data-start="106.34" href="#">00:01:46,340</a> It's outside</div>
<div><a data-start="124.92" href="#">00:02:04,920</a> Oh, I hear children in the background crying</div>
<div><a data-start="124.94" href="#">00:02:04,940</a> There is some weird sound in the foreground, which I... It's hard to describe [chuckling]
Oh, I hear children in the background crying</div>
<div><a data-start="128.36" href="#">00:02:08,360</a> There is some weird sound in the foreground, which I... It's hard to describe [chuckling]</div>
<div><a data-start="134.9" href="#">00:02:14,900</a> Again it sounds like there is a kindergarten or school nearby</div>
</div>
</div></div>
<button id="but">listen</button>
<br><br>
<!-- second sounwalk player -->
<div class="tooltip-wrap">
<audio style="width: 100%; background: #FFFFFF;" id="b1" controls src="audio/selectionB.mp3" class="audio-tag"></audio><a href="" target="_blank">
<div class="tooltip-content-up">
<!-- have to add id="transcriptWrapper..." -->
</div>
</div>
<div class="tooltip-wrap">
<!-- have to add ontimeupdate="playTranscript3()" -->
<audio style="width: 100%; background: #222;" id="b2" controls src="audio/description-tommi.mp3" class="audio-tag"></audio><a href="" target="_blank">
<div class="tooltip-content-up">
<!-- have to add id="transcriptWrapper..." -->
<div class='subB'>
<h3>Tommi</h3>
<div><a data-start="12.98" href="#">00:00:12,980</a> This is some water ** maybe from a fountain</div>
<div><a data-start="61.48" href="#">00:01:01,480</a> Plates</div>
<div><a data-start="64.44" href="#">00:01:04,440</a> A bus at stand by at a bus stop</div>
<div><a data-start="70.02" href="#">00:01:10,020</a> Some people are chatting</div>
<div><a data-start="76.94" href="#">00:01:16,940</a> Some kids talking talking while they are playing in the sand or something</div>
<div><a data-start="87.94" href="#">00:01:27,940</a> Two people having a conversation on a street</div>
<div><a data-start="96.28" href="#">00:01:36,280</a> One of them is walking away [chuckling]</div>
<div><a data-start="102.1" href="#">00:01:42,100</a> And now a car is passing</div>
<div><a data-start="110.6" href="#">00:01:50,600</a> It's a construction site</div>
<div><a data-start="113.3" href="#">00:01:53,300</a> Something is being hammered</div>
<div><a data-start="121.2" href="#">00:02:01,200</a> Some sports match or something</div>
<div><a data-start="124.16" href="#">00:02:04,160</a> Everyone is **</div>
<div><a data-start="132.54" href="#">00:02:12,540</a> Someone is speaking Arabic</div>
<div><a data-start="138.76" href="#">00:02:18,760</a> To a group of people</div>
<div><a data-start="142.76" href="#">00:02:22,760</a> It's like a very large voluminous space [chuckling] cause it's echoing a lot</div>
<div><a data-start="156.76" href="#">00:02:36,760</a> Some people are shouting at something at a distance</div>
<div><a data-start="163.76" href="#">00:02:43,760</a> It sounds like in a courtyard</div>
<div><a data-start="166.54" href="#">00:02:46,540</a> A baby crying</div>
</div>
</div></div>
<div class="tooltip-wrap">
<!-- have to add ontimeupdate="playTranscript3()" -->
<audio style="width: 100%; background: #222;" id="b3" controls src="audio/description-alex2.mp3" class="audio-tag"></audio><a href="" target="_blank">
<div class="tooltip-content-up">
<!-- have to add id="transcriptWrapper..." -->
<div class='subB'>
<h3>Alex</h3>
<div><a data-start="7.82" href="#">00:00:07,820</a> There is teenagers nearby and it's walking</div>
<div><a data-start="11.7" href="#">00:00:11,700</a> Oh, there is water</div>
<div><a data-start="15.24" href="#">00:00:15,240</a> That's running</div>
<div><a data-start="20.66" href="#">00:00:20,660</a> Outside probably</div>
<div><a data-start="28.88" href="#">00:00:28,880</a> Oh, that's... It sounds like there is something clapping or like hitting against a surface</div>
<div><a data-start="38.52" href="#">00:00:38,520</a> And it's very repetitive sound</div>
<div><a data-start="46.6" href="#">00:00:46,600</a> Oh, I can hear some, some radio or some music or broadcast</div>
<div><a data-start="60.2" href="#">00:01:00,200</a> That was too short. I don't know [chuckling]</div>
<div><a data-start="64.44" href="#">00:01:04,440</a> Oh, it's quite loud. It's... Maybe it's in some kind of transport</div>
<div><a data-start="76.22" href="#">00:01:16,220</a> Oh, there is a child speaking</div>
<div><a data-start="85.74" href="#">00:01:25,740</a> There are people talking outside... In a foreign language</div>
<div><a data-start="96.28" href="#">00:01:36,280</a> It's not Dutch and there is some wind</div>
<div><a data-start="102.32" href="#">00:01:42,320</a> There are more people talking</div>
<div><a data-start="112.76" href="#">00:01:52,760</a> Oh, there is sounds like there are construction works</div>
<div><a data-start="116.72" href="#">00:01:56,720</a> Or hammering</div>
<div><a data-start="120.92" href="#">00:02:00,920</a> Oh, it's very loud. Oh [chuckling], it's applause or... a crowd of people. I don't know [chuckling]</div>
<div><a data-start="132.06" href="#">00:02:12,060</a> It's inside. It sounds like a hallway... I don't know. Like inside</div>
<div><a data-start="138.26" href="#">00:02:18,260</a> Because I hear some echoing</div>
<div><a data-start="142.56" href="#">00:02:22,560</a> Ot it's inside a tunnel, where people are passing by</div>
<div><a data-start="158.2" href="#">00:02:38,200</a> It sounds like near some street outside and I hear some kids in the background</div>
<div><a data-start="166.6" href="#">00:02:46,600</a> Again, there is a child screaming or crying</div>
</div>
</div></div>
<button id="butB">listen</button>
</section>

@ -18,26 +18,26 @@
</h3>
<!-- draggable menu-->
<div class="draggable scaleable-wrapper" style="top: 740px; right: 300px;">
<div class="draggable scaleable-wrapper" style="top: 110%; right: 3%;">
<h2><a href="amplification.php">Amplification of female voices</a></h2>
<div class="drag-content">
(workshops)
</div>
</div>
<div class="draggable scaleable-wrapper" style="top: 948.6px; right: 30px;">
<div class="draggable scaleable-wrapper" style="top: 130%; right: 7%;">
<h2 ><a href="diary.php">Diary of West Rotterdam</a></h2>
<div class="drag-content">
(first experiments)
</div>
</div>
<div class="draggable scaleable-wrapper" style="top: 848.533px; right: 5px;">
<div class="draggable scaleable-wrapper" style="top: 90%; right: 5%;">
<h2 ><a href="player.php">Player</a></h2>
<div class="drag-content">
(audio archive)
</div>
</div>
<div class="draggable scaleable-wrapper" style="top: 540px; right: 1900px;">
<div class="draggable scaleable-wrapper" style="top: 92%; left: 2%;">
<h2 ><a href="index.php">About</a></h2>
<div class="drag-content">
(main page)
@ -81,8 +81,9 @@ $files = glob("podcasts/podcast1/*.mp3");
for ($i=0; $i<count($files); $i++)
{$num = $files[$i];
$var1 = $_GET["files"]["name"];
echo '<td><div class="tooltip-wrap"><audio src='.$num.' controls></audio><div class="tooltip-content-down">';include $num.'.txt';
echo '</div><br /><div style="font-size:14px;line-height:1;text-align: left;max-width:280px;">';
echo '<td><div class="tooltip-wrap no-underline"><audio src='.$num.' controls></audio><div class="tooltip-content-down"><div class="left_col"><h3>NARRATOR</h3>';include $num.'.txt';
echo '</div><div class="right_col"><h3>SPEAKERS</h3>'; include $num.'-M.txt';
echo '</div></div><br /><div style="font-size:14px;line-height:1;text-align: left;max-width:280px;">';
include $num.'-METADATA.txt';
echo '<br /><a href='.$num.' download='.$var1.'>download</a></div></div></td>'; } ?>
</tr></table>

@ -10,8 +10,7 @@ body {
}
section {
margin-bottom: 50px;
margin-top: 20px;
display: block;
}
a {
@ -22,12 +21,12 @@ a {
.active {
color: red;
font-size: 120% ;
font-size: 125% ;
}
.active-draggable{
width: 30% !important;
font-size: 110%;
font-size: 130%;
}
a img {
@ -57,7 +56,7 @@ h1 {
h2 {
text-align: center;
letter-spacing: 4px;
font-size: 120%;
font-size: 135%;
margin: 5px;
margin-bottom: 10px;
color: red;
@ -343,13 +342,17 @@ input[type=checkbox]:checked ~ aside {
text-decoration: underline;
}
.no-underline {
text-decoration: none !important;
}
.tooltip-wrap .tooltip-content-down {
display: none;
position: absolute;
z-index: 1;
top: 50%;
top: 25%;
/*bottom: 100%;*/
left: 50%;
left: 0%;
/*right: 100%;*/
padding: 0.2em;
background-color: white;
@ -358,7 +361,8 @@ input[type=checkbox]:checked ~ aside {
border-style: solid;
border-color: black;
text-align: left;
min-width:200%;
min-width:300%;
font-size: 80%;
}
.tooltip-wrap .tooltip-content-right {
@ -532,6 +536,10 @@ input[type=checkbox]:checked ~ aside {
/*margin-right: 90px;*/
}
.full-width {
width: 100% !important;
}
.draggable {
box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.2);
background-color: white;
@ -673,4 +681,15 @@ li, #angela, #judith, #laurie, #dana, #katalin {
width: 100%;
}
.left_col {
float:left;
margin-left: 0.8%;
border-right: 1px dashed grey;
width:49%;
}
.right_col {
float:right;
width:49%;
}
/*}*/

@ -1 +1,6 @@
'Let's amplify unspeakable things' is an online platform of exploration and research, regarding voice in public and its amplification, developed by Angeliki Diakrousi. It creates a space for excluded voices to be explored, that questions the establishment of authoritative voices — which construct exclusive speech platforms and binaries, along the assumption that voices have to be rational. It includes a set of <div class="tooltip-wrap" style="display: inline;text-decoration:underline;">podcasts <div class="tooltip-content-right" ><div>what conflicts or frictions the technical aspect and difficulties, of a project like that reveals? The website consists of different web-audio implementations</div></div></div>that revisit and overlay an archive of audio recordings produced in situated meetings and soundwalks, and media sources from a body of research. 'Let's amplify unspeakable things' is based on the concept that amplification can create presence through repetition and multiplication.
'Let's Amplify Unspeakable Things' is an online platform of exploration and research, regarding female voices in public and their amplification, developed by Angeliki Diakrousi. It creates a space for excluded voices to be explored, that questions the establishment of authoritative voices — which construct exclusive speech platforms and binaries, along the assumption that voices have to be rational. It includes a set of <div class="tooltip-wrap" style="display: inline;text-decoration:underline;">podcasts <div class="tooltip-content-right" ><div>what conflicts or frictions the technical aspect and difficulties, of a project like that reveals? The website consists of different web-audio implementations</div></div></div>that revisit and overlay an archive of audio recordings, produced in situated<div class="tooltip-wrap" style="display: inline;text-decoration:underline;">workshops<div class="tooltip-content-right" ><div></div></div></div> and soundwalks, and media sources from a body of research. 'Let's Amplify Unspeakable Things' is based on the concept that amplification can provide presence through repetition and multiplication, as the structure of the workshops and the website reveals. The project itself is a process of feedback and iteration of actions, throughout a period of four months, situated around the space of <a href="http://www.leeszaalrotterdamwest.nl/" >Leeszaal</a> and <a href="https://hub.xpub.nl/">hub.xpub.nl</a>. It exists in between the friction of institutions (a public library and an academy) and different public spheres (wereldvrouwen, academic), and it aims to go beyond their binaries.

@ -1 +1,3 @@
This is a documentation of a series of meetings/workshops I am organising together with Christina Karagianni. Our intentions come from personal experiences and we seek to explore the silencing of excluded voices, and go beyond their barriers. We combine our practices -her practice lies on choreography and dance and mine on social interaction, voice and sound- in moments of <a href="http://www.leeszaalrotterdamwest.nl/" >Leeszaal</a>, an open local library, a public space of diversity. How can we engage politically with the exclusion of specific voices from the public sphere? We are borrowing methods from feminist groups and protest movements and vocal warming up exercises by Pauline Oliveros. For example, protesters would amplify the speaker's voice by repeating collectively their speech to make their presence visible. Feminists would create safe spaces where women could speak about domestic violence and make a dialogue based on listening. <div class="tooltip-wrap" style="display: inline;text-decoration:underline;">We invite <div class="tooltip-content-right" ><div>how we should approch the gender terminology and false association with voice when inviting people? Should it be about femme sounding? Female voice? </div></div></div>people from Leeszaal and our environment, who find themselves related and interested to this topic. Elements from the meetings: discuss previous material, reading extracts in random order, <div class="tooltip-wrap" style="display: inline;text-decoration:underline;">discuss <div class="tooltip-content-right" ><div>what conflicts or frictions the technical aspect provokes? web-audio, recordings</div></div></div>personal associations and experiences with voice in public, warming up, say a sentence of personal experience in any language, transcribe only the vowels of it, read back the vowels, read outloud all together the score of vowels, speak with distorted voice, make podcasts. The produced material is being included in an audio archive, the player.
This is a documentation of a series of meetings/workshops I am organising together with Christina Karagianni. Our intentions come from personal experiences and we seek to explore the silencing of excluded voices, and go beyond their barriers. We combine our practices -her practice lies on choreography and dance and mine on social interaction, voice and sound- in moments of <a href="http://www.leeszaalrotterdamwest.nl/" >Leeszaal</a>, an open local library, a public space of diversity. How can we engage politically with the exclusion of specific voices from the public sphere? We are borrowing methods from feminist groups and protest movements and vocal warming up exercises by Pauline Oliveros. For example, protesters would amplify the speaker's voice by repeating collectively their speech to make their presence visible. Feminists would create safe spaces where women could speak about domestic violence and make a dialogue based on listening. <div class="tooltip-wrap" style="display: inline;text-decoration:underline;">We invite <div class="tooltip-content-right" ><div>how we should approch the gender terminology and false association with voice when inviting people? Should it be about femme sounding? Female voice? </div></div></div>people from Leeszaal and our environment, who find themselves related and interested to this topic. The produced material is being included in an audio archive, <div class="tooltip-wrap" style="display: inline;text-decoration:underline;">player.<div class="tooltip-content-right" ><div>what conflicts or frictions the technical aspect provokes? web-audio, recordings</div></div></div>

@ -1,4 +1,5 @@
<div style="background-color: white; width: 500px;border:1px red;border-style: dashed;padding: 10px;">
<p>Dear listener,</p>
you are invited to <div class="tooltip-wrap" style="display: inline;text-decoration:underline;">amplify<div class="tooltip-content-right"><div>Protesters in occupy wall street all together repeated the voice of the public speaker in order to amplify their voices. This is called "the human microphone"</div></div></div> parts of the podcasts that you find worthy of attention by repeating or annotate them with your own voice message. Amplification can happen through multiplication, through the gathering of multiple individual voices. <p>Maximum duration: 1 min</p>
you are invited to <div class="tooltip-wrap" style="display: inline;text-decoration:underline;">amplify<div class="tooltip-content-right"><div>Protesters in occupy wall street all together repeated the voice of the public speaker in order to amplify their voices. This is called "the human microphone"</div></div></div> parts of the podcasts that you find worthy of attention by repeating or annotate them with your own voice message. Amplification can happen through repetition and multiplication, through the gathering of multiple individual voices repeating fragments of situations. <p>Maximum duration: 1 min</p>

@ -1 +1 @@
I recorded sounds from the West Rotterdam, <div class="tooltip-wrap" style="display: inline;text-decoration:underline;">while walking around the neighborhood of <div class="tooltip-content-down" ><img width="300px" src="images/soundwalk-photo1.jpg" /><br /><br /><img width="300px" src="images/soundwalk-photo3.jpg" /></div></div><a href="http://www.leeszaalrotterdamwest.nl/" >Leeszaal</a> for several days. This action was part of my first experiments when I was in attempt to understand how gender binaries regarding voice are reflected in space, especially public space.
This is a diary from my first experiments. It includes mostly material from my walks. I recorded sounds from the West Rotterdam, <div class="tooltip-wrap" style="display: inline;text-decoration:underline;">while walking around the neighborhood of <div class="tooltip-content-down" ><img width="300px" src="images/soundwalk-photo1.jpg" /><br /><br /><img width="300px" src="images/soundwalk-photo3.jpg" /></div></div><a href="http://www.leeszaalrotterdamwest.nl/" >Leeszaal</a> for several days. This action was part of my first experiments when I was in attempt to understand how gender binaries regarding voice are reflected in space, especially public space.

@ -165,7 +165,7 @@
<!-- end of draggable images -->
<div class="draggable scaleable-wrapper box_metadata" id="metadata-thesis" >
<div class="draggable scaleable-wrapper box_metadata" id="metadata-thesis" style="left:1%;" >
<li>Author: Angeliki Diakrousi</li>
<li>Title: Let's Talk About Unspeakable Things</li>
<li>Student number: 0956090</li>

Loading…
Cancel
Save