Shadertoy - Shadertoy

Shadertoy.com
Orijinal yazar (lar)Inigo Quilez ve Pol Jeremias
İlk sürüm14 Şubat 2013 (2013-02-14)
Kararlı sürüm
Sürüm 0.8.3 / 3 Mart 2016
YazılmışGLSL, JavaScript, PHP
Tür3D bilgisayar grafikleri araç topluluk
İnternet sitesiwww.shadertoy.com

Shadertoy.com bir tarayıcılar arası oluşturmak ve paylaşmak için çevrimiçi topluluk ve araç gölgelendiriciler vasıtasıyla WebGL, hem öğrenmek hem de öğretmek için kullanılır 3D bilgisayar grafikleri içinde internet tarayıcısı.

Genel Bakış

Shadertoy'da gerçek zamanlı olarak modellenen, gölgelendirilen, aydınlatılan ve işlenen mesafe alanlarıyla yapılan prosedürel bir görüntü

Shadertoy.com çevrimiçi bir topluluk ve platformdur Bilgisayar grafikleri profesyoneller, akademisyenler[1] ve işleme tekniklerini ve prosedürel sanatı paylaşan, öğrenen ve deneyen meraklılar GLSL kodu. 2019 ortası itibariyle binlerce kullanıcıdan gelen 31 binden fazla kamu katkısı var. WebGL[2] Shadertoy'un GPU üretmek prosedürel sanat, animasyon, modeller, aydınlatma, duruma dayalı mantık ve ses.

Tarih

Shadertoy.com, Pol Jeremias ve Inigo Quilez tarafından Ocak 2013'te oluşturuldu ve aynı yılın Şubat ayında çevrimiçi oldu.

Çabanın kökleri Inigo'nun "Shadertoy" bölümünde [3] bilgisayar grafikleri eğitim sitesinde.[4] Başlangıcın gelişiyle WebGL Mozilla'nın uygulaması Firefox 2009 yılında Quilez, ilk çevrimiçi canlı kodlama ortamını ve prosedürel gölgelendiricilerin küratörlüğünü yaptı. Bu içerik, şuradaki 18 yazar tarafından bağışlanmıştır: Demoscene Raymarched metataban, fraktal ve tünel efektleri gibi daha önce Web'de hiç görülmemiş gelişmiş gerçek zamanlı ve etkileşimli animasyonlar sergiledi.

Yıllarca birlikte birkaç gerçek zamanlı oluşturma projesinde birlikte çalıştıktan sonra, Aralık 2012'de Quilez ve Pol, demosken aromalı kaynağı ve boyutu kısıtlı gerçek zamanlı grafikleriyle orijinal Shadertoy sayfasının geleneğini takip edecek yeni bir Shadertoy sitesi oluşturmaya karar verdi. içerik, ancak sosyal ve topluluk özellikleri ekler ve açık kaynaklı bir tutum benimser.

Sayfa, canlı düzenleyici, gerçek zamanlı oynatma, göz atma ve arama yetenekleri, etiketleme ve yorumlama özellikleriyle çıktı. İçerik açısından Shadertoy, kullanıcılarının yaratıcı şekillerde kullanmaları için sabit ve sınırlı bir doku seti sağladı. Yıllar içinde Shadertoy, web kamerası ve mikrofon girişi desteği, video, müzik, Sanal Gerçeklik oluşturma ve çok geçişli işleme gibi ekstra özellikler ekledi.

Birçoğuna akademik makalelerde atıfta bulunulan binlerce kullanıcıdan toplamda 31 binin üzerinde katkı var. Shadertoy ayrıca, Siggraph 2015 Shadertoy Yarışması gibi, topluluğunun eğlenmesi için yıllık yarışmalara ve etkinliklere ev sahipliği yapmaktadır.[5]

