2d:null 2e:["$","title",null,{"children":"Monokai's Drifters | Anaglyphic | Observable"}] 33:T486,What I can explain is why I decided to spend most of my artistic revenue during a certain period of time to buy 42 Drifters after letting it aside for weeks. There are four main reasons for that. The first one is that I came to understand that many if not most collectors, including ones spending *a lot* of money on such generative art tokens, had no idea how pieces were made or what they were buying. The second reason is that, as might now be clear, I'm personally sensitive to artistic concepts that are both light and performative. Mixing up juvenile literature aesthetics and somewhat unsettling creatures is, in that regard, a good find. The third reason is that obtaining such organic results with such performances in JS is quite a technical achievement, and particularly so when most of the pieces we see are trivial p5.js landscapes which can take full minutes to render a single image. And finally the fourth reason is that it was affordable: none of the deep-pocketed collectors had established a position on its supply, which had been the case on the [Monokai token before that one](https://twitter.com/anaglyph_ic/status/1552183574698332160).34:[] 31:{"id":"2623c48a7d0b6f8f","slug":"monokai-drifters","title":"Monokai's Drifters","thumbnail":"594d3a40dbe6383a9f2394a1f8e656ab15756906bbb3310dc466110dcd8a4c1a","access_level":"public","create_time":"$D2022-07-27T11:23:45.721Z","update_time":"$D2022-12-10T17:05:02.868Z","view_time":null,"first_public_time":"$D2022-07-28T17:15:48.897Z","has_unpublished_edits":null,"fork":{"id":"743e7200cf24c311","slug":"infinite-exploration-of-any-fxhash-gentk","title":"Infinite exploration of any fxhash gentk","owner":{"id":"800970edcaeb8f91","login":"anaglyph-ic","name":"Anaglyphic"}},"stars":18,"starred":false,"owner":{"type":"team","id":"800970edcaeb8f91","login":"anaglyph-ic","name":"Anaglyphic","avatar_url":"https://avatars-next.observableusercontent.com/19aeef7ac69ee14cef82c97e6c0c159bd26401d7c0a84015f40729f56e262d5e","tier":"starter_2024"},"version":554,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"6f0f4212e751586f","login":"anaglyph-ic","name":"Anaglyphic","avatar_url":"https://avatars-next.observableusercontent.com/19aeef7ac69ee14cef82c97e6c0c159bd26401d7c0a84015f40729f56e262d5e","tier":null}],"members":[{"type":"individual","id":"6f0f4212e751586f","login":"anaglyph-ic","name":"Anaglyphic","avatar_url":"https://avatars-next.observableusercontent.com/19aeef7ac69ee14cef82c97e6c0c159bd26401d7c0a84015f40729f56e262d5e","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":true,"trashed":false,"lapsed":null,"subscribed":null,"forks":4,"collection":{"id":"304690be4844e50d","slug":"blogs","title":"Blogs","owner":{"id":"800970edcaeb8f91","login":"anaglyph-ic","name":"Anaglyphic"}},"type":"notebook","body":{"title":"Monokai's Drifters","cells":[{"id":0,"value":"# Monokai's Drifters\n---","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":10,"value":"{\n var iframe = DOM.element(\"iframe\");\n iframe.src = `https://gateway.fxhash2.xyz/ipfs/QmThe3jGtwWPXXtkfgSxtZMRVpqAhbrpsdjSSkQTJ7F5Bh/?fxhash=${hash}`;\n iframe.sandbox = \"allow-scripts allow-same-origin\";\n iframe.allow =\n \"accelerometer; camera; gyroscope; microphone; xr-spatial-tracking;\";\n iframe.width = (width * 2) / 3;\n iframe.height = width / 2;\n iframe.style.width = (width * 2) / 3;\n iframe.style.height = width / 2;\n iframe.style.border = \"0px\";\n return iframe;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":40,"value":"viewof button = Inputs.button(\"Click here to generate news Drifters\", {})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":532,"value":"viewof open = Inputs.button(\n \"Click here to open these Drifters in a new tab\",\n {}\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":64,"value":"*Disclaimer: Drifters is a piece of generative art. Its author, [Wimer Hazenberg aka Monokai](https://monokai.nl/), wrote an algorithm that generates the animated piece you see above. He published it on a generative art platform called `fx(hash)` and opened the possibility for people to fix certain iterations. At time of writing this article, the author is the largest unique holder of drifters (43/256). You can check the generator on [`fx(hash)`](https://www.fxhash.xyz/generative/slug/drifters) and check owners and metadata on [fxfam](https://fxfam.xyz/12055).*","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":79,"value":"----","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":166,"value":"**I**t's often when friends your age start dying that you ask yourself what made you a cohort in the first place. How is it that people the same age usually manage to relate to one another? What is the \"generational fabric\" made of? The easy explanation is that we who were born at the same time fundamentally share the same cosmos of signification. We were given the same [core narratives](https://fr.wikipedia.org/wiki/Marthe_Robert) on which we built a understanding of the social world.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":173,"value":"I was surprised to realise that a largely shared feature of my cohort is the early ownership of a copy of *Der Regenbogenfisch*, known in English as [The Rainbow Fish](https://en.wikipedia.org/wiki/The_Rainbow_Fish). It's no surprise that one's school friends have the same books: if you're living in a same area, going to the same school, chances are you share a lot of the same social and cultural background. But what's more uncanny is making this discovery as an adult age, going to an adult's room to do adult things with another consenting adult, and find out the Rainbow Fish watching you from a shelf.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":182,"value":"Drifters inhabit the same pseudojuvenile world, the same underwater cosmos. The difference is that nothing is simple anymore. Reality has revealed its propension to chaos. Giving your shiny scales to others will not always work. Disheartening social encounters will not always have a solution. There is no magic recipe that will make you and others feel good about yourselves. And then one day your friends start dying and they never stop.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":192,"value":"---\n```\nIn an undiscovered area, you've stumbled upon an unknown creature.\n```\n---","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":201,"value":"**T**he power of Drifters lies in their ability to inhabit an ambiguous space of signification. They're both reassuring and worrying. But how? How is it possible that one creates a *generative* children's book aesthetics that is instantly naturalised by the spectator? The foundation of this work is a generative scene that is immediately relatable and put out of conscious focus.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":324,"value":"htl.html`

