[{"data":1,"prerenderedAt":400},["ShallowReactive",2],{"project-23985825":3},{"id":4,"name":5,"line":6,"line_source":7,"title":8,"url":9,"domain":10,"maker":11,"posted_at":12,"year":13,"points":14,"comments":15,"rank_in_year":16,"shown_in_year":17,"top":18,"tier":19,"category":20,"subcategory":21,"format":22,"keywords":23,"reception":29,"sentiment":30,"stance_mix":31,"scored_comments":36,"aspects":37,"strip":47,"post_text":49,"what":50,"said":65,"maker_in_thread":189,"shape":194,"grid":198,"attempts":362,"same_week":363,"maker_shows":39,"maker_hidden":392,"reader_version":393,"card":394},"23985825","Pluvoir","WebGL simulation of rainy autumn day\u002Fevening","title","Show HN: WebGL simulation of rainy autumn day\u002Fevening","https:\u002F\u002Fpluvoir.netlify.app\u002Findex.html","pluvoir.netlify.app","maxraz",1596025376,2020,393,60,88,3028,3,"legend","creative","ambient sound and visual simulation","web_app",[24,25,26,27,28],"webgl","rain simulation","rain sound","shader","ambient","debated",0.168,{"positive":32,"neutral":33,"mixed":34,"critical":35},21,11,1,13,46,{"idea":38,"design":40,"performance":41,"docs":43,"execution":45},{"positive":39,"critical":39},2,{"positive":33,"critical":34},{"positive":34,"critical":42},4,{"positive":44,"critical":44},0,{"positive":34,"critical":46},6,[18,34,48,34,48,48,44,48,48,48,48,44,48,34,34,34,44,44,44,44,18,34,44,34,18,18,48,34,48,18,18,48,48,18,34,18,18,48,48,48],5,null,{"problem":49,"audience":49,"pricing":49,"motivation":49,"time_to_build":49,"stack":51,"openness":64,"stage":64,"team_size":64},[52],{"value":53,"source":54,"evidence":55},"WebGL","commenter",[56,60],{"id":57,"by":58,"text":59},"23988749","nomel","That story map is beautiful! I have a somewhat unrelated question. Do you ever see the world moving to rendering content completely on a WebGL canvas, for better control and with…",{"id":61,"by":62,"text":63},"23987155","hombre_fatal","The drops flicker in OSX Chrome 84 for me. Works in other browsers. Not surprising though. This 2017 Macbook Pro's integrated gfx (Intel Iris Plus Graphics 640 1536 MB) seems…","unknown",{"praise":66,"objections":97,"requests":141,"questions":149,"alternatives":160},[67,86],{"value":68,"source":54,"evidence":69},"Realistic rain effect and glass refraction",[70,74,78,82],{"id":71,"by":72,"text":73},"23986583","IvoDankolov","Lovely effect! Particularly enjoyed how it seems to 'fake' refraction by sampling higher or lower from the background based on the drop shape. The trails squishing back into…",{"id":75,"by":76,"text":77},"23986798","jcun4128","Man that's crazy, trying to figure out how you make something look like glass\u002Fwater. Also moving your mouse around on desktop gives it added feel of depth\u002Frealism the pane of…",{"id":79,"by":80,"text":81},"23987022","donalhunt","Can't tell the difference between the screen and my window (it's rainy here today!). Nice!",{"id":83,"by":84,"text":85},"24001264","Akcium","Looks very realistic!",{"value":87,"source":54,"evidence":88},"Sound samples add atmosphere",[89,93],{"id":90,"by":91,"text":92},"23988890","lbebber","Well it has sound it seems, which might actually be more important depending on what you're looking for.",{"id":94,"by":95,"text":96},"23987233","acidburnNSA","My question too. This loads really fast and is really smooth. I've been using https:\u002F\u002Fmynoise.net\u002F for years as a paying customer for this kind of thing and am always happy to…",[98,113,123,130],{"value":99,"source":54,"evidence":100},"Flickering or glitchy drops on some browsers and GPUs",[101,102,106,110],{"id":61,"by":62,"text":63},{"id":103,"by":104,"text":105},"23987113","ibdf","Looks pretty good, I do see some weird rain drops blinking on the bottom half of the screen (latest version of Chrome).",{"id":107,"by":108,"text":109},"23988045","rhacker","Pretty cool!. Only one glitchy part, the bottom of the screen seems to have a few drops that appear and disappear at random, that's the only thing that took me out of the realism.",{"id":111,"by":91,"text":112},"23987424","It _is_ really weird, that didn't use to happen either. Started happening after some update of either Chrome or macOS, I'm not certain which. In fact I think this is one of the…",{"value":114,"source":54,"evidence":115},"Toggles add browser history entries",[116,120],{"id":117,"by":118,"text":119},"23986227","controlledchaos","Toggling the options seems to add records to the browser history, which means it takes a bunch of taps on the back button in safari to get out of the app. Otherwise, really cool!",{"id":121,"by":72,"text":122},"23986358","It's due to the day\u002Fnight buttons being anchor tags as opposed to any Safari-specific issue. If you wanted to keep the the ability to link to specific states, but avoid the…",{"value":124,"source":54,"evidence":125},"Sound does not play in Safari on macOS without permission",[126],{"id":127,"by":128,"text":129},"23987578","filleduchaos","Safari on macOS isn't playing any sounds, apparently because you're not requesting for some permission?",{"value":131,"source":54,"evidence":132},"Sliders do not work on some devices",[133,137],{"id":134,"by":135,"text":136},"23990402","murermader","The sliders don't work on Google Chrome on Android 10.",{"id":138,"by":139,"text":140},"23990790","rnotaro","Sliders are for the audio.",[142],{"value":143,"source":54,"evidence":144},"Fix drop merging to look more natural",[145,146],{"id":71,"by":72,"text":73},{"id":147,"by":91,"text":148},"23986873","There was an attempt of making the drops merge more naturally, but it was affecting the refraction effect, which I deemed was more important. It should be solvable though, I just…",[150],{"value":151,"source":54,"evidence":152},"Are the sounds samples or procedurally generated?",[153,157],{"id":154,"by":155,"text":156},"23986823","dbrgn","That looks \u002F sounds great! Are the sounds based on samples, or procedurally generated?",{"id":158,"by":139,"text":159},"23990809","It seems that it'S samples as seen from the credits at the bottom : https:\u002F\u002Fpluvoir.netlify.app\u002Fcredits.html",[161,171,178,182],{"value":162,"source":54,"evidence":163},"Original Codrops rain effect by Lucas Bebber",[164,167],{"id":165,"by":91,"text":166},"23987120","Hi, I'm the author of the rain effect (not of the website itself though). You can see the original effect here[1], along with an explanation here[2]. If you like it, you can see…",{"id":168,"by":169,"text":170},"23986387","jeffschofield","For those that feel inspired, there's a good article by Lucas Bebber that breaks down how this kind of rain effect can be made in WebGL here:…",{"value":172,"source":54,"evidence":173},"Shadertoy The Drive Home rain shader",[174],{"id":175,"by":176,"text":177},"23986648","weinzierl","Not sure if it is the original but the source where I first saw this rain effect was on ShaderToy - The Drive Home by Martijn Steinrucken aka BigWings[1] The accompanying video…",{"value":179,"source":54,"evidence":180},"mynoise.net",[181],{"id":94,"by":95,"text":96},{"value":183,"source":54,"evidence":184},"Rainpaper Android live wallpaper",[185],{"id":186,"by":187,"text":188},"23989646","Sephr","I ported this effect to Android in a live wallpaper called Rainpaper[1]. [1] https:\u002F\u002Frainpaper.com",{"comments":34,"answered":44,"key":190},[191],{"id":192,"text":193},"23986254","I wish I had a MAC to test, anyway thank you.",{"commenters":195,"max_depth":42,"maker_replies":34,"first_comment_mins":196,"lifespan_hours":197},48,49,30,[199,201,205,209,211,214,217,221,224,227,229,232,235,238,240,243,247,250,253,256,258,260,261,264,267,271,272,276,278,280,283,285,288,290,292,295,297,299,301,304,308,313,316,318,320,321,323,325,326,329,331,335,337,341,343,344,348,353,356,360],[165,44,18,200,91,44],"project\u002Fneutral\u002Fidea",[202,44,34,203,204,44],"23987543","project\u002Fcritical\u002Fidea","OJFord",[206,44,18,207,208,44],"23988695","project\u002Fneutral\u002Fnone","ebg13",[90,44,48,210,91,44],"project\u002Fpositive\u002Fidea",[212,44,18,200,213,44],"23992787","Waterluvian",[215,44,34,203,216,44],"23992972","esrauch",[218,44,48,219,220,44],"23987684","maker\u002Fpositive\u002Fnone","_the_inflator",[222,44,18,223,91,44],"23988868","maker\u002Fneutral\u002Fnone",[225,44,48,219,226,44],"23988603","ChrisMarshallNY",[57,44,44,228,58,44],"other\u002Fneutral\u002Fidea",[230,44,44,231,91,44],"23989363","other\u002Fneutral\u002Fnone",[233,44,48,234,91,44],"23989370","maker\u002Fpositive\u002Fdesign",[236,44,48,234,237,44],"23990693","AndrewStephens",[186,44,48,239,187,44],"project\u002Fpositive\u002Fnone",[241,44,48,210,242,44],"23993016","AceJohnny2",[244,44,48,245,246,44],"23990288","project\u002Fpositive\u002Fdesign","lifeisstillgood",[248,44,44,231,249,44],"23991454","dgellow",[251,44,44,231,252,44],"23991200","lacoolj",[254,44,48,245,255,44],"23991875","dave_sid",[257,44,44,231,255,44],"23991903",[61,34,34,259,62,44],"project\u002Fcritical\u002Fperformance",[111,34,34,259,91,44],[262,34,34,259,263,44],"23988722","mistercow",[265,34,34,259,266,44],"23988824","jmkerr",[268,34,44,269,270,44],"23992073","commenter\u002Fneutral\u002Fperformance","spanhandler",[175,39,44,228,176,44],[273,39,44,274,275,44],"23986792","other\u002Fpositive\u002Fnone","technicolorwhat",[277,39,44,228,91,44],"23986957",[279,39,44,231,176,44],"23987103",[281,39,44,231,282,44],"23993258","Cactus2018",[168,18,18,284,169,44],"project\u002Fneutral\u002Fdocs",[286,18,18,287,91,44],"23986809","maker\u002Fneutral\u002Fdocs",[117,42,34,289,118,44],"project\u002Fcritical\u002Fexecution",[192,42,44,291,11,34],"maker\u002Fneutral\u002Fexecution",[293,42,34,289,294,44],"23986286","eminence32",[121,42,18,296,72,44],"project\u002Fneutral\u002Fexecution",[71,48,18,298,72,44],"project\u002Fmixed\u002Fdesign",[147,48,18,300,91,44],"maker\u002Fneutral\u002Fdesign",[302,46,44,231,303,44],"23986463","rimliu",[305,306,48,245,307,44],"23986808",7,"eggfriedrice",[309,310,34,311,312,44],"23987784",8,"project\u002Fcritical\u002Fdesign","kristiandupont",[314,310,44,231,315,44],"23988392","ricklamers",[75,317,48,245,76,44],9,[103,319,34,289,104,44],10,[79,33,48,245,80,44],[154,322,18,207,155,44],12,[94,322,48,324,95,44],"project\u002Fpositive\u002Fperformance",[158,322,18,207,139,44],[327,35,48,245,328,44],"23986603","anticristi",[107,330,34,289,108,44],14,[332,333,48,245,334,44],"23997221",15,"awiesenhofer",[127,336,34,289,128,44],16,[338,339,48,239,340,44],"23987190",17,"DGKSK8LIFE",[134,342,34,289,135,44],18,[138,342,18,207,139,44],[345,346,48,245,347,44],"23988133",19,"talolard",[349,350,48,351,352,44],"23986894",20,"project\u002Fpositive\u002Fexecution","svenfaw",[354,32,48,239,355,44],"23986284","madjam002",[357,358,48,239,359,44],"23986272",22,"windock",[83,361,48,245,84,44],23,[],[364,369,374,379,383,387],{"id":365,"name":366,"points":367,"category":368},"23927380","TinyPilot",756,"infrastructure",{"id":370,"name":371,"points":372,"category":373},"23965787","vo.codes",462,"ai",{"id":375,"name":376,"points":377,"category":378},"23948672","Felicette",303,"dev_tools",{"id":380,"name":381,"points":382,"category":368},"23948234","Textdb.dev",200,{"id":384,"name":385,"points":386,"category":378},"23965295","UnnaturalScrollWheels",176,{"id":388,"name":389,"points":390,"category":391},"23947659","memordo",140,"learning_science",false,"v2",{"id":395,"name":5,"line":6,"ai":392,"cat":20,"year":13,"points":14,"comments":15,"rec":29,"s":396,"top":18,"kw":397,"maker":11,"domain":10,"tier":19,"attempts":44,"strip":398,"url":9,"mix":399,"praise":68,"objection":99,"sub":21},23985825,0.17,[24,25,26,27,28],"3151550555505111000031013351533553133555",[32,33,34,35],1794036594009]