User:Euna/SI13: Difference between revisions

From XPUB & Lens-Based wiki
(Created page with "=Methode= ==1 (22/09/2020)== Group work about ATATA, Hope, Otherness <br> with Camilo and Jacopo https://pad.xpub.nl/p/ISSUE13_Atata_notes <br> https://pad.xpub.nl/p/Hope_G...")
 
No edit summary
 
(3 intermediate revisions by the same user not shown)
Line 1: Line 1:
=HOPE=
https://issue.xpub.nl/13/HOPE/index.html
[[File:WFTF Partie3.jpg|thumb|WFTF Partie3]]
Hope
During special issue 13, I especially worked with the text « HOPE » by Gurur Ertem and « Zero » by Ogutu Muraya.
Ertem proposed solutions to find a light to face the current political and social darkness. Among them, I was fascinated by « recognition of pluralism ». So, I focused on manifesting plural voices on the original text and these voices are represented in accumulated form on multiple HTML pages. Firstly, XPUB students participate to Ertem’s text through annotations during the class. And with Python NLTK, I made the narrator change in every page refresh, which is the metaphor of standing in others shoes.
In parallel, as Muraya’s way to brighten the darkness, I made an empty space, a space of Zero, where the reader takes time for reflection and becomes the author.
Verbs : embrace, understand, argue
Nouns : democracy, darkness, subjectivity
Adjectives : political, pluralistic, accessible
=Methode=
=Methode=


Line 10: Line 27:
https://pad.xpub.nl/p/Otherness_Daniel_L._Everett
https://pad.xpub.nl/p/Otherness_Daniel_L._Everett


=License=
<b>Aymeric Mansoux, Sandbox Culture, chapter2</b>
beyond the apparent common universality that seem to connect them under the umbrella of openness and freedom, they each have their distinctive features, as a result of adapting to their needs the free and source software template.
instead the emergence of identity politics within the not so diverse cultural context of free and open source communities.
Reuse – Use the work verbatim, just exactly as you found it
Revise – Alter or transform the work so that it better meets your needs
Remix – Combine the (verbatim or altered) work with other works to better meet your needs
Redistribute – Share the verbatim work, the reworked work, or the remixed work with others35
<b>WFTF licensing with Nami and Federico</b>
https://pad.xpub.nl/p/wftf_licensing


= Prototyping =
= Prototyping =
Line 435: Line 469:
QQQQQQQQQQQQQQQQQQQQQWQQQQQWWQQQQQQQQ#vii||||iivvnvnnnno22SS2SSXXXZZUZXXnonvi=+|lvvo2SXWWQQWQQQQQQQQ
QQQQQQQQQQQQQQQQQQQQQWQQQQQWWQQQQQQQQ#vii||||iivvnvnnnno22SS2SSXXXZZUZXXnonvi=+|lvvo2SXWWQQWQQQQQQQQ
QQQQQQQQQQQQQQQQQQQQQQQQWQQQQQWQQQQQWElIliiilvnnonnooo22S2S2XXXXXZZZZUZZX2nvl|+||lvnnonmQQWQQQQQQQWQ
QQQQQQQQQQQQQQQQQQQQQQQQWQQQQQWQQQQQWElIliiilvnnonnooo22S2S2XXXXXZZZZUZZX2nvl|+||lvnnonmQQWQQQQQQQWQ
</pre>
=WFTF Visual design=
- customized typeface : each student draw a letter -> transform to digital version
[[File:Wftf typeface.png|thumb|wftf typeface]]
- customized icon : an icon represent a text (eg. for HOPE, a star) -> serve as a hyperlink image inside of the text.
[[File:Hyperlink.gif|thumb|hyperlink]]
How to make hyperlink from one precise word to another!
<pre>
# making hyperlink point in my html
<a name="past"></a><span class="link">past</span>
# link to external hyperlink point
<a class="lilink" href="../LIQUID/manifesto.html" target="_blank">L</a>
</pre>
</pre>

Latest revision as of 20:48, 11 April 2021

HOPE

https://issue.xpub.nl/13/HOPE/index.html

WFTF Partie3

Hope

