2d:null 2e:["$","title",null,{"children":"Assignment 4: Code Self-portrait | KarlieDoesNotExist | Observable"}] 33:T8e3,md` ## REALISATION
Artworks like Stranger Visions, Advertising Positions and Facial Weaponization Suite are all calling attention to the developing technology, but from a not so positive perspective. Stranger Visions one of those that impressed me a lot. When I was watching the video, I doubt whether it's possible to collect such a lot of comprehensive, precise DNA information just from a piece of protein. Since I know that there are lots of uncertainty exists in the process of translation from RNA to protein in our bodies, and it's not a one-to-one translation. Yet, when scrolling down the page and seeing those data collection, I was still surprised by the accuracy of the descriptive information of the samples. I supposed the artist was must be intended to display the final model, the DNA data, and the originally collected objects (hairs, chewing gums, etc.) together within one set. It created such an impact on the audience, that your DNA can be extracted so precisely, even from such daily and random things like hairs. And it made me realise that, with modern technology, everything about you can be exposed to the public. Furthermore, these works focus on the issues of human rights and equality brought about by the development of modern technology. Some are designed to draw people's attention to certain issues, while others are raising revolts. The artists used portraitures to remind audiences of the harm and pain caused by the "improper" use of these advanced technologies. To me, they remind me not only of the problems of the advanced technology but furthermore, the narrowness of human nature and the inequality in the society is so pervasive that they have already been involved in the field of modern technology. In [Memories of Passersby I](https://www.sothebys.com/en/articles/artificial-intelligence-and-the-art-of-mario-klingemann), I found that the morphing from one common shape to another always draws the audience's attention, especially when the morphing process, generated by the neural networks, becomes more unpredictable for people. It reminds me of another [Google experiment project](https://artsexperiments.withgoogle.com/xdegrees/xwERWaqDyIcZ9w/ogGvLdZg_9FlIQ) that "reveals" a transition between paintings.
`34:T92e,md` ### What modification I did on the top of the original work: - Wrote a P5js version, of course : ) - Modified the original line-generating algorithms a bit, and add some random factor so that it looks more like "a mirror smashed to pieces". - Wrote a new colour-filling function, which picks colours from a photo of mine. - Add a function to make it stop after it completes those existing lines, when there are enough lines and fragments.
### What did I learn from the original algorithm The algorithm takes a very smart and innovative way to "detect collision" and generate new lines. As common, it uses a point to draw a jerky but straight line. However, how does the programme know when and where the lines meet so that it could stop drawing and start a new line? And where should the new line begin? (Because clearly that a new line starts at some point on an existing line, but we don't exactly know the coordinate of this point.) In this programme, a **2D array**, containing M columns and N rows where M and N equal to the width and height of the canvas, is adopted to store a **magic number** that indicates whether is this location occupied or not. Furthermore, it stores the inclination angle when the line (point actually) passes through this location. Basically, the initial values in this array are all set to 10001, with just a lucky few will be randomly picked and set to a **DEGREE**, like half PI or PI. And from those points, the drawing begins. When the line(point) passes through each pixel, the original 10001 will be rewritten as this **DEGREE**. If another line is getting close to this location, it would first check if the corresponding value is greater than 10000. If so, the line can continue to grow, otherwise it stops and pick an "occupied location" and generate a new line. (I hope this make sense...😢) The advantage of this approach is that it will also tell the programme where to start to draw a new line, and how many degrees should the new line rotate. So each time a line collides with another line or the border, the programme will pick a point whose value is smaller than 10000 and reads that number of degrees. Base on the number of degrees, the programme add or subtract a certain number so that the new line will be perpendicular to its "father line". *(enough of these* 🤯*)*
`35:[{"id":"6fb3ba1a4cce1310c6c533cab9016d4cfeae0f8da231fa6ac349a15923d04e7be4f6815d705b4bbf2395c933f8bb539fd4cc251573aad794f0261ae31e23bb25","href":"https://static.observableusercontent.com/files/6fb3ba1a4cce1310c6c533cab9016d4cfeae0f8da231fa6ac349a15923d04e7be4f6815d705b4bbf2395c933f8bb539fd4cc251573aad794f0261ae31e23bb25","name":"haroldCohen.jpg","type":"image/jpeg","lastModified":1613573281621.372,"size":96788},{"id":"bdd320a8a28299040fe88197fa1bb30ca7baecbeb1ee248fb9b2221dd08c6322f40417e586ca74c8bb6ce4b5936eeec80e8a3fc160b73f4dd117d517388cb54f","href":"https://static.observableusercontent.com/files/bdd320a8a28299040fe88197fa1bb30ca7baecbeb1ee248fb9b2221dd08c6322f40417e586ca74c8bb6ce4b5936eeec80e8a3fc160b73f4dd117d517388cb54f","name":"3.png","type":"image/png","lastModified":1613575926571.321,"size":3945319},{"id":"a0bafe96106c5c5b934c9f757848dd34cca2009732a62d8fb0aee6a6b062ea5279ff90e9ed8ede53d13a41a472fbac303c809fff806e339e2621d36439e8411b","href":"https://static.observableusercontent.com/files/a0bafe96106c5c5b934c9f757848dd34cca2009732a62d8fb0aee6a6b062ea5279ff90e9ed8ede53d13a41a472fbac303c809fff806e339e2621d36439e8411b","name":"1.png","type":"image/png","lastModified":1613575893541.741,"size":1928368},{"id":"8121888d3548a0a76fb55ee3c828e2d442df87db6c61285ddddada315eeb72ba663109fe3bdfaf60321bdb69a01ec2161280eef30182af86ce67b72afffe5af6","href":"https://static.observableusercontent.com/files/8121888d3548a0a76fb55ee3c828e2d442df87db6c61285ddddada315eeb72ba663109fe3bdfaf60321bdb69a01ec2161280eef30182af86ce67b72afffe5af6","name":"2.png","type":"image/png","lastModified":1613575893254.843,"size":2121866}] 31:{"id":"529c964f9eb781a6","slug":"assignment-4-code-self-portrait","title":"Assignment 4: Code Self-portrait","thumbnail":"652edefcd84ac09bfa610e2247b912bd951ab84da9b68a5030d2664e811c11c3","access_level":"public","create_time":"$D2021-02-17T12:44:40.630Z","update_time":"$D2021-02-24T17:40:15.517Z","view_time":null,"first_public_time":"$D2021-02-17T15:41:28.956Z","has_unpublished_edits":null,"fork":false,"stars":6,"starred":false,"owner":{"type":"team","id":"b34c988451399e98","login":"wenrazhao2","name":"KarlieDoesNotExist","avatar_url":"https://avatars-next.observableusercontent.com/64edd542e55cff350a7503e5050267fb1768e8cc5052184b8a8cb49162d172f3","tier":"starter_2024"},"version":159,"publish_version":159,"role":null,"authored":false,"authors":[{"type":"individual","id":"302ba7635bb9b25d","login":"wenrazhao2","name":"KarlieDoesNotExist","avatar_url":"https://avatars-next.observableusercontent.com/64edd542e55cff350a7503e5050267fb1768e8cc5052184b8a8cb49162d172f3","tier":null}],"members":[{"type":"individual","id":"302ba7635bb9b25d","login":"wenrazhao2","name":"KarlieDoesNotExist","avatar_url":"https://avatars-next.observableusercontent.com/64edd542e55cff350a7503e5050267fb1768e8cc5052184b8a8cb49162d172f3","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":true,"trashed":false,"lapsed":null,"subscribed":null,"forks":2,"collection":null,"type":"notebook","body":{"title":"Assignment 4: Code Self-portrait","cells":[{"id":0,"value":"md`# Assignment 4: Code Self-portrait\n\n***Feb 18th, 2021***\n\n
\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":7,"value":"$33","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":11,"value":"md`\n## LOCATE\nHere's a self-portrait code art, called **Image Circular Random Walker** by [Vamoss](https://vamoss.com.br/blogfolio/).\n\n\n\n
\nI think it's cool not only because it uses simple codes but creates interesting effect, but also because of visuals it produces: fragmented, broken, rough and disordered.\n\n
\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":18,"value":"md`\n## CREATE\n\nThis sketch is inspired and modified from [Jared Tarbell’s “Substrate\"](http://www.complexification.net/gallery/machines/substrate/). \n\nWith thanks, I would reference [this webpage](http://discourse.processing.org/t/trying-to-understand-the-substrate-algorithm/3031/12) from the Processing Foundation here as I've learnt so much about this work (though painfully) from it.\n\n
\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":43,"value":"md`\n## In the Broken Mirror\nClick to generate a new one...\n\n\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":113,"value":"md`\nAnd some other interesting (awkward) outputs:\n\n

\n\n
\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":47,"value":"$34","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":21,"value":"md`\n## PRESENT\n
\n# Harold Cohen (1928-2016): \n### [Personal Website](http://aaronshome.com/aaron/index.html)\n

\n\n## Yeah, you can find the PDF of my presentation [here](https://drive.google.com/file/d/1HHjX75pWXs8orH75YMZzbuLxLpd9cJ67/view?usp=sharing).\n
\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W35","stdlib":"1","titling":"auto"}} 32:"$31:body"