2a:null 2b:["$","title",null,{"children":"Paintings of Butterfly | Zihou Ng | Observable"}] 30:[{"id":"f1a7fe145f1a5fe7818179b49956c5d2ccb3941e79915ab45c0bf257b4d8a9986905cd0ff4c96e2bccce6f14fad9c34a456fabf91f9959b7380cc542d5322a12","href":"https://static.observableusercontent.com/files/f1a7fe145f1a5fe7818179b49956c5d2ccb3941e79915ab45c0bf257b4d8a9986905cd0ff4c96e2bccce6f14fad9c34a456fabf91f9959b7380cc542d5322a12","name":"latent_walk_0.jpg","type":"image/jpeg","lastModified":1615799936287.928,"size":1910549},{"id":"ab0cee31bb34da019c6fbc278647376b9cb2480e104ef161fd728b9723a6511288799024d1e5353ee720c18d93a3c9b21942f90508774e698b6bb51fddc220d3","href":"https://static.observableusercontent.com/files/ab0cee31bb34da019c6fbc278647376b9cb2480e104ef161fd728b9723a6511288799024d1e5353ee720c18d93a3c9b21942f90508774e698b6bb51fddc220d3","name":"latent_walk_1.jpg","type":"image/jpeg","lastModified":1615799935254.214,"size":2356040},{"id":"d563a2682f326e622421db661779813cc5f4900549def8d29311ce6e41122527e77ce03451ab55b760321f4c690ff27851054ed69d1bce5894306a83186174bd","href":"https://static.observableusercontent.com/files/d563a2682f326e622421db661779813cc5f4900549def8d29311ce6e41122527e77ce03451ab55b760321f4c690ff27851054ed69d1bce5894306a83186174bd","name":"cover.jpg","type":"image/jpeg","lastModified":1615809641596.742,"size":150009},{"id":"796fd122a403aec4ba2c7101fc34a23d0998644f122635a3b66bafb88690902b73893d87acc4bc6eb07cc681c0d9f56bf98f4cd7a7970fc9f7338bee4a5f245d","href":"https://static.observableusercontent.com/files/796fd122a403aec4ba2c7101fc34a23d0998644f122635a3b66bafb88690902b73893d87acc4bc6eb07cc681c0d9f56bf98f4cd7a7970fc9f7338bee4a5f245d","name":"random_samples_mosaic@1.jpg","type":"image/jpeg","lastModified":1615809484176.611,"size":2353542}] 2e:{"id":"be3d7151d7f6acea","slug":"paintings-of-butterfly","title":"Paintings of Butterfly","thumbnail":"c997c8c8d4d08e7ac1eb88ffc859d251d97c12bda1850f8d1440929a3e4165e3","access_level":"public","create_time":"$D2021-03-15T08:29:21.953Z","update_time":"$D2021-05-20T12:57:09.991Z","view_time":null,"first_public_time":"$D2021-03-15T12:10:19.756Z","fork":false,"stars":8,"starred":false,"owner":{"type":"team","id":"7fad80bf128915e9","login":"stwind","name":"Zihou Ng","avatar_url":"https://avatars-next.observableusercontent.com/ff8a8f73ad220dcaec180c1e813951d692777837355004f062692b49042d2458","tier":"starter_2024"},"version":238,"publish_version":238,"role":null,"authored":false,"authors":[{"type":"individual","id":"dbb85afd665c9e5e","login":"stwind","name":"Zihou Ng","avatar_url":"https://avatars-next.observableusercontent.com/ff8a8f73ad220dcaec180c1e813951d692777837355004f062692b49042d2458","tier":null}],"members":[{"type":"individual","id":"dbb85afd665c9e5e","login":"stwind","name":"Zihou Ng","avatar_url":"https://avatars-next.observableusercontent.com/ff8a8f73ad220dcaec180c1e813951d692777837355004f062692b49042d2458","tier":null,"role":"editor"}],"comments":[{"id":"ed85d4de21a237f3","reply_to_id":null,"content":"I wonder why some generated images contain part of wing in the top. Could this be that we have such images in the training set?\n\nhttps://imgur.com/a/MeNwpWI","create_time":"$D2021-06-19T06:33:26.743Z","update_time":null,"resolved":true,"user":{"type":"individual","id":"8f7483a9b5b7f9ce","login":"p16i","name":"Pat Chormai","avatar_url":"https://avatars-next.observableusercontent.com/50ae30dfbb0b3a2e34678e1119b46706546ba9394dc0bb2e86489388fce89949","tier":null}},{"id":"302e69da6bf51f39","reply_to_id":"ed85d4de21a237f3","content":"Yeah, they are in the training set. See https://observablehq.com/@stwind/paintings-of-butterfly-making-of .\n\nbtw, for the next version I am planning to add an additional matting step to contain a single butter in single image.","create_time":"$D2021-06-19T07:34:31.533Z","update_time":null,"resolved":true,"user":{"type":"individual","id":"dbb85afd665c9e5e","login":"stwind","name":"Zihou Ng","avatar_url":"https://avatars-next.observableusercontent.com/ff8a8f73ad220dcaec180c1e813951d692777837355004f062692b49042d2458","tier":null}},{"id":"7a005a37b207b066","reply_to_id":"ed85d4de21a237f3","content":"ahh, ic. Also, thanks for pointing out to that notebook. I think it's also interesting.","create_time":"$D2021-06-19T10:15:13.960Z","update_time":null,"resolved":false,"user":{"type":"individual","id":"8f7483a9b5b7f9ce","login":"p16i","name":"Pat Chormai","avatar_url":"https://avatars-next.observableusercontent.com/50ae30dfbb0b3a2e34678e1119b46706546ba9394dc0bb2e86489388fce89949","tier":null}}],"custom_thumbnail":true,"trashed":false,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"title":"Paintings of Butterfly","cells":[{"id":0,"value":"md`# Paintings of Butterfly`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":199,"value":"FileAttachment(\"cover.jpg\").image()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":43,"value":"md`\nThe wings of butterflies are one of the most beautiful canvases in the nature. How they get their painting remains a mystery, and scientists have been using [CRISPR](https://entomologytoday.org/2020/01/09/crispr-cuts-through-layers-butterfly-wing-pattern-evolution/) to study and repaint their wing patterns. Can we also do that with StyleGAN2? \n\nI collected thousands of butterfly drawings from the [Biodiversity Heritage Library](https://www.biodiversitylibrary.org/). Then I trained a [FRCNN](https://github.com/facebookresearch/detectron2) to detect and crop out butterfly regions, extracted the contours with [${tex`U^2`}-Net](https://github.com/xuebinqin/U-2-Net/) and align them properly with a custom neural network. This gives me a dataset of 19k butterfly drawings. \n\nFinally I trained a [StyleGAN2](https://github.com/NVlabs/stylegan2-ada-pytorch) with the dataset to learn a latent space, and latent journey begins.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":196,"value":"md`### Random Encounters`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":192,"value":"viewImage(await FileAttachment(\"random_samples_mosaic@1.jpg\").url(), [5147,4117], 0.2)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":178,"value":"md`### Latent Walk 01`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":181,"value":"viewImage(await FileAttachment(\"latent_walk_0.jpg\").url(), [4628,4628])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":174,"value":"md`### Latent Walk 02`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":74,"value":"viewImage(await FileAttachment(\"latent_walk_1.jpg\").url(), [4628,4628])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":12,"value":"md`### Interpolation\n\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":21,"value":"md`### Wing Paintings by Style Mixing\n\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":224,"value":"---\n## Haru","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined"},{"id":228,"value":"html`

`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":24,"value":"md`---\n## Code`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":164,"value":"viewImage = (url, size, scale = 0.1, height = 600) => {\n const root = d3.select(DOM.svg(width, height));\n root.append(\"rect\").attr(\"width\", width).attr(\"height\", height).attr(\"fill\", \"hsl(0,0%,20%)\");\n const img = root.append(\"image\").attr(\"xlink:href\", url);\n\n const zoom = d3.zoom()\n .extent([[0, 0], [width, height]])\n .scaleExtent([0.1, 1])\n .on(\"zoom\", ({ transform }) => img.attr(\"transform\", transform));\n \n root.call(zoom)\n .call(zoom.transform, d3.zoomIdentity\n .translate(width / 2 - size[0] * scale / 2, height / 2 - size[1] * scale / 2)\n .scale(scale));\n\n return root.node();\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"}],"files":"$W30","stdlib":"1","titling":"auto"}} 2f:"$2e:body"