< html >
< head >
< meta charset = "UTF-8" >
< script src = "jquery-3.5.1.min.js" > < / script >
< style >
/*------------------------------------------------------------------------------------------------------------------------------------------------------------------------
--------------------------------------------------------------------PRINT----------------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
@page {
size: 420mm, 297mm;
margin: 0mm;
}
@media print {
@font-face {
font-family: 'Roboto';
src: url('Roboto-Regular.ttf');
}
@font-face {
font-family: 'Robotobold';
src: url('Roboto-Bold.ttf');
}
@font-face {
font-family: 'Robotomedium';
src: url('Roboto-Medium.ttf');
}
@font-face {
font-family: 'WFTF';
src: url('wftfs-Regular.otf');
}
@font-face {
font-family: 'EBGaramonditalic';
src: url('EBGaramond-MediumItalic.ttf');
}
@font-face {
font-family: 'EBGaramonditalicsemi';
src: url('EBGaramond-SemiBoldItalic.ttf');
}
@font-face {
font-family: 'EBGaramondregular';
src: url('EBGaramond-Medium.ttf');
}
@font-face {
font-family: 'Brut';
src: url('Brut_Grotesque-Text.otf');
}
@font-face {
font-family: 'Custom';
src: url('WFTF_custom-Regular.otf');
}
@font-face {
font-family: 'EBGaramondregularitalic';
src: url('EBGaramond-Italic.ttf');
}
body {
padding: 2mm;
margin-top: 0;
margin-left: 0;
margin-top: 0;
margin-left: 0;
width: 100%;
height: 100%;
text-align: left;
}
symbols {
font-size: 40pt;
line-height: 17pt;
font-family: 'WFTF';
}
symbol2 {
font-size: 36pt;
line-height: 17pt;
font-family: 'Custom';
}
indent {
color: blue;
text-align: left;
font-size: 17pt;
line-height: 19pt;
z-index: 300;
font-family: 'Roboto';
text-indent: 3mm;
}
.titlevertical {
writing-mode: vertical-rl;
display: none;
font-size: 48pt;
line-height: 100%;
position: fixed;
letter-spacing: normal;
font-family: 'Roboto';
bottom: 10mm;
right: 10mm;
margin-bottom: 10mm;
margin-left: 17mm;
margin-top: 0mm;
}
.titleitalic {
font-family: 'EBGaramondregularitalic';
font-size: 17pt;
position: fixed;
top: 70mm;
left: 0;
margin-bottom: 10mm;
margin-left: 10mm;
margin-top: 0mm;
margin-bottom: 10mm;
}
.titleverticalleft {
writing-mode: vertical-rl;
display: none;
font-size: 48pt;
line-height: 100%;
position: fixed;
letter-spacing: normal;
font-family: 'Roboto';
top: 10mm;
right: 10mm;
margin-bottom: 10mm;
margin-left: 10mm;
margin-top: 7mm;
margin-left: 0;
}
.title {
display: block;
font-size: 74pt;
line-height: 100%;
position: fixed;
letter-spacing: normal;
font-family: 'Roboto';
top: 0;
left: 0;
margin-bottom: 10mm;
margin-left: 9mm;
margin-top: 15mm;
margin-bottom: 10mm;
}
.title2 {
display: block;
font-size: 33pt;
line-height: 70pt;
position: fixed;
letter-spacing: normal;
font-family: 'Custom';
top: 0;
left: 0;
margin-bottom: 10mm;
margin-left: 10mm;
margin-top: 15mm;
margin-bottom: 10mm;
}
.titlebottom {
display: none;
font-size: 74pt;
line-height: 100%;
position: fixed;
letter-spacing: normal;
font-family: 'Roboto';
bottom: 0;
left: 0;
margin-left: 10mm;
letter-spacing: -1px;
}
symbol {
font-family: 'WFTF';
font-size: 16pt;
text-align: center;
margin-left: 5mm;
margin-right: 5mm;
line-height: 20pt;
}
h1 {
color: black;
text-align: left;
font-size: 32pt;
line-height: 34pt;
z-index: 300;
font-family: 'Roboto';
}
h2 {
color: black;
text-align: left;
font-size: 16pt;
line-height: 18pt;
z-index: 300;
font-family: 'Robotobold';
}
p {
text-indent: 7mm;
color: black;
text-align: left;
font-size: 11pt;
line-height: 13pt;
z-index: 300;
font-family: 'Roboto';
}
p2 {
text-indent: 10mm;
color: black;
text-align: left;
font-size: 11pt;
line-height: 13pt;
z-index: 300;
font-family: 'Roboto';
}
p3 {
color: black;
text-align: left;
font-size: 11pt;
line-height: 13pt;
z-index: 300;
font-family: 'Roboto';
}
p3special {
color: black;
text-align: left;
font-size: 11pt;
line-height: 13pt;
z-index: 300;
font-family: 'Roboto';
padding-right: 10mm;
}
line {
color: black;
text-align: left;
font-size: 11pt;
line-height: 13pt;
z-index: 300;
font-family: 'Roboto';
}
bold {
color: black;
text-align: left;
font-size: 173t;
line-height: 15pt;
z-index: 300;
font-family: 'Robotobold';
}
medium {
color: black;
text-align: left;
font-size: 11pt;
line-height: 13pt;
z-index: 300;
font-family: 'Robotomedium';
}
garamond {
font-family: 'EBGaramondregular';
}
brut {
font-family: 'Brut';
color: black;
text-align: left;
font-size: 13pt;
line-height: 15pt;
}
* {
box-sizing: border-box;
}
.row:after {
content: "";
display: table;
clear: both;
}
.column {
float: left;
padding: 100mm;
font-size: 24pt;
line-height: 28pt;
font-family: 'Roboto';
vertical-align:bottom;
}
.columnleft {
width: 25%;
margin-left: 10mm;
margin-top: 75mm;
margin-right: 5mm;
}
.columnmiddle {
width: 25%;
margin-top: 75mm;
}
.columnmiddle2 {
width: 25%;
margin-top: 75mm;
}
.columnright {
width: 25%;
margin-top: 10mm;
margin-right: 10mm;
}
italic {
font-family: 'EBGaramonditalicsemi';
font-size: 16pt;
line-height: 17pt;
margin-left: 5mm;
}
bigitalic {
text-indent: 30mm;
font-family: 'EBGaramondregularitalic';
font-size: 16pt;
line-height:18pt;
}
bigitalicregular {
text-indent: 30mm;
font-family: 'EBGaramondregularitalic';
font-size: 16pt;
/*font-size: 27pt;
line-height:29pt;*/
}
bigp {
text-indent: 7mm;
color: black;
text-align: left;
font-size: 11pt;
line-height: 13pt;
z-index: 300;
font-family: 'Roboto';
}
bigmedium {
text-indent: 7mm;
color: black;
text-align: left;
font-size: 11pt;
line-height: 13pt;
columns: 3 ;
z-index: 300;
font-family: 'Robotomedium';
}
bigregular {
color: black;
text-align: left;
font-size: 11pt;
line-height: 13pt;
word-break: break-word;
columns: 3 ;
z-index: 300;
font-family: 'Roboto';
}
.screen {
display:none;
}
}
/*------------------------------------------------------------------------------------------------------------------------------------------------------------------------
--------------------------------------------------------------------SCREEN----------------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen{
@font-face {
font-family: 'Roboto';
src: url('Roboto-Regular.ttf');
}
@font-face {
font-family: 'Robotobold';
src: url('Roboto-Bold.ttf');
}
@font-face {
font-family: 'Robotomedium';
src: url('Roboto-Medium.ttf');
}
@font-face {
font-family: 'WFTF';
src: url('wftfs-Regular.otf');
}
@font-face {
font-family: 'EBGaramonditalic';
src: url('EBGaramond-MediumItalic.ttf');
}
@font-face {
font-family: 'EBGaramonditalicsemi';
src: url('EBGaramond-SemiBoldItalic.ttf');
}
@font-face {
font-family: 'EBGaramondregular';
src: url('EBGaramond-Medium.ttf');
}
@font-face {
font-family: 'Brut';
src: url('Brut_Grotesque-Text.otf');
}
@font-face {
font-family: 'Custom';
src: url('WFTF_custom-Regular.otf');
}
body{
display: block;
margin-top: 10px;
margin-bottom: 10px;
margin-left: 10px;
margin-right: 10px;
text-align: left;
position: absolute;
background: black;
width: 98%;
}
symbol {
display: none;
}
h1 {
display: none;
position: fixed;
background: blue;
color: black;
font-family: helvetica;
text-align: left;
line-height: 110%;
font-weight: 900;
position: fixed;
margin-right: 10px;
margin-left: 10px;
margin-top: 10px;
margin-bottom: 10px;
top: 10px;
left: 10px;
z-index: 300;
}
.title {
display: none;
position: fixed;
font-size: 100px;
line-height: 100%;
font-family: 'Custom';
margin-bottom: 10px;
margin-left: 10px;
margin-top: 10px;
margin-bottom: 10px;
bottom: 0;
left: 0;
z-index: 100;
}
.titlevertical {
display: none;
position: fixed;
font-size: 100px;
line-height: 100%;
font-family: 'Roboto';
margin-bottom: 10px;
margin-left: 10px;
margin-top: 10px;
margin-bottom: 10px;
bottom: 0;
left: 0;
z-index: 100;
}
.screen {
display: block;
top: 0;
left: 0;
font-size: 60px;
font-family: 'Roboto';
color: white;
z-index: 10;
}
a {
color: grey;
}
.titleverticalleft {
display: none;
}
.titlebottom {
display: none;
}
h1 {
display:none;
}
h2 {
display:none;
}
p {
display:none;
}
p2 {
display:none;
}
p3 {
display:none;
}
p3special {
display:none;
}
line {
display:none;
}
bold {
display:none;
}
medium {
display:none;
}
garamond {
display:none;
}
brut {
display:none
}
* {
box-sizing: border-box;
}
.row:after {
display:none;
}
.column {
display:none;
}
.columnleft {
display:none;
}
.columnmiddle {
display:none;
}
.columnright {
display:none;
}
italic {
display:none;
}
bigitalic {
display:none;
}
bigp {
display:none;
}
bigmedium {
display:none;
}
}
* {
box-sizing: border-box;
}
.row {
display: flex;
}
/* Create two equal columns that sits next to each other */
.column {
vertical-align: text-bottom;
flex: 100%;
padding: 10px;
height: 180px; /* Should be removed. Only for demonstration */
}
< / style >
< / head >
< / html >
< div > < span class = "screen" > CTRL(⌘)+ P to print the A3 cover (W.I.P)< br >
Please use < a href = "https://download-chromium.appspot.com/" target = "blank" > Chromium< / a > Open Source browser and set to Horizontal A3< br > < br >
A3 Cover PDF< a href = "A3COVER.pdf" target = "blank" > (here)< / a > < br > < br >
Thank you!< / span > < / div >
<!-- WOr(L)DS foR THE FuTUrE - -->
< div > <!-- <span class="title2">WOr(L)DS<br>foR THE FuTUrE - </span><br> - -->
< span class = "title" > WOR(< symbol2 > L< / symbol2 > )DS< br > FOR THE FUTURE< / span > < br >
< div > < span class = "titleitalic" > Republishing Tool Kit for an Imaginary Atlas< / span > < / div >
< div > < span class = "titlevertical" > WѺR(L)DS FҨӶ THξ FUTURЭ< / span > < / div >
< div > < span class = "titleverticalleft" > XPUB< / span > < / div >
< div > < span class = "titlebottom" > XPUB< / span > < / div >
< body >
< div class = "row" >
< div class = "columnleft" style = "background-color:white;" >
< br >
< br >
< br >
< br >
< br >
< br >
< br >
< bigmedium > Words have the power to shape reality. Wor(l)ds < br > for the Future is a set of map making tools to re-imagine and collect wor(l)ds, and to re-publish an everchanging atlas. We invite you to delve into the materials and traverse the texts in any way you desire: by cutting and pasting the printed matter, or by unravelling the texts online. The choice is yours. You can reconstruct images and reinterpret words to create Wor(l)ds for the Future.< br > < br >
< / bigmedium > < br > < br >
< / div >
< div class = "columnmiddle " style = "background-color:white;" >
< br >
< br >
< br >
< br >
< br >
< br >
< br >
< bigregular > This project is a republication of < i > Words for the Future< / i > (2018), a multivoiced series of ten booklets. In the 2020 version, XPUB (Experimental Publishing) students from the Piet Zwart institute reinterpret the original material through methods such as annotating and prototyping< br > in Python (a coding language we used to analyse text< br > as texture). The ten booklets were cross-examined and mapped in order to find interconnections and links.< br > < br >
We approached this project through the perspective< br > of cartography. Alfred Korzybski wrote: "The map is < br > not the territory". In other words, the description of the thing is not the thing itself. The model is not reality. Cartography always entails a selection and transformation of properties of a complex reality that affect the way maps – – < br > for the Future.< br > < br >
A map could relate to something that no longer exists.< br > It could also relate to something that does not yet exist. Maps could be seen as fictions therefore, as spaces for the imaginary.< br > < br >
Join us to un-map and re-map an infinite amount of potential constellations of tomorrow, and to navigate speculative wor(l)ds which holds the capacity< br > to bleed into the very fabric of our shared grounds.
< br > < br >
< bigmedium > Online publication:< / bigmedium > < br >
https://hub.xpub.nl/sandbot/words-for-the-future/< / bigregular >
< / div >
< div class = "columnmiddle2 " style = "background-color:white;" >
< h2 > < / h2 >
< / div >
< div class = "columnright" >
<!-- <bigitalic>Legenda:</bigitalic> -->
< br > < br > < br >
< line > ——————————————————————————————< / line >
< br > < br >
< symbol > L< / symbol > < italic > Liquid< / italic > < p2 > Kendal Beynon< / p2 > < br >
< br >
< line > ——————————————————————————————< / line >
< br > < br >
< symbol > T< / symbol > < italic > Tense< / italic > < p2 > Martin Foucaut< / p2 > < br >
< br >
< line > ——————————————————————————————< / line >
< br > < br >
< symbol > A< / symbol > < italic > Atata< / italic > < p2 > Camilo García A.< / p2 > < br >
< br >
< line > ——————————————————————————————< / line >
< br > < br >
< symbol > M< / symbol > < italic > !?< / italic > < p2 > Clara Gradel< / p2 > < br >
< br >
< line > ——————————————————————————————< / line >
< br > < br >
< symbol > U< / symbol > < italic > Undecidability< / italic > < p2 > Nami Kim< / p2 > < br >
< br >
< line > ——————————————————————————————< / line >
< br > < br >
< symbol > H< / symbol > < italic > Hope< / italic > < p2 > Euna Lee< / p2 > < br >
< br >
< line > ——————————————————————————————< / line >
< br > < br >
< symbol > O< / symbol > < italic > Otherness< / italic > < p2 > Jacopo Lega< / p2 > < br >
< br >
< line > ——————————————————————————————< / line >
< br > < br >
< symbol > P< / symbol > < italic > Practical Vision< / italic > < p2 > Federico Poni < / p2 > < br >
< br >
< line > ——————————————————————————————< / line >
< br > < br >
< symbol > R< / symbol > < italic > Resurgence< / italic > < p2 > Louisa Teichmann< / p2 > < br >
< br >
< line > ——————————————————————————————< / line >
< br > < br >
< symbol > E< / symbol > < italic > Eco-Swaraj< / italic > < p2 > Floor van Meeuwen< / p2 > < br >
< br >
< line > ——————————————————————————————< / line >
< / div >
< / div >
< / body >
