격자 칸이 이웃 상태에 따라 켜지고 꺼지며 무늬가 성장하거나 이동하는 셀룰러 오토마타Grid cells switch on and off by neighbor state, and patterns grow or drift.
60x36 격자에서 초기 25% 점유로 시작해 120ms마다 한 세대씩 진행하며 5초간 글라이더와 군집이 생긴다
세대 간격이 40ms 이하로 빨라 깜빡임으로 보이거나 초기 점유율이 커서 전부 켜졌다 꺼졌다 한다
기본값은 클립에 쓴 값Defaults are the values used in the clip
| 항목PARAM | 기본DEFAULT | 범위RANGE | 메모NOTE |
|---|---|---|---|
| 세대 간격 | 120ms | 80~250ms | steps 이징 한 칸 |
| 격자 | 60x36 | 40x24~96x54 | 칸 32px 기준 |
| 초기 점유율 | 0.25 | 0.15~0.35 | 시드 배열 |
| 지속 | 5s | 3~8s | 약 41세대 |
| 규칙 | B3/S23 | 고정 | Conway |
// 세대를 미리 계산해 표로 저장
let g = seedGrid(42, 60, 36, 0.25); const gens = [g];
for (let i = 0; i < 42; i++) gens.push(g = next(g)); // B3/S23
const u = { k: 0 };
tl.to(u, { k: 41, duration: 5, ease: 'steps(41)', onUpdate: () => draw(gens[Math.round(u.k)]) }, 0);그대로 붙여 넣는다Paste as is
<대상> 배경에 셀룰러 오토마타를 넣어줘. 60x36 격자(칸 32px)를 시드 42, 점유율 0.25로 초기화하고 Conway B3/S23 규칙으로 42세대를 미리 계산해 표로 저장해. 5초 동안 steps 이징으로 120ms마다 한 세대씩 재생하고, 켜진 칸은 흰색 불투명도 0.8, 방금 태어난 칸은 청록으로 표시해.
Add a cellular automaton to the background of <target>. Initialize a 60x36 grid (32px cells) with seed 42 and 0.25 occupancy, precompute 42 generations with Conway B3/S23, and play one generation every 120 ms over 5 seconds with a steps ease. Live cells are white at 0.8 opacity and newborn cells teal.
<파일>에 60x36 격자와 42세대 표를 만들어(시드 42, 점유율 0.25, B3/S23). GSAP으로 k를 0→41, 5초, ease steps(41)로 tween하고 onUpdate에서 gens[k]를 그려. 0.6초·2.4초·4.8초 캡처로 세대가 넘어갈 때만 화면이 바뀌고 전체가 깜빡이지 않는지 확인해.
In <file>, build a 60x36 grid and a 42-generation table (seed 42, occupancy 0.25, B3/S23). Tween k from 0 to 41 over 5 s with ease steps(41) in GSAP and draw gens[k] in onUpdate. Capture at 0.6 s, 2.4 s and 4.8 s to confirm the frame changes only at generation ticks and the whole grid does not flicker.
HyperFrames · ReelForge · Scrolline
개념 출처와 라이선스. 구현은 이 레포에서 새로 씀Concept sources and licenses. Implementations are original to this repo