2a:null 2b:["$","title",null,{"children":"Assignment 10 - GenArt | John C | Observable"}] 31:T786,

Part A

Below is a segment of the generated book

Koifozo poirilenkingakui laxuxe zoixandinsunbunsa xowxigekui bosoi fovoisafa pevu mawko kevi kunmabawva xekemenlow jan juixanma ren tivabowpenfawvei di yenzenjarui feifepafe vawjovan veijuizu jeizupintei munbitaw fuvapexeyagen. Zenfoi lanyen. Xipiyagoisaw geivunpowven mudenlakun. Bon sendinseka gawdui pudui. Jenyen de reifasondonza xeibinyuibowxan. Dikanmen furan venviyenbokondu menfaw zuiloxojo yinzeiteluzazi muiyaw penranpaw denpowlan ranran doza. Funkalin voitinxugunyo. Vei ra xoixun fensezoizabuixoi kinsinfuibon tenbowyeiyuirawsan.

"This uses the Bitspeech lookup tables of consonants and vowels to generate an asemic stream of words formatted into semi-rhythmic sentences and paragraph breaks."

Based on the Bitspeech lookup algorithm, a method for translating base 16 hex values into words by mapping the underlying input value into chunks of bits which map to lookup tables of vowels and consonants, Rickerby generated steam of meaningless but rhythmic words. Try to read the generated novel out loud, it feels like it is written with an ancient Northern European language, and maybe contains some kind of hex. Perhaps, it is telling a story of how powerful magic is used by and finally destroyed the civilization, so their language and cities, with the magic, are forever lost.

The orginal code in Ruby comes in 255(or 256 if you are using a PC) characters, which is incredibly small. Below is the source code.

