XPUB
/
SI24
19
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

include some counters

Browse Source
main
vitrinekast 5 months ago
parent a9957cede5
commit 11852d1333
2 changed files with 228 additions and 184 deletions
Show Stats Download Patch File Download Diff File

349
web/index.html
Unescape Escape View File

@ -32,41 +32,44 @@
<div class="imagedescription">Explore Rotterdam in new ways | photo Person With a Smartphone</div>
</div>
<div class="index">
<h1>Counter Tourist Information</h1>
<h1><span class="counter">Counter</span> Tourist Information</h1>
<p>
Welcome to the pop-up Counter-Tourist Information Center! The only place in Rotterdam that offers a unique
Welcome to the pop-up <span class="counter">Counter</span>-Tourist Information Center! The only place in
Rotterdam that offers a unique
personalized view of the city.
Do you want to experience the city—without being a nuisance to residents—as a local Rotterdammer would? Wait
no more! Drop by the Counter-Tourist Information Center for all things authentic Rotterdam: loitering,
no more! Drop by the <span class="counter">Counter</span>-Tourist Information Center for all things
authentic Rotterdam: loitering,
littering and anti model-citizen etiquette. We offer personalized guides and blending-in equipment.
<br><br>
</p>
<p>
Our personnel is always present to provide advice catered to your interests and concerns.
<br><br>
</p>
<address>
Opening Thursday 27th at 19.00h<br>
27th–30th June<br>
@ Worm Slash Gallery,<br>
Boomgaardsstraat 69, 3012 XA Rotterdam
<br><br>
</address>
</p>
</div>
<div class="container" id="surroundings">
<section>
<h2>UnDiscover Rotterdam</h2>
<p>Our tips for an uneventful stay in Rotterdam</p>
<p>Our tips for an uneventful stay in Rotterdam</p>
</section>
<div class="tours">
<div class="tourcard">
<img src="images/breda.JPG" alt="">
<div class="tour-text">
<b>POINXS [Points of InAccess]</b>
<h4>POINXS [Points of InAccess]</h4>
<p>A critical counter map looking at city marketing & planning versus the city living and
experience. It's a parody on postcard surreality and apps/websites portraying cool and flashy
2D/3D imagery without the complicated dimensions of the city without showing what's behind the
scenes.
<br>
<br>
Rotterdam is 'back on the map'. POINXS questions that map and looks at a city that has become
scenes.</p>
<p> Rotterdam is 'back on the map'. POINXS questions that map and looks at a city that has become
less livable and affordable and reports the bugs from a hill that leads to a dead end pavement,
via private transport to wheelchair inaccessible hotspots with ambitions to become a multi-user
platform for reporting other people's POINXS.
@ -76,7 +79,7 @@
<div class="tourcard">
<img src="images/breda.JPG" alt="">
<div class="tour-text">
<b>Fly on the Wall</b>
<h4>Fly on the Wall</h4>
<p>This is a device built to counter mosquito devices and prolong possible periods of loitering.
Mosquito devices emit high frequencies and are installed by private companies and individuals to
specifically target and drive away youth from hanging out. They can cause nausea, ear pain and
@ -89,14 +92,14 @@
<div class="tourcard">
<img src="images/breda.JPG" alt="">
<div class="tour-text">
<b>Ministry of the Infraordinary</b>
<h4>Ministry of the Infraordinary</h4>
<p>The Ministry of the Infraordinary invites you to experience the city of Rotterdam in ways you
haven't imagined. Let the subjective infrastructure map inspire and guide you and search for
views you haven't seen before, look up and under, listen carefully for the subtler sounds of
life, consider your place and your role in this network of cables, waves and invisible
connections and contribute to the photo map that aspires to make the city our own.
<br>
<br>
</p>
<p>
At the Ministry of the Infraordinary, we are concerned with noticing the subtle fabric that
makes up our urban surroundings. Using qualitative and generous methods to interrogate the
ever-changing ecosphere that constitute our cities. Working in close relation with partners such
@ -108,7 +111,7 @@
<div class="tourcard">
<img src="images/breda.JPG" alt="">
<div class="tour-text">
<b>INTIMACITY</b>
<h4>INTIMACITY</h4>
<p>INTIMACITY is an installation art piece that explores the relationship between people and the
intimacy of the city. It blurs the boundaries and distinction of public and private spaces.
The installation is composed of a semi-transparent mesh mosquito net, stitched together with
@ -124,7 +127,7 @@
<div class="tourcard">
<img src="images/breda.JPG" alt="">
<div class="tour-text">
<b>Collective Nearby Diary</b>
<h4>Collective Nearby Diary</h4>
<p>A collection of publications includes autoethnography works exploring "why I like loitering" and
components that inspire individuals and groups to envision and depict their ideal "nearby".
"Nearby" not only refers to geographical proximity but also to the closeness of emotional and
@ -136,7 +139,7 @@
<div class="tourcard">
<img src="images/breda.JPG" alt="">
<div class="tour-text">
<b>re-secure</b>
<h4>re-secure</h4>
<p>In today's cities, surveillance systems are often touted as indispensable elements of urban
security. Yet, despite the widespread use of these technologies over the past decades, many
people, especially women, still feel unsafe in public spaces, particularly at night.
@ -150,16 +153,16 @@
<div class="tourcard">
<img src="images/breda.JPG" alt="">
<div class="tour-text">
<b>Checking point</b>
<h4>Checking point</h4>
<p>In games, checking points are saving the player’s state, so they could resume the point if they
fail.
<br>
<br>
</p>
<p>
Checking point is a map about the camera zones in the city, related to the checking points in
the games, using the camera zone as a checking point to connect the path, also explore the
relationship between the player and the people behind the monitor.
<br>
<br>
</p>
<p>
In the map, the path that the player takes will leave no traces, but the camera zones will leave
traces as checkpoints that save the player's status. By accepting cookies, you will navigate
through various camera zones. You can do this by scanning QR codes or using GPS record settings
@ -171,7 +174,7 @@
<div class="tourcard">
<img src="images/breda.JPG" alt="">
<div class="tour-text">
<b>EmoHooHoo</b>
<h4>EmoHooHoo</h4>
<p>Specially designed for adults prone to embarrassment. EmoHooHoo supports the outward expression
of unspoken emotions in public places; once you wear this device, it clumsily reflects your
emotional changes, whether you like it or not. 💨💨💨
@ -185,19 +188,19 @@
<div class="tourcard">
<img src="images/breda.JPG" alt="">
<div class="tour-text">
<b>Scripts to Read the City</b>
<h4>Scripts to Read the City</h4>
<p>The project imagines an urban environment that can be read, analyzed and criticized as a text. By
reading the city in this way we find other possible ways of seeing, moving and listening. In a
scripted city, marked by escalating levels of perfection, efficiency and control, the
emancipatory aspects of urban life are undermined, allowing little room for anything that
doesn't fit the image of the "norm".
<br>
<br>
</p>
<p>
Scripts to Read the City is an attempt to foster diverse experiences and uses of space, similar
to a theater script interpreted differently by each actor. The tools of navigation are a device
indicating which character to play and a guide, including a set of directions and instructions.
<br>
<br>
</p>
<p>
The project explores a relation between scripts and spontaneity, chance and control and how
scripts and unpredictability can enhance each other, stimulating imagination, encouraging us to
engage with space from another perspective.
@ -208,7 +211,7 @@
<div class="tourcard">
<img src="images/breda.JPG" alt="">
<div class="tour-text">
<b>Portable Mosquito</b>
<h4>Portable Mosquito</h4>
<p>What if anti-loitering devices such as Mosquitos foregrounded dialogical, rather than monological
interaction? Mosquitos buzz away at the margins of perception: for some people the devices may
be inaudible, for others the noise may be incessant. Make a journey to the portable mosquito. It
@ -220,168 +223,168 @@
</div>
</div>
</div>
</div>
<div class="container reviews">
<div class="container reviews">
<section>
<section>
<section>
<h2>We are amazing</h2>
<p>But, don't listen to us! This is what our visitors said</p>
</section>
<h2>We are amazing</h2>
<p>But, don't listen to us! This is what our visitors said</p>
</section>
</section>
<div class="review">
<p>⭑✩✩✩✩</p>
<p>The Counter-Tourist Information Center is nothing more than a front. They receive funds from and
frequently collaborate with the Tourist Information Center. They aren't invested in helping people
have a more meaningful connection with the city, they just want to make money off of hype, same as
the Tourist Information Center... They're really part of a much larger issue. If you want to support
actual local businesses and not gentrify the area by being a tourist, stay away from this.
</p>
</div>
<div class="review">
<p>⭑⭑⭑⭑⭑</p>
<p>the counter tourist info center delivers on what it claims to offer: the possibility to go thru the
city as a local. no more of people looking at you strangely because your not familiar with the local
culture and traditions. with this center you not only get to blend in, but experience the city for
what it is to be!! even if it turn out to be a bit rotten. that's part of every city tho ;))
</p>
</div>
<div class="review">
<p>⭑⭑⭑✩✩</p>
<p>Got in here via a speakeasy. Had to knock 5 times saying "Feyenoord Attentie Sparta Buurtpreventie
Excelsior".
The person at the door said "What are you talking about?". I said "Why are you asking me that?" Door
person then replied: "Very well then." As soon as I got in, there were 5 shady figures standing in
line. They all had something to say or ask:
1. "How have you traversed here? Could you name 5 surveillance objects you've seen along your path?"
2. "How long will you be staying? When are you leaving? Isn't it time for you to go? Don't you have
a train toc catch?"
3. If you follow the trail of drops, you will be in the humid center of the area.
4. Does this place even exist? Are we in a movie? Are we being watched? What are you looking at?
Leave me alone
5. Rambled something about seamless peripheral derivé structurelessness, seemed confused
After those 5 blurbs I went to see if I could get a drink. I saw the bar in the distance and asked
for their brightest cup of water. The waiter looked suspicious and tapped 6 times on the bar. Out of
the blue, 7 gemeentewerkers en 3 bezoekers grabbed me by the shoulders and threw me out. The moment
I realized what happened I took my phone and started typing this rev- [redacted]</p>
</div>
<div class="review">
<p>⭑⭑⭑⭑⭑ </p>
<p> Comfort, Uncompromised Quality
Reviewed in Canada on January 8, 2024
Size: Queen Color: Navy Blue Verified Purchase
I recently acquired the Amazon Basics Light-Weight Microfiber Sheet Set, and it has exceeded my
expectations in more ways than one.
</p>
</div>
<div class="review">
<p>⭑⭑⭑⭑✩</p>
<p>The counter tourist info center offers me a free apple tart and coffee, so nice and friendly! Also,
the person told me about their secret local hotspots in Rotterdam.</p>
</div>
<div class="review">
<p>⭑✩✩✩✩</p>
<p>The Counter-Tourist Information Center is nothing more than a front. They receive funds from and
frequently collaborate with the Tourist Information Center. They aren't invested in helping people
have a more meaningful connection with the city, they just want to make money off of hype, same as
the Tourist Information Center... They're really part of a much larger issue. If you want to support
actual local businesses and not gentrify the area by being a tourist, stay away from this.
</p>
</div>
<div class="review">
<p>⭑⭑⭑⭑⭑</p>
<p>the counter tourist info center delivers on what it claims to offer: the possibility to go thru the
city as a local. no more of people looking at you strangely because your not familiar with the local
culture and traditions. with this center you not only get to blend in, but experience the city for
what it is to be!! even if it turn out to be a bit rotten. that's part of every city tho ;))
</p>
</div>
<div class="review">
<p>⭑⭑⭑✩✩</p>
<p>Got in here via a speakeasy. Had to knock 5 times saying "Feyenoord Attentie Sparta Buurtpreventie
Excelsior".
The person at the door said "What are you talking about?". I said "Why are you asking me that?" Door
person then replied: "Very well then." As soon as I got in, there were 5 shady figures standing in
line. They all had something to say or ask:
1. "How have you traversed here? Could you name 5 surveillance objects you've seen along your path?"
2. "How long will you be staying? When are you leaving? Isn't it time for you to go? Don't you have
a train toc catch?"
3. If you follow the trail of drops, you will be in the humid center of the area.
4. Does this place even exist? Are we in a movie? Are we being watched? What are you looking at?
Leave me alone
5. Rambled something about seamless peripheral derivé structurelessness, seemed confused
<div class="review">
<p>⭑⭑✩✩✩</p>
<p>Offers mid activities that confused me. Why are they based in a bakfiets?!? I just feel disoriented
</p>
</div>
After those 5 blurbs I went to see if I could get a drink. I saw the bar in the distance and asked
for their brightest cup of water. The waiter looked suspicious and tapped 6 times on the bar. Out of
the blue, 7 gemeentewerkers en 3 bezoekers grabbed me by the shoulders and threw me out. The moment
I realized what happened I took my phone and started typing this rev- [redacted]</p>
</div>
<div class="review">
<p>⭑⭑⭑⭑⭑ </p>
<p> Comfort, Uncompromised Quality
Reviewed in Canada on January 8, 2024
Size: Queen Color: Navy Blue Verified Purchase
I recently acquired the Amazon Basics Light-Weight Microfiber Sheet Set, and it has exceeded my
expectations in more ways than one.
</p>
</div>
<div class="review">
<p>⭑⭑⭑⭑✩</p>
<p>Turns out they don't Queensday anymore </p>
</div>
<div class="review">
<p>⭑⭑⭑⭑✩</p>
<p>The counter tourist info center offers me a free apple tart and coffee, so nice and friendly! Also,
the person told me about their secret local hotspots in Rotterdam.</p>
</div>
<div class="review">
<p>⭑⭑⭑✩✩</p>
<p>The 4-piece set includes a fitted sheet, flat sheet, and pillowcases – all essentials for a well-made
bed. The fitted sheet securely stays in place, ensuring a neat appearance and minimizing the hassle
of constant readjustment. The flat sheet and pillowcases complement the ensemble, offering a
cohesive and inviting look to my bed.</p>
</div>
<div class="review">
<p>⭑⭑✩✩✩</p>
<p>Offers mid activities that confused me. Why are they based in a bakfiets?!? I just feel disoriented
</p>
</div>
<div class="review">
<p>⭑⭑⭑⭑⭑</p>
<p>The Counter-Tourist Information Center opened my eyes to True Rotterdam. I was so tired of all the
other information centers, that promoted the Euromast and the Maritime Museum but tried to hide so
many things that constitute this unique urban experience, but now I am really informed and feel like
a local. More importantly, the Counter-Tourist Information Center changed the way I will look at
cities forever. Thank you Counter-Tourist Information Center! :* </p>
</div>
<div class="review">
<p>⭑⭑⭑⭑✩</p>
<p>Turns out they don't Queensday anymore </p>
</div>
<div class="review">
<p>⭑⭑⭑⭑✩ </p>
<p>They bring noisy devices everywhere thta they claim make 'human music', that only 'civil citizens'
can 'appreciate'. 4 out of 5 stars.</p>
</div>
<div class="review">
<p>⭑⭑⭑✩✩</p>
<p>The 4-piece set includes a fitted sheet, flat sheet, and pillowcases – all essentials for a well-made
bed. The fitted sheet securely stays in place, ensuring a neat appearance and minimizing the hassle
of constant readjustment. The flat sheet and pillowcases complement the ensemble, offering a
cohesive and inviting look to my bed.</p>
</div>
<div class="review">
<p>⭑⭑⭑⭑⭑</p>
<p>Geachte Contratoeristeninformatiecentrum Rotterdam, wij willen onze dank uitspreken richting Storm
die ons heeft geholpen met het vervangen van oude papieren cadeaubonnen alsmede het vervangen van
een geblokkeerde cadeaukaart.
Mvgr Jaap-Hendrik van Barendrecht-Doetinchem
</p>
</div>
<div class="review">
<p>⭑⭑⭑⭑⭑</p>
<p>The Counter-Tourist Information Center opened my eyes to True Rotterdam. I was so tired of all the
other information centers, that promoted the Euromast and the Maritime Museum but tried to hide so
many things that constitute this unique urban experience, but now I am really informed and feel like
a local. More importantly, the Counter-Tourist Information Center changed the way I will look at
cities forever. Thank you Counter-Tourist Information Center! :* </p>
</div>
<div class="review">
<p>⭑⭑⭑✩✩ </p>
<p>Update I showed human music to band practise and they really really like it. I think I will be
promoted from bass to guitar soon. 3 out of 5 stars.
</p>
</div>
<div class="review">
<p>⭑⭑⭑⭑✩ </p>
<p>They bring noisy devices everywhere thta they claim make 'human music', that only 'civil citizens'
can 'appreciate'. 4 out of 5 stars.</p>
</div>
<div class="review">
<p>⭑⭑⭑⭑⭑</p>
<p>Tot het Counter-Tourist Information Center op mijn pad kwam, wist ik niet eens dat ik verdwaald was!
2 jaar is voorbij gevlogen, merci!</p>
</div>
<div class="review">
<p>⭑⭑⭑⭑⭑</p>
<p>Geachte Contratoeristeninformatiecentrum Rotterdam, wij willen onze dank uitspreken richting Storm
die ons heeft geholpen met het vervangen van oude papieren cadeaubonnen alsmede het vervangen van
een geblokkeerde cadeaukaart.
Mvgr Jaap-Hendrik van Barendrecht-Doetinchem
</p>
</div>
<div class="review">
<p>⭑⭑⭑⭑✩</p>
<p>Update I got kicked out of band. Said Im never 'down to hang'. To whom I say well who is ever 'down'
to 'hang' nowadays? 'Where'? I ask you this. 4 out of 5 stars.</p>
</div>
<div class="review">
<p>⭑⭑⭑✩✩ </p>
<p>Update I showed human music to band practise and they really really like it. I think I will be
promoted from bass to guitar soon. 3 out of 5 stars.
</p>
</div>
<div class="review">
<p>⭑⭑⭑⭑✩</p>
<p>Turns out they don't Queensday anymore </p>
</div>
<div class="review">
<p>⭑⭑⭑⭑⭑</p>
<p>Tot het Counter-Tourist Information Center op mijn pad kwam, wist ik niet eens dat ik verdwaald was!
2 jaar is voorbij gevlogen, merci!</p>
</div>
<div class="review">
<p>⭑⭑⭑⭑✩</p>
<p>Update I got kicked out of band. Said Im never 'down to hang'. To whom I say well who is ever 'down'
to 'hang' nowadays? 'Where'? I ask you this. 4 out of 5 stars.</p>
</div>
<div id="events" class="container container--events">
<h2>Top 10 things to do</h2>
<ul class="events">
<li class="event">
<img src="images/breda.JPG" alt="" class="event__img">
<h3 class="event__title">1. The Counter-Tourist Information Center</h3>
</li>
<li class="event">
<img src="images/breda.JPG" alt="" class="event__img">
<h3 class="event__title">1. The Counter-Tourist Information Center</h3>
</li>
<li class="event">
<img src="images/breda.JPG" alt="" class="event__img">
<h3 class="event__title">1. The Counter-Tourist Information Center</h3>
</li>
<li class="event">
<img src="images/breda.JPG" alt="" class="event__img">
<h3 class="event__title">1. The Counter-Tourist Information Center</h3>
</li>
<li class="event">
<img src="images/breda.JPG" alt="" class="event__img">
<h3 class="event__title">1. The Counter-Tourist Information Center</h3>
</li>
</ul>
<div class="review">
<p>⭑⭑⭑⭑✩</p>
<p>Turns out they don't Queensday anymore </p>
</div>
<footer class="annoying">
Do you have our card already?
</footer>
</div>
<div id="events" class="container container--events">
<h2>Top 10 things to do</h2>
<ul class="events">
<li class="event">
<img src="images/breda.JPG" alt="" class="event__img">
<h3 class="event__title">1. The Counter-Tourist Information Center</h3>
</li>
<li class="event">
<img src="images/breda.JPG" alt="" class="event__img">
<h3 class="event__title">1. The Counter-Tourist Information Center</h3>
</li>
<li class="event">
<img src="images/breda.JPG" alt="" class="event__img">
<h3 class="event__title">1. The Counter-Tourist Information Center</h3>
</li>
<li class="event">
<img src="images/breda.JPG" alt="" class="event__img">
<h3 class="event__title">1. The Counter-Tourist Information Center</h3>
</li>
<li class="event">
<img src="images/breda.JPG" alt="" class="event__img">
<h3 class="event__title">1. The Counter-Tourist Information Center</h3>
</li>
</ul>
</div>
<footer class="annoying">
Do you have our card already?
</footer>
</body>