Özellikleri

  • Düzenleme: anında görsel geri bildirim ile sözdizimi vurgulanan düzenleyici
  • Sosyal: shadertoys hakkında yorum yapma, oylama (beğenme)
  • Paylaşım: diğer web sitelerine gömülü kalıcı URL'ler, özel gölgelendirici paylaşımı
  • Oluşturma: kayan nokta arabellek tabanlı çoklu geçiş ve geçmiş
  • Medya girişleri: mikrofon, web kamerası, klavye, fare, VR HMD'ler, soundcloud, video, dokular

Kullanım

Shadertoy'da oluşturulan prosedürel animasyona bir örnek aşağıdaki kare tünel olabilir:

geçersiz Ana resim( dışarı vec4 fragColor, içinde vec2 fragCoord ){    // girdi: piksel koordinatları    vec2 p = (-iResolution.xy + 2.0*fragCoord)/iResolution.y;    // her pikselin ekranın merkezine olan açısı    yüzer a = atan(p.y,p.x);        // değiştirilmiş mesafe metriği    yüzer r = pow( pow(p.x*p.x,4.0) + pow(p.y*p.y,4.0), 1.0/8.0 );        // dokuyu (animasyonlu ters) yarıçap ve açıya göre indeksle    vec2 uv = vec2( 1.0/r + 0.2*iTime, a );    // desen: kosinüsler    yüzer f = çünkü(12.0*uv.x)*çünkü(6.0*uv.y);    // renk getirme: palet    vec3 col = 0.5 + 0.5*günah( 3.1416*f + vec3(0.0,0.5,1.0) );        // aydınlatma: merkezde koyulaştır     col = col*r;        // çıktı: piksel rengi    fragColor = vec4( col, 1.0 );}

Yukarıdaki kod, aşağıdaki görüntüyü oluşturur:

Yukarıdaki kod tarafından oluşturulan görüntü

Bahisler

Shadertoy.com'a çeşitli kaynaklarda başvurulmaktadır:

  • NVidia geliştirici blogu, Haziran 2016, Shadertoy Contest 2016 Açıklandı.[6]
  • Siggraph Gerçek Zamanlı Canlı!, 2015, interaktif bir ses görselleştirme projesi.[7]
  • Hacker Haberleri, 2014, Shadertoy, tarayıcıya prosedürel GPU tarafından oluşturulan müziği ekler.[8]
  • Örtük Olarak Tanımlanmış Yüzeyleri İzlemek İçin Sayısal Yöntemler,[9]
  • Williams College'da CS 371 Kursu, 2014, CS 371 için İlham[10]
  • Gerçek Zamanlı İşleme, Ağu 2015, Seven Things for August 20, 2015.[11]

Referanslar

  1. ^ http://graphics.cs.williams.edu/courses/cs371/f14/reading/shadertoy.pdf
  2. ^ "Khronos Nihai WebGL 1.0 Spesifikasyonunu Yayınladı". Khronos Grubu. 3 Mart 2011. Alındı 2 Haziran 2012.
  3. ^ "Shader Toy". www.iquilezles.org.
  4. ^ "Inigo Quilez".
  5. ^ "Siggraph 2015 Shadertoy Yarışması".
  6. ^ "NVidia geliştirici blogu". 2016. Alındı 2 Haziran 2016.
  7. ^ "Siggraph 2015'te Shadertoy Yarışması. Gerçek Zamanlı Canlı!". Alındı 2015-08-13.
  8. ^ "Hacker Haberleri". ycombinator. Alındı 2020-08-31.
  9. ^ "Işın İzleme Örtülü Olarak Tanımlanmış Yüzeyler için Sayısal Yöntemler" (PDF). Williams Koleji. Arşivlenen orijinal (PDF) 2015-09-06 tarihinde. Alındı 2014-09-25.
  10. ^ "CS 371" (PDF). Williams Koleji.
  11. ^ "Gerçek Zamanlı İşleme - 20 Ağustos 2015 için Yedi Şey". realtimerendering.com. 2015. Alındı 20 Ağustos 2015.

Dış bağlantılar