During special issue 13, I especially worked with the text « HOPE » by Gurur Ertem and « Zero » by Ogutu Muraya. Ertem proposed solutions to find a light to face the current political and social darkness. Among them, I was fascinated by « recognition of pluralism ». So, I focused on manifesting plural voices on the original text and these voices are represented in accumulated form on multiple HTML pages. Firstly, XPUB students participate to Ertem’s text through annotations during the class. And with Python NLTK, I made the narrator change in every page refresh, which is the metaphor of standing in others shoes. In parallel, as Muraya’s way to brighten the darkness, I made an empty space, a space of Zero, where the reader takes time for reflection and becomes the author.

Verbs : embrace, understand, argue

Nouns : democracy, darkness, subjectivity

Adjectives : political, pluralistic, accessible

Methode

1 (22/09/2020)

Group work about ATATA, Hope, Otherness
with Camilo and Jacopo

https://pad.xpub.nl/p/ISSUE13_Atata_notes
https://pad.xpub.nl/p/Hope_Gurur_Ertem
https://pad.xpub.nl/p/Otherness_Daniel_L._Everett

License

Aymeric Mansoux, Sandbox Culture, chapter2

beyond the apparent common universality that seem to connect them under the umbrella of openness and freedom, they each have their distinctive features, as a result of adapting to their needs the free and source software template.

instead the emergence of identity politics within the not so diverse cultural context of free and open source communities.

Reuse – Use the work verbatim, just exactly as you found it

Revise – Alter or transform the work so that it better meets your needs

Remix – Combine the (verbatim or altered) work with other works to better meet your needs

Redistribute – Share the verbatim work, the reworked work, or the remixed work with others35

WFTF licensing with Nami and Federico https://pad.xpub.nl/p/wftf_licensing

Prototyping

1

JupiterLab

