2b:null 2c:["$","title",null,{"children":"Perception Illusion (part I) | Alain Roan | Observable"}] 31:[] 2f:{"id":"3810610548ede024","slug":"perception-illusion-part-i","title":"Perception Illusion (part I)","thumbnail":"54213d07e0d0462d9e082016ddac3c4729672e5d822f661cecd1e875dbe237e7","access_level":"public","create_time":"$D2018-08-27T16:10:29.710Z","update_time":"$D2020-11-01T12:27:40.321Z","view_time":null,"first_public_time":"$D2018-08-29T13:54:02.258Z","fork":false,"stars":5,"starred":false,"owner":{"type":"team","id":"f8fce27399341cf5","login":"alainro","name":"Alain Roan","avatar_url":"https://avatars-next.observableusercontent.com/877e36b5e75080b8597092e60b8898e6742bba1f4f7ba12f909dbeae5228fce3","tier":"starter_2024"},"version":653,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"1e78bb64fcda4384","login":"alainro","name":"Alain Roan","avatar_url":"https://avatars-next.observableusercontent.com/877e36b5e75080b8597092e60b8898e6742bba1f4f7ba12f909dbeae5228fce3","tier":null}],"members":[{"type":"individual","id":"1e78bb64fcda4384","login":"alainro","name":"Alain Roan","avatar_url":"https://avatars-next.observableusercontent.com/877e36b5e75080b8597092e60b8898e6742bba1f4f7ba12f909dbeae5228fce3","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":2,"collection":{"id":"38b69149df7452a7","slug":"illusions","title":"Illusions","owner":{"id":"f8fce27399341cf5","login":"alainro","name":"Alain Roan"}},"type":"notebook","body":{"title":"Perception Illusion (part I)","cells":[{"id":0,"value":"md`# Perception Illusion (part I)\nThis is a well known optical illusion that I recreated with d3/canvas after discovering this Japanese [website](http://www.psy.ritsumei.ac.jp/~akitaoka/kosaku2e.html). I was amazed by the magic of the appearing/disappearing shapes and deligthed by the luminance curve which says a lot about the way our vision works. \n\nThe color area hides rectangles having the exact same color of their background. By dragging them around with mouse or finger you wont believe that their color is not changing. ***(hint: press \" Show me \" button to see them first).*** \n\nOnce visible, try to replace the shape at the location where it is perfectly hidden.` ","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":290,"value":"viewof uniform = checkbox({\n options: [{ value: \"true\", label: \"Uniform color\" }],\n value: false\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":554,"value":"md `Strangely enough, a uniform color appears like being a gradient. Try it.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":296,"value":"viewof blackwhite = checkbox({\n options: [{ value: \"true\", label: \"Grey scale\" }],\n value: false\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":307,"value":"viewof show = html``","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":642,"value":"fullscreen = {\n const button = html`