chalkwrite 사용법

시작하기

chalkwrite는 글과 수식, 그래프, 도형을 칠판에 분필로 한 획씩 써 나가는 영상을 만듭니다. 칠판 위에 상자를 놓고 내용을 적으면, 오른쪽에서 쓰는 모습을 바로 볼 수 있습니다.

이렇게 만든 영상입니다. 제목, 수식이 든 목록, 그래프를 차례로 씁니다(소리 있음).

위쪽 도구 막대의 글, 그래프, 도형으로 상자를 놓거나, 칠판을 두 번 누릅니다.
상자를 고르고 오른쪽 아래 속성에서 내용과 색, 크기를 바꿉니다.
쓰는 순서 목록에서 순서를 맞춥니다.
재생해 보고, 내려받기로 영상이나 그림을 받습니다.

작업은 브라우저에 저절로 저장됩니다. 다른 컴퓨터로 옮기려면 프로젝트 파일로 저장하세요.

화면 구성

편집 화면 전체 — 편집 화면. 1 도구 막대, 2 칠판, 3 쓰는 순서, 4 영상과 타임라인, 5 속성.

도구 막대. 왼쪽부터 상자 넣기, 순서 항목 넣기, 되돌리기·다시 하기·격자, 파일, 사용법, 내려받기.

도구 막대: 상자(글, 그래프, 도형, 배열)와 순서 항목(음성, 멈춤, 지우기) 넣기, 되돌리기와 다시 하기, 격자선, 새로 시작·열기·저장·스크립트 보기, 사용법, 내려받기.
칠판 (왼쪽): 상자를 놓고 옮기는 곳입니다. 배경에는 다 쓴 마지막 장면이 깔립니다. 격자선은 50픽셀마다 긋고, 위와 왼쪽에 100픽셀마다(칠판이 작게 보일 때는 200픽셀마다) 좌표를 적습니다. 마우스 옆에는 그 자리의 좌표(가로, 세로)가 나옵니다. 칠판은 1920×1080 픽셀이고 세로는 아래로 갈수록 커집니다.
쓰는 순서: 상자를 쓰는 차례입니다. 위에서부터 씁니다.
영상 (오른쪽): 만들어질 영상을 미리 봅니다. 아래 타임라인에 상자와 음성의 시간이 나옵니다.
속성: 고른 상자의 속성입니다. 아무 상자도 고르지 않으면 칠판 전체 설정이 나옵니다.

가운데 구분선을 끌면 왼쪽과 오른쪽 크기를 바꿀 수 있습니다.

격자선과 마우스 좌표 — 격자선과 좌표. 마우스 옆의 숫자(998, 777)가 그 자리의 칠판 좌표입니다.

상자 다루기

고른 글 상자와 손잡이 — 고른 상자는 파란 테두리로 보입니다. 상자를 끌어 옮기고, 오른쪽 손잡이로 폭을, 위의 동그란 손잡이로 방향을 바꿉니다.

옮기기	상자를 끕니다.
크기	오른쪽 가장자리(글 상자)나 오른쪽 아래 모서리(그래프, 도형)의 손잡이를 끕니다.
돌리기	위쪽 동그란 손잡이를 끕니다. Shift를 누르면 15°씩 돕니다.
글자 크기	고른 글 상자 위에서 휠을 굴립니다.
복사	Ctrl을 누른 채 끌면 원래 상자는 두고 복사본을 옮깁니다. Ctrl+C로 복사하고 Ctrl+V로 붙여 넣을 수도 있습니다. 붙여 넣을 때마다 조금씩 비켜 놓입니다.
지우기	상자를 고르고 Delete를 누르거나, 쓰는 순서 목록의 ✕를 누릅니다.

위치와 크기는 속성에서 숫자로도 정할 수 있습니다. 단위는 칠판 픽셀입니다.

글 상자

상자 폭 안에서 단어 사이로 줄을 바꿉니다. 상자 높이는 쓴 글에 맞춰 저절로 정해집니다.

