Your browser lacks required capabilities. Please upgrade it or switch to another to continue.
Loading…
<<fadeLine 3.5s>><p>As you slap the ice in panic, a giant blade inches away from splitting you in half, you regret snapping that photo with your phone.</p><<nextLine 1s>><p>Selfies aren't your thing.</p>
<<nextLine 1s>><p>Let's face it, friends aren't really your thing.</p>
<<complete>>Which is why you were alone, outside the art gallery, away from the rest of your class, looking at the one photo you did take, when you saw another face staring back at you. In the background, lost amongst the tiny figures from the middle ages, there was no mistaking it — a face you <<link [[recognised.|The girl disappeared]]>><<audio "prologue" volume 1 fadeoverto 1 0>><</link>><</fadeLine>>
<span id ="the" class="hidden">The</span> <span id="girl" class="hidden">Girl</span>
<<timed 1s t8n>><<addclass "#the" "fade-in">><<addclass "#girl" "fade-in">><<audio "prologuebell" play>><</timed>>
<<timed 6s t8n>><<removeclass "#the" "fade-in">><</timed>>
<<timed 9s t8n>><<audio "prologue4shot" play>><<removeclass "#girl" "fade-in">><</timed>>
<p style = "text-align:right"><span id = "the2" class ="hidden">The</span><span id = "one" class ="hidden"> one</span> <span id = "who" class ="hidden">who</span> <span id = "disappeared" class ="hidden">disappeared.</span></p>
<<timed 2s t8n>><<addclass "#the2" "fade-in">><<addclass "#one" "fade-in">><<addclass "#who" "fade-in">><<addclass "#disappeared" "fade-in">><</timed>>
<<timed 4s t8n>><<audio "prologue2shot" play>><<removeclass "#the2" "fade-in">><</timed>>
<<timed 5s t8n>><<removeclass "#one" "fade-in">><</timed>>
<<timed 7s t8n>><<audio "prologue3shot" play>><<removeclass "#who" "fade-in">><</timed>>
<<timed 11s t8n>><<audio "prologue5shot" play>><<removeclass "#disappeared" "fade-in">><</timed>>
<<timed 12.5s t8n>><<goto "TRANS1">><</timed>>
<h1 class="fadein">Welcome to
The Garden.</h1>
<<timed 1s t8n>><span class="highLight">Do you have a pair of headphones?</span><</timed>>
<div style="text-align:center;"><span class="btnBorder"><<timed 2s t8n>><<link[[Yes]]>><</link>>[[No]]<</timed>></span></div>
<div style="text-align:center;"><<timed 2.5s t8n>>Please click<</timed>></div>
<<cacheaudio "onboard" "Music/Onboarding.mp3">>
<<cacheaudio "onboard1shot" "Music/Onboarding_Oneshot.mp3">>
<<waitforaudio>>
<<cacheaudio "prologue" "Music/Prologue.mp3">>
<<cacheaudio "prologuebell" "Music/Prologue_Oneshot.mp3">>
<<cacheaudio "prologue2shot" "Music/Prologue_Oneshot 2.mp3">>
<<cacheaudio "prologue3shot" "Music/Prologue_Oneshot 3.mp3">>
<<cacheaudio "prologue4shot" "Music/Prologue_Oneshot 4.mp3">>
<<cacheaudio "prologue5shot" "Music/Prologue_Oneshot 5.mp3">>
<<cacheaudio "girl" "Music/The Girl.wav">>
<<cacheaudio "endprologue" "Music/EndPrologue.wav">>
<<cacheaudio "message" "Music/Message_Alert.mp3">>
<<cacheaudio "school" "Music/School Ambience.mp3">>
<<cacheaudio "lonliness" "Music/Loneliness_Loop.mp3">>
<<cacheaudio "park" "Music/ParkOutside.mp3">>
<<cacheaudio "guitars" "Music/Stephs Guitar.mp3">>
<<cacheaudio "hoover" "Music/Inside_Room_Hoover.mp3">>
<<cacheaudio "mum" "Music/Stephs_Mom.mp3">>
<<cacheaudio "shower" "Music/Shower_Loop.mp3">>
<<cacheaudio "berlin" "Music/Experimental Berlin.mp3">>
<<cacheaudio "drone" "Music/Drone_Loop.mp3">>
<<cacheaudio "artgallerybusy" "Music/Art_Gallery_Busy.mp3">>
<<cacheaudio "mrsvanderson1" "Music/MRS_Vanderson_1.mp3">>
<<cacheaudio "mrsvanderson2" "Music/MRS_Vanderson_2.mp3">>
<<cacheaudio "mrsvanderson3" "Music/MRS_Vanderson_3.mp3">>
<<cacheaudio "mrsvanderson4" "Music/MRS_Vanderson_4.mp3">>
<<cacheaudio "mrsvanderson" "Music/MRS_Vanderson_1 copy.mp3">>
<<cacheaudio "hellscape" "Music/Hellscape.mp3">>
<<cacheaudio "hellscape1" "Music/Hellscape1.mp3">>
<<cacheaudio "hellscape2" "Music/Hellscape2.mp3">>
<<cacheaudio "hellscape3" "Music/Hellscape3.mp3">>
<<cacheaudio "hellscape4" "Music/Hellscape4.mp3">>
<<cacheaudio "guard1" "Music/Guard_1 copy.mp3">>
<<cacheaudio "guard2" "Music/Guard_2 copy.mp3">>
<<cacheaudio "guard3" "Music/Guard_3.mp3">>
<<cacheaudio "guard4" "Music/Guard_4.mp3">>
<<cacheaudio "camera" "Music/Phone_Camera.mp3">>
<<cacheaudio "shimmer" "Music/High Shimmer.mp3">>
<<cacheaudio "mobile" "Music/Mobile Phone Scene.mp3">>
<<cacheaudio "mobile1" "Music/Mobile Phone Scene 1.mp3">>
<<cacheaudio "mobile2" "Music/Mobile Phone Scene 2.mp3">>
<<cacheaudio "mobile2-1" "Music/Mobile Phone Scene 2-1.mp3">>
<<cacheaudio "mobile3" "Music/Mobile Phone Scene 3.mp3">>
<<cacheaudio "mobile3-1" "Music/Mobile Phone Scene 3-1.mp3">>
<<cacheaudio "mobile4" "Music/Mobile Phone Scene 4.mp3">>
<<cacheaudio "lake" "Music/The Garden Lake.mp3">>
<<cacheaudio "journey1" "Music/The Garden Lake 1.mp3">>
<<cacheaudio "journey2" "Music/The Garden Lake 2.mp3">>
<<cacheaudio "journey3" "Music/The Garden Lake 3.mp3">>
<<cacheaudio "journey4" "Music/The Garden Lake 4.mp3">>
<<cacheaudio "journey5" "Music/The Garden Lake 5.mp3">>
<<cacheaudio "journey6" "Music/The Garden Lake 6.mp3">>
<<cacheaudio "outside" "Music/Open_Ambience.mp3">>
<<cacheaudio "cows" "Music/Cows Calling.mp3">>
<<cacheaudio "birds" "Music/Exotic_Birds.mp3">>
<<cacheaudio "underwater" "Music/Underwater.mp3">>
<<cacheaudio "galleryempty" "Music/Art_Gallery_Empty.mp3">>
<<cacheaudio "hellpanel" "Third_Panel.mp3">>
<<cacheaudio "hellpanel1" "Music/Third_Panel_1.mp3">>
<<cacheaudio "hellpanel2" "Music/Third_Panel_2.mp3">>
<<cacheaudio "hellpanel3" "Music/Third_Panel_3.mp3">>
<<cacheaudio "hellpanel4" "Music/Third_Panel_4.mp3">>
<<cacheaudio "hellpanel4-1" "Music/Third_Panel_4-1.mp3">>
<<cacheaudio "hellpanel5" "Music/Third_Panel_5.mp3">>
<<cacheaudio "hellpanel6" "Music/Third_Panel_6.mp3">>
<<cacheaudio "hellpanel7" "Music/Third_Panel_7.mp3">>
<<cacheaudio "hellpanel8" "Music/Third_Panel_8.mp3">>
<<cacheaudio "hellpanel8-1" "Music/Third_Panel_8-1.mp3">>
<<cacheaudio "hellpanel9" "Music/Third_Panel_9.mp3">>
<<cacheaudio "hellpanel9-1" "Music/Third_Panel_9-1.mp3">>
<<cacheaudio "hellpanel10" "Music/Third_Panel_10.mp3">>
<<cacheaudio "hellpanel11" "Music/Third_Panel_11.mp3">>
<<cacheaudio "hellpanel12" "Music/Third_Panel_12.mp3">>
<<cacheaudio "footsteps" "Music/Running.mp3">>
<<cacheaudio "footsteps-1" "Music/Running-1.mp3">>
<<cacheaudio "footsteps-15" "Music/Running15.mp3">>
<<cacheaudio "footsteps-20" "Music/Running20.mp3">>
<<cacheaudio "splash" "Music/Splash.mp3">>
<<run setTimeout(UInv.cacheImages("Images/", ["Images/Titlepage.png"]), 100)>><<audio "message" play>>
<<audio "school" volume 0 fadeoverto 10 1>>
<<link [img[Images/Text Message.jpg][Page 1]]>><</link>>
<<fadein 3s>>The last time you saw Steph was at lunch.<</fadein>><<fadein 1s `(9/$wps) + "s"`>> She was being a dick, and you told her exactly that.<</fadein>><<fadein 1s `(23/$wps) + "s"`>> So she sauntered off, waving her half-eaten sandwich over her head like it was some 'Bye Bitch' flag, trying to pretend she didn't care, even though you could see that she did.<</fadein>>
<<fadein 1s `(55/$wps) + "s"`>> <span class="highLight">Whatever.</span><</fadein>>
<<fadein 1s `(56/$wps + 1) + "s"`>> It was her fault for being a <<link [[dick.|Page 2]]>><<audio "school" fadeoverto 10 0>><</link>> <</fadein>>
<<script>>
SimpleAudio.select("artgallerybusy").load();
<</script>>
<<fadein 2s>>There were police interviews, and missing child signs, stories in the local and national newspapers, on the television.<</fadein>><<fadein 1s `(18/$wps) + "s"`>> You made a video appeal with Gary Agbole, because he was also Steph's friend, and Heather Illingsworth, because she's one of those people who just jumps on whatever the latest cause is, and that week it was Steph.<</fadein>><<fadein 1s `(57/$wps) + "s"`>> You put the video all over the internet, and a clip of it (Heather's part, of course) even made it on national television.<</fadein>>
<<fadein 3s `(70/$wps) + "s"`>> But none of it made a <<link[[difference.|Page 3]]>><<audio "guitars" play>><<audio "lonliness" fadeout>><</link>><</fadein>>
<<audio "lonliness" volume 0 fadeoverto 2 1>>
<<fadein 2s>>Steph was new at school. She wore oversized hoodies, played guitar — you took some photos of her strumming an acoustic one day, and edited them so she looked epic.<</fadein>> <<fadein 1s `(27/$wps) + "s"`>> So you started hanging out a bit. You went round to her house, met her mum, heard her play her Fender electric with the loop pedal, so she could comp the chords and then solo a melody line over the top.<</fadein>>
<<fadein 1s `(68/$wps) + "s"`>>Her mum didn't like you. She was pleasant enough, but you could tell right away.<</fadein>><<fadein 1s `(83/$wps) + "s"`>> After a couple of hours she started hoovering the hallway outside Steph's room, and the hoover kept banging into the door, rattling the walls, and it was like how passive aggressive can you be, until she finally knocked on the door and <<link [[said,|Page 4]]>><<audio "mum" play>><<audio "guitars" fadeoverto 0.5 0>><<audio "hoover" volume 1 fadeoverto 0.1 0.3>><</link>><</fadein>>
<<audio "lonliness" fadeout>>
<<audio "park" volume 0 fadeoverto 2 1>>
<<audio "guitars" fadeoverto `(83/$wps)` 0.35>>
<<timed `(27/$wps) + "s"`>><<audio "hoover" play>><<audio "park" fadeout>><</timed>>
<<audio "mum" volume 2.0 play>>
<<timed 1s>><<audio "hoover" volume 0.75 fadeoverto 3 1>><</timed>>
<p style="text-indent:15%"><<fadein 1s 3s>><span class="highLight">You:</span> Maybe I should go...?<</fadein>></p><p style="text-indent:15%"><<fadein 1s 4s>><span class="highLight">Steph:</span> Probably for the best.<</fadein>></p>
<<fadein 2s 6s>>After the hoover incident, she didn't invite you over to her house <<link[[again.|Page 5]]>><<audio "hoover" fadeoverto 2 0>><<audio "hoover" time 75 play>><</link>><</fadein>>
Perfect. <span class="highLight">Are your headphones connected to this device?</span>
<div style="text-align:center;">
<span class="btnBorder"><<timed 1s t8n>><<link [[Yes|Headphones On]]>><<audio "onboard" volume 0.75 play>><</link>>[[No|headphones off]]<</timed>></span></div>
<span class="highLight">This story is only complete with a pair of headphones.</span>
[[Click here|Yes]] when they are to hand.
Right now, <span class="highLight">can you hear the guitar in your right ear only?</span>
<div style="text-align:center;"><span class="btnBorder"><<timed 3s t8n>>[[Yes|Headphones working]][[No|Headphones not working]]<</timed>>
<<timed 4s t8n>>[[I can't hear any sound]]<</timed>></span></div>
<div style="text-align:center;">
<<timed 5s t8n>>Please click<</timed>></div>
<span class="highLight">Please connect your headphones to this device.</span>
<<link [[Click here|Headphones On]]>><<audio "onboard" volume 0.75 play>><</link>> when you are ready. <<fadein 1s>><span class="highLight">The story will begin shortly.</span><</fadein>>
<<fadein 1s 1s>>When you click a blue word, it will take you to a [[new page.]]<</fadein>>
<span class="highLight">Please swap the headphones around.</span>
[[Click here|Headphones working]] when you are ready.<<fadein 2s>><span class="highLight">But this is also a story about hidden things.</span><</fadein>>
<<fadein 2s 2s>>A story that likes to<</fadein>><span id="conceal" class="slow-hidden"> conceal its words.</span><<timed 3s>><<addclass "#conceal" "fade-in">><</timed>>
<<fadein 3s 5s>>And then reveal them to you.<</fadein>>
<<fadein 2s 7s>>But when, exactly, is the right moment?<</fadein>>
<<fadein 1.5s 9s>>On the next page, you'll find a short passage. Read it at your own speed, starting...<</fadein>>
<<fadein 2s 12s>><span class="btnBorder">[[now]]</span><</fadein>>
Words, in their own way, are hidden things. They are assembled from shapes and sounds. On a page. Onscreen.
Spoken, written, articulated, left hanging in the air — that is their presence, their existence. Sometimes for a short moment.
Sometimes forever.
<<linkreplace "I've finished reading the passage." t8n>>
<<set $timeCountA to time()>>
<<set $timeTemp to Math.round($timeCountA/1000)>>Beautiful. It took you $timeTemp seconds to read that passage of 40 words.
<span class="fadein btnBorder">[[Turn the page]]</span><</linkreplace>>Words are shapes and sounds that paint images of the world in our minds. In this story, they are even hidden in a painting. Because a painting can render the world itself — what is seen, and what is unseen. From the hyper-real, to the language of abstraction, and into the realm of the imagination.
<<linkreplace "I've finished reading the passage." t8n>>
<<set $timeCountB to time()>>
<<set $timeTemp to Math.round($timeCountB/1000)>>It took you $timeTemp seconds to read that passage of 54 words.
<span class="fadein btnBorder">[[What does this mean?]]</span><</linkreplace>>
<<set $totalTime to Math.round(($timeCountA+$timeCountB)/1000)>>
<span id = "text">It means you took around $totalTime seconds to read 94 words.
<<set $wps to Math.round(94/$totalTime)>><<set $storyTime to Math.round((2430/$wps)/60 + 6)>><span class="highLight">
So this story will tell you $wps words every second,</span> and should take $storyTime minutes to read.
<span class="btnBorder"><<link[[Now — let's begin|Trans out of Prologue]]>><<run setTimeout(function () { $.wiki('<<audio "prologue" play>>'); }, 14650)>><<audio "onboard" fadeout>><<run setTimeout(function () { $.wiki('<<audio "onboard1shot" play>>'); }, 5900)>><</link>></span>
or
<span class="btnBorder">[[I'd like to try that again|now]]</span>
<<fadein 3s>>Then she was gone.<</fadein>><<fadein 2s `(4/$wps + 1) + "s"`>> It was less sad than strange. This person was skirting around your life a bit, and then she wasn't.<</fadein>><<fadein 1.5s `(23/$wps) + "s"`>> You wondered, obviously, what might have happened to her. You had a mental image of her playing with a loud, experimental, and androgynous band in an underground club somewhere like Berlin.<</fadein>><<fadein 2s `(54/$wps) + "s"`>> And sometimes you considered the possibility of other, <<link [[worse things.|Page 6]]>><<audio "shower" fadeoverto 3 1>><</link>><</fadein>>
<<timed `(4/$wps + 1) + "s"`s>><<audio "shower" play>>
<<next 0.1s>><<audio "shower" fadeoverto 0.1 0.3>>
<<next 2s>><<audio "shower" fadeoverto 6 1>>
<</timed>>
<<timed `(52/$wps) + "s"`>><<audio "berlin" play>><<audio "shower" fadeoverto 6 0.8>>
<</timed>>
<<run setTimeout(function () { $.wiki('<<audio "drone" play>>'); }, 31000)>><span id="pt1" class="hidden">Eventually,</span><span id="pt2" class="hidden"> it stopped being</span><span id="strange" class="hidden"> strange</span><span id="pt3" class="hidden"> that she was no longer there.</span><span id="She" class="hidden"> She</span> <span id="pt4" class="hidden">was someone who was once a</span><span id="presence" class="hidden"> presence</span><span id="pt5" class="hidden"> in your</span><span id="life" class="hidden"> life</span><span id="pt6" class="hidden">, and then wasn't anymore,</span><span id="pt7" class="hidden"> and if you thought of anything you thought that it was</span><span id="nice" class="hidden"> nice</span><span id="pt8" class="hidden">, for a short</span><span id="time" class="hidden"> time</span><span id="pt9" class="hidden">, to have had someone to talk to,</span><span id="pt10" class="hidden"> even if you didn't speak about much.</span>
<span id="pt11" class="hidden">Maybe you would have told her more</span><span id="pt12" class="hidden"> about who you really were,</span><span id="pt13" class="hidden"> what you really thought about basically</span><span id="everything" class="hidden"> everything</span><span id="pt14" class="hidden">, but that's not how you were then or</span><span id="now" class="hidden"> now</span><span id="pt15" class="hidden">, and so</span><span id="youkeep" class="hidden"> you keep</span><span id="yourself" class="hidden"> yourself</span><span id="pt16" class="hidden"> to yourself.</span>
<<timed 0.25s t8n>><<addclass "#pt1" "fade-in">><</timed>><<timed 0.25s t8n>><<addclass "#pt2" "fade-in">><</timed>><<timed 0.25s t8n>><<addclass "#strange" "fade-in">><</timed>><<timed 0.25s t8n>><<addclass "#pt3" "fade-in">><</timed>><<timed `(11/$wps) + "s"` t8n>><<addclass "#She" "fade-in">><</timed>><<timed `(11/$wps) + "s"` t8n>><<addclass "#pt4" "fade-in">><</timed>><<timed `(11/$wps) + "s"` t8n>><<addclass "#presence" "fade-in">><</timed>><<timed `(11/$wps) + "s"` t8n>><<addclass "#pt5" "fade-in">><</timed>><<timed `(11/$wps) + "s"` t8n>><<addclass "#life" "fade-in">><</timed>><<timed `(11/$wps) + "s"` t8n>><<addclass "#pt6" "fade-in">><</timed>><<timed `(11/$wps) + "s"` t8n>><<addclass "#pt7" "fade-in">><</timed>><<timed `(11/$wps) + "s"` t8n>><<addclass "#nice" "fade-in">><</timed>><<timed `(11/$wps) + "s"` t8n>><<addclass "#pt8" "fade-in">><</timed>><<timed `(11/$wps) + "s"` t8n>><<addclass "#time" "fade-in">><</timed>><<timed `(11/$wps) + "s"` t8n>><<addclass "#pt9" "fade-in">><</timed>><<timed `(11/$wps) + "s"` t8n>><<addclass "#pt10" "fade-in">><</timed>><<timed `(56/$wps) + "s"` t8n>><<addclass "#pt11" "fade-in">><</timed>><<timed `(56/$wps) + "s"` t8n>><<addclass "#pt12" "fade-in">><</timed>><<timed `(56/$wps) + "s"` t8n>><<addclass "#pt13" "fade-in">><</timed>><<timed `(56/$wps) + "s"` t8n>><<addclass "#everything" "fade-in">><</timed>><<timed `(56/$wps) + "s"` t8n>><<addclass "#pt14" "fade-in">><</timed>><<timed `(56/$wps) + "s"` t8n>><<addclass "#now" "fade-in">><</timed>><<timed `(56/$wps) + "s"` t8n>><<addclass "#pt15" "fade-in">><</timed>><<timed `(86/$wps) + "s"` t8n>><<addclass "#youkeep" "fade-in">><</timed>><<timed `(86/$wps) + "s"` t8n>><<addclass "#yourself" "fade-in">><</timed>><<timed `(86/$wps) + "s"` t8n>><<addclass "#pt16" "fade-in">><</timed>><<timed `(86/$wps + 2) + "s"` t8n>><<removeclass "#pt2" "fade-in">><</timed>><<timed `(86/$wps + 3) + "s"` t8n>><<removeclass "#pt3" "fade-in">><</timed>><<timed `(86/$wps + 4) + "s"` t8n>><<removeclass "#pt4" "fade-in">><</timed>><<timed `(86/$wps + 4.5) + "s"` t8n>><<removeclass "#pt1" "fade-in">><</timed>><<timed `(86/$wps + 5) + "s"` t8n>><<removeclass "#pt6" "fade-in">><</timed>><<timed `(86/$wps + 5.5) + "s"` t8n>><<removeclass "#pt5" "fade-in">><</timed>><<timed `(86/$wps + 6) + "s"` t8n>><<removeclass "#pt10" "fade-in">><</timed>><<timed `(86/$wps + 6.5) + "s"` t8n>><<removeclass "#pt7" "fade-in">><</timed>><<timed `(86/$wps + 7) + "s"` t8n>><<removeclass "#pt11" "fade-in">><</timed>><<timed `(86/$wps + 7.5) + "s"` t8n>><<removeclass "#nice" "fade-in">><</timed>><<timed `(86/$wps + 8) + "s"` t8n>><<removeclass "#pt8" "fade-in">><</timed>><<timed `(86/$wps + 9.5) + "s"` t8n>><<removeclass "#pt14" "fade-in">><</timed>><<timed `(86/$wps + 10) + "s"` t8n>><<removeclass "#pt12" "fade-in">><</timed>><<timed `(86/$wps + 10.5) + "s"` t8n>><<removeclass "#pt9" "fade-in">><</timed>><<timed `(86/$wps + 11) + "s"` t8n>><<removeclass "#pt13" "fade-in">><</timed>>
<<timed `(86/$wps + 12) + "s"` t8n>><<removeclass "#pt16" "fade-in">><</timed>><<timed `(86/$wps + 12.5) + "s"` t8n>><<removeclass "#pt15" "fade-in">><</timed>><<timed `(86/$wps + 14) + "s"` t8n>><<removeclass "#youkeep" "fade-in">><</timed>><<timed `(86/$wps + 15.5) + "s"` t8n>><<removeclass "#She" "fade-in">><</timed>><<timed `(86/$wps + 17) + "s"` t8n>><<removeclass "#everything" "fade-in">><</timed>><<timed `(86/$wps + 18) + "s"` t8n>><<removeclass "#life" "fade-in">><</timed>>
<<timed `(86/$wps + 18) + "s"` t8n>><<removeclass "#now" "fade-in">><</timed>><<timed `(86/$wps + 20) + "s"` t8n>><<removeclass "#strange" "fade-in">><</timed>><<timed `(86/$wps + 21.5) + "s"` t8n>><<removeclass "#time" "fade-in">><</timed>><<timed `(86/$wps + 23) + "s"` t8n>><<removeclass "#yourself" "fade-in">><</timed>>
<<timed `(86/$wps + 25) + "s"` t8n>><<removeclass "#presence" "fade-in">><</timed>><<timed `(86/$wps + 29) + "s"` t8n>><<goto "TRANS2">><</timed>>
<<audio "shower" fadeoverto 20 0>><<timed 4s>><<goto "Trans to New Background Color">><</timed>>
<<script>>
SimpleAudio.select("prologue prologuebell prologue2shot prologue3shot prologue4shot prologue5shot girl endprologue").load();
<</script>><<timed 1s>><<goto "TRANS TO IMAGE AND TITLE">><</timed>>
<<timed 4s>><<goto "Text Message">><</timed>>
<<run setTimeout(UInv.cacheImages("Images/", ["Garden1 copy.jpg", "Text Message.jpg"]), 3500)>><div class="cols"><div class="colRight"><h1><span id="garden" span class="hidden">The Garden</span></h1><h2><span id="ben" span class="hidden">by B J T Samuels</span></h2></div>
<div class="colLeft">
<img src="Images/Cover2.jpg" img id="cover" img class="hidden">
</div></div><<timed 1s t8n>><<addclass "#cover" "fade-in">><</timed>><<timed 3s t8n>><<addclass "#garden" "fade-in">><</timed>><<timed 4.5s t8n>><<addclass "#ben" "fade-in">><</timed>><<timed 8s t8n>><<removeclass "#cover" "fade-in">><</timed>><<timed 8s t8n>><<removeclass "#garden" "fade-in">><</timed>><<timed 8s t8n>><<removeclass "#ben" "fade-in">><</timed>><<timed 9.8s t8n>><<goto Prologue>><</timed>>
<<script>>
SimpleAudio.select("message school lonliness park guitars hoover mum shower berlin drone").load();
<</script>><<timed 2s>><<goto "TRANS2 cont.">><</timed>>
<<script>>
SimpleAudio.select("mrsvanderson1 mrsvanderson2 mrsvanderson3 mrsvanderson4 mrsvanderson hellscape hellscape1 hellscape4 guard1 guard2 guard3 guard4 camera shimmer mobile mobile1 mobile2-1 mobile3-1 mobile4 lake journey1 journey2 journey3").load();
<</script>><div class="imageblock">
<img src="Images/Garden1 copy.jpg" img id="cover" img class="hidden">
<<timed 1s t8n>><<addclass "#cover" "fade-in">><</timed>>
<<timed 6s t8n>><<removeclass "#cover" "fade-in">><</timed>>
</div>
<<audio "drone" unloop>>
<<audio "drone" fadeoverto 10 0>>
<<audio "artgallerybusy" volume 0 fadeoverto 10 1>>
<span class="fadein">It's a special exhibition:</span><<timed `(6/$wps) + "s"` t8n>> “Hieronymous Bosch: Apocalypse Now.”<<next `(6/$wps+1) + "s"` t8n>> You haven't heard of the painter but you recognise an old movie in the title. It's only a few rooms, and the teachers encourage you to move through at your own pace. <<next `(33/$wps) + "s"`>><<audio "mrsvanderson" play>>
<<next 4.2s>>That's Mrs. Vanderson,<<next 3s>> speaking to the whole year group just before you enter the museum. <<next `(9/$wps) + "s"` t8n>><<audio "mrsvanderson3"play>>
<<next 1.8s>>She's extra-enthusiastic.<<next`(3/$wps) + "s"` t8n>><<audio "mrsvanderson4"play>><<next 2s>> <<link [[Extra.|Page 8]]>><<audio "artgallerybusy" fadeoverto 4 0.8>><<audio "galleryempty" volume 0 fadeoverto 3 0.1>><</link>>
<</timed>>
<<audio "artgallerybusy" fadeoverto `(45/$wps)` 0.25>>
The hellscape sits in the middle of the exhibition, in three panels.
<div class="imageblock imageWidth100">\
<span class="txt"><span class="highLight">Adam and Eve on the left.</span></span>\
<<link [img["Images/Adam and Eve717.jpg"]]>>
<<run $(".imageblock img").css({ opacity: 0, cursor: "default", "z-index": 1 })>>
<</link>>\
</div><div class="imageblock2 imageWidth100">\
<span class="txt"><span class="highLight">lots of naked people dancing with birds and fish in the middle, and on the right,</span></span>\
<<link [img["Images/birds.jpg"]]>>
<<run $(".imageblock2 img").css({ opacity: 0, cursor: "default", "z-index": 1 })>><<audio "hellscape1" volume 0 fadeoverto 25 0.25>><<audio "artgallerybusy" fadeoverto 30 0.1>>
<</link>>\
</div><div class="imageblock3 imageWidth100">\
<span class="txt enlaceSeguido"><span class="highLight">the fires of hell: dark, engorged, mutated and mutilated.</span> It is there you look, there your eye wants to linger. Yes, you glance back at the fecund mass of pink bodies, but it's all just a [[tangle.|Montage 1]]</span>\
<<link [img["Images/hell.jpg"]]>>
<<run $(".imageblock3 img").css({ opacity: 0, cursor: "default", "z-index": 1 })>>
<</link>>\
</div><div class="imageblock4">
<<link [img["Images/Hellpaneltop.png"][Page 11]]>>
<<run $(".imageblock4 img").css({ opacity: 0, cursor: "default", "z-index": 1 })>>
<</link>>\
</div>
<<fadein 2s>>You take out your phone, and focus first on the cracked, hollow eggshell man.<</fadein>>
<p style = "text-align:right"><<fadein 2s `(14/$wps) + "s"`>> Flipping the camera, you consider a selfie with him.
With your face in the foreground, and his behind — <</fadein>></p>
<<fadein 2s `(32/$wps) + "s"`>> in the painting it looks like he is looking back at his own torso, but in this shot,<</fadein>>
<p style = "text-align:right"><<fadein 2s `(50/$wps) + "s"`>> he's looking right at you.<</fadein>> </p>
<p style = "text-align:center"><<fadein 2s `(55/$wps) + "s"`>> <<link [[Snap.|Page 13]]>><<audio "hellscape" fadeoverto 0.5 0>><<audio "hellscape4" fadeoverto 0.5 0>><</link>><</fadein>></p>
<<run setTimeout(UInv.cacheImages("Images/", ["Images/selfie.png", "Images/NewZoom.png", "Images/Zoom1-5.png", "Images/Zoom2-1.png", "Images/Zoom3-5.png", "Images/Zoom4-5.png"]), 1000)>><div class="imageblock4">\
<span class="txt2">The closer
you look
at hell,
the more
hell draws
<<link [[you in.|Montage 2]]>><<audio "hellscape" time 8 volume 0 fadeoverto 3 0.25>><<audio "hellscape1" fadeout>><<run setTimeout(function () { $.wiki('<<audio "hellscape" volume 0.25 fadeoverto 25 0.9>>'); }, 10000)>><</link>></span>\
<<link [img["Images/Hellpanelfull250.jpg"]]>>
<<run $(".imageblock4 img").css({ opacity: 0, cursor: "default", "z-index": 1 })>>
<</link>>\
</div><div class="imageblock">\
<span class="txt enlaceSeguido">You glance up and see the body of a man, deathly white, cracked open like an [[egg.|Montage 4]] </span>\
<<link [img["Images/Mutant.png"]]>>
<<run $(".imageblock img").css({ opacity: 0, cursor: "default", "z-index": 1 })>>
<</link>>\
</div>
<div class="imageblock">
<<fadein 3s>>A blue bird with a cauldron as a crown polishes off the remains of a man, two legs protruding from its beak.<</fadein>></div>
<div class="imageblock4 imageWidth100">\
<<fadein 3s `(22/$wps) + "s"`>><span class="txt">There are spikes and stabbings and crucifixions everywhere, <span class="highLight">people impaled and screaming.</span> </span>\
<<link [img["Images/Bluebird.jpg"]]>>
<<run $(".imageblock4 img").css({ opacity: 0, cursor: "default", "z-index": 1 })>>\<<replace "#imageblock2id">>\
<<fadein 3s `(12/$wps) + "s"`>><span class="txt enlaceSeguido">A pig dressed as a nun kisses a man who is about to be lanced by a squatting, [[jousting mutant.|Montage 3]] </span>\
<<link [img["Images/impaled.jpg"]]>>
<<run $(".imageblock2 img").css({ opacity: 0, cursor: "default", "z-index": 1 })>>
<</link>>\
<</fadein>>\
<</replace>>\
<</link>>\
<</fadein>>\
</div>
<div id="imageblock2id" class="imageblock2 imageWidth100">\
</div>
<div class="imageblock">\
<span class="txt enlaceSeguido">Higher still, atop it all, the distant <<link [[fires.|Page 10]]>><<audio "hellscape4" volume 0 fadeoverto 1 0.5>><</link>> </span>\
<<link [img["Images/Eggshellman.png"]]>>
<<run $(".imageblock img").css({ opacity: 0, cursor: "default", "z-index": 1 })>>
<</link>>\
</div>
<<audio "galleryempty" volume 0 fadeoverto 10 0.3>><span id="line1" class="slow-hidden">The gallery has chirruped with the shuffling of an entire Spanish schoolgroup.</span>
<span id="line2" class="slow-hidden">When they leave, it is briefly, blissfully empty —</span>
<p id="line3" class="slow-hidden" style="text-align:right">yours [[alone.|Page 12]]</p>
<<timed 1s t8n>><<addclass "#line1" "fade-in">>
<<next `(12/$wps) + "s"` t8n>><<addclass "#line2" "fade-in">>
<<next `(12/$wps+0.3) + "s"` t8n>><<removeclass "#line1" "fade-in">>
<<next `(8/$wps) + "s"` t8n>><<addclass "#line3" "fade-in">>
<<next `(8/$wps+0.1) + "s"` t8n>><<removeclass "#line2" "fade-in">><</timed>>
<<audio "artgallerybusy" fadeout>>
<<audio "galleryempty" volume 0.1 fadeoverto `(20/$wps)` 0.5>><img src="Images/selfie.png">
<<timed 2s>><<goto "Page 14">><</timed>>
<<audio "camera" play>>
<<timed 0.75s>><<audio "guard1" play>><<audio "artgallerybusy" volume 0 fadeoverto 1.25 0.03>><</timed>><<fadein 1s 2s>>The guard is bald, and huge, even when sitting down, but he's got these tiny, round glasses propped up on his face.<</fadein>>
<p style = "text-align:left"><<fadein 2s `(23/$wps+3.5) + "s"`>> You hurry out of the <<link [[room.|Page 15]]>><<audio "artgallerybusy" fadeoverto 10 0>><<audio "mobile1" volume 0 fadeoverto 2 1>><<audio "galleryempty" fadeoverto 2 0>><</link>><</fadein>></p>
<<fadein 2s>>All the way outside the gallery, sitting on a bench, getting some air, you zoom around your photo, and into the empty body of the egg.<</fadein>><<fadein 1.5s `(25/$wps + 3.5) + "s"`>> There, you can see three figures seated at a table.<</fadein>><<fadein 1.5s `(35/$wps + 3.5) + "s"`>> To their right, a woman draws wine from a casket.<</fadein>><<fadein 1.5s `(45/$wps + 3.5) + "s"`>> In front of her, a man leans on the edge of the eggshell, resting his elbow as if on a window, gazing out at the madness below.<</fadein>> <<fadein 3s `(72/$wps + 3.5) + "s"`>>You look down below him, and something catches your <<link [[eye.|Page 16]]>> <<audio "shimmer" play>><</link>><</fadein>> <img src="Images/NewZoom.png">
<<timed 4s>><<goto "Page 17">><</timed>>The eggshell man has two front limbs, as if crawling on all fours, but with his back legs cut off. The front limbs look a bit like dead tree branches. For feet, there are boats, and cowering in one of the boats—in what would be, effectively, the eggshell man's right hand — you <<link [[see it.|Zoom1]]>><<audio "mobile1" volume 1 fadeoverto 4 0>><<audio "mobile2-1" play>><</link>>A small figure in a hoodie. It looks like this person is hiding, trying not to attract attention to themselves. Someone is drowning just next to the boat, but this figure sits impassively, unmoving, like a rock, or an animal frozen by the gaze of a [[predator.|Zoom2]] <img src="Images/Zoom2-1.png">
<<timed 2.5s>><<goto "Zoom 3">><</timed>><img src="Images/Zoom1-5.png">
<<timed 3.5s>><<goto "Page 18">><</timed>>
<<run setTimeout(UInv.cacheImages("Images/", ["Images/Strip1.png", "Images/Strip2.png", "Images/Strip3.png", "Images/Strip4.png", "Images/Strip5.png", "Images/Strip6.png", "Images/Strip7.png", "Images/Strip8.png", "Images/Strip9.png", "Images/Strip10.png"]), 1000)>><img src="Images/Zoom3-5.png">
<<timed 2.3s>><<goto "Page 19">><</timed>>The figure has round, wide shoulders. You cast your eyes into the darkness that envelops the head. Stretching your fingers across the screen, enlarging the details, you zoom in as much as possible. You turn up the brightness. And you can see, now, the faintest trace of <<link [[a face.|Zoom 4]]>><<audio "mobile2-1" volume 1 fadeoverto 1 0>><<audio "mobile3-1" play>><</link>><img src="Images/Zoom2-1.png">
<<timed 2.4s>><<goto "Zoom 5">><</timed>>
<img src="Images/Zoom3-5.png">
<<timed 2s>><<goto "Zoom 6">><</timed>><img src="Images/Zoom4-5.png">
<<timed 1.8s>><<goto "Page 20">><</timed>><span id="first" class="hidden">You hold your phone at different angles to make sure you are seeing correctly. But the closer you look, the clearer it is. Unmistakeably, under the hood, six months since you last saw:</span><span id="second" class="hidden highLight"> her.</span>
<span id="third" class="hidden">Back in the gallery, staring at the painting, at that exact spot — with the naked eye, it is much harder to see what was so clear when zoomed in on your phone. You look over at the security guard, but he is staring at his shoes. So you lean in as close as you can, and whisper her name.</span>
<p id="fourth" class="hidden" style="text-indent:15%"><<link [["Steph?"|Page 21]]>><<audio "guard2" play>><</link>></p>
<<timed 1s>><<addclass "#first" "fade-in">><<next `(33/$wps+1) + "s"`>><<addclass "#second" "fade-in">><<audio "mobile3-1" volume 1 fadeoverto 1.2 0>><<audio "mobile4" play>><<next 2s>><<removeclass "#first" "fade-in">><<next 3s>><<audio "artgallerybusy" volume 0 fadeoverto 3 0.25>><<addclass "#third" "fade-in">><<next `(17/$wps) + "s"`>><<removeclass "#second" "fade-in">><<next `(40/$wps) + "s"`>><<addclass "#fourth" "fade-in">><<next 1.5s>><<removeclass "#third" "fade-in">>
<</timed>>
<div id="imageblock5id" class="imageblock5 imageWidth100">\
<<fadein 5s>><span class="txt2">Which is how you notice that the water is moving. </span>\
<<link [img["Images/Strip6.png"]]>>
<<run $(".imageblock5 img").css({ opacity: 0, cursor: "default", "z-index": 1 })>>\
<</link>>\
<</fadein>>\
</div>\
<div id="imageblock6id" class="imageblock6 imageWidth100">
<<fadein 5s>> <span class="txt2">It is barely perceptible, but still crazy that no one else in this headphone-wearing herd can see it. </span>\
<<link [img["Images/Strip7.png"]]>>
<<run $(".imageblock6 img").css({ opacity: 0, cursor: "default", "z-index": 1 })>>
<<replace "#imageblock5id" t8n>>\
[img["Images/Strip9.png"]]\
<</replace>>
<</link>>\
<</fadein>>\
</div><div id="imageblockid" class="imageblock7 imageWidth100">
<<fadein 5s>> <span class="txt2 enlaceSeguido">The water — the lake in the Garden of Eden, redolent of leaping porpoises — <<link [[ripples.|Page 23]]>><<audio "journey1" volume 1 fadeoverto 4 0>><<audio "journey2" play>><</link>></span>\
<<link [img["Images/Strip8.png"]]>>
<<run $(".imageblock7 img").css({ opacity: 0, cursor: "default", "z-index": 1 })>>
<<replace "#imageblock6id" t8n>>\
[img["Images/Strip10.png"]]\
<</replace>>
<</link>>\
<</fadein>>\
</div>
<<audio "journey1" play>>
<<audio "artgallerybusy" fadeoverto 25 0.1>><div id="line1" class="imageblock"><span id="guard" class="highLight hidden">The guard is looking right at you.</span></div><div id="imageblock5id" class="imageblock5 imageWidth100">\
<<fadein 5s>><span class="txt2">You step away, and are subsumed by a headphone wearing tour group. </span>\
<<link [img["Images/Strip1.png"]]>>
<<run $(".imageblock5 img").css({ opacity: 0, cursor: "default", "z-index": 1 })>>\
<</link>>\
<</fadein>>\
</div>\
<div id="imageblock6id" class="imageblock6 imageWidth100">
<<fadein 5s `(7/$wps) + "s"`>> <span class="txt2">They pile in around you, humming and clucking.</span>\
<<link [img["Images/Strip2.png"]]>>
<<run $(".imageblock6 img").css({ opacity: 0, cursor: "default", "z-index": 1 })>>
<<replace "#imageblock5id" t8n>>\
[img["Images/Strip4.png"]]\
<</replace>>
<</link>>\
<</fadein>>\
</div><div id="imageblockid" class="imageblock7 imageWidth100">
<<fadein 5s `(7/$wps) + "s"`>> <span class="txt2 enlaceSeguido">You wriggle through them, and look frantically at the painting, your eyes darting across it looking for some hint, some clue, as to what it truly [[holds.|Page 22]]</span>\
<<link [img["Images/Strip3.png"]]>>
<<run $(".imageblock7 img").css({ opacity: 0, cursor: "default", "z-index": 1 })>>
<<replace "#imageblock6id" t8n>>\
[img["Images/Strip5.png"]]\
<</replace>>
<</link>>\
<</fadein>>\
</div>
<<audio "artgallerybusy" fadeoverto 15 0.5>>
<<timed 3s>><<addclass "#guard" "fade-in">><</timed>>
<<fadeLine 3s>>You look down, and the ground beneath you opens up.
<<nextLine>>The throng around you slowly drifts away, as if on an automated walkway.
<<nextLine>>None of them notice the void open up in the space they have vacated.
<<nextLine>>No one seems to hear, below, the distant sound of lapping waves.
<<nextLine>>You see the hole in the gallery floor.
<<nextLine>>You hear the waves.
<<nextLine>><p style = "text-indent:25%">You</p>
<<nextLine>><p style = "text-indent:50%">dive</p>
<<complete>><p style = "text-indent:75%"><<link [[in.|TRANS3]]>><<audio "journey2" volume 1 fadeoverto 1 0>><<audio "journey3" play>><<audio "artgallerybusy" fadeoverto 5 0>><</link>> </p>
<</fadeLine>><<timed 4s>><<goto "TRANS3 cont.">><</timed>>
<<script>>
SimpleAudio.select("journey4 journey5 journey6 outside cows birds underwater galleryempty hellpanel hellpanel1 hellpanel2 hellpanel3 hellpanel4-1 hellpanel5 hellpanel6 hellpanel7 hellpanel8-1 hellpanel9-1 hellpanel10 hellpanel11 hellpanel12 footsteps-20 splash").load();
<</script>><<timed 2s>><<goto "Page 24">><</timed>><<fadein 7s>>Pressure on your temples, holding your breath, you swim towards a distant light.<</fadein>> <<fadein 5s 7s>>Just as your inhalation is about to expire, you surface, surrounded by flying fish, a swimming unicorn, and a duck that reads.<</fadein>>
<<fadein 5s `(35/$wps + 5.5) + "s"`>>You look around, blinking in light whose radiance you can almost hear. The duck approaches you with its book, as if you might care to read a passage. In the distance, on the shore, you see Adam and Eve playing hide and seek.<</fadein>>
<p style = "text-align:center"><<fadein 3s `(78/$wps + 7) + "s"`>>Everything is perfect,<</fadein>></p><p style = "text-align:right"><<fadein 6s `(81/$wps + 7) + "s"`>>but you cannot <<link [[stay.|Page 25]]>><<audio "journey4" volume 1 fadeoverto 3 0>><<audio "journey5" play>><<audio "outside" fadeoverto 5 0>><</link>><</fadein>></p>
<<timed `(21/$wps + 5.5) + "s"`>><<audio "journey3" volume 1 fadeoverto 1 0>><<audio "journey4" play>><<audio "outside" fadeoverto 7 0.5>>
<</timed>>
<<timed 1s>><<audio "outside" volume 0 fadeoverto 7 0.01>><</timed>><<fadein 4s>>You dive down, kicking, surfacing in a swiftly moving river, whose current takes you past the frolicking, naked mass of humanity, the sound of braying cattle, bird calls, and the distant chatter of human agency. <</fadein>>
<<fadein 3s `(35/$wps) + "s"`>>After the pink towers and blue obelisks, you know you are heading in the right direction when the clouds darken,<</fadein>><<fadein 2s `(59/$wps) + "s"`>> birds sit atop twisted spikes,<</fadein>><<fadein 2s `(64/$wps) + "s"`>> and you see a man carrying a toad by its long tail.<</fadein>><<fadein 2s `(76/$wps) + "s"`>> Its cries are a haunting, amphibious groan, and you are so distracted by them you do not see<</fadein>><<fadein 3s `(94/$wps) + "s"`>> the approaching waterfall until its current has already swept you up.<</fadein>>
<<fadein 4s `(105/$wps) + "s"`>>You do not fight it, but let it take you <<link [[over the edge.|Page 26]]>><<audio "journey5" volume 1 fadeoverto 4 0>><<audio "journey6" play>><<audio "hellpanel1" volume 0 fadeoverto 7 1>><<audio "cows" fadeout>><<audio "birds" fadeout>><</link>>
<</fadein>>
<<timed 7s>><<audio "cows" volume 0.90 play>><</timed>>
<<audio "outside" fadeoverto 10 0>><<fadein 5s>>Darkness and the smell of smoke. A fine mist blurs the edges of the world around you.<</fadein>><<fadein 5s `(17/$wps) + "s"`>> Is that sound a scream, rising above the lapping water? You try not to look too closely at the violent freak-show all around: <</fadein>>
<p style = "text-align:right"><<fadein 3s `(40/$wps) + "s"`>> the human key,<</fadein>></p>
<<fadein 3s `(43/$wps+2) + "s"`>>the swinging body that tolls a giant bell,<</fadein>>
<p style = "text-align:center"><<fadein 3s `(51/$wps+2) + "s"`>>a talking moth,<</fadein>></p>
<<fadein 3s `(54/$wps+2) + "s"`>>and, on the horizon:<</fadein>>
<p style = "text-align:center"><<fadein 5s `(58/$wps+2) + "s"`>>a sea of bobbing, [[drowning limbs.|Page 27]]<</fadein>></p>
<<timed `(43/$wps+2) + "s"`>><<audio "hellpanel2" play>><</timed>>
<span id="part1" class="slow-hidden">On the shore, giant ears rolling like cart wheels crush every living thing in their way, an oversized knife blade sitting where a face should be. </span>
<span id="part2" class="slow-hidden"> You float as still as you can, using the minimum effort to keep you above water.</span><span id="part3" class="hidden"> Slowly, towering above, you glean the outline of the eggshell man. </span>
<span id="part4" class="hidden">Close now, senses heightened, you become aware of the water growing colder around you.</span><span id="part5" class="hidden"> Chunks of ice brush against your elbows.</span><span id="part6" class="hidden"> <span id="part7">Your breath quickens,</span> <span id="part8">your heart pumps faster,</span> <span id="part9">and you can't feel your feet anymore,</span></span><span id="part6-5" class="hidden"><span id="part10"> so you abandon stealth,</span><span id="part11"> thrash your arms</span><span id="part12"> and kick your legs </span></span><span id="part6-6" class="hidden"><span id="part14">until your hand crashes down on something solid and sharp,</span><span id="part15"> and though you wince at the dull sting you realize</span><span id="part16"> that you have reached a shelf of</span> <<link [[solid ice.|Page 28 (ALT)]]>><<audio "hellpanel4-1" play>><<audio "hellpanel3" volume 1 fadeoverto 10 0>><</link>> </span>
<<timed 0.2s>><<addclass "#part1" "fade-in">>
<<next `(26/$wps) + "s"`>><<addclass "#part2" "fade-in">><<next `(26/$wps + 0.5) + "s"`>><<removeclass "#part1" "fade-in">><<next `(16/$wps +1) + "s"`>><<addclass "#part3" "fade-in">><<next `(11/$wps+1) + "s"`>><<addclass "#part4" "fade-in">><<next `(11/$wps + 0.6) + "s"`>><<removeclass "#part2" "fade-in">><<next `(11/$wps + 0.5) + "s"`>><<removeclass "#part3" "fade-in">><<next `(14/$wps) + "s"`>><<addclass "#part5" "fade-in">><<next `(7/$wps) + "s"`>><<addclass "#part6" "fade-in">><<next `(7/$wps + 0.5) + "s"`>><<removeclass "#part4" "fade-in">><<addclass "#part6-5" "fade-in">><<next `(12/$wps + 0.5) + "s"`>><<audio "hellpanel3" time 16 volume 0 fadeoverto 5 1>><<audio "hellpanel1" volume 1 fadeoverto 3 0>><<audio "hellpanel2" volume 1 fadeoverto 7 0>><<addclass "#part6-6" "fade-in">><<removeclass "#part5" "fade-in">><<next 0.5s>><<addclass "#part7" "fadeout">><<next 0.5s>><<addclass "#part8" "fadeout">><<next 0.3s>><<addclass "#part9" "fadeout">><<next 0.5s>><<addclass "#part10" "fadeout">><<next 0.5s>><<addclass "#part11" "fadeout">><<next 0.5s>><<addclass "#part12" "fadeout">><<next 0.5s>><<addclass "#part14" "fadeout">><<next 0.5s>><<addclass "#part15" "fadeout">><<next 0.5s>><<addclass "#part16" "fadeout">>
<</timed>>
<div id="ice">
<span id="line1">A crackle, a snapping.</span>
<<timed `(4/$wps) + "s"`>><<replace "#line1">><span id="line2">You look around and see,</span><</replace>><<next `(5/$wps) + "s"`>><<replace "#line2">><span id="line3">straight ahead,</span><</replace>><<next `(2/$wps + 0.5) + "s"`>><<replace "#line3">><span id="line4">a sharp, steel blade,
tall as a skyscraper,</span><</replace>><<next `(4/$wps + 0.5) + "s"`>><<replace "#line4">><span id="line5">cutting through the ice, </span><</replace>><<next `(4/$wps + 0.5) + "s"`>><<replace "#line5">><span id="line6">directly</span><</replace>><<next `(1/$wps + 0.5) + "s"`>><<replace "#line6">><span id="line7">towards</span><</replace>>
<<next `(1/$wps + 1) + "s"` t8n>><<replace "#line7">><span id="line8" t8n>You</span><</replace>><<next `(1/$wps + 1) + "s"`>><<replace "#line8">><span id="line9" t8n>slap the ice</span><</replace>><<next `(1/$wps + 0.5) + "s"`>><<replace "#line9">><span id="line10" t8n>slap the ice,</span><</replace>><<next `(3/$wps + 0.5) + "s"`>><<replace "#line10">><span id="line11" t8n>hoping for purchase, </span><</replace>><<next `(3/$wps + 0.5) + "s"`>><<replace "#line11">><span id="line12" t8n>something to lift you out of harm's way,</span><</replace>><<next `(8/$wps + 0.5) + "s"`>><<replace "#line12">><span id="line13" t8n>but your hands slip and the slick surface smacks you back into the freezing water. </span><</replace>><<next `(15/$wps + 0.5) + "s"`>><<replace "#line13">><span id="line14" t8n>but your hands slip and the slick surface smacks you back into the freezing water. </span><</replace>><<next `(15/$wps + 0.5) + "s"`>><<replace "#line14">><span id="line15" t8n>You can see firelight glinting off the ice-cutting blade. </span><</replace>><<next `(9/$wps + 0.5) + "s"`>><<replace "#line15">><span id="line16" t8n>It towers above you,
and you flail backwards desperately,
but its approach is unwavering, </span><</replace>><<next `(14/$wps + 0.5) + "s"`>><<replace "#line16">><span id="line17" t8n>closer and closer,</span><</replace>><<next `(3/$wps + 0.5) + "s"`>><<replace "#line17">><span id="line16" t8n>until with it directly above, </span><</replace>><<next `(4/$wps + 0.5) + "s"`>><<replace "#line16">><span id="line17" t8n>there is only </span><</replace>><<next `(3/$wps + 0.9) + "s"`>><<replace "#line17">><span id="line18" t8n>one</span><</replace>><<next `(1/$wps + 0.5) + "s"`>><<replace "#line18">><span id="line19" t8n>[[option.|Page 29]]</span><</replace>>
<</timed>>
</div>
<<fadein 2s>>You hold a huge breath, and<</fadein>>
<span id="middle1" class="slow-hidden">sink beneath the ice itself, swimming away from the approaching blade.</span>
<span id="middle2" class="slow-hidden">Try not to panic when your head knocks against the ice floe above.</span>
<<timed `(5/$wps + 0.5) + "s"`>><<addclass "#middle1" "fade-in">><<next 1s>><<audio "hellpanel5" play>><<audio "underwater" volume 1 fadeoverto 10 0.5>><<audio "hellpanel4-1" fadeoverto 2 0>><<next `(10/$wps + 0.5) + "s"`>><<addclass "#middle2" "fade-in">><<next `(14/$wps) + "s"`>><<removeclass "#middle1" "fade-in">><<next `(14/$wps) + "s"`>><<removeclass "#middle2" "fade-in">><<next `(14/$wps + 0.5) + "s"`>><<addclass "#bottom" "fade-in">><</timed>>
<span id="bottom" class="slow-hidden">The cold pierces your temples; it feels like the bones of your face are collapsing, while some unknown force pulls your lungs down through your feet and into the darkness <<link "below.">></span><<replace "#bottom" t8n>><span class="fadein"><br>This cannot last longer than a few <<link [[moments.|Page 30]]>><<audio "hellpanel6" play>><</link>></span><</replace>><</link>>
<span id="first" class="hidden">It doesn't.</span><span id="second" class="hidden"> Glinting light,</span><span id="third" class="hidden"> a dull cracking,</span><span id="fourth" class="hidden"> and a pulse in the water.</span><span id="fifth" class="hidden"> A subtle but certain shift in the underwater gloam.</span><span id="sixth" class="hidden"> You reach up with a hand and feel a fissure.</span><span id="seventh" class="hidden"> With joy, you slip your fingers into it, and wriggle your hand up through the ice.</span><span id="eigth" class="hidden"> Your other arm follows, splitting open a crevice big enough to crawl through.</span><span id="ninth" class="hidden"> In moments you are back above water, watching a pair of kicking legs drive the ice cutting blade into the</span>
<span id="tenth" class="hidden">distance.</span>
<span id="11" class="hidden">Your head knocks against something hollow. </span><span id="12" class="hidden"> Wood.</span><span id="13" class="hidden"> The boat — you turn and a hand is reaching down towards you you.</span><span id="14" class="hidden"> You grasp it, allow yourself to be [[pulled up on to the deck.|Page 31]]</span>
<<timed 0.5s>><<audio "hellpanel5" volume 1 fadeoverto 4 0>>
<<next `(2/$wps) + "s"`>><<addclass "#second" "fade-in">><<next `(2/$wps + 1) + "s"`>><<addclass "#third" "fade-in">><<next 1s>><<removeclass "#second" "fade-in">><<next `(3/$wps) + "s"`>><<addclass "#fourth" "fade-in">><<next `(3/$wps + 0.5) + "s"`>><<removeclass "#third" "fade-in">><<next `(6/$wps) + "s"`>><<addclass "#fifth" "fade-in">><<next `(6/$wps + 0.5) + "s"`>><<removeclass "#fourth" "fade-in">><<next `(9/$wps) + "s"`>><<addclass "#sixth" "fade-in">><<next `(9/$wps + 0.5) + "s"`>><<removeclass "#fifth" "fade-in">><<next `(10/$wps) + "s"`>><<addclass "#seventh" "fade-in">><<audio "hellpanel7" play>><<audio "underwater" volume 0.5 fadeoverto 5 0>><<next `(10/$wps + 0.5) + "s"`>><<removeclass "#sixth" "fade-in">><<next `(16/$wps + 0.5) + "s"`>><<addclass "#eigth" "fade-in">><<next `(16/$wps) + "s"`>><<removeclass "#seventh" "fade-in">><<next `(12/$wps) + "s"`>><<addclass "#ninth" "fade-in">><<next `(12/$wps + 0.5) + "s"`>><<audio "hellpanel8-1" play>><<removeclass "#eigth" "fade-in">><<next `(20/$wps) + "s"`>><<addclass "#tenth" "fade-in">><<next `(1/$wps + 2) + "s"`>><<addclass "#11" "fade-in">><<next `(1/$wps + 2) + "s"`>><<removeclass "#ninth" "fade-in">><<next `(1/$wps + 1.5) + "s"`>><<removeclass "#tenth" "fade-in">><<next `(1/$wps + 1) + "s"`>><<addclass "#12" "fade-in">><<next `(1/$wps + 1) + "s"`>><<addclass "#13" "fade-in">><<next `(1/$wps + 1) + "s"`>><<addclass "#14" "fade-in">>
<</timed>><span id="3" class="hidden"><<link [[A hand removes the hood.|Page 32]]>><<audio "hellpanel9-1" play>><</link>></span>
<span id="2" class="hidden">A hooded figure hovers above you, round, broad shoulders silhouetted against the sky.</span>
<span id="1" class="hidden">Shivering, flat on your stomach, covered in a blanket, unsure of how you arrived in exactly this arrangement. Twist and look up:</span>
<<timed 0.5s>><<addclass "#1" "fade-in">>
<<next `(22/$wps) + "s"`>><<addclass "#2" "fade-in">>
<<next `(35/$wps) + "s"`>><<addclass "#3" "fade-in">>
<</timed>><span id="1" class="hidden">You leap up to embrace her, but she pulls away, holding a hand in front of her, keeping you at arm's length. The message is clear:</span>
<p id="2" style="text-align:center" class="hidden">Don't touch her.</p>
<span id="3" class="hidden">Same tangle of stringy, blonde hair; same round face. You shrug, and wave ironically: Well, hi. An awkward silence follows, so you open your mouth to ask: Are you okay? But the words don't come out. [[Only shapes.|Page 33]]</span>
<<timed 0.5s>><<addclass "#1" "fade-in">>
<<next `(26/$wps) + "s"`>><<addclass "#2" "fade-in">>
<<next `(26/$wps) + "s"`>><<removeclass "#1" "fade-in">>
<<next `(6/$wps) + "s"`>><<addclass "#3" "fade-in">>
<<next `(36/$wps) + "s"`>><<removeclass "#2" "fade-in">>
<</timed>>
<<fadein 2s>>You lie back in the boat and take in the surroundings, gesturing with one hand:<</fadein>>
<div style="text-indent:15%"><<fadein 2s `(15/$wps) + "s"`>>Nice spot you got here.<</fadein>></div> <<fadein 1.5s `(21/$wps) + "s"`>>(A bipedal platypus with arrows lodged in its heel ice-skates past a disembodied head.)<</fadein>>
<<fadein 1s `(36/$wps + 1) + "s"`>>. . .<</fadein>>
<<fadein 1.3s `(36/$wps + 2) + "s"`>>. . .<</fadein>>
<div style="text-indent:15%"><<fadein 1.2s `(36/$wps + 3) + "s"`>>. . .<</fadein>>
<div style="text-indent:30%"><<fadein 1.1s `(36/$wps + 3.9) + "s"`>>. . .<</fadein>>
<div style="text-indent:45%"><<fadein 1s `(36/$wps + 4.8) + "s"`>>. . .<</fadein>>
<div style="text-indent:60%"><<fadein 0.8s `(36/$wps + 5.7) + "s"`>>. . .<</fadein>>
<div style="text-indent:50%"><<fadein 0.8s `(36/$wps + 6.5) + "s"`>>. . .<</fadein>>
<div style="text-indent:35%"><<fadein 0.8s `(36/$wps + 7.3) + "s"`>>. . .<</fadein>>
<div style="text-indent:25%"><<fadein 1s `(36/$wps + 8.5) + "s"`>>. . .
<</fadein>>
<<fadein 4s `(36/$wps + 10) + "s"`>><<link [[She hands you a paddle.|TRANS4]]>><<audio "hellpanel10" play>><<audio "hellpanel9-1" volume 1 fadeoverto 15 0>><</link>><</fadein>>
</div><<timed 4s>><<goto "TRANS4 cont.">><</timed>><<timed 3s>><<goto "Page 34">><</timed>><span id="1" class="hidden"> The boat nearly capsizes when passing back beneath the waterfall, but it stays afloat, and together you row upstream, with increasing desperation, until you arrive back in the sunlit pastures, surrounded by ruminants and naked humans.</span>
<span id="2" class="hidden"> Exhausted, you manoeuvre towards the shore. Then, without warning,</span><span id="3" class="hidden"> she leaps out,</span><span id="4" class="hidden"> and runs through the shallow surf,</span> <span id="5" class="hidden">across the spongy grass,</span> <span id="6" class="hidden"> and towards the woods [[beyond.|Page 35]]</span>
<<timed 0.5s>><<addclass "#1" "fade-in">>
<<next `(23/$wps) + "s"`>><<audio "outside" volume 0 fadeoverto 5 0.75>>
<<next `(13/$wps) + "s"`>><<addclass "#2" "fade-in">>
<<next `(9/$wps) + "s"`>><<removeclass "#1" "fade-in">>
<<next `(9/$wps) + "s"`>><<removeclass "#2" "fade-in">>
<<next `(9/$wps + 0.7) + "s"`>><<audio "splash" play>><<next 1s>><<addclass "#3" "fade-in">><<audio "hellpanel11" play>><<run setTimeout(function () { $.wiki('<<audio "hellpanel11" fadeout>>'); }, 11000)>>
<<next `(3/$wps + 1.5) + "s"`>><<addclass "#4" "fade-in">><<audio "footsteps-20" play>>
<<next `(6/$wps) + "s"`>><<addclass "#5" "fade-in">>
<<next `(4/$wps) + "s"`>><<addclass "#6" "fade-in">>
<</timed>><<fadeLine 3s>>You watch her growing smaller until the trees swallow her like a speck.
<br>
<<nextLine>>She will stay here, she can only stay here, suspended in this place of nightmare and dream.
<br>
<<complete>>Gazing down into the water, so clear you can see your reflection through its soft, blue filter, you know <<link [[your time will come.|Page 36]]>><<audio "artgallerybusy" volume 0 fadeoverto 10 0.4>><<audio "outside" volume 0.75 fadeoverto 5 0>><</link>>
<</fadeLine>>
<<audio "hellpanel12" volume 0 fadeoverto 7 1>>
<span id="last" class="hidden">When it does, you will find yourself back in the gallery, subsumed in that same headphone-wearing crowd, except there is a hand on your shoulder, and when you turn around and see the guard, he looks you in the eye and says,</span>
<<timed 0.1s>><<addclass "#last" "fade-in">>
<<audio "hellpanel7" fadeout>>
<<audio "hellpanel12" fadeout>>
<<next `(43/$wps) + "s"`>><<audio "guard4" play>>
<<next 9s>><<removeclass "#last" "fade-in">>
<<next 2s>><<goto "Page 37">>
<</timed>><span id="end" class="highLight hidden"> The End </span>
<<timed 0.1s>><<addclass "#end" "fade-in">>
<<next 7s>><<removeclass "#end" "fade-in">>
<<next 2s>><<goto Credits>><</timed>>
<<audio "artgallerybusy" fadeoverto 10 0>><<timed 2s>><<goto "ACT 2 IMAGE">><</timed>>
<<run setTimeout(UInv.cacheImages("Images/", ["Garden1 copy.jpg", "Adam and Eve717.jpg", "birds.jpg", "hell.jpg", "Hellpanelfull250.jpg", "Bluebird.jpg", "impaled.jpg", "Mutant.png", "Eggshellman.png", "Hellpaneltop.png"]), 1000)>><span id="line1">A crackle, a snapping.</span><<timed `(4/$wps + 0.5) + "s"`>><<replace "#line1">><span id="line2">You look around and see,</span><</replace>><<next `(5/$wps + 0.5) + "s"`>><<replace "#line2">><span id="line3">straight ahead,</span><</replace>>
<<next `(2/$wps + 0.5) + "s"`>><span id="line4"> a sharp, steel blade,</span><<next `(4/$wps + 0.5) + "s"`>> tall as a skyscraper,<<next `(4/$wps + 0.5) + "s"`>><span id="line5"> cutting through the ice, </span><<next `(4/$wps + 0.5) + "s"`>><span id="line6"> directly</span>
<<next `(1/$wps + 0.5) + "s"`>><<replace "#line6">><span id="line7">towards</span><</replace>>
<<next `(1/$wps + 1) + "s"` t8n>><span id="line8" t8n>You</span><<next `(1/$wps + 1) + "s"`>><span id="line9" t8n> slap the ice</span><<next `(0.5/$wps + 0.5) + "s"`>><<replace "#line9">><span id="line10" t8n> slap the ice,</span><</replace>><<next `(3/$wps + 0.5) + "s"`>><<replace "#line10">><span id="line11" t8n>, hoping for purchase </span><</replace>><<next `(0.5/$wps + 0.8) + "s"`>><<replace "#line10">><span id="line11" t8n>, hoping for purchase,</span><</replace>><<next `(3/$wps + 0.7) + "s"`>><span id="line12" t8n> something to lift you out of harm's way</span><<next `(5/$wps + 0.6) + "s"`>><span id="line12" t8n>.</span><<next `(8/$wps + 0.5) + "s"`>> But your hands slip<<next `(4/$wps + 0.5) + "s"`>> and the slick surface <<next `(4/$wps + 0.5) + "s"`>>smacks you back <<next `(3/$wps + 0.5) + "s"`>>into the freezing water.
<<next `(15/$wps + 1) + "s"`>><span id="line14">You can see firelight glinting off the ice-cutting blade.</span>
<<next `(9/$wps + 0.5) + "s"`>><span id="line15">It towers above you, and you flail backwards desperately, </span><<next `(10/$wps + 0.5) + "s"`>><span id="line16"> but its approach is unwavering, </span><<next `(4/$wps + 0.5) + "s"`>><<replace "#line16">><span id="line17" t8n>closer and closer,</span><</replace>><<next `(3/$wps + 0.5) + "s"`>><<replace "#line17">><span id="line18">until with it directly above,</span><</replace>>
<<next `(5/$wps + 0.5) + "s"`>><<replace "#line18">><span id="line19" t8n> there</span><</replace>><<next `(3/$wps) + "s"`>><<replace "#line19">><span id="line20" t8n> is</span><</replace>><<next `(3/$wps) + "s"`>><<replace "#line19">><span id="line20" t8n> only</span><</replace>><<next `(3/$wps) + "s"`>><<replace "#line19">><span id="line20" t8n> one</span><</replace>>
<<next `(3/$wps) + "s"`>><<replace "#line20">> <</replace>><<next `(2/$wps + 0.5) + "s"`>><<fadein 2s>>[[there is only one option.|Page 29]]<</fadein>>
<</timed>>
<div id="credits"><<fadein 3s 2s>><span class="highLight">The Garden</span><</fadein>>
<<fadein 3s 3s>>Written by B J T Samuels<</fadein>>
<<fadein 3s 4s>>Music by Robert Wicks<</fadein>>
<<fadein 3s 5s>>Spatial Audio Design by Henrik Oppermann<</fadein>>
<<fadein 3s 6s>>Voices by Claire Lacey and Jaime Zubari<</fadein>>
<<fadein 3s 7s>>Developed in Twine by Ben Samuels<</fadein>>
<<fadein 3s 7.5s>>Design by Alfón Pérez Gómez and Elena Marticorena<</fadein>>
<<fadein 3s 8s>>Supported by NESTA Alternarratives<</fadein>>
<<fadein 3s 9s>>With thanks to Rachel Bull, Peter Bennett, Kate Pullinger, Amy Spencer, Josh Samuels, Vera Mina Samuels, Gaël Le Cornec, and the Interactive Fiction Forum — HiEV, TheMadExile, tayruh, Chapel, Greyelf.<</fadein>></div>
<<timed 14s>><<addclass "#credits" "fadeout">>
<<next 2.5s>><<goto "Return">>
<</timed>>
<<audio "hellpanel12" fadein>><h1 class="fadein">The Garden</h1><h2><<timed 2s t8n>>A short story with sound <</timed>></h2>
<div style="text-align:center;"><span class="btnBorder"><<timed 4s t8n>>[[Enter|On-board 0.5]]<</timed>></span></div>
<div style="font-size:75%">The Garden runs best in Chrome or Firefox.
If you are viewing this on an iPad, please re-open the website on an alternate device, as iPad does not support the audio for this project.
If you are viewing this on any other mobile device, please make sure this page is open on your device's full browser app. Otherwise, you may encounter issues with the sound playback. To access your full browser app, click the 3 dots in the top right hand corner of the screen, and then "open in browser."
<img src="Images/androidopen.png">
If sound drops out during the project, try clearing the cache and reloading the page.
<span class="btnBorder">[[Continue|On-board 1]]</span>
</div>
<div id="painting" class="hidden">
<<link [img[Images/Garden1 copy.jpg][Page 7]]>><<removeclass "#painting" "fade-in">><</link>>
</div>
<<timed 0.5s>><<addclass "#painting" "fade-in">><</timed>>
<<audio "drone" unloop>>
<<audio "drone" fadeoverto 10 0>>
<<timed 2s>><<audio "artgallerybusy" volume 0 fadeoverto 10 1>><</timed>>
<<fadein 3s>><img src="Images/Limbik_Logo_small.png">
Share, rate and provide feedback via
<span class="btnBorder">[[BBC Taster|https://www.bbc.co.uk/taster/pilots/the-garden]]</span>
or
<span style="font-size:75%"><span class="btnBorder"><<link [[Replay Story|TITLE PAGE]]>><<audio "hellpanel12" fadeout>><</link>></span>
(Make sure to clear your browser's cache and refresh the page, before replaying the story)
</span><</fadein>>
<<audio "hellpanel12" fadeoverto 10 0>>
<div style="font-size:85%">Check the volume on your device. If that doesn't work, try clearing the cache on your browser and refreshing the page.
If neither of those work... Apologies! Some devices are not able to access the audio for this story. Please try opening this page on another device, using the link below. Any desktop or laptop computer should work, as will more recent phones and tablets.
We recommend opening the story in Chrome or Firefox.
If after opening on a new device, you still experience the sound playing intermittently, or dropping out, please try clearing the cache on your browser and reloading the page.
<<link [[http://limbiktheatre.com/the-garden/The_Garden.html|TITLE PAGE]]>><<audio "onboard" fadeout>><</link>>
Thanks!
</div>