- command language : pythone (also, wiki language (marke-up language). ex. instead of #, use ==headline==)
- run on offline + in browser (easy to publish)
- have its library, with ? at the end (ex. random?), we get its explanation
- with "enter", change the line in the cell
- "enter + shift", command to execute the command -> on the next line, spit out the output immediately (like javascript console)
- consist of "Console" and "Notebook"


Console

-like terminal, command line interface. direct way to see the result, but, cannot be saved


Notebook

- for hybrid publishing interface (but +, console)
- fast editing and publishing possiblle ( faster than using hub)
- Text (Markdown) + Code (Python)
- modifying / rerunning the cell is possible


Phython code

- https://docs.python.org/3/tutorial/classes.html#class-objects
- "17" + 29 -> error / "17" + "29" -> 1729
- x=x+1 same with x+=1
- type : str (for text ex. "17"), int(number), float(number with fractional parts), boolean(true/false), list
- calculation with text is not possible (sauf, * ex."hello"*2 -> hellohello)
- x=["a", "b", "c"] -> x[1]=b / x[-1]=c(negative number starts from the end)
- print() -> empty line output
- for For, the space before inner-command is important

for x in "Michael":
    print(f"hello {x}")
print("End") 

-> hello M 
   hello i
   ... 
   hello l
   End  # appeals only at the end

- input random
random.random -> 0.234546546678
random.randint(0,5) -> 4 (random number between 0-4)
random.randint(0,len(x)) -> 1 (number between 0-2)
random.choice(x) -> c


Generated poem

- A house of dust by Alison Knowles https://hub.xpub.nl/bootleglibrary/read/465/pdf
- My generated poem input and output

import random
from random import choice

ani = ("mosquitos", "pigs", "kangaroos", "tunas", "cats")

cha = ("blue", "laziest", "numbest", "most stinky", "dullest")

for x in range (10) :
    n = random.randint(3, 30)   # when the number is too big, doesn't give a sufficient random one (like, 99999 -> always, a number of 5 ciphers)
    a = choice(ani)
    c1 = choice(cha)
    c2 = list(cha)   # to remove an element in tuple, must change to list (list = ["",""], tuple = ("","")
    c2.remove(c1)    # c2 is a list except the result of c1
    c2 = choice(c2)
    print(f"Amongst the numbers of {n} of {a},")
    print(f"the {c1} one and {c2} one are selected as the king and queen of {a}!")
    print()
Amongst the numbers of 5 of mosquitos,
the blue one and dullest one are selected as the king and queen of mosquitos!

Amongst the numbers of 13 of cats,
the laziest one and dullest one are selected as the king and queen of cats!

Amongst the numbers of 12 of cats,
the dullest one and most stinky one are selected as the king and queen of cats!

Amongst the numbers of 11 of kangaroos,
the numbest one and blue one are selected as the king and queen of kangaroos!

Amongst the numbers of 7 of cats,
the dullest one and blue one are selected as the king and queen of cats!

Amongst the numbers of 26 of tunas,
the laziest one and numbest one are selected as the king and queen of tunas!

Amongst the numbers of 6 of tunas,
the laziest one and dullest one are selected as the king and queen of tunas!

Amongst the numbers of 13 of pigs,
the numbest one and dullest one are selected as the king and queen of pigs!

Amongst the numbers of 4 of kangaroos,
the numbest one and blue one are selected as the king and queen of kangaroos!

Amongst the numbers of 18 of pigs,
the laziest one and blue one are selected as the king and queen of pigs!


2

JupiterLab

Terminal

- Console where can test python language locally

- easily access to local file

type "python3" + enter   #not the version 2.7!
exit()    #to finish


Phython code

- b=str(3) = c="3"

- "software" != "Software" (for Python, uppercase and lowercase are different string)

- a.replace ('soft','hard)

- a. + tab -> shows what we can chose after "."

- \(back slash) is used to escape characters

print('Euna's cookie')   #Error, cause after a, is already closed
print('Euna\'s cookie')   #output, Euna's cookie

a = "\\"
print(a)   #output, \


Pattern

- Both early code and weaving pattern used punch card -> making pattern!

- all unicode : http://xahlee.info/comp/unicode_circled_numbers.html

- Pattern 1

import random
characters = ['╱','╲']   #if you do with '/','\' use '/','\\'
width = 100
height = 50
line = ''
for y in range(height):
    for x in range(width):
        line += random.choice(characters)
    print(line)
    line = ''
╱╲╲╱╱╱╲╱╲╱╲╲╲╲╲╲╱╱╲╲╲╲╱╱╲╲╲╱╲╱╲╱╱╱╲╲╲╲╲╱╲╱╲╱╱╲╱╲╱╱
╲╲╲╱╱╲╱╱╱╲╲╱╲╲╱╱╱╱╱╲╲╲╲╲╲╲╲╲╱╱╱╱╲╱╱╱╲╱╱╲╱╱╲╱╱╲╱╲╱╱
╲╲╱╱╲╲╱╲╲╱╲╱╱╲╱╱╲╱╲╱╱╲╱╱╲╲╲╲╱╱╲╱╱╲╲╲╱╱╲╲╲╲╲╱╲╱╲╲╲╲
╲╱╲╲╱╱╲╲╲╱╲╲╲╱╲╱╱╲╲╲╱╱╲╱╱╲╱╲╲╲╲╱╱╲╲╲╱╱╲╲╱╱╱╱╱╱╱╲╱╲
╲╱╲╱╱╲╱╲╲╲╲╱╲╲╱╱╲╱╱╱╱╱╲╲╲╱╱╲╱╲╱╱╱╱╱╲╱╱╱╱╲╲╲╲╲╱╲╲╱╲
╱╲╱╱╱╲╲╱╱╲╱╱╱╱╱╱╲╲╱╲╲╱╱╱╱╱╲╲╲╱╲╲╱╲╱╱╲╲╲╲╱╲╲╲╲╱╱╱╱╲
╱╲╲╱╲╲╱╲╲╱╲╲╲╲╱╲╲╱╱╲╲╱╲╲╲╲╲╲╲╲╲╱╱╱╱╱╱╱╲╲╱╲╱╲╱╱╲╲╱╱
╲╲╱╲╲╱╲╲╱╲╱╲╱╱╲╱╱╲╱╲╱╲╲╲╱╲╱╱╲╲╲╲╲╱╱╲╲╲╱╲╱╲╲╲╲╲╲╲╲╲
╲╲╱╲╱╲╱╲╲╲╲╲╱╲╲╲╲╲╱╱╲╲╱╱╱╱╲╱╲╲╲╲╲╲╱╱╱╱╱╱╱╱╲╲╲╱╲╱╲╱
╱╱╲╲╲╱╱╲╲╱╱╱╲╱╱╱╱╲╱╲╲╱╱╲╲╱╲╱╱╲╲╲╱╲╱╲╱╱╱╲╲╱╲╲╱╲╲╲╲╲
╱╱╲╱╲╱╲╱╱╲╲╱╲╲╱╲╱╲╱╱╲╲╱╱╱╲╲╱╱╱╲╲╱╲╱╲╱╲╱╲╱╱╲╱╲╲╲╲╱╱
╲╱╲╲╱╱╲╱╲╲╲╲╱╲╱╱╱╱╱╱╲╲╱╱╲╲╱╱╱╲╱╲╲╲╲╲╱╱╱╱╱╲╲╱╲╲╲╲╱╱
╱╲╱╱╱╲╱╱╲╱╱╲╱╱╱╲╲╲╲╱╱╲╲╱╱╱╲╱╱╲╱╱╲╲╱╱╱╱╲╱╲╲╲╱╲╱╲╲╲╲
╲╲╲╱╱╲╲╲╲╱╲╲╲╲╲╱╱╱╲╱╲╲╱╲╲╱╱╱╱╲╱╲╱╲╲╱╱╱╱╱╱╲╲╲╲╱╲╱╲╱
╲╲╱╲╲╲╲╲╲╱╱╲╱╱╲╲╱╱╲╱╲╲╲╱╲╲╱╱╲╲╱╲╲╱╱╱╱╱╲╲╱╱╱╲╲╱╲╱╱╱
╲╱╱╱╲╱╱╲╲╲╱╲╲╲╱╱╱╲╱╲╱╲╲╱╲╱╱╲╲╲╲╱╲╱╱╱╱╲╱╲╱╱╲╱╱╱╱╱╲╲
╱╲╱╱╲╱╱╱╱╱╲╲╱╱╲╱╲╱╱╲╱╲╱╱╱╱╲╱╱╱╱╲╱╲╲╱╲╱╱╱╲╱╱╱╲╱╲╱╲╲
╲╱╱╱╲╱╱╲╲╱╱╱╱╱╱╲╱╱╱╱╲╱╲╱╲╲╲╲╲╲╲╲╲╱╲╲╲╲╱╱╱╱╱╱╲╲╱╲╱╲
╲╱╲╱╱╱╱╱╲╱╲╲╱╱╲╲╱╲╲╱╲╲╲╱╲╱╱╲╲╱╲╱╲╲╲╲╲╱╲╲╱╱╲╱╱╲╲╱╱╲
╲╲╲╱╲╲╱╲╲╲╲╱╲╲╱╲╱╲╲╲╱╱╱╱╲╲╲╲╱╲╱╱╱╱╱╲╲╱╲╱╲╱╲╱╱╱╱╱╲╱
╲╲╱╱╱╲╱╱╲╱╱╲╱╲╱╱╱╲╱╲╱╲╱╲╱╲╲╱╱╲╱╲╱╱╲╱╱╱╲╱╲╱╱╲╱╲╱╱╲╲
╲╱╲╲╲╱╱╱╲╲╲╱╱╱╲╱╱╱╲╲╱╲╱╲╱╱╲╱╱╲╲╱╱╱╱╱╱╱╲╲╲╱╱╲╲╱╱╱╱╲
╱╲╲╲╲╲╱╲╲╱╲╲╱╱╱╲╱╲╱╱╱╲╲╱╲╲╱╱╲╱╲╱╱╲╲╲╲╲╱╲╱╲╱╲╱╱╱╱╱╲
╲╱╲╲╲╱╱╱╱╱╲╱╱╲╱╱╲╲╱╲╱╱╲╱╱╱╲╱╱╲╲╱╱╲╱╲╱╱╱╲╲╲╱╲╲╲╱╱╱╲
╲╲╲╱╲╱╲╱╲╱╱╱╱╲╲╲╱╱╲╱╲╲╲╱╱╲╱╱╲╲╲╲╲╱╱╲╱╲╲╱╱╱╲╱╲╱╲╲╲╱

- Pattern 2

import random
characters = ["c", "o", "c", "o"]
width = 50
height = 25
line = ''

for y in range(height):
    for x in range(width):
        line += random.choice(characters)   #chose the letter randomly 
    if 'coco' in line :
        print(line.replace('coco','🥥🥥🥥🥥'))   #coconut emoji if it's combination of coco
    else :
        print(line)   #if not, just print the chosen letter 
    line = ''   #reset, change the line
ccccoocoocoocoooc🥥🥥🥥🥥ococ🥥🥥🥥🥥cooocoo🥥🥥🥥🥥ococcooooc
ooccooc🥥🥥🥥🥥occccccoooo🥥🥥🥥🥥c🥥🥥🥥🥥ccccoccooocc🥥🥥🥥🥥ccc
coocooooooccoccc🥥🥥🥥🥥occoccc🥥🥥🥥🥥ccoc🥥🥥🥥🥥cooccooccoc
🥥🥥🥥🥥o🥥🥥🥥🥥occ🥥🥥🥥🥥ooocoocooocc🥥🥥🥥🥥ccoocoocccccccoooo
coocoooccc🥥🥥🥥🥥ococcocc🥥🥥🥥🥥cooccoccccccocccoc🥥🥥🥥🥥cc
oocc🥥🥥🥥🥥coooocooooocooooccoc🥥🥥🥥🥥coocc🥥🥥🥥🥥oooo🥥🥥🥥🥥o
occoococc🥥🥥🥥🥥ccocccoo🥥🥥🥥🥥oocoocoo🥥🥥🥥🥥occoooooooooc
ccccoooo🥥🥥🥥🥥oooccooooccoc🥥🥥🥥🥥ooooccccc🥥🥥🥥🥥cocccooc
🥥🥥🥥🥥cccccocccocccoccoo🥥🥥🥥🥥oooo🥥🥥🥥🥥ccooococ🥥🥥🥥🥥occo
occoocccooo🥥🥥🥥🥥ooccoccoccoccoc🥥🥥🥥🥥occocccoc🥥🥥🥥🥥ooo
c🥥🥥🥥🥥coccooocoooccooc🥥🥥🥥🥥occcoooooc🥥🥥🥥🥥ocooooooooc
ooccooococcocccccoocoocc🥥🥥🥥🥥coccoocccooooocooocooo
oo🥥🥥🥥🥥oocooccoccoccoccccoococcocccc🥥🥥🥥🥥oocoocooocc
coooooc🥥🥥🥥🥥cooc🥥🥥🥥🥥🥥🥥🥥🥥coocooocoooocoococc🥥🥥🥥🥥ocoo
oooccooc🥥🥥🥥🥥cocc🥥🥥🥥🥥oo🥥🥥🥥🥥ccooocccccccoococ🥥🥥🥥🥥cco
cooo🥥🥥🥥🥥oococccoooocooccoocccocccc🥥🥥🥥🥥c🥥🥥🥥🥥ooc🥥🥥🥥🥥
cooooocooocccoocccccooocoooocoooccoocoooocoooocccc
occcccoccccccoo🥥🥥🥥🥥🥥🥥🥥🥥coccocccocc🥥🥥🥥🥥cooooocoococ
oo🥥🥥🥥🥥cocccoccoo🥥🥥🥥🥥oc🥥🥥🥥🥥oocoooccccoocoo🥥🥥🥥🥥cccoc
ooococccocccocccccoooocccc🥥🥥🥥🥥coocccooccccoocccooc
o🥥🥥🥥🥥🥥🥥🥥🥥cooccccocccooccoocooc🥥🥥🥥🥥ccoooccooocooooo
coccooocoocooooccooooccoooocc🥥🥥🥥🥥cocccc🥥🥥🥥🥥oococco
occ🥥🥥🥥🥥cooocccocccoccoooccccooo🥥🥥🥥🥥ococcoocccooooc
cooooocooccoo🥥🥥🥥🥥coccccooccoocooocooccoooocccooccc
ooccccocccooocoocccoccoocccoocoocooccccooc🥥🥥🥥🥥cccc


Read text to Python

from urllib.request import urlopen


#for ATATA
url = 'https://pad.xpub.nl/p/ISSUE13_Atata_notes/export/txt'
response = urlopen(url)

lines = response.readlines()
a = []


#for OTHERNESS
url = 'https://pad.xpub.nl/p/Otherness_Daniel_L._Everett/export/txt'
response = urlopen(url)

liness = response.readlines()
b = []


#for OTHERNESS
url = 'https://pad.xpub.nl/p/Hope_Gurur_Ertem/export/txt'
response = urlopen(url)

linesss = response.readlines()
c = []


print("Tell me a word")
word = input()
print()

import random


for line in lines:
    line = line.decode('UTF-8')
        
    if word in line:
        a.append(line).  #for making a list with line
        yoyo = random.choice(a)

        
        
for line in liness:
    line = line.decode('UTF-8')
        
    if word in line:
        b.append(line)
        yaya = random.choice(b)
 

for line in linesss:
    line = line.decode('UTF-8')
        
    if word in line:
        c.append(line)
        yuyu = random.choice(c)
        
        
        
print("found in ATATA")
print(" --> " + yoyo)
print()

print("found in OTHERNESS")
print(" --> " + yaya)
print()

print("found in HOPE")
print(" --> " + yuyu)
Tell me a word
 think

found in ATATA
 --> * rethinking the image of ‘weighing of the heart’ in light of capitalism and its interest in life-value 


found in OTHERNESS
 --> Also I think it's interesting that somehow there has to be a need to aproach the otherness putting in question the "non-flexible" values of true. 


found in HOPE
 --> Here, I’m not making a case for going back to narrative forms in performance or a call for storytelling above and beyond any other forms. The emphasis here is more on storytelling as an example of a social act of [i]poeisis[i] rather than the product of narrative activity. The critical question for me today is can artists, curators, and social thinkers bring to life the stories that are waiting to be told? Sometimes, instead of focusing on how to increase visitors to our venues, it could be more rewarding to take our imagination to go visiting. I conclude my reflections on hope with a quote from Arundathi Roy: 


3

JupiterLab

 Phython code

- add url : [marked word](https://www...)

- while (loop with condition ex.while True) or for -> for in for (with indentation! ) is nesting


Insert Image

- im.mode : RGB, RGBA(Red, Green, Blue, Alpha-for transparency), l(greyscale)

- im.thumbnail( (150, 150) ) : size automatically saved (to cancle, im.resize((100,100)) or restart from im = Image.open("b-.jpeg"))

- im.convert :not automatically saved. image pixelate key2.convert("1", dither=Image.NONE) or change the mode with key2.convert("l")

- urlopen image can be saved on server with key3.saved (also possible with terminal, saving locally)

- ASCII art : http://jwilk.net/software/python-aalib

from PIL import Image
import aalib
screen = aalib.AsciiScreen(width=100, height=50)

f = Image.open("b.jpeg") 
f = f.convert('L').resize(screen.virtual_size)
screen.put_image((0, 0), f)
print (screen.render())
QQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQ
QQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQ
QQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQ
QQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQ
QQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQ
QQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQWWB#W##W##W###WWWWQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQ
QQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQWB##XZZXZZZZZZZZUXZZUXXXXZ###WQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQ
QQQQQQQQQQQQQQQQQQQQQQQQQQQQQQQWB#XXXXXXZXZXXZXZZZZXZZZZZZZUZZZZXZ#WWWW#ZXXZUWWQQQQQQQQQQQQQQQQQQQQQ
QQQQQQQQQQQQQQQQQQQQQQQQQQQQWBXXXXXXXXXXXXXXZXXXXXXXXXZXXXZXZZXZZZZXXXS**I*11oX$WQQQQQQQQQQQQQQQQQQQ
QQQQQQQQQQQQQQQQQQQQWB##WWWAXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXZXXZXXXXXSvi|vIv%|In3WWQQQQQQQQQQQQQQQQQQ
QQQQQQQQQQQQQQQQQQWSI*S22S2XSXSXXSSXXXXXXXSXXSXXXXXXXXXXXXXXXXXXXXXSSovlvvvvl|vlQWWQWQQQQQQQQQQQQQQQ
QQQQQQQQQQQQQQQQQQ#>|iivXXXSSSS2SSSS2SSS2XS2SSS2SSSSSSSXSXXXXXXXXXXSS2onilliiivmWWQQQQQQQQQQQQQQQQQQ
QQQQQQQQQQQQQQQQQQmc|vnXXSS2S2SS2S2S2S2SS2SS2S2SS2SS2XS2XSSXXXSXXSSSSSSonvvIiuQWWQQWQQQQQQQQQQQQQQQQ
QQQQQQQQQQQQQQQQQQQQooXXS2SS2S2S2S2S2S2S2S22S2S2S2S2XS2XS2SSS2XSSSSSS2S22onvnWWWQQQQQQQQQQQQQQQQQQQQ
QQQQQQQQQQQQQQQQQWW#2X22S2SoX2S22222S2S2222SoSoSoS2222S22S222S2S2S2S2S2S2222odWWWQQWQQQQQQQQQQQQQQQQ
QQQQQQQQQQQQQQQQQWWoS22So222S222222So2o2o22o2o2222222222222S2222S2S2S2S2S2S2S2XWWQQQQQQQQQQQQQQQQQQQ
QQQQQQQQQQQQQQQQQWSo2o2o2222o2oo2ooo2ooo2ooooo2ooooooooo222o22oSo222o222222SoS2$WQQWQQQWQQQWQQQQQQQQ
QQQQQQQQQQQQQQQQW#nooooononooooooooooononnonoonoooooooo2oooo2ooo222oSo222222222XWWQQQQQQQQQQQQQQQQQQ
QQQQQQQQQQQQQQQQWZnnnnnnnnnnnnnnnnnnnnnnnnvnnnnnnnonnnooooooo22222o2o22222SoS222$WWQWQQQQQQQQQQQQQWQ
QQQQQQQQQQQQQQQQW1nnvnvvvvnvnvvnvvvvvvvvvvnvnvnvnvnnnooooooooo2o2222222222222222dWWQQQQQQQQQQQQQQQQQ
QQQQQQQQQQQQQQQW#nnnvvnvvvvvvvvvvvnvnvvnvvvvvnvnvnvnnnnnnoooo2o22S2S2S2S2S2S2222oQWQQQQQQQQQQQQQQWQQ
QQQQQQQQQQQQQQQWZonvnvvvvvvvvvvvvvvvvvvvvvvvvvvvvnvnvnnnnoooo222S2S2S2SS2S2S2X22oWWQQQQQQQQQWQQQQQQQ
QQQQQQQQQQQQQQWWnonvvvvvIIvIvIvvvvvvvvvvIvvvvvnvnvnvnnnnnnoo2oS22S2SSSSSSS2X2S22omWWQQQQQQQQQQQQQQQQ
QQQQQQQQQQQQQWWSnnnvnvvvvIIIIvIIIIvIIvIIvvvIvvvvvnvnvnvnvnoo222SS2XS2SS2S2S2S2SoomWQQQQQQQWQQQQQQWQQ
QQQQQQQQQQQQWBSooo>-iiIvIIIvIIIvIvlvvIvIIIvIvvvvI|"^--=%nno2SoS2SSS2XS2SSS2SS2So2mWQWQQQQQQQQQQQQQQQ
QQQQQQQQQQQWB2S22on,-=.~<vvIlvIIIIvIIvIvvIIv>~- .  ._%vnoo2S2S2S2S2SS2XS22S22S2SomWWQQQQQWQQQQQQQQQQ
QQQQQQQQQWW#2XS2Sooos, . -vvvvvvvvvvvvvvvv}+ . .._ivnoo2o22S2SSSSSSS2X2SSS2S2222omWQQQQQQQQQQQQQQQQQ
QQQQQQQQQQ#2X2S222oonvns,ivvvnvnnnnnnnnvnvv<<iivvnnnno222S2S2SS2SS2S2S2SoSo2222oomWQWQQQQQQQQQQQWQQQ
QQQQQQQQWWoX2S2SSSo2oonnoonooo2o2oo2oonononnvnnnnnnno22S2S2S2S2XS2S2S222So2222oonmQWQQQQQQQQQQQQQQQQ
QQQQQQQQW#oo2222oo222o2oo222SXSXSSSS222ooooooooooo2oSoS2S2S2S2S22So2o22ooooooooonmQQQQQQQQQQQQQQQQQQ
QQQQQQQQW#nnonnnnnonooo2222!"!""!"!!1X22SoSo22o2oo22oooo2oo2o22o2oo2oooooooononnnQQQQQQQQQQQWQQQWQQQ
QQQQQQQQQmvvvvvvvvvvvvnn1+ -......__.-{ooooooonnnnvnnnnnnonnnonnnonnnnnnnnnnvnnvdQWQQQQQQQQQQQQQQQQQ
QQQQQQQQWQzillllllllIvI}-.:.:.::=|nv>..+ooonnnvvvIvvvvvvvvvvvvvnvnvnvnvvnvvvnvvvmQQQQWQQQQQWQQQQQQQQ
QQQQQQQQQWm|iiiiiiilill> -.:.::.:-=--...vnnvvvIvlIllllllIvIvvIvIvvvvvvvvvvvvvvvqQQQQQQQQQQQQQQQQQQQQ
QQQQQQQQQWWaiiiiiiiiiii|...:-:.:.:..... vvvvvIIlllliliiliillillllllIIvIvvIvvvvnQWQQWQQQQQQQQQQQQQQQQ
QQQQQQQQQWQQp|ii|i|i||||=..-.--........%vIlIllliliiii||+|iiiiiiiiillllllllllInQWQQQQQQQQQQQWQQQQQQQQ
QQQQQQQQQQQWWma||i||||||+|.-........ _%lliliii|i|||=:::=||iiiiiiiiiiilillillnmWWQQQQQQQQQQQQQQQQQQQQ
QQQQQQQQQQWQQWWwc|||i|||+||==__.:__=iliiiii||||+=:-:.=+||||i|i|iiiiiiiiiiiiwWQQQQQQQQQQQWQQQQQQQQQWQ
QQQQQQQQQQQQWQWQQmo%|||||||||i|i|iiiii|ii||||=:::::=||+|||||i|i|i|i|iii|iimWWWQQQQQWQQQQQQQQQQQQQQQQ
QQQQQQQQQQQQQQQQWQQQgw%>|||||||||++||+||iis=-::;=||||+|||||||||i|||i|||ivvXXQWQWQWQQQQQQQQQQQQQQQQQQ
QQQQQQQQQQQQQQQQQQQWQWWQmwwa%|+||+|iI1nn1**i=||ii|||||||+||||||||||||ilIvvno2X$WQQQWQQQQQQQQQQWQQQQQ
QQQQQQQQQQQQQQQQQQQQQQQQWQWWQQ>:..=|+|||||||i|||||||||+|+|=|=|+|+|iivvviiIvnnoSX$WWQWQQQQWQQQQQQQQQQ
QQQQQQQQQQQQQQQQQQQQQQWQQQWBY(:.;==:==+++|+||||||||||+|++|+||||iilIvvvvi+iilvnno2XWWQQQQQQQQQQQQQQQQ
QQQQQQQQQQQQQQQQQWQQQWQQQWDvv;.=|||;;;====+++|+||||+|+|+||||||iillIvvvvv|=||lIvo22X$WQWQQQQQQQQQQQQQ
QQQQQQQQQQQQQQQQQQQQQQQQWW1nn>--<iI>==;;;====+++=+=|+|||||||iilllvvvvvnvl|+||lvnn2o2$WQQWQQQQQWQQQQQ
QQQQQQQQQQQQQQQQQQQQQQQQQW2vvi:=iiIi=====;===|+||||||||||iiilllvIvvvnnnvnv|+|iivvoS22WWQQQQQQQQQQQQQ
QQQQQQQQQQQQQQQQWQQQQQWQWQmci|:.=i|=|+i|+===|+||+||||iilvvvnnvnvnnnnvnnnnvl|+||IvnoS23WWWQQWQQQQQQQQ
QQQQQQQQQQQQQQQQQQQQQQQQQWWQga%i||iawoIi||+|+|||iilIvnnnooo22SSXXXXXo2oonovv=||iIvno2SXQQQQQQQQQQQQQ
QQQQQQQQQQQQQQQQQQQQQWQQQQQWWQQQQQQQQ#vii||||iivvnvnnnno22SS2SSXXXZZUZXXnonvi=+|lvvo2SXWWQQWQQQQQQQQ
QQQQQQQQQQQQQQQQQQQQQQQQWQQQQQWQQQQQWElIliiilvnnonnooo22S2S2XXXXXZZZZUZZX2nvl|+||lvnnonmQQWQQQQQQQWQ

WFTF Visual design

- customized typeface : each student draw a letter -> transform to digital version

wftf typeface

- customized icon : an icon represent a text (eg. for HOPE, a star) -> serve as a hyperlink image inside of the text.

hyperlink

How to make hyperlink from one precise word to another!

# making hyperlink point in my html
<a name="past"></a><span class="link">past</span>
# link to external hyperlink point
<a class="lilink" href="../LIQUID/manifesto.html" target="_blank">L</a>