수식	$\log_2 n$ 은 글 사이의 수식, `$$\frac{a}{b}$$`는 한 줄 가운데 수식입니다. 분수, 첨자, 루트, 큰 연산자(∑, ∫), `\left( \right)` 괄호를 쓸 수 있습니다.
부분 색	`{yellow\|강조할 말}`처럼 씁니다. 색 이름은 white, yellow, red, orange, green, blue, cyan, pink입니다.
목록	줄 맨 앞에 `-` (•), `[ ]` (□), `[x]` (☑), `1.` 을 씁니다. 앞에 공백 2칸마다 한 단계 들여씁니다.
빈 줄	빈 줄은 무시합니다.
글자 그대로	`\$`는 달러 기호, `\{` `\}`는 중괄호, 줄 맨 앞의 `\-`는 목록이 아닌 빼기입니다.

쓰기 속도는 분필이 1초에 지나가는 픽셀 수입니다. 기본 500이고, 높을수록 빨리 씁니다.

직접 쓴 획이 없는 글자는 건너뛰고, 상태 줄에 "획이 없는 글자"로 알려 줍니다.

그래프 상자

축을 긋고 곡선을 차례로 그립니다.

식	변수는 `x`나 `n`입니다. 예: `n^2`, `log2(n)`, `2*sin(x)`. 식 안에는 공백을 쓰지 않습니다.
함수와 상수	`sin cos tan sqrt abs exp ln log log2`, `pi e`
곡선	곡선마다 식, 색, 두께(배)를 정합니다. 곡선 넣기로 더하고 ✕로 뺍니다.
범위	x와 y의 시작과 끝입니다. 범위를 벗어나거나 계산할 수 없는 곳에서는 곡선이 끊깁니다.
축	축 이름, 이름 크기, 색, 두께, 화살표를 정합니다.

눈금과 숫자는 아직 없습니다.

도형 상자

사각형, 원(타원), 삼각형, 선, 화살표를 그립니다. 상자 크기에 맞춰 그립니다.

선 두께는 분필 굵기의 배수입니다.
사각형, 원, 삼각형은 채우기를 켜면 테두리를 그린 뒤 안을 분필로 문질러 칠합니다.
선과 화살표는 상자 가운데 높이에서 왼쪽에서 오른쪽으로 긋습니다. 기울이려면 상자를 돌립니다.

배열 상자

네모 칸을 한 줄로 긋고 칸마다 값을 씁니다. 자료 구조나 알고리즘을 설명할 때 씁니다.

배열 상자 속성 — 배열 상자의 속성. 강조 줄의 칸을 누르면 켜고 끕니다.

값은 빈칸으로 나눠 적습니다. 예: 3 7 9 12 15. 값 안에는 빈칸과 =를 쓸 수 없습니다.
강조에서 칸을 누르면 그 값을 노랑으로 씁니다. 다시 누르면 풀립니다.
칸은 정사각형입니다. 모서리 손잡이를 끌거나 칸 크기로 크기를 바꿉니다. 값의 글자 크기는 칸에 맞춰집니다.

멈춤과 지우기

도구 막대의 멈춤과 지우기는 칠판에 놓이지 않고 쓰는 순서에만 들어갑니다. 고른 항목 뒤에, 고른 것이 없으면 맨 뒤에 들어갑니다.

멈춤	분필을 떼고 정한 초만큼 기다립니다. 기본 1초입니다.
지우기	지우개로 칠판 전체를 닦습니다. 지우는 소리도 납니다. 그 뒤의 상자는 깨끗한 칠판에 씁니다.

지우기 앞의 상자나 지우기 항목을 고르면 왼쪽 칠판 배경에 지우기 직전의 모습이 나옵니다. 그때 칠판에 없는 상자(지우기 뒤에 쓰는 상자나 이미 지워진 상자)는 점선으로 흐리게 보입니다.

지우기 앞의 제목 상자를 고른 모습. 배경은 지우기 직전의 칠판이고, 지운 뒤에 쓸 상자(8, 9, 10, 11번)는 점선입니다.