63
web/style.css
Unescape Escape View File

@ -25,9 +25,11 @@
/* overflow-x: hidden; */
box-sizing: border-box;
}
html {
scroll-behavior: smooth;
}
body {
font-family: Montserrat;
color: var(--black);
@ -48,9 +50,11 @@ body {
padding: .5rem;
}
.nav > * {
.nav>* {
margin: 0 0;
}
.nav a {
text-decoration: none;
color: inherit;
@ -98,6 +102,7 @@ h3 {
h1 {
font-size: clamp(1.5rem, 1rem + 9vw, 6rem);
margin: 0 0;
}
h2 {
@ -107,42 +112,55 @@ h2 {
p {
font-size: 18px;
margin-bottom: 1rem;
}
.index {
background: var(--green);
width: 100%;
padding: 2rem;
display: flex;
justify-content: center;
flex-direction: column;
}
.index>* {
padding: 2%;
max-width: 70ch;
text-align: center;
margin: auto;
margin-lefT: auto;
margin-right: auto;
}
.index:hover > * {
order: -1;
}
.tours {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
margin-top: 50px;
max-width: 2000px;
gap: 2rem;
display: grid;
grid-template-columns: 1fr 1fr;
grid-template-rows: min-content min-content min-content min-content;
grid-auto-rows: 300px;
transition: .2s linear;
}
.tourcard {
position: relative;
flex-basis: 50%;
max-width: 30%;
flex-grow: 1;
overflow: hidden;
}
@media only screen and (max-width: 801px) {
.tourcard {
flex-basis: 100%;
max-width: 100%;
.tours {
grid-template-columns: 1fr;
}
}
@ -159,8 +177,29 @@ p {
font-family: Montserrat;
font-size: .7em;
background: white;
max-height: 80%;;
}
.counter {
transform: scaleY(1);
transition: .2s linear;
display: inline-block;
cursor: pointer;
}
h1:has(.counter):hover .counter, p:has(.counter):hover .counter {
transform: scaleY(-1);
border-color: blue;
}
@media only screen and (max-width: 801px) {
.tourcard {
flex-basis: 100%;
max-width: 100%;
}
}
.reviews {
width: var(--container-lg);
text-wrap: wrap;
@ -272,11 +311,13 @@ footer.annoying {
padding: 0 0;
list-style: none;
}
.events .event {
overflow: hidden;
position: relative;
min-width: 300px;
}
.event img {
aspect-ratio: 3/4;
width: 100%;

Write Preview
Loading…
Cancel
Save