17 ms·
Planet Shadertoy
- laurentlb 9y agoNice! It reminds me of two other recent demoscene productions, also shader-based: Waillee, in 4kB: http://www.pouet.net/prod.php?which=71873 http://www.pouet.net/prod.php?which=71873 Fermi Paradox, in 64kB: http://www.pouet.net/prod.php?which=67113 http://www.pouet.net/prod.php?which=67113
- teamhappy 9y agoHere's a presentation from one of the mercury guys explaining how to do that kind of thing: https://www.youtube.com/watch?v=s8nFqwOho-s https://www.youtube.com/watch?v=s8nFqwOho-s Also, elevated from RGBA should probably be mentioned since iq (https://www.shadertoy.com/user/iq https://www.shadertoy.com/user/iq) is the guy behind Shadertoy. (Also because it's pretty.) http://www.pouet.net/prod.php?which=52938 http://www.pouet.net/prod.php?which=52938
- sbarre 9y agoFYI I downloaded the Fermi Paradox intro from that website (the actual executable one), and Windows Defender quarantined it, claiming it contains a Win32/Tiggre!rfn trojan. I don't know enough about this stuff to figure out if it's a false positive, but there you go.
- yunyu 9y agoSome of the strategies that demoscene authors use to shrink their executable size (think packing, self-modifying code, etc...) are also incredibly common in malware.
- laurentlb 9y agoSome antivirus complain about any file compressed using kkrunchy (http://www.farbrausch.de/~fg/kkrunchy/ http://www.farbrausch.de/~fg/kkrunchy/). This is a known issue. Some background here: https://conspiracy.hu/about/antivirus/ https://conspiracy.hu/about/antivirus/ The only solution is to report the false positive to antivirus vendors, but it takes a lot of time.
- sbarre 9y agoThank you for the explanation.
- userbinator 9y agoAlternatively, stop using antivirus. The amount of stuff that gets flagged as false positives is incredible once you go outside of the applications written by big corporations and the like. It's almost as if they use a whitelist... Also, seeing that some AV will alert on even the presence of an empty folder that happens to share the same name as actual malware[1] or a completely innocuous Hello World[2][3], it's hard to recommend any. That and the detection of cracks and keygens (which goes beyond "antimalware", IMHO) further strengthens my opposition against what is essentially censorware. [1] https://news.ycombinator.com/item?id=2390907 https://news.ycombinator.com/item?id=2390907 [2] https://www.csoonline.com/article/3216765/security/heres-why-the-scanners-on-virustotal-flagged-hello-world-as-harmful.html https://www.csoonline.com/article/3216765/security/heres-why... [3] https://stackoverflow.com/questions/22926360/malwarebytes-gives-trojan-warning-for-basic-c-sharp-hello-world-program https://stackoverflow.com/questions/22926360/malwarebytes-gi...
- applecrazy 9y agoTruly amazing work, especially considering the whole thing isn't running off of a game engine. Everything was made from scratch. That being said, I wish I had the patience to do something like this :)
- lawlessone 9y agoIt isn't completely from scratch, i recognize several noise functions, of course everyone uses them.
- microcolonel 9y agoShaderToy is the new demoscene, in my opinion. It's cool to figure out what you can do running the exact same shader code for every fragment on the screen exactly once per frame.
- ericjang 9y agoIt was started by demoscene people.
- adamnemecek 9y agoIt’s better than demoscene. Demoscene is super secretive, Shadertoy is open and lets me study the shit out of shaders.
- ageofwant 9y agoThe demoscene thinking is - I've been led to believe - that given most of the coding is done on assembly level, anyone with the binary already has the code.
- gpm 9y agoSurely the assembly code has comments, names, etc. The code might be closer to the binary in most programming languages, but it isn't the same.
- adamnemecek 9y agoIt depends what year we are talking. C64 was mostly assembly, farbrausch eas cpp iirc.
- laurentlb 9y agoApart from old-school productions, there's very little assembly in modern demoscene. 64kB intros use mostly C++ (or Rust). Even for 4kB intros, assembly is not used very often (and the interesting code is in the shaders anyway).
- 9y ago
- danschumann 9y agoCan someone make a video and upload it to youtube please? While slowly scrolling through the shader code? I'm on a linux laptop :0
- kijiki 9y agoThere is a video posted in the comments. But it worked fine on my Debian Stretch laptop with Intel integrated graphics. MED was pretty slow, but VERY_LOW and LOW detail levels were fine.
- ktpsns 9y agoI am also on a linux laptop, with integrated graphics but working drivers ;-) The code copied to a pastebin: https://pastebin.com/f4uFYMzy https://pastebin.com/f4uFYMzy Recorded webm with the shadertoy-integrated record tool: https://gfycat.com/CrazyMassiveBluewhale https://gfycat.com/CrazyMassiveBluewhale or https://webmshare.com/vPx9d https://webmshare.com/vPx9d (sorry for having the tab in the background while recording :P)
- viseztrance 9y agoHave you tried firefox? I get between 25-50 fps on it and just 1 fps on Chrome on my fedora laptop.
- JepZ 9y agoStable 60 FPS on high setting here with Firefox 58, Linux, open source drivers (mesa-17.3.5) and an AMD Radeon RX 460 (passive). So its neither a Linux nor an open source driver problem. Maybe your hardware is in fact not up to the job or you need to install some updates ;-) Btw. I also tested chrome and as long as I run it with default settings I get around 3-5fps, but when I activate #ignore-gpu-blacklist in chrome://flags it reaches 60 fps there too.
- IntronExon 9y agoThat’s so incredibly impressive, and the frame rate is pretty stable too! I’d love to see a similarly detailed dive into a black hole with these tools.
- lxe 9y agoShadertoy in the new WinAmp Visualizations.
- megaman22 9y agoWow, I miss those... Software from that era was just more fun... Things have gotten a little sterile since
- IntronExon 9y agoI still run Winamp with Milkdrop on an old laptop. It’s still a lot of fun too. It really whips the llama’s ass.
- nodesocket 9y agoThey should apply at Space X.
- make3 9y agothey write pretty 3D graphics ray tracing software, how does that make them good for space-x? pixar or nvidia, maybe
- TheCoreh 9y agoSpaceX does make promotional 3d animations for their projects/concepts. Here's an example: https://www.youtube.com/watch?v=zqE-ultsWt0 https://www.youtube.com/watch?v=zqE-ultsWt0
- oatmealsnap 9y agoI'm sure they outsource that.
- seanmcdirmid 9y agoAlso sure they at least use vertex shaders :)
- jsd1982 9y agoFor a second there I thought it was going to be a cut for cut remake of the Star Trek TNG intro.
- corysama 9y agoIt’s not working on my iPhone. But, I think this is what you are looking for https://www.shadertoy.com/view/ldSfRG https://www.shadertoy.com/view/ldSfRG
- danbolt 9y agoI really admire the value this piece has as a composition. Or, the clouds, rings, and water terrain individually work as cool demoscene shaders, but flipping them on/off depending where the camera is gives it a great sense of scale.
- therein 9y agoDid this cause noise in anyone else's audio output? I have a GTX1070, running on Arch w/ Chromium. I am using the onboard sound card, not even the GTX for that.
- Keloran 9y agoI’m not sure what I’m more impressed by the shader itself was r the fact that it runs at 60fps on an iPhone 7
- loeg 9y agoAnd a solid 5 fps on Chrome on Linux on Haswell, heh.
- beefsack 9y agoI got solid 60FPS using Firefox Developer Edition on Arch, it would be interesting to see what the issue is for you (might be hardware, I'm running a Vega.)
- Frondo 9y agoBetween 30 and 50 fps on Firefox 58, on Kubuntu, on a slow-ass Intel Celeron 3205U (1.50ghz) laptop. Amazing. Just amazing.
- loeg 9y agoRe: Vega — I think it's pretty clearly some sort of software issue — other people are having no trouble with mobile/embedded/iGPU hardware. This machine has an Nvidia GT 610 in it, which isn't high end gaming equipment. But it should be adequate for this demo.
- newnewpdro 9y agoAnything under 10fps on a modern machine is almost certainly not benefitting from GPU acceleration.
- floatboth 9y agoUnless you try running a demanding AAA game in 8K resolution :D
- ploggingdev 9y agoSame here, 3 to 5 fps on Chrome and a consistent 60 fps on firefox 58. There's definitely something wrong with Chrome for linux. Try the Stripe docs page https://stripe.com/docs/api#error_handling https://stripe.com/docs/api#error_handling , same issue. Buttery smooth scrolling on firefox but unusable on Chrome.
- ttoinou 9y agoIf you're looking for a high res video out of this awesome shader, look at the intro of my recent Shadertoy Best Of video on YouTube : https://www.youtube.com/watch?v=7BB8TkY4Aeg https://www.youtube.com/watch?v=7BB8TkY4Aeg
- saagarjha 9y agoHuh, this works in Safari but not in Safari Technology Preview. Weird.
- newnewpdro 9y agoWhat I find most incredible is that consumer-grade computer hardware has gotten so fast this kind of thing can be done in a web browser.
- vardump 9y agoI'm honestly not sure if that's an attempt at sarcasm or whether you're really serious. Isn't it just rendering two triangles with a fragment (pixel) shader executing purely on the GPU. I mean, why would that be any slower in a web browser than anywhere else? (Unless the shader compiler is pretty bad?) Are pure WebGL fragment shader demos really significantly slower in a web browser? If so, why?
- newnewpdro 9y agoI'm not being sarcastic. Viewed through the lens of someone that lived through PCs requiring programs written in x86 assembly and be the only thing running on the bare metal to achieve anything close to 60FPS for full-screen faux-3D in 320x200 in 256 colors and well.. yes, this is absolutely incredible that a damn web browser can do this stuff in a tab - and it's entirely due to how fast processors (including GPUs) have become. I'm aware the shader is being throw at the GPU and that's the majority of the complexity, but the GPU is part of the incredible progress consumer hardware has made. The browser being in the loop just furthers the impressiveness; there's a bunch of other software running on the computer while this is going on in a damn tab.
- tluyben2 9y agoThis[0] is a great book for people who do not know the history of gaming and the struggles devs had in early pc game dev when you had no gpu’s and very crappy graphics cards. [0] https://www.amazon.com/gp/aw/d/B0768B3PWV/ref=mp_s_a_1_1?ie=UTF8&qid=1519487524&sr=1-1&pi=AC_SX236_SY340_QL65&keywords=wolfenstein&dpPl=1&dpID=415zLWtgKhL&ref=plSrch https://www.amazon.com/gp/aw/d/B0768B3PWV/ref=mp_s_a_1_1?ie=...
- 9y ago
- parmesan 9y agoIt doesn't render properly on my Samsung S8+, Chrome/Firefox. Weird!
- auvi 9y agoWhat is a good introductory book to start learning stuff like this?
- otaviogood 9y agoBooks might not be the best resource for Shadertoy-type stuff. Almost all of Shadertoy 3d shaders use a technique called ray-marching with signed distance functions. If you Google it, you should find good resources. Also, someone on Shadertoy made a very good tutorial using Shadertoy, which I think is kindof amazing... https://www.shadertoy.com/view/4dSfRc https://www.shadertoy.com/view/4dSfRc There are other tutorial shaders on Shadertoy and I always try to make mine readable and heavily commented... https://www.shadertoy.com/user/otaviogood https://www.shadertoy.com/user/otaviogood
- chii 9y agowow, a shader tutorial and it's written in shaders!
- zrth 9y agoMay I suggest this free and open resource: https://thebookofshaders.com https://thebookofshaders.com
- chipfunk 9y agoSomeone else already mentioned the book of shaders (which is the single best introductory resource IMO) - aside from that, I've found that reverse-engineering existing shaders and reapplying the learnings to my own shaders has been very helpful. With time, you start developing an eye for which shaders are just one or two steps beyond your understanding. You'll also start noticing that certain users (such as @Shane) on the site are really good about commenting their code, while others treat it like a game of code golf. When studying existing shaders, it's best to focus on the well-documented shaders that are a few steps beyond your current capabilities, rather than the ones that consist of hundreds of lines of single letter variables and incomprehensible math. As far as open source repositories go, it doesn't get much better than shadertoy (in terms of pedagogy) since you can easily tweak values and comment out pieces of code right there in the browser if you're trying to figure out what a certain line of code does. The in-browser editor makes reverse-engineering very efficient and reduces friction as much as possible, which is really helpful for this kind of dense mathematical code. Once you get used to the whole process of reverse-engineering shaders, you'll quickly come to see shadertoy as the perfect place to learn how different visual effects and graphics techniques are achieved. I don't know of anywhere else on the web (except perhaps codepen) where you can so immediately go from viewing a visual effect in a gallery to messing around with the code in nearly the exact environment that it was created in. Edit: the best resource I've come across for learning raymarching (the 3d rendering technique used in the shader that is the subject of this submission) is this tutorial by Jamie Wong: http://jamie-wong.com/2016/07/15/ray-marching-signed-distance-functions/ http://jamie-wong.com/2016/07/15/ray-marching-signed-distanc...
- cleeus 9y agoRemember that WebGL is also a security nightmare. Shaders are fed to the GPU driver. The driver contains a compiler and compiles the shaders into the GPU specific ISA. The GPU that runs that code is a PCIe device with full DMA access. What could possibly go wrong? (I'm aware that at least Chrome does some syntactic checks on the shader syntax)
- FraKtus 9y agoAre there examples where this model has been abused to steal real data?
- jsheard 9y agoIn the early days of WebGL some browsers leaked information via uninitialized GPU memory, so an attacker could potentially read texture data left behind by other processes. Todays WebGL implementations take care to wipe new memory allocations with zeros before letting the untrusted script do anything with them though.
- FraKtus 9y agoThat's the same than starting a process and mallocing some memory; you will have the garbage of the previous process... Because you have no idea who owned that memory and what it was used to it would be hard to build something on top of that. This being said it's not a bad idea to zero stuff when you start to use them.
- jburgess777 9y agoA long time ago, a bug in Firefox let a screenshot be taken of data outside the browser window: "This issue allows attackers to capture screen shots of private or confidential information" https://blog.mozilla.org/security/2011/06/16/webgl-graphics-memory-stealing-issue/ https://blog.mozilla.org/security/2011/06/16/webgl-graphics-...
- FraKtus 9y ago
- grondilu 9y agoVery impressive. Any chance the author would be interested in porting Oolite[1] to the web? I started to work on it[2] but gave up eventually[3]. 1. http://www.oolite.org/ http://www.oolite.org/ 2. http://grondilu.github.io/oolite/ http://grondilu.github.io/oolite/ 3. http://aegidian.org/bb/viewtopic.php?f=5&p=260273 http://aegidian.org/bb/viewtopic.php?f=5&p=260273
- blarg1 9y agothe best way to do it would be with emscripten. You just need to make sure it only uses at most GLES3 gl calls, and also replace the sound/input/controllers apis with emscripten/web ones.
- kalkut 9y agoThe democratization of non gaming 3D content and both powerful and cheap consumer electronics are long term driving forces. I am both biased and hopeful since I am working on something very related, but my take on this is that the 3D part of the web will grow much faster than the non 3D part [1]. This growth will mainly be driven by non gaming 3D content that do not need high quality graphics to be relevent or entertaining. VR and AR are better understood when we realize that they are just means to the end of consuming a wider variety of 3D content in a more engaging fashion. The percieved lack of interest about VR is absolutely not about technical limitations (such as HMD weight, resolution, controllers, wire or whatever)[2] but it clearly is about the layman having no 3D content as relevant to his daily life as let say Facebook, YouTube, LinkedIn, Amazon etc. The first big VR company will launch a product that will be useful both in and out of VR and the web is the platform the most likely to host it. [1] Most (say over 70%) of the web will stay 2D for a VERY long time though [2] Most people who try VR HMDs enjoy the experience just fine (for the least). They just have no reason to try it again, and even less reason to pay money for that.
- usernam 9y agoMarginally related: is there something native (and for linux/unix) equivalent to shadertoy? When debugging a sharer it's quite handy, but the web interface is just too laggy for me. I'm currently using my own simple test rig, but I'd like something more refined.
- laurentlb 9y agoBonzomatic is an equivalent of Shadertoy designed for live-coding competitions: https://github.com/Gargaj/Bonzomatic/blob/master/README.md https://github.com/Gargaj/Bonzomatic/blob/master/README.md
- Sharlin 9y agoI was already sufficiently impressed... and then I realized that by default it's in "VERY_LOW_QUALITY" mode. Select "HIGH_QUALITY" using the #defines at the top of the file if your machine can handle it :)
- HugoDaniel 9y ago:O 24fps on the all mighty Intel HD3000 :O
- vijaybritto 9y ago45-60 fps on my 120$ Xiaomi Redmi phone. This is amazing work! The amount of math in this code can not even be dreamt by me!