멈춤 0.8초 뒤 지우기, 그리고 두 번째 화면(소리 있음).

쓰는 순서

목록 위에서부터 차례로 씁니다. 항목을 끌거나 ↑↓ 버튼으로 순서를 바꿉니다. 항목 이름을 누르면 그 상자를 고릅니다. 새로 넣거나 붙여 넣은 상자는 맨 뒤에 붙습니다. 음성 항목도 이 목록에 들어갑니다.

음성

도구 막대의 음성으로 녹음 파일(mp3, wav, m4a, ogg 등)을 고르면 쓰는 순서에 음성 항목이 생깁니다. 고른 상자가 있으면 그 앞에, 없으면 맨 뒤에 들어갑니다.

음성 항목부터 다음 음성 항목까지가 한 구간입니다. 음성은 구간이 시작할 때 나옵니다.
구간의 쓰기, 멈춤, 지우기 시간을 음성 길이에 맞춥니다. 글이 짧으면 고르게 늦추고(최저 0.4배) 음성이 끝날 때까지 기다립니다.
글이 길면 차례로 ① 멈춤과 펜 이동을 절반까지 줄이고 ② 앞 구간에 남는 시간이 있으면 최대 3초 먼저 쓰기 시작하고 ③ 획을 음성 구간 최고 배속(칠판 설정, 기본 2배)까지 빠르게 씁니다.
그래도 길면 음성이 먼저 끝나고 글을 마저 씁니다. 다음 음성은 기다립니다. 상태 줄과 타임라인에 빨간색으로 표시됩니다.
파일 없는 음성 항목은 앞 구간을 그 자리에서 끝냅니다. 그 뒤의 상자는 원래 속도로 씁니다.
음성 항목을 고르면 들어 보기, 파일 바꾸기와 함께 어떻게 맞췄는지(시작 시각, 획 속도, 멈춤 비율)가 나옵니다.

음성 항목 속성 — 음성 항목의 속성. 맞추기에 이 구간을 어떻게 맞췄는지 나옵니다.

녹음 파일은 이 브라우저 안에 보관됩니다. 프로젝트 저장 파일에도 함께 들어가므로, 다른 컴퓨터에서는 그 파일을 열면 됩니다.

타임라인

영상 아래의 두 줄은 시간에 따라 무엇이 일어나는지 보여 줍니다.

글	상자마다 쓰는 동안이 그 상자의 색으로 표시되고, 쓰는 순서 번호가 적힙니다. 흰 세로줄 무늬는 지우기입니다.
음성	음성이 나오는 동안입니다. 빨간 빗금은 음성이 끝난 뒤에도 글을 쓰는 시간(넘침)입니다.

타임라인을 누르면 그 시각으로 가고, 끌면 따라 움직입니다. 칸을 누르면 그 상자나 음성도 고릅니다.

재생

재생 버튼이나 스페이스로 재생하고 멈춥니다. 분필 소리와 음성도 함께 나옵니다.
재생 중에 시간 막대를 끌면 놓은 자리부터 이어서 재생합니다.
재생 중에 고치면 같은 진행 비율에서 이어서 재생합니다.
배속(0.5~3×)은 미리보기에만 쓰입니다. 내려받는 영상에는 영향이 없습니다.
⛶ 버튼, F 키, 영상을 두 번 누르면 크게 봅니다. Esc로 나옵니다.

칠판 설정

칠판의 빈 곳을 눌러 상자 고르기를 풀면 칠판 전체 설정이 나옵니다.

분필 소리	분필 소리의 크기입니다. 1이 기본이고 0이면 소리가 없습니다.
음성 구간 최고 배속	글이 음성보다 길 때 획을 기본 속도의 몇 배까지 빠르게 쓸지입니다. 기본 2배이고, 3배부터는 분필 소리가 급하게 들립니다.
변형 번호	같은 글자라도 매번 조금씩 다르게 씁니다. 번호를 바꾸면 다른 모양이 나오고, 같은 번호면 언제나 같은 영상이 나옵니다.