${addplot(bgfeatures[0])}${addplot(\n bgfeatures[1]\n)}${addplot(bgfeatures[2])}

${addplot(\n bgfeatures[3]\n)}${addplot(bgfeatures[4])}

`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":336,"value":"*Figure 1: bar charts representing the distribution of all \"background features\" on the final set of 256 blockchain-fixed iteration.* ","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":334,"value":"A quick look at the diversity of the final set tells an interesting story of why this could be. The combination of five discrete elements (the dispatch of the scene, the coral coverage, the coral nature, the coral reef's distribution and the presence/absence/nature of visitors) gives a sens of the potential diversity. Each background in itself is the product of one of 432 possible combinations, not counting the palettes.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":370,"value":"Then come the drifters themselves. It might seem paradoxical, but not too much should be told about them. One should find the strength to pause their day for five minutes, open them fullscreen, and watch them be. If there is magic in this code, it is in the way they appear and disappear, move and dance, show and hide. What is striking to the eye of the spectator is the simplicity & organicity of their movements. Yes, the logic is algorithmic. But so are all forms of communication: there's a reason there are such things as programming *languages* after all.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":374,"value":"htl.html`

${addplot(bgfeatures[5])}${addplot(\n bgfeatures[6]\n)}${addplot(bgfeatures[8])}

