You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

166 lines
6.8 KiB
HTML

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Count On Me</title>
<meta name="description" content="XPUB">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="../notitleyet/main.css">
<link rel="stylesheet" href="../notitleyet/style.css">
<link rel="icon" href="img/Crypto.png" type="img/Crypto.png" />
</head>
<body>
<div id='wrapper'></div>
<a href='../' id='homebttn' class='ext'> &#9746</a>
<header>
<h1 id='project-title'>Count On Me <a href='#hleft-text' class='show'> &#8645</a></h1>
<h2 id='student-name'>Martin Foucaut</h2>
<div id='hleft-text'>
<a href=# id='back'>
<div id='inner-hleft-text'>
<div id='ihtp'>
<object>
<div id='about-project'>
<p>&#129122 I am <i>Count on me</i>, an interactive installation speculating on the study and marketisation of human behavioural data in physical spaces.
When I detect you, your position in space is simultaneously translated into information, interactions and &#8645* earnings/losses. During your journey through 8 different levels, you will be consciously participating to the commodification of your own existence!
<br><br>
In order to maximise “earnings”, you will have to keep letting me detect you, find the most lucrative positions and act accordingly to the instructions displayed on the screen.
Each micro-task successfully performed will allow you to unlock new data-driven interfaces. Once you exit the session for more than 5 seconds, your &#8645 earnings are automatically converted into euros according to the exchange rates.** ***
<br><br>
So, what are you waiting for?<br>
Start counting today and you can count on me!
<br><br>
* &#8645 = crypto-currency<br>
** see level 1: Stock ticker<br>
*** avg.ratio &#8645 1 ≈ € 0.0001 <br>
<br>
<br>
</p>
</div>
<br><br>
<div id='about-student'>
<p>&#129122 Martin Foucaut is a freelance graphic designer based in Rotterdam, NL. Next to his professional practice ,
Martin is conducting a research about new media that involves writing, coding and installation works.<br><br><br><br><br><br><br><br><br><br><br><br>
</p>
</div>
<a id='getback' class='int'> go back </a>
</object>
</div>
</a>
</div>
</header>
<section id='main'>
<div id="galleries">
<div id='work'>
<h3 class='gal-title'><div id='about-project'>
<a href='https://project.xpub.nl/notitleyet/pdf/Martin_Foucaut_Graduation_Thesis_XPUB_2022.pdf' target="_blank" class='ext'>Publication</a> &#129122
<a href='https://editor.p5js.org/MartinF/full/ASFk-WPHH' target="_blank" class='ext'>Project</a> &#129122
<a href='https://editor.p5js.org/MartinF/sketches/ASFk-WPHH' target="_blank" class='ext'>Code</a> &#129122
<a href='https://pzwiki.wdka.nl/mediadesign/XPUB2_Research_Board_/_Martin_Foucaut' target="_blank" class='ext'>Board</a>
</div></h3>
<div id="myGallery">
<figure tabindex="0">
<p class="fade-in">hover me</p>
<img src="img/01_StockTicker.png" title="Level 1: Stock Ticker" alt="" class='still'/>
<img src="img/gif/01_StockTicker.gif" title="Level 1: Stock Ticker" alt="" class='workimg'/><figcaption>Level 1: Stock Ticker (hover to preview)</figcaption>
</figure>
<figure tabindex="0">
<p class="fade-in">hover me</p>
<img src="img/02_SlotMachine.png" title="Level 2: Slot Machine" alt="" class='still'/>
<img src="img/gif/02_SlotMachine.gif" title="Level 2: Slot Machine" alt="" class='workimg'/><figcaption>Level 2: Slot Machine (hover to preview)</figcaption>
</figure>
<figure tabindex="0">
<p class="fade-in">hover me</p>
<img src="img/03_SelfTracker_01.png" title="Level 3: Self-Tracker" alt="" class='still'/>
<img src="img/gif/03_SelfTracker_01.gif" title="Level 3: Self-Tracker" alt="" class='workimg'/><figcaption>Level 3: Self-Tracker (hover to preview)</figcaption>
</figure>
<figure tabindex="0">
<p class="fade-in">hover me</p>
<img src="img/04_SelfTracker_02.png" title="Level 4: Self-Tracker" alt="" class='still'/>
<img src="img/gif/03_SelfTracker_02.gif" title="Level 4: Self-Tracker" alt="" class='workimg'/><figcaption>Level 4: Self-Tracker (hover to preview)</figcaption>
</figure>
<figure tabindex="0">
<p class="fade-in">hover me</p>
<img src="img/05_Livestream_02.png" title="Level 5: Livestream" alt="" class='still'/>
<img src="img/gif/05_Livestream_02.gif" title="Level 5: Livestream" alt="" class='workimg'/><figcaption>Level 5: Livestream (hover to preview)</figcaption>
</figure>
<figure tabindex="0">
<p class="fade-in">hover me</p>
<img src="img/06_Captcha.png" title="Level 6: Captcha" alt="" class='still'/>
<img src="img/gif/06_Captha.gif" title="Level 6: Captcha" alt="" class='workimg'/><figcaption>Level 6: Captcha (hover to preview)</figcaption>
</figure>
<figure tabindex="0">
<p class="fade-in">hover me</p>
<img src="img/07_SelfRegister.png" title="Level 6: Self Scanning" alt="" class='still'/>
<img src="img/gif/07_SelfRegister.gif" title="Level 6: Self Scanning" alt="" class='workimg'/><figcaption>Level 6: Self Scanning (hover to preview)</figcaption>
</figure>
<figure tabindex="0">
<p class="fade-in">hover me</p>
<img src="img/08_GPS_01.png" title="Level 7: GPS" alt="" class='still'/>
<img src="img/gif/08_GPS_01.gif" title="Level 7: GPS" alt="" class='workimg'/><figcaption>Level 7: GPS (hover to preview)</figcaption>
</figure>
<figure tabindex="0">
<p class="fade-in">hover me</p>
<img src="img/000_Exit.png" title="Exit" alt="" class='still'/>
<img src="img/gif/000_Exit.gif" title="Exit" alt="" class='workimg'/><figcaption>Exit (Not detected for 5sec) (hover to preview)</figcaption>
</figure>
<figure tabindex="0">
<img src="img/Schema_Martin_01.png" title="Materials" alt="" class='workimg'/><figcaption>Material list (doesnt include computer)</figcaption>
</figure>
<figure tabindex="0">
<img src="img/Schema_Martin_02.png" title="Assembling" alt="" class='workimg'/><figcaption>Assembled installation</figcaption>
</figure>
<figure tabindex="0">
<img src="img/Schema_Martin_03.png" title="Instructions" alt="" class='workimg'/><figcaption>Instructions</figcaption>
</figure>
<figure tabindex="0">
<img src="img/Schema_Martin_04.png" title="Soluce" alt="" class='workimg'/><figcaption>Soluce (stage 1—4)</figcaption>
</figure>
<figure tabindex="0">
<img src="img/Schema_Martin_05.png" title="Soluce" alt="" class='workimg'/><figcaption>Soluce (stage (5—8)</figcaption>
</figure>
</div>
<!---
<img src="img/01_StockTicker.gif" class='workimg'/>
<img src="img/02_SlotMachine.gif" class='workimg'/>
<img src="img/03_SelfTracker_01.gif" class='workimg'/>
<img src="img/03_SelfTracker_02.gif" class='workimg'/>
<img src="img/08_GPS_01.gif" class='workimg'/>
<img src="img/07_SelfReister.gif" class='workimg'/>
<img src="img/000_Exit.gif" class='workimg'/> -->
</div>
</ul>
</div>
<div id='gradshow'>
<h3 class='gal-title'>Graduation Show (Soon)</h3>
</div>
</div>
</section>
</div>
</body>
</html>