32:T1aec,p5(s => { const exampleExpandRule = { "X": "FF|XFF+[FF-F-X]++F|X|J-G", "F": "X+F-[F+F-]X|F[F-F+]X|G-J", "G": "G-G|G+G", "J": "+[+J]-[-G]XF|-[-J]+[+G]XF" }; const exampleDrawRule = { "F": {method: (l) => {s.line(0,0,l,0);s.translate(l,0);}, para: 3}, "+": {method: (d) => {s.rotate(d)}, para: 89}, "-": {method: (d) => {s.rotate(d)}, para: -59}, "[": {method: () => {s.push()}, para: undefined}, "]": {method: () => {s.pop()}, para: undefined}, "G": {method: (r) => {s.translate(r,0);s.push();s.noStroke();s.ellipse(0,0,r,r);s.pop();s.translate(r,0);}, para: 4}, "J": {method: (arr) => {s.rectMode(s.CENTER);s.push();s.noStroke();s.rect(s.random(arr[0],arr[1]),s.random(arr[0],arr[1]),s.random(arr[2],arr[3]),s.random(arr[4],arr[5]));s.pop();}, para: [5,10,2,5,2,5]} }; const expandRuleA = { "F": "FF-F+F-F-FF" }; const drawRuleA = { "+": {method: (d) => {s.rotate(d)}, para: 90}, "-": {method: (d) => {s.rotate(d)}, para: -90}, "F": {method: (d) => { s.push(); s.noStroke(); s.rectMode(s.CENTER); let total = 0; let num = s.random([5,6,7,8]); let avg = d/num; do{ let tw = s.random(0.7, 1.3) * avg; let ratio = s.random(1.2,3.2); let th = tw*ratio; s.rect(total + tw/2,0,tw * s.random(1,1.5),th); total += tw; } while(total < d) s.pop(); s.translate(d,0); }, para: 25} }; const expandRuleB = { "F" : "F-G+F+G-F", "G" : "GG" }; const drawRuleB = { "+": {method: (d) => {s.rotate(d)}, para: 120}, "-": {method: (d) => {s.rotate(d)}, para: -121}, "F": {method: (d) => { //s.line(0,0,d,0); s.push(); s.noStroke(); let pointNo = s.random([3,4,5,6,7]); let points = new Array(pointNo); for (let i = 0; i < points.length; i ++) { points[i] = [(i + 1) * (d/(pointNo + 1)) + (s.random(-1,1) / ((pointNo + 1)*2)) * d,s.random(-d/3,d/3)]; } s.beginShape(); s.vertex(0,0); s.curveVertex(d,0); s.curveVertex(0,0); for (const p of points) { s.curveVertex(p[0],p[1]); } s.curveVertex(d,0); s.curveVertex(0,0); s.vertex(d,0); s.endShape(s.CLOSE); s.pop(); s.translate(d,0); }, para:15}, "G": {method: (d) => { s.translate(d,0); }, para:15}, }; const expandRuleC = { "F": "FF-F+F-F-FF|F-G+F+G-F", "G": "GG|FF" }; const drawRuleC = { "+": {method: (d) => {s.rotate(s.random(d))}, para: [90]}, "-": {method: (d) => {s.rotate(s.random(d))}, para: [-90]}, "F": {method: (d) => { s.push(); s.noStroke(); s.rectMode(s.CENTER); let total = 0; let num = s.random([5,6,7,8]); let avg = d/num; do{ let tw = s.random(0.7, 1.3) * avg; let ratio = s.random(1.2,3.2); let th = tw*ratio; s.rect(total + tw/2,0,tw * s.random(1,1.5),th); total += tw; } while(total < d) s.pop(); s.translate(d,0); }, para: 25}, "G": {method: (d) => { s.push(); s.noStroke(); let pointNo = s.random([3,4,5,6,7]); let points = new Array(pointNo); for (let i = 0; i < points.length; i ++) { points[i] = [(i + 1) * (d/(pointNo + 1)) + (s.random(-1,1) / ((pointNo + 1)*2)) * d,s.random(-d/3,d/3)]; } s.beginShape(); s.vertex(0,0); s.curveVertex(d,0); s.curveVertex(0,0); for (const p of points) { s.curveVertex(p[0],p[1]); } s.curveVertex(d,0); s.curveVertex(0,0); s.vertex(d,0); s.endShape(s.CLOSE); s.pop(); s.translate(d,0); }, para: 30}, }; const generateTradition = function(initStr, expandRule, iterationNo){ let str = initStr; for (let i = 0; i < iterationNo; i ++) { str = expand(str, expandRule); } return str; } const renderStatic = function (initStr, expandRule, iterationNo, drawRule, startingPoint, noRotation, alpha) { let temC = s.color(s.random(palette)) s.stroke(temC); temC.setAlpha(alpha) s.fill(temC) let str = generateTradition(initStr, expandRule, iterationNo); let tur = turtleDraw(str, drawRule); s.push(); s.translate(startingPoint.x, startingPoint.y); if (!noRotation) s.rotate(s.random(-90,90)); while(!tur.next().done){} s.pop(); } const palette = ["#000f08","#136f63","#e0ca3c","#f34213","#3e2f5b"]; let ruleSet = []; s.setup = function (){ s.createCanvas(600,600); s.background(255); s.angleMode(s.DEGREES); s.noFill(); s.stroke(0); s.strokeWeight(0.5); //s.blendMode(s.MULTIPLY); switch(opts){ case "1": ruleSet.push(exampleExpandRule,exampleDrawRule,7,9,[.4,.6],[.4,.6],["X","FX","F"],false, 32, 6); break; case "2": ruleSet.push(expandRuleA,drawRuleA,2,5,[.5,.7],[.3,.5],["F-F-F-F"], true, 32, 5); break; case "3": ruleSet.push(expandRuleB,drawRuleB,5,8,[0,1],[0,1],["F-G-G"],false, 150, 12); break; case "4": ruleSet.push(expandRuleC,drawRuleC,3,6,[.5,.7],[.3,.5],["F-F-F-F", "F-G-G"], true, 32, 5); break; default: break; } } s.draw = function (){ s.blendMode(s.random([s.DIFFERENCE,s.BLEND,s.EXCLUSION, s.REPLACE])); for (let times = 0; times < ruleSet[9]; times++) { renderStatic(s.random(ruleSet[6]), ruleSet[0], s.floor(s.random(ruleSet[2],ruleSet[3])), ruleSet[1], new p5c.Vector(s.random(ruleSet[4][0],ruleSet[4][1]) * s.width, s.random(ruleSet[5][0],ruleSet[5][1]) * s.height), ruleSet[7], ruleSet[8]); } s.noLoop(); } s.mouseClicked = function () { if (s.mouseX > 0 && s.mouseY > 0&& s.mouseX < s.width && s.mouseY < s.height) { s.blendMode(s.BLEND); s.background(255); s.loop(); } } const expand = function (input, rule) { if (typeof input !== 'string' || typeof rule !== 'object') { console.error("invaild input/rule @expand"); return ""; } let res = ""; for (let i = 0; i < input.length; ++i) { if ((Object.keys(rule)).includes(input[i])) { if (rule[input[i]].includes('|')) { let toChooseFrom = rule[input[i]].split("|"); res += s.random(toChooseFrom); } else { res += rule[input[i]]; } } else { res += input[i]; } } return res; } const turtleDraw = function* (input, rule) { if (typeof input !== 'string' || typeof rule !== 'object') { console.error("invaild input/rule @turtle"); return; } else { for (let i = 0; i < input.length; ++i) { let character = input[i]; if (!Object.keys(rule).includes(input[i])) continue; rule[input[i]].method(rule[input[i]].para); yield ""; } return; } } })33:[{"id":"b78a926795abccc166f24e9d658f2e81c9f25a79079196e2381e77065f7cc5b25798775ebe5497426b3e5ec0dedcdbf27689be599a99cdca594a061ebcb77389","href":"https://static.observableusercontent.com/files/b78a926795abccc166f24e9d658f2e81c9f25a79079196e2381e77065f7cc5b25798775ebe5497426b3e5ec0dedcdbf27689be599a99cdca594a061ebcb77389","name":"圖片@2.png","type":"image/png","lastModified":1637066331773.87,"size":703439},{"id":"13a066e9278c560c18a8b94a4781b91ac5e424becb8a866ce972843ed68f949386ebdc93533c6e7411beda8d1ca3f93e213635b938fea1edb59d13c035ee6f51","href":"https://static.observableusercontent.com/files/13a066e9278c560c18a8b94a4781b91ac5e424becb8a866ce972843ed68f949386ebdc93533c6e7411beda8d1ca3f93e213635b938fea1edb59d13c035ee6f51","name":"圖片@3.png","type":"image/png","lastModified":1637066378121.142,"size":1337027},{"id":"2494a0bfcc57b8545c1fba467b6298f47247e5f6de5b7516544f6d527700bd0a46699f0364ec6080077572f44b94a60c135c62ba6053d0ab2cc42c72d61f5969","href":"https://static.observableusercontent.com/files/2494a0bfcc57b8545c1fba467b6298f47247e5f6de5b7516544f6d527700bd0a46699f0364ec6080077572f44b94a60c135c62ba6053d0ab2cc42c72d61f5969","name":"圖片@4.png","type":"image/png","lastModified":1637069366128.58,"size":431639},{"id":"d7f5893fbd10856d83b23c97db8b0e3a215d131b565b76baeaea3e67219065035775ebb11628f0a9ce8002ff5d86607d18cfa53c61b0141a5b73050a7048b12f","href":"https://static.observableusercontent.com/files/d7f5893fbd10856d83b23c97db8b0e3a215d131b565b76baeaea3e67219065035775ebb11628f0a9ce8002ff5d86607d18cfa53c61b0141a5b73050a7048b12f","name":"圖片@5.png","type":"image/png","lastModified":1637069413580.798,"size":697746}] 2e:{"id":"202d91298debcf55","slug":"assignment-10-genart","title":"Assignment 10 - GenArt","thumbnail":"f44fc95222522b20a8663fa2bdca0d64309f58436d9e17947f4a8d906438b25c","access_level":"public","create_time":"$D2021-11-15T07:25:27.735Z","update_time":"$D2021-11-17T06:07:04.437Z","view_time":null,"first_public_time":"$D2021-11-16T13:30:41.275Z","fork":false,"stars":0,"starred":false,"owner":{"type":"team","id":"b2e9840be7b1b607","login":"real-john-cheung","name":"John C","avatar_url":"https://avatars-next.observableusercontent.com/1d9ef6121a0bbd1a75fab479f9891fe1d78cc65f76c394585ae1a7dad0d3abf6","tier":"starter_2024"},"version":332,"publish_version":332,"role":null,"authored":false,"authors":[{"type":"individual","id":"e8e99acdbe3aebfb","login":"real-john-cheung","name":"John C","avatar_url":"https://avatars-next.observableusercontent.com/1d9ef6121a0bbd1a75fab479f9891fe1d78cc65f76c394585ae1a7dad0d3abf6","tier":null}],"members":[{"type":"individual","id":"e8e99acdbe3aebfb","login":"real-john-cheung","name":"John C","avatar_url":"https://avatars-next.observableusercontent.com/1d9ef6121a0bbd1a75fab479f9891fe1d78cc65f76c394585ae1a7dad0d3abf6","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"title":"Assignment 10 - GenArt","cells":[{"id":0,"value":"

Assignment 10 - GenArt

","pinned":false,"hidden":false,"mode":"html"},{"id":18,"value":"$31","pinned":false,"hidden":false,"mode":"html"},{"id":32,"value":"```ruby\nc=%w(p b t d k g x j f v l r m y s z)\nv=%w(a e i o u an en in un on a ei oi ui aw ow)\nt=\"\"\nu=[?\\s]*9+[\". \",\".\\n\\n\"]\nq=->x{x[-2]=~/[.\\n]/}\n50000.times{rand(1..6).times{|i|t<<(i<1&&q[t]?c.sample.upcase: c.sample)+v.sample};t<Part B","pinned":false,"hidden":false,"mode":"html"},{"id":166,"value":"viewof opts = {\n //ref to https://observablehq.com/@s-haensch/multiple-inputs-in-a-cell\n const form = html`\n \n` ;\n form.oninput = () => {\n form.value = form.rules.value;\n}\n form.value = form.rules.value;\n \n return form;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":52,"value":"$32","pinned":false,"hidden":false,"mode":"ojs"},{"id":237,"value":"

","pinned":false,"hidden":false,"mode":"html"},{"id":45,"value":"

Part C

Readings Responses

","pinned":false,"hidden":false,"mode":"html"},{"id":11,"value":"

","pinned":false,"hidden":false,"mode":"html"},{"id":8,"value":"html`\n\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":15,"value":"import {p5,p5c} from \"@real-john-cheung/sm3809-a1\"","pinned":false,"hidden":false,"mode":"ojs"}],"files":"$W33","stdlib":"1","titling":"auto"}} 2f:"$2e:body"