`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":381,"value":"*Figure 2: bar charts representing the distribution of all \"Drifter features\" on the final set of 256 blockchain-fixed iteration.* ","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":393,"value":"How is it made? If you're a somewhat accomplished developer, you might have an idea. It will be for Monokai to write and publish an article on how Drifters were generated when the time comes, if he so chooses to. What is most striking is an ability to make a series of non-anthropomorphic figures \"dance\". This might seem trivial, but building an evocative choreography for somewhat undefined creatures is something I had personally never seen before.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":161,"value":"----\n```\nYou're wondering what it's doing.\n```\n----","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":74,"value":"**W**hen the Drifters generator first came online, I could only afford to get one. Things were a bit special back then. After several weeks of pause, the `fx(hash)` platform had been reopened with new features. In the two weeks that followed, many artists published new generators. Some pushed the limits set by their prior works, others simply rehashed what had been done before.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":91,"value":"It was common at the time that \"well known artists\" would \"instantly mint out\". In other words, some developers had built systems that would buy all the available iterations of a generator published by a famous artist on the primary market, and re-list them for several times their original amount on the secondary market. Monokai is by far the best known name publishing on this platform, probably thanks to its IDE theme (which cumulates [1,6 million installs](https://marketplace.visualstudio.com/items?itemName=monokai.theme-monokai-pro-vscode) on VSCode).","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":400,"value":"Plot.plot({\n height: 250,\n marks: [Plot.ruleY([0]), Plot.lineY(mintSequence, { x: \"date\", y: \"Minted\" })]\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":420,"value":"*Figure 3: Minting of Drifters over time. Data obtained from `fx(hash).`*","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":416,"value":"The Dutch auction that was set up, starting at 96 and finishing at 16, did not follow the pattern other generators had followed the days before. Drifters did not instantly mint out : it would take a full month to happen. ","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":96,"value":"----\n```\nIt seems to move in patterns, and sometimes suddenly changes course.\nIs it communicating?\n\n(to whom?)\n```\n----","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":110,"value":"**I** do not have an explanation for that. Some might argue that the \"minting out\" behaviour is a game-theory fed botnet (systems buying massive amounts of tokens to sell them at a higher price), and that the architects of these botnets did not factor Monokai. That's *de facto* true, but we cannot explain why. Others will say that all that matters is the snapshot preview taken by the `fx(hash)` virtual machines, and that the collectors did not know, care or realise it was moving in a subtle series of predetermined choreographies. That's probably also true, but they did not act on it on the weeks that followed either. So, again, it does not explain why.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":117,"value":"$33","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":131,"value":"----\n\n`And it all makes sense.`\n\n----","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":134,"value":"**M**any have stated strong opinions on what is happening with generative art in the blockchain age. My own observation is that the game theory explanations does not have merit in the specific niche Drifters were published on. Many primary purchases are made through a front-less system, that is without any access to what the piece looks like, which takes out the piece-specific rationalisation argument. Most collectors have no idea what they are doing, do not know how the pieces are generated and/or do not understand what it takes to get to a specific result, which also takes out the technical achievement rationale. What's left is an arbitrage between available liquidity and overall market anticipation.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":459,"value":"Plot.plot({\n grid: true,\n marks: [\n Plot.line(floorovertime, {\n x: \"from\",\n y: \"floor\"\n }),\n Plot.ruleY([0])\n ]\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":478,"value":"*Figure 4: Floor value of Drifters on the secondary market over time. Data is obtained dynamically from `fx(hash)` every time you load this notebook in your browser.*","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":147,"value":"I will hence conclude by formulating what I would call the *Drifters paradox*: the best piece of its genre is both a progeny and a victim of a specific blockchain-powered generative art moment. The expectation of revenue did induce Monokai in taking the time to write this piece of algorithmic poetry. The specific moment of [low liquidity / high supply](https://observablehq.com/@anaglyph-ic/fxhash-revenue?collection=@anaglyph-ic/tezos-tools) sterilised its launch as a market icon. The good news is that it absolutely doesn't matter: the generator is on [IPFS](https://en.wikipedia.org/wiki/InterPlanetary_File_System), and as you saw at the top of this page, you can generate as many drifters as you want by clicking on the button. You can even save a particular iteration by copying the \"hash\" sequence at the bottom of this page. Be grateful to the nonsense, for it gave you Drifters.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":104,"value":"----","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":13,"value":"hash = {\n button;\n let alphabet = \"123456789abcdefghijkmnopqrstuvwxyzABCDEFGHJKLMNPQRSTUVWXYZ\";\n return (\n \"oo\" +\n Array(49)\n .fill(0)\n .map((_) => alphabet[(Math.random() * alphabet.length) | 0])\n .join(\"\")\n );\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":519,"value":"`Change the integer line below to load a different project. Only fx(hash) project ids will work.`","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":512,"value":"project_id = 12055","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":84,"value":"","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":282,"value":"function addplot(feature) {\n var plot = Plot.plot({\n grid: true,\n height: width / 5,\n width: width / 3,\n\n marks: [\n Plot.barY(feature.data, {\n x: \"name\",\n y: \"value\",\n width: width / 40,\n opacity: 0.4,\n sort: { x: \"y\", reverse: true }\n }),\n Plot.ruleY([0])\n ]\n });\n var legend = htl.html`${feature.name}`;\n\n var item = document.createElement(\"DIV\");\n\n item.appendChild(legend);\n item.appendChild(plot);\n\n return item;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":235,"value":"bgfeatures = {\n var bg = [];\n\n var props = [\n \"underwater scene\",\n \"coral coverage\",\n \"coral\",\n \"coral reef\",\n \"visitors\",\n \"drifters\",\n \"choreography\",\n \"colors\",\n \"pattern\"\n ];\n\n props.forEach((d) => {\n var t = { name: d, data: [] };\n for (const type in featuresMap[d]) {\n t.data.push({ name: type, value: featuresMap[d][type].length });\n }\n bg.push(t);\n });\n\n return bg;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":230,"value":"featuresMap = {\n const map = {};\n\n drifters.generativeToken.entireCollection.forEach((d) => {\n d.metadata.attributes.forEach((a) => {\n if (!map.hasOwnProperty(a.name)) {\n map[a.name] = {};\n }\n\n if (!map[a.name].hasOwnProperty(a.value)) {\n map[a.name][a.value] = [];\n }\n map[a.name][a.value].push(d.metadata.name);\n });\n });\n\n return map;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":404,"value":"mintSequence = {\n var seq = [];\n\n var count = 256;\n drifters.generativeToken.entireCollection.forEach((d) => {\n count--;\n seq.push({ date: new Date(d.createdAt), Minted: count });\n });\n\n return seq;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":454,"value":"floorovertime = {\n var floors = [];\n\n var mkt = drifters.generativeToken.marketStatsHistory;\n\n for (let i = 0; i < mkt.length; ++i) {\n if (mkt[i].floor) {\n if (floors.length > 0) {\n if (floors[floors.length - 1].floor === mkt[i].floor) {\n } else {\n floors.push(mkt[i]);\n }\n } else {\n floors.push(mkt[i]);\n }\n }\n }\n\n floors.forEach((d) => {\n d.floor = d.floor / 1000000;\n\n d.from = new Date(d.from);\n });\n\n return floors;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":213,"value":"drifters = await graph\n .request(\n \"https://api.fxhash.xyz/graphql\",\n graph.gql`query Query($generativeTokenId: Float, $filters: MarketStatsHistoryInput!) {\n generativeToken(id: $generativeTokenId) {\n entireCollection {\n metadata\n owner {\n name\n id\n }\n activeListing {\n price\n }\n createdAt\n }\n marketStatsHistory(filters: $filters) {\n floor\n from\n }\n }\n}`,\n filters\n )\n .then((r) => r)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":434,"value":"filters = {\n var date = new Date();\n\n date = date.toISOString();\n\n return `{\n \"generativeTokenId\": ${project_id},\n \"filters\": {\n \"from\": \"2022-04-25T15:40:29\",\n \"to\": ${JSON.stringify(date)}\n }\n}`;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":217,"value":"graph = import(\"https://cdn.skypack.dev/graphql-request@4.0.0?min\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":252,"value":"import { vl } from \"@vega/vega-lite-api\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":535,"value":"{\n setTimeout(() => {\n document\n .getElementsByClassName(\"oi-ec050e\")[2][0]\n .addEventListener(\"click\", () => {\n window.open(document.querySelector(\"iframe\").src);\n });\n }, 1500);\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W34","stdlib":"1","titling":"auto"}} 32:"$31:body"