내려받기

MP4 영상	분필 소리와 음성을 넣은 1920×1080 영상입니다. 만드는 동안 진행 막대가 나오고, 취소할 수 있습니다. 다른 탭으로 가도 됩니다.
PNG, 마지막 장면	다 쓴 칠판 한 장입니다.
투명 PNG, 글씨만	칠판 없이 글씨 부분만 잘라 냅니다. 슬라이드에 올리기 좋습니다.

MP4는 영상 인코딩(WebCodecs)을 지원하는 Chrome이나 Edge에서 만들 수 있습니다.

저장과 스크립트

스크립트 보기 창 — 스크립트 보기. 편집 내용이 .chalk 스크립트로 바뀐 모습입니다.

고칠 때마다 브라우저에 저절로 저장되고, 다시 열면 이어서 작업합니다.
프로젝트 저장은 JSON 파일로 내려받고(음성 파일 포함), 프로젝트 열기로 다시 불러옵니다.
새로 시작은 빈 칠판으로 시작합니다. 상자가 있으면 먼저 확인을 묻습니다.
스크립트 보기는 편집 내용을 .chalk 스크립트 글로 보여 줍니다. 명령줄 도구로 같은 영상을 만들 수 있습니다: chalkwrite render 파일.chalk -o 영상.mp4

나만의 폰트

위쪽 도구 막대의 펜 아이콘(나만의 폰트 만들기)을 누르면 폰트 페이지가 새 탭으로 열립니다. 아이패드와 펜으로 글자를 하나씩 쓰면, 그 글씨로 TTF 폰트를 만들 수 있습니다. 로그인은 없고 모든 일이 브라우저 안에서 이루어집니다.

처음에 폰트 이름(영문, 한글)과 키트를 고릅니다. Fast는 영문, 숫자, 기본 문장부호, 한글 기본 자모 24자, Normal은 기호와 그리스 문자, 겹자모, 위치별 자모, 많이 쓰는 음절 419자, Full은 음절을 1,202자까지 씁니다. 음절은 신문 기사에 많이 나오는 순서입니다.
노란 상자 안에 견본을 보며 쓰고 저장 후 다음을 누릅니다(Enter). 획 되돌리기는 Backspace입니다. 같은 글자를 여러 번 쓰면 판서에서 조금씩 다른 모양으로 번갈아 나옵니다.
쓰지 않은 한글 음절은 자모를 조합해 채우므로, 기본 자모만 써도 한글 11,172자가 모두 들어간 폰트가 됩니다.
쓴 글씨는 이 브라우저에만 보관됩니다. 파일 저장으로 내 글씨 파일(.hand.json)을 내려받아 두고, 다른 기기에서는 파일 열기로 이어서 씁니다. 50자를 쓸 때마다 파일 저장을 권합니다.
TTF 만들기에서 굵기(가늘게, 보통, 굵게)를 고르면 10초 남짓 뒤 폰트를 내려받을 수 있습니다.

단축키

`Ctrl`+`Z`	되돌리기
`Ctrl`+`Y`, `Ctrl`+`Shift`+`Z`	다시 하기
`Ctrl`+`C`, `Ctrl`+`V`	상자 복사, 붙여 넣기
`Ctrl`+끌기	상자 복사본 옮기기
`Delete`	고른 상자 지우기
`Shift`+돌리기	15°씩 돌리기
휠	고른 글 상자의 글자 크기
`스페이스`	재생, 멈춤
`F`	영상 크게 보기
`G`	격자선 켜고 끄기
칠판 두 번 누르기	그 자리에 글 상자 넣기

정보

chalkwrite v0.1 · 판서 동영상 생성기

손글씨 획과 분필·지우개 소리는 Jeff가 직접 쓰고 녹음한 것입니다.
모든 계산은 이 브라우저 안에서 합니다. 쓴 글과 음성 파일은 서버로 보내지 않습니다.
함께 쓴 오픈 소스 소프트웨어와 글꼴의 라이선스: licenses.txt