무료 모션그래픽 툴 Phase 사용후기

Phase 후기🔥 Phase란 무엇인가Phase는 5월 2일날 한국에 런칭한 따끈 따끈한 애니메이션 툴입니다. 직접 사용해보니 어도비의 에펙, 일러스트레이터, 피그마를 합친 느낌이었습니다 😳 🔥 Phase 인상 깊었던 기능페이즈는 계속해서 새로운 기능들이 추가되고 있는 중! 현재는 기능이 부족하지만 웬만한 건 거의 다 있긴 하다. 아무튼 개인적으로 인상 깊었던 건 animate 기능 1. Animate 이게 진짜 편하다고 느꼈는데 Animate 버튼을 누르면 화면이 스윽 위로 올라가면서 타임라인 ui가 구성된다. 이게 디자인 작업과 영상 작업을 딱 분리해주는 느낌이라 After Effects만 해본 입장에서 정말 좋다고 느꼈다. 작업자마다 다르겠지만 나 같은 경우는 After Effects 안에서 디자인..

• format_list_bulleted 🧠 저장/etc.
• · 2024. 5. 29.
• textsms

Three.js 간단 정리

Three.js로 웹에서 3D 구현하기 전부터 배우고 싶었는데 미루다 미루다 드디어 입문했습니다 😎지금 하는 일에 도움은 안되지만 순전히 재미만을 위한 학습 너무 좋아요 푸하항 사실 저는 6년 전 쯤, 3D 모델링을 잠깐 배워본 적이 있었고, 한 때는 관련 일을 꿈꾸기도 해서 그런지 이번 강의가 너무 재밌었어요. 그리고 PerspectiveCamera 라든가 ...  AmbientLight, texture 등 한 때는 자주 봤던(?) 단어들을 다시 보니 반갑기도 했어요. 아무튼 도전하기 어려운 Three.js를 이 강의를 통해 쉽게 훑어볼 수 있었네요.강의에 대한 내용은 맨 아래에 적어놨습니다!Three.js 의 특징- 자바스크립트 기반의 3D 라이브러리- WebGL기반으로 동작- 3D모델링, 렌더링,..

• format_list_bulleted 🧠 저장/etc.
• · 2024. 4. 2.
• textsms

SVG와 Canvas 간단 비교

SVG와 Canvas의 차이 SVG (Scalable Vector Graphics) SVG는 확장 가능한 벡터 그래픽라는 의미를 갖고있다. 이름 그대로 해석하면 커졌다 작아졌다해도 멀쩡한 벡터 (Vector) 이미지이다. 즉, 모든 사이즈에서 깔끔하게 렌더링 되는 이미지를 말한다. 일반적인 이미지 파일인 JPG, PNG는 비트맵 이미지 파일 형식이라 크기에 따라 품질 저하가 발생한다. 반면에 Vector는 기하학적 정보와 계산에 의한 이미지이다.... (아무튼 수학적이다.) 이러한 벡터 이미지는 크기나 해상도를 변경해도 그냥 다시 계산을 하면 되기 때문에 품질 저하가 없다. 또한 크기를 키워도 데이터 양은 바뀌지 않는다. 이런 큰 장점이 있지만... 사실 복잡한 이미지는 오히려 더 무거워질 수 있어서 만..

• format_list_bulleted 🧠 저장/etc.
• · 2024. 3. 30.
• textsms

Lottie.js 간단 정리

Lottie.js- Lottie는 에어비엔비에서 만든 JSON 기반의 애니메이션 라이브러리이다. - Lottie 라이브러리를 통해 Adobe After Effects의 motion(움직임)을 json 기반의 데이터로 추출하여 웹에서 motion을 표현(렌더링)할 수 있다. - 이러한 lottie로 표현한 모션은 gif 파일보다 훨씩 작은 용량으로 리소스를 대폭 줄일 수 있다. https://airbnb.design/lottie/ LottieEasily add high-quality animation to any native app. Lottie is an iOS, Android, and React Native library that renders After Effects animations in real..

• format_list_bulleted 🧠 저장/etc.
• · 2024. 3. 25.
• textsms

웹팩(모듈 번들러) 간단 정리

웹팩 - 프론트엔드 프레임워크에서 가장 많이 사용되는 모듈 번들러(Module Bundler) *** 빌드=번들링=변환 다 같은 말임 모듈 - 프로그래밍 관점에서 특정 기능을 갖는 작은 코드 단위 모듈 번들링 - 웹 애플리케이션 몇백개 자원들을 하나의 파일로 압축해주는 동작 - 파일들간의 관계를 모두 파악함 - 웹 애플리케이션을 구성하는 자원(HTML, CSS, Javscript, Images 등)을 모두 각각의 모듈로 보고 이를 조합해서 병합하는 도구 웹팩의 역할 - 웹팩은 파일 단위의 자바스크립트 모듈을 변수로 관리가 가능!! ( 예전엔 AMD, Common.js와 같은 라이브러리 사용했다고 한다...) - 웹개발 작업 자동화 도구 + 모듈 관리 ( 예를 들면 ... HTML, CSS, JS 압축 /..

• format_list_bulleted 🧠 저장/etc.
• · 2024. 2. 2.
• textsms