diff --git a/README.md b/README.md index 7f94354..92ec788 100644 --- a/README.md +++ b/README.md @@ -1,20 +1,3 @@ -# computer archaeology jp multimedia playlist and utility - -## multimedia playlist -In this playlist, you will find a list of multimedia content to navigate the space of "computer archaeology jp": - -* a handful of songs -* an NES long play -* a manual manga -* an advertisement -* an audio book -* a book - -## utility -Jinja templating engine for a web zine project. - -Usage - -## thank you -Supported by the Race x Technology Micro Grant program of the Media Archaeology Lab +# README +a utility to generate an index page for my works similar to the combination of a portfolio and annotated index sheet. diff --git a/app.py b/app.py new file mode 100644 index 0000000..5370836 --- /dev/null +++ b/app.py @@ -0,0 +1,27 @@ +from flask import Flask +app = Flask(__name__) + +HTML_TEMPLATE = """ + + + + + Biyi Wen Works Index + + + +

Biyi Wen Works Index

+ + +""" + +@app.route("/") +def homepage(): + return HTML_TEMPLATE + +if __name__ == '__main__': + app.run(use_reloader=True, debug=True) diff --git a/index.html b/index.html new file mode 100644 index 0000000..5b1c289 --- /dev/null +++ b/index.html @@ -0,0 +1,95 @@ + + + + + + media archaeology jp multimedia playlist Test + + + +
+
+

media archaeology jp multimedia playlist

+
+
+ + + Big in japan + + + + 新世紀エヴァンゲリオン EVA - 残酷な天使のテーゼ [SC88] + + + + Nintendo Famicom user manual manga + + + + 悲しみのNIFTY-Serve + + + + L’aventurier + + + + neuromancer + + + + toshiba msx advertisement in 1985 + + + + timothy leary in japan + + + + アメリカ大統領選挙 + + + + Artificial intelligence on the Commodore 64 : make your micro think + + + + yaruo text + + + + Afternoon yaruo time + + + + AA/ASCIIART archive + + + + Lolicore music archive + + + + Oki wiredot printer + + + + Pyuuta + + + + Pyuuta text + + + + Pyuuta text color + + + +
+ +
+ + + \ No newline at end of file diff --git a/ls b/ls new file mode 100644 index 0000000..5f6170e --- /dev/null +++ b/ls @@ -0,0 +1,106 @@ +[ + { + "title":"Big in japan", + "link":"https://archive.org/details/alphaville-big-in-japan-original-vhs", + "img":"biginjapan.jpg", + "type":"audio", + "content":"Big in Japan, ooh, the eastern sea's so blue" + }, + + { + "title":"新世紀エヴァンゲリオン EVA - 残酷な天使のテーゼ [SC88]", + "link":"https://www.youtube.com/watch?v=k8ozVkIkr-g", + "img":"evangelion.png", + "type":"audio", + "content":"OST from Neon Genesis Evangelion, a popular anime portraying humanoids and the humans around them." + }, + + { + "title":"Nintendo Famicom user manual manga", + "link":"https://archive.org/details/famicom-manga/page/n1/mode/2up", + "img":"famicon_manga.png", + "type":"print", + "content":"Nintendo Famicom user manual in manga format." + }, + + { + "title":"悲しみのNIFTY-Serve", + "link":"https://www.nicovideo.jp/watch/sm2380352", + "img":"nifty_serve.png", + "type":"audio", + "content":"A melancholic song written for NIFTY Serve, a telecommunications services in Japan active from 1987 to 2006." + }, + + { + "title":"L’aventurier", + "link":"https://archive.org/details/cd_laventurier_indochine/disc1/01.+Indochine+-+L'Aventurier.flac", + "img":"laventurier_indochine_itemimage.png", + "type":"audio", + "content":"The band's name reflected an orientalism" + }, + + { + "title":"neuromancer ", + "link":"https://archive.org/details/neuromancer-william-gibson/1+of+2.mp3", + "img":"neuromancer.png", + "type":"audio", + "content":"Chiba city blues, razor girl, console cowboy, and the matrix." + }, + + { + "title":"toshiba msx advertisement in 1985", + "link":"https://archive.org/details/ToshibaPasopiaIQMSX_1985", + "img":"tosiba_msx.png", + "type":"video", + "content":"Advertisement featuring kanji input." + }, + + { + "title":"timothy leary in japan", + "link":"https://archive.org/details/Timothy_Leary_Archives_239", + "img":"", + "type":"", + "content":"Timothy leary interviewed in japan. watch with caution." + }, + + { + "title":"アメリカ大統領選挙", + "link":"https://archive.org/details/NESLongplay918AmericaDaitouryouSenkyo", + "img":"america_pre.png", + "type":"game", + "content":"A longplay of an NES game of the american presidential election." + }, + + { + "title":"Artificial intelligence on the Commodore 64 : make your micro think", + "link":"https://archive.org/details/artificial-intelligence-on-the-commodore-64/page/n33/mode/2up", + "img":"c64_ai.png", + "type":"", + "content":"AI is no new deal, the promotion of AI may be." + }, + + { + "title":"Afternoon yaruo time", + "link":"https://gogoyaru.blogspot.com/", + "img":"", + "type":"", + "content":"" + }, + + { + "title":"AA/ASCIIART archive", + "link":"http://azeria.jp/index.php", + "img":"", + "type":"", + "content":"" + }, + + { + "title":"Lolicore music archive", + "link":"https://lolicore.net/", + "img":"lolicore.jpg", + "type":"", + "content":"" + } +] + diff --git a/main.py b/main.py new file mode 100644 index 0000000..92ade29 --- /dev/null +++ b/main.py @@ -0,0 +1,14 @@ +import json +from jinja2 import Environment, FileSystemLoader + +with open("worklist.json","r") as d: + worklist = json.load(d) + +fileLoader = FileSystemLoader("templates") +env = Environment(loader=fileLoader) + +rendered = env.get_template("worklist.html").render(worklist=worklist,title="Test") +fileName = "works.html" + +with open(f"{fileName}","w") as f: + f.write(rendered) \ No newline at end of file diff --git a/makeJson.py b/makeJson.py new file mode 100644 index 0000000..e4368e2 --- /dev/null +++ b/makeJson.py @@ -0,0 +1,26 @@ +import csv +import json + +def csv_to_json(csvFilePath, jsonFilePath): + jsonArray = [] + + #read csv file + with open(csvFilePath, encoding='utf-8') as csvf: + #load csv file data using csv library's dictionary reader + csvReader = csv.DictReader(csvf) + + #convert each csv row into python dict + for row in csvReader: + #add this python dict to json array + jsonArray.append(row) + + #convert python jsonArray to JSON String and write to file + with open(jsonFilePath, 'w', encoding='utf-8') as jsonf: + jsonString = json.dumps(jsonArray, ensure_ascii=False, indent=4) + print(jsonString) + jsonf.write(jsonString) + +csvFilePath = r'worklist.csv' +jsonFilePath = r'worklist.json' + +csv_to_json(csvFilePath, jsonFilePath) diff --git a/static/style.css b/static/style.css new file mode 100644 index 0000000..9407954 --- /dev/null +++ b/static/style.css @@ -0,0 +1,51 @@ + + +img +{ + display: block; + padding: 20px; +} + + +/** make live selection of random links **/ +div.container +{ + +} + + + +h1.title +{ + font-size: 60px; + color: purple; + font-family: "Cursive"; + +} + +a.archive +{ + color: red; + font-size:30px; +} + +a.print +{ + color: yellow; + font-size:45px; +} + +a.video +{ + color: blue; + font-size:50px; +} + +a.audio +{ + color: violet; + font-size:60px; +} + + + diff --git a/templates/homepage.html b/templates/homepage.html new file mode 100644 index 0000000..e69de29 diff --git a/templates/worklist.html b/templates/worklist.html new file mode 100644 index 0000000..be44466 --- /dev/null +++ b/templates/worklist.html @@ -0,0 +1,29 @@ + + + + + + Biyi Wen Works Index {{ title }} + + + +
+
+

Biyi Wen Works Index

+
+
+ {% for item in worklist %} + + "{{item.type}}" + {{item.type}} + "{{item.title}}" + {{item.title}} + + {% endfor %} +
+
Index page is generated with Jinja with an idiosyncratic CMS.
+ +
+ + + \ No newline at end of file diff --git a/worklist.csv b/worklist.csv new file mode 100644 index 0000000..e424a33 --- /dev/null +++ b/worklist.csv @@ -0,0 +1,16 @@ +title,link,img,type,summary,role ,year +RGB Reader,,,Artist book and intervention,The RGB Reader is an artist book that archives the average color samples from the IKEA catalog to showcase the digital materiality of color. The book is accompanied by a cake party that invites guests to taste colored cakes as a tangible intervention.,,2018 +How Many Cats?,,,Artist book and intervention,"“How Many Cats?” is a participatory artist book that playfully intervenes on the subjects of data collection, batch processing, and machine learning on a slow and personal scale. The book presents a collection of my selfies taken with cats, and invites the reader to hand count the total number of cats appeared in the book.",,2018 +Libraries amongst others: A network publication,,,Networked publication," Summary: The publication is a textually networked publication that speaks of a cultural ecology of publishing and archiving from the lens of my childhood experiences. The experiences are on institutional, parasitical, and personal scales: reading at municipal libraries, my aunt’s print shop, and my friend’s personal library. The publication is structured as a network of hyperlinked pages. The hyperlinked network is used as an intermedia writing medium to present the myriad of networks in which text circulates.",,2019 +The Repeater Archive ,,,Archive,"The archive animates the repeater, a language aid learning device similar to the dictaphone popular in China in the late 90s. In the archive, a navigator “onebigear” guides the visitor with narration and reflection. “onebigear” narrates my childhood experience using the device to learn English, and it reflects on the device in the framework of material and cultural media history. The reflection discusses how the transmission and storage of standardized English speech intended for language instruction is a process of power that is uniquely embedded in the materiality of magnetic tape recordings.",,2020 +avant la lettre: media archaeology cn,,,Online conference," Summary: The conference proposed a materialist approach to understanding the history of Chinese text processing. It was curated with three thematic panels discussions: “Input/Output”, focusing on the materialities of Chinese digital word processors, input method, and Chinese character card; “Hardware/Software”, focusing on presenting emulated demonstrations to illustrate how Chinese text were processed in the early computer models and operating systems developed in China; and “Publishing Surfaces”, focusing on the intermedia writing practices that directly concerns the role of text in hybrid publishing procedures.","Curator, host, organizer",2021 +dot_text_tile,,,Hybrid and interactive installation,"The work activates and materializes the overlap between the history of computation and textile. Drawing from the history of the punch card as a material storage medium that automated both looms and computers, the installation interactively weaves textiles based on dynamic input from questionnaires filled in by the audience that poetically blends the computational aspects of textile and the condition of textile production in Southeastern China.",Researcher ,2021 +Channel Channel,,,,,,2019 +Contextual Electronics,,,,,,2019 +bpNichol Reader,,,,,,2022 +Machine Learning 4 Cats,,,,,,2022 +The Radio Book ,,,,,,2022 +textArchaeology,,,,,,2022 – ongoing +IRIS,,,,,, +The Library Is Open,,,,,,2018 +,,,,,,2019 diff --git a/worklist.json b/worklist.json new file mode 100644 index 0000000..75dd833 --- /dev/null +++ b/worklist.json @@ -0,0 +1,137 @@ +[ + { + "title": "RGB Reader", + "link": "", + "img": "", + "type": "Artist book and intervention", + "summary": "The RGB Reader is an artist book that archives the average color samples from the IKEA catalog to showcase the digital materiality of color. The book is accompanied by a cake party that invites guests to taste colored cakes as a tangible intervention.", + "role ": "", + "year": "2018" + }, + { + "title": "How Many Cats?", + "link": "", + "img": "", + "type": "Artist book and intervention", + "summary": "“How Many Cats?” is a participatory artist book that playfully intervenes on the subjects of data collection, batch processing, and machine learning on a slow and personal scale. The book presents a collection of my selfies taken with cats, and invites the reader to hand count the total number of cats appeared in the book.", + "role ": "", + "year": "2018" + }, + { + "title": "Libraries amongst others: A network publication", + "link": "", + "img": "", + "type": "Networked publication", + "summary": " Summary: The publication is a textually networked publication that speaks of a cultural ecology of publishing and archiving from the lens of my childhood experiences. The experiences are on institutional, parasitical, and personal scales: reading at municipal libraries, my aunt’s print shop, and my friend’s personal library. The publication is structured as a network of hyperlinked pages. The hyperlinked network is used as an intermedia writing medium to present the myriad of networks in which text circulates.", + "role ": "", + "year": "2019" + }, + { + "title": "The Repeater Archive ", + "link": "", + "img": "", + "type": "Archive", + "summary": "The archive animates the repeater, a language aid learning device similar to the dictaphone popular in China in the late 90s. In the archive, a navigator “onebigear” guides the visitor with narration and reflection. “onebigear” narrates my childhood experience using the device to learn English, and it reflects on the device in the framework of material and cultural media history. The reflection discusses how the transmission and storage of standardized English speech intended for language instruction is a process of power that is uniquely embedded in the materiality of magnetic tape recordings.", + "role ": "", + "year": "2020" + }, + { + "title": "avant la lettre: media archaeology cn", + "link": "", + "img": "", + "type": "Online conference", + "summary": " Summary: The conference proposed a materialist approach to understanding the history of Chinese text processing. It was curated with three thematic panels discussions: “Input/Output”, focusing on the materialities of Chinese digital word processors, input method, and Chinese character card; “Hardware/Software”, focusing on presenting emulated demonstrations to illustrate how Chinese text were processed in the early computer models and operating systems developed in China; and “Publishing Surfaces”, focusing on the intermedia writing practices that directly concerns the role of text in hybrid publishing procedures.", + "role ": "Curator, host, organizer", + "year": "2021" + }, + { + "title": "dot_text_tile", + "link": "", + "img": "", + "type": "Hybrid and interactive installation", + "summary": "The work activates and materializes the overlap between the history of computation and textile. Drawing from the history of the punch card as a material storage medium that automated both looms and computers, the installation interactively weaves textiles based on dynamic input from questionnaires filled in by the audience that poetically blends the computational aspects of textile and the condition of textile production in Southeastern China.", + "role ": "Researcher ", + "year": "2021" + }, + { + "title": "Channel Channel", + "link": "", + "img": "", + "type": "", + "summary": "", + "role ": "", + "year": "2019" + }, + { + "title": "Contextual Electronics", + "link": "", + "img": "", + "type": "", + "summary": "", + "role ": "", + "year": "2019" + }, + { + "title": "bpNichol Reader", + "link": "", + "img": "", + "type": "", + "summary": "", + "role ": "", + "year": "2022" + }, + { + "title": "Machine Learning 4 Cats", + "link": "", + "img": "", + "type": "", + "summary": "", + "role ": "", + "year": "2022" + }, + { + "title": "The Radio Book ", + "link": "", + "img": "", + "type": "", + "summary": "", + "role ": "", + "year": "2022" + }, + { + "title": "textArchaeology", + "link": "", + "img": "", + "type": "", + "summary": "", + "role ": "", + "year": "2022 – ongoing" + }, + { + "title": "IRIS", + "link": "", + "img": "", + "type": "", + "summary": "", + "role ": "", + "year": "" + }, + { + "title": "The Library Is Open", + "link": "", + "img": "", + "type": "", + "summary": "", + "role ": "", + "year": "2018" + }, + { + "title": "", + "link": "", + "img": "", + "type": "", + "summary": "", + "role ": "", + "year": "2019" + } +] \ No newline at end of file diff --git a/works.html b/works.html new file mode 100644 index 0000000..90835ab --- /dev/null +++ b/works.html @@ -0,0 +1,127 @@ + + + + + + Biyi Wen Works Index Test + + + +
+
+

Biyi Wen Works Index

+
+
+ + + "Artist book and intervention" + Artist book and intervention + "RGB Reader" + RGB Reader + + + + "Artist book and intervention" + Artist book and intervention + "How Many Cats?" + How Many Cats? + + + + "Networked publication" + Networked publication + "Libraries amongst others: A network publication" + Libraries amongst others: A network publication + + + + "Archive" + Archive + "The Repeater Archive " + The Repeater Archive + + + + "Online conference" + Online conference + "avant la lettre: media archaeology cn" + avant la lettre: media archaeology cn + + + + "Hybrid and interactive installation" + Hybrid and interactive installation + "dot_text_tile" + dot_text_tile + + + + "" + + "Channel Channel" + Channel Channel + + + + "" + + "Contextual Electronics" + Contextual Electronics + + + + "" + + "bpNichol Reader" + bpNichol Reader + + + + "" + + "Machine Learning 4 Cats" + Machine Learning 4 Cats + + + + "" + + "The Radio Book " + The Radio Book + + + + "" + + "textArchaeology" + textArchaeology + + + + "" + + "IRIS" + IRIS + + + + "" + + "The Library Is Open" + The Library Is Open + + + + "" + + "" + + + +
+
Index page is generated with Jinja with an idiosyncratic CMS.
+ +
+ + + \ No newline at end of file