Strona główna Sztuka Generatywna Szum Perlina — proceduralny generator terenu i tekstur

🏔 Szum Perlina — proceduralny generator terenu i tekstur

Interaktywny wizualizator szumu Perlina 2D z ułamkowym ruchem Browna (fBm). Generuj proceduralne mapy wysokości terenu, tekstury chmur i słoje drewna. Steruj oktawami, persystencją, lakunarnością i skalą.

Sztuka Generatywna3DŁatwy60 FPS
perlin-noise ↗ Otwórz osobno
Interfejs samej symulacji jest w języku angielskim.

O Szumie Perlina — proceduralnym generatorze terenu i tekstur

Ten wizualizator oblicza klasyczną funkcję szumu gradientowego (Perlina) 3D w całości na karcie graficznej za pomocą shadera fragmentów Three.js: pseudolosowe gradienty są przypisywane punktom siatki, a wartości pomiędzy nimi są płynnie interpolowane krzywą wygładzającą piątego stopnia. Kilka warstw o rosnącej częstotliwości jest sumowanych metodą ułamkowego ruchu Browna (fBm) — każda oktawa podwaja częstotliwość (lakunarność), a jej amplituda maleje zgodnie ze współczynnikiem gain/persystencji — co daje szczegółowe, naturalnie wyglądające pola szumu. Trzeci wymiar szumu jest przesuwany w czasie, dzięki czemu animacja jest ciągła i pozbawiona widocznych szwów. Opcjonalne zniekształcanie dziedziny (domain warping) oraz tryb grzbietowy (ridged/turbulence) pozwalają tej samej bazowej funkcji szumu tworzyć płynące, przypominające dym zniekształcenia albo ostre sylwetki górskich grzbietów.

🔬 Co przedstawia

Pole fBm w GLSL renderowane na żywo w każdej klatce: do 8 oktaw klasycznego szumu gradientowego Perlina jest sumowanych z konfigurowalną lakunarnością i gain, a następnie mapowanych na pięć różnych kolorystyk — zwykłą skalę szarości wysokości, rampę terenu woda/piasek/trawa/skała/śnieg, linie konturowe w stylu mapy topograficznej, zabarwienie pola przepływu po zniekształceniu dziedziny oraz wygląd grzbietowy/turbulencyjny oparty na wartości bezwzględnej.

🎮 Jak korzystać

Wybierz tryb renderowania (Greyscale, Terrain, Contours, Warp/flow, Ridged), a następnie dostosuj Scale/frequency, Octaves (1–8), Lacunarity, Gain/persistence i Domain warp, aby przekształcić pole szumu. Suwak Animation speed przesuwa szum wzdłuż jego trzeciego wymiaru w czasie, Pause/Reset zatrzymuje lub przywraca wartości domyślne, a przycisk „About & help" otwiera okno modalne z tym samym wyjaśnieniem.

💡 Czy wiesz, że?

Ken Perlin wynalazł tę funkcję szumu w 1983 roku, pracując nad efektami wizualnymi do filmu Tron, aby zastąpić surowy, mechaniczny wygląd wcześniejszych tekstur proceduralnych czymś organicznym. Technika okazała się na tyle wpływowa, że w 1997 roku otrzymał za nią nagrodę Technical Achievement Academy Award, a fBm zbudowane na szumie Perlina wciąż leży u podstaw większości proceduralnych efektów terenu, chmur i ognia w grach i filmie.

Najczęściej zadawane pytania

Czym dokładnie jest szum Perlina?

Szum Perlina to rodzaj szumu gradientowego: pseudolosowe wektory gradientu jednostkowego są przypisywane wierzchołkom siatki, a wartość szumu w dowolnym punkcie wyznacza się, obliczając iloczyn skalarny każdego pobliskiego gradientu z wektorem przesunięcia do tego punktu, a następnie łącząc wyniki gładką krzywą wygładzającą. W przeciwieństwie do czystego szumu białego daje to ciągłą, naturalnie wyglądającą zmienność zamiast ostrych zakłóceń, dlatego jest standardowym budulcem proceduralnego terenu i tekstur.

Co oznacza fBm i jak wykorzystuje je ta symulacja?

fBm to skrót od ułamkowego ruchu Browna (fractional Brownian motion) — techniki sumowania kilku oktaw tej samej funkcji szumu przy rosnącej częstotliwości i malejącej amplitudzie. W tej symulacji częstotliwość każdej oktawy jest mnożona przez suwak Lacunarity (domyślnie 2, czyli się podwaja), a jej amplituda jest mnożona przez suwak Gain/persistence (domyślnie 0,5); w ten sposób łączy się do 8 oktaw, dodając drobne detale ponad ogólnymi kształtami.

Co właściwie zmieniają poszczególne tryby renderowania?

Wszystkie pięć trybów opiera się na tym samym bazowym polu fBm, ale koloruje je lub przetwarza inaczej. Greyscale pokazuje surową wartość wysokości wprost; Terrain mapuje wysokość na rampę kolorów woda-piasek-trawa-skała-śnieg; Contours rysuje linie izo, jak na mapie topograficznej; Warp/flow podaje szum z powrotem do jego własnych współrzędnych (domain warping), tworząc wirujące, przypominające dym kształty; a Ridged bierze wartość bezwzględną każdej oktawy przed sumowaniem, co rzeźbi ostre cechy przypominające górskie grzbiety zamiast łagodnych wzniesień.

Jak animacja jest generowana bez widocznego zapętlenia lub szwów?

Użyta tu funkcja szumu jest naprawdę trójwymiarowa (x, y oraz sterowane czasem z), a nie teksturą 2D, którą się przewija. W każdej klatce wartość Animation speed przesuwa zegar „przesunięcia Z", który staje się trzecią współrzędną podawaną do funkcji szumu, dzięki czemu cały wycinek 2D płynnie i w sposób ciągły przekształca się w obrębie bazowej trójwymiarowej objętości szumu, bez powtarzającego się wzoru ani widocznego szwu.

Czy ten szum Perlina jest obliczany na CPU, czy na GPU?

Wyłącznie na GPU. Szum, krzywa wygładzająca, sumowanie fBm, zniekształcanie dziedziny i rampy kolorów są zaimplementowane jako kod GLSL wewnątrz shadera fragmentów Three.js, dzięki czemu każdy piksel na ekranie oblicza własną wartość szumu równolegle w każdej klatce. To właśnie umożliwia ustawienie oktaw, skali i warp na maksymalne wartości przy zachowaniu płynnego, ciągłego przerysowywania wizualizacji w czasie rzeczywistym.

Podobne symulacje