미드저니 랜딩페이지가 너무 맘에들어서 무슨 라이브러리 썼나 찾아보다가. 클로닝한 영상을 찾게되었다.

이분 작업을 보니깐 코드양이 그리 많지는 않아서, 나도 한번 클로닝을 해보았다.

트랜스폼 로직만 조금 분리해내서 파이프라인형태로 넣을 수 있게 만들었다. 만든뒤 lit element로 잘 말아주었다.

요런 것들을 할 수있다.

기본

미드저니 스타일 spiral

<AsciiElement 
  transforms={['spiral']} />

spiral -> zoom -> wave

<AsciiElement 
  transforms={['spiral', 'zoom', 'wave']}/>

기다리다 보면 은하 모양이됨

쭉쭉 몇개 더 첨부해보려 했는데, 더 넣으니 브라우저가 뻗으려한다… 그래서 여기까지만 하겠다.
돔 수를 좀 줄여보니깐 괜찮아졌다.
잘 관리해서 쓰면 재미있을 것 같다.