내 걸 만들어요.

벽

모든 패턴이 돌아가요.

community.patternflow.work는 사람들이 나눈 패턴이 전부 걸린 벽이에요. 카드에 마우스를 올리면 재생되고, 화면 위에서 휠을 굴리면 노브가 돌아가요. 구경하는 데는 계정이 필요 없어요.

폰에선 카드가 멈춘 그림이에요. 눌러서 들어가면 움직여요.

.h

.h가 있어야 보드에 올라가요.

여기 패턴은 전부 자바스크립트로 돼 있어요. 브라우저에서 돌아가는 게 그거예요. 보드는 C++로 돌아가서, 펌웨어 헤더인 .h가 있는 패턴만 올릴 수 있어요.

그런 패턴은 화면 구석에 .h가 붙어 있어요. Flashable now를 누르면 그것만 모아 보여줘요.

패턴 하나

하나만 보드로 보내요.

.h가 있는 패턴을 열고 Send to my Patternflow, 이어서 Send over Wi-Fi를 눌러요. 보드의 Patterns 페이지가 열리면서 그 패턴을 알아서 받아 설치해요. 계정도 케이블도 필요 없어요.

바로 목록에 들어가요. K4를 꾹 눌러 찾아보세요.

안드로이드라면 같은 창의 Board address에 K2로 본 IP 주소를 먼저 넣어요.

내 덱

내 덱을 만들어요.

덱은 재생 순서예요. .h가 있는 카드의 +를 누르거나, 카드를 아래 바로 끌어다 놓아요. 20개까지, 이 브라우저에 담겨요. 폰에선 위쪽의 ▦ 칩이 그 바 역할이에요.

칸을 끌면 자리가 바뀌고, ✕ 위에 놓으면 빠져요. Send to my board가 덱을 빌드하고(계정이 필요해요), 이어서 Send over Wi-Fi가 보드로 넘겨요.

펌웨어 v3.10.4까지는 Send over Wi-Fi로 보내면 이 순서가 빠져요. 다음 펌웨어부터는 따라가요. 그전까진 ↓ .zip을 보드의 Patterns 페이지에 올리면 순서까지 들어가요.

남의 덱

남의 덱을 통째로 가져와요.

Decks 페이지엔 사람들이 자신 있게 내건 덱이 있어요. 03에서 올린 Basics도 Ships with Patternflow 아래에 있고, 카드에 Install to my board가 바로 있어요. 커뮤니티 덱은 열어서 Install to my board를 누르면 계정 없이, 순서까지 그대로 들어가요.

Copy into my deck을 누르면 아래쪽 바의 내 덱으로 가져와요. 고친 다음 보내면 돼요.

내 것으로

랩에서 열어요.

패턴 페이지마다 Open in Pattern Lab이 있어요. .h가 없어도요. 복사본이 랩에서 열리고, 거기서 공유하면 원본과 연결된 내 포크로 올라가요.

이때 열리는 건 community.patternflow.work의 랩이에요. 초안도 따로라서, 거기서 하던 건 Recent ▾에 남아요.

Pattern Lab

랩을 열어요.

패턴 랩은 patternflow.work/pattern-lab에 있어요. 브라우저에서 돌아가서 설치할 게 없고, 만들기 시작하는 데 계정도 필요 없어요. 왼쪽은 미리보기, 가운데는 코드, 오른쪽엔 노브와 Color Ramp가 있어요.

이제 이 페이지의 보드는 이 브라우저 랩에 있는 내 초안을 틀어요. 랩이 저장할 때마다 따라 바뀌고, 읽기만 할 뿐 아무것도 저장하지 않아요. 저장한 게 없으면 랩이 처음 여는 패턴, Code 1이 나와요. 커뮤니티 사이트 쪽 랩의 초안은 여기 안 보여요.

patternflow.work/pattern-lab열기

이름

이름부터 지어요.

name this pattern 자리에 이름을 적어요. 보드 목록에 뜨는 이름이 이거예요. 비워 두면 Code 1 같은 레이어 이름이 대신 보드로 가요.

작업은 하는 대로 저장되고, 이 브라우저에만 남아요.

AI에게

AI에게 패턴을 받아요.

Copy prompt를 눌러 ChatGPT, Claude, Gemini 중 하나에 붙여넣으면 변형 다섯 개가 와요. 마음에 드는 걸 복사해서 Paste를 눌러요.

Gallery가 대신 Gemini에게 물어보게 할 수도 있어요. 구글 AI 스튜디오에서 무료로 받는 내 키가 필요해요.

Color Ramp

흑백이 맞아요.

프롬프트는 v-field를 달라고 해요. 코드는 픽셀마다 0에서 1 사이 값만 내고, 색은 그 레이어의 Color Ramp가 입혀요. 램프는 검정에서 흰색으로 시작해요.

Random ramp를 누르거나, 바를 클릭해 색을 골라요. 램프는 패턴과 함께 보드로 가요.

노브

노브의 범위를 정해요.

슬라이더 네 개가 보드의 노브예요. 첫 번째가 K1이고, 모든 레이어가 같이 써요. 이름과 범위는 코드의 한 줄에서 와요. // @knobs Glitch=0..1, Speed=0.05..5, …

범위를 넓히면 노브가 더 크게 움직여요. 보드에서도요.

To hardware

보드용 프롬프트가 하나 더 있어요.

보드는 C++로 돌아가서, 패턴은 .h 헤더가 되어야 보드로 가요. To hardware를 누르고 Copy the conversion prompt로 복사해 AI에게 붙여넣은 다음, AI의 답을 랩에 다시 붙여넣어요.

#pragma once로 시작하면 Next →를 눌러요.

Apply

내 보드에 올려요.

↗ Apply to my Patternflow를 누르면 커뮤니티 서버가 모듈을 만들어요. 로그인이 필요해요. 이어서 Send over Wi-Fi를 누르면 보드의 Patterns 페이지가 열리고 알아서 설치해요.

K4를 꾹 누르면 목록에 그 이름으로 있어요.

컴퓨터가 보드와 같은 와이파이에 있어야 해요. 안드로이드라면 K2의 IP를 Device address에 먼저 넣어요.

레이어

겹쳐요.

+ Code는 램프를 따로 가진 패턴을 하나 더, + Pixel은 픽셀아트나 이미지를 올릴 레이어를 더해요. masks layer below를 켠 레이어는 바로 아래 레이어를 오려 내요.

보드로 보낼 땐 코드 레이어마다 프롬프트가 하나씩이에요.

Graphic Export

그림과 영상.

Graphic Export는 내 패턴을 PNG로 저장하거나 MP4·WebM으로 녹화해요. 한 변 4096px까지 되고, 전부 내 브라우저 안에서 해요.

Director

노브의 타임라인.

Director는 노브에 시간에 따른 키프레임을 찍어요. .pfs는 퍼포먼스 에디션 보드에서, .mid는 에이블톤에서 쓰고, Render…는 영상으로 뽑아요.

커뮤니티

나눠요.

Upload to the community는 .h까지 함께 올려서, 누구든 바로 자기 보드에 넣을 수 있어요. 맨 위 Share는 .h 없이 올려요. 로그인은 올릴 때 해요.

남의 패턴에서 열었다면 그 패턴의 포크로 올라가요. 05에서 본 JS만 있는 패턴도 같은 식이에요. 여기서 .h를 만들어 그 패턴 페이지에 제안해요.