MOVARO

Appearance

ALPHA

Typewriter Expression ​

텍스트가 타자기로 치듯 한 글자씩 순차적으로 나타나는 효과입니다.

Preview ​

텍스트가 한 글자씩 타이핑되듯 나타나는 효과입니다.

Hello, World!

※ 시각적 이해를 위한 애니메이션으로, 실제 결과와 다를 수 있습니다.

Code ​

Source Text에 적용 ​

javascript
// Typewriter Expression
// 텍스트 레이어의 Source Text에 적용

txt = "Hello, World!";  // 표시할 텍스트
speed = 5;              // 초당 글자 수

numChars = Math.floor(time * speed);
txt.substring(0, numChars);

커서 깜빡임 포함 ​

javascript
// 깜빡이는 커서와 함께
txt = "Hello, World!";
speed = 5;
cursorBlink = 0.5;  // 커서 깜빡임 주기

numChars = Math.floor(time * speed);
displayTxt = txt.substring(0, numChars);

// 커서 추가 (텍스트 완성 전에만)
if (numChars < txt.length) {
  cursor = (Math.floor(time / cursorBlink) % 2 == 0) ? "|" : "";
  displayTxt + cursor;
} else {
  displayTxt;
}

딜레이 후 시작 ​

javascript
// 특정 시간 후 타이핑 시작
txt = "Hello, World!";
speed = 5;
delay = 1;  // 1초 후 시작

t = Math.max(0, time - delay);
numChars = Math.floor(t * speed);
txt.substring(0, numChars);

Parameters ​

파라미터설명
txt표시할 전체 텍스트
speed초당 나타나는 글자 수
delay타이핑 시작 전 대기 시간
cursorBlink커서 깜빡임 주기

Examples ​

빠른 타이핑 ​

javascript
txt = "Fast typing!";
speed = 15;

numChars = Math.floor(time * speed);
txt.substring(0, numChars);

느린 타이핑 (드라마틱) ​

javascript
txt = "Slowly...";
speed = 2;

numChars = Math.floor(time * speed);
txt.substring(0, numChars);

여러 줄 타이핑 ​

javascript
txt = "Line 1\nLine 2\nLine 3";
speed = 8;

numChars = Math.floor(time * speed);
txt.substring(0, numChars);

완성 후 유지 ​

javascript
txt = "Complete!";
speed = 5;

numChars = Math.min(Math.floor(time * speed), txt.length);
txt.substring(0, numChars);

Advanced ​

타이핑 후 삭제 ​

javascript
// 타이핑 후 백스페이스로 삭제
txt = "Hello!";
typeSpeed = 5;
deleteSpeed = 10;
pauseTime = 1;  // 완성 후 대기 시간

typeTime = txt.length / typeSpeed;
totalTime = typeTime + pauseTime + txt.length / deleteSpeed;

t = time % totalTime;

if (t < typeTime) {
  // 타이핑 중
  numChars = Math.floor(t * typeSpeed);
} else if (t < typeTime + pauseTime) {
  // 대기 중
  numChars = txt.length;
} else {
  // 삭제 중
  deleteT = t - typeTime - pauseTime;
  numChars = txt.length - Math.floor(deleteT * deleteSpeed);
}

txt.substring(0, Math.max(0, numChars));

Tips ​

Source Text에 적용

이 익스프레션은 텍스트 레이어의 Source Text 속성에 적용합니다.

글꼴 선택

타자기 효과에는 고정폭 글꼴(Courier, Consolas 등)이 더 잘 어울립니다.

한글 주의

한글은 조합형 문자이므로 글자가 완성되기 전에 잘리면 깨져 보일 수 있습니다. 자음/모음 단위로 나뉘지 않도록 주의하세요.