NEW

Design

UI/UX

[LottieFiles公式] LottieFiles for Framer : FramerでLottieアニメーション200%活用する（修了証発行）

グローバルモーションデザインプラットフォームLottieFilesの公式初韓国語化講座、今Inflearnで独占的にご覧いただけます！講座を全て受講するとLottieFiles公式修了証を受け取ることができます。

16名 が受講中です。

lottiefiles

실습 중심

자격증

framer

모션

인터랙티브웹

Web Design

Interactive Web

Responsive Web

Lottie

こんなことが学べます

Framer内でLottieアニメーションを直接読み込み、制御する方法
クリック、スクロール、カーソル移動など様々なインタラクション実装法
複雑なコードなしで感覚的なWebインタラクションを実装する実戦ノウハウ

こんな方に
おすすめです

学習対象は
誰でしょう？

Framerでウェブサイトを制作しているデザイナー/企画者
ウェブサイトに洗練されたモーションを加えたいウェブデザイナー及びマーケター
ノーコードで高度なインタラクションを実装したいフロントエンド入門者

前提知識、
必要でしょうか？

基本的なFramerの使用経験（フレーム作成、セクション構成など）
Figmaの基本機能に対する理解
初心者でも映像の流れに沿って十分に実習できるよう構成されています。

こんにちは
です。

1,178

受講生

受講レビュー

4.9

講座評価

講座

로티파일즈(LottieFiles)는 전 세계 디자이너와 개발자들이 손쉽게 애니메이션을 만들고, 관리하고,적용할 수 있도록 도와주는 플랫폼이에요. Lottie 포맷 기반의 애니메이션을 웹, 앱, 프리젠테이션 등 다양한 환경에 빠르게 적용할 수 있으며,효율적인 팀 협업과 모션 디자인 워크플로우 향상을 위한 다양한 도구를 제공합니다.

カリキュラム

全体

9件 ∙ (31分)

セクション 1．Lottieアニメーション作成

3件 ∙ (8分)

1. FigmaでLottieアニメーション作成
03:30
2. Lottie Creatorでアニメーション作成
02:36
3. AIツールを活用したLottieアニメーション制作
02:41

セクション 2．FramerにLottieアニメーションを適用する

2件 ∙ (7分)

4. Framer ウェブサイトにLottieアニメーションを挿入する
04:46
5. dotLottieアニメーションファイルを理解する
02:27

セクション 3．FramerでLottieアニメーションにインタラクションを追加する

4件 ∙ (15分)

6. インタラクティブアニメーション：ホバーおよびクリックトリガーの適用
02:20
7. インタラクティブアニメーション：スクロール効果の適用
02:50
8. Lottieでフェイク3D効果を作る
04:16
9. インタラクティブアニメーション：カーソルの動きに反応させる方法
05:37

講座掲載日:

最終更新日:

受講レビュー

まだ十分な評価を受けていない講座です。

みんなの役に立つ受講レビューを書いてください！

無料

lottiefilesの他の講座

知識共有者の他の講座を見てみましょう！

[LottieFiles chính thức] LottieFiles for Webflow : Website tương tác hoàn thiện với Lottie (Cấp chứng chỉ hoàn thành)

lottiefiles

Khóa học tiếng Hàn chính thức đầu tiên của nền tảng thiết kế chuyển động toàn cầu LottieFiles, hiện chỉ có độc quyền trên Inflearn. Khi hoàn thành khóa học, bạn có thể nhận được chứng chỉ hoàn thành chính thức từ LottieFiles.

입문

Motion Graphic, Web Design, Lottie

[LottieFiles chính thức] LottieFiles for Webflow : Website tương tác hoàn thiện với Lottie (Cấp chứng chỉ hoàn thành)

lottiefiles

[LottieFiles chính thức] Tạo Lottie Animation với After Effects (Cấp chứng chỉ hoàn thành)

lottiefiles

Khóa học tiếng Hàn chính thức đầu tiên của nền tảng thiết kế chuyển động toàn cầu LottieFiles, hãy gặp gỡ độc quyền trên Inflearn ngay bây giờ! Khi hoàn thành toàn bộ khóa học, bạn có thể nhận được chứng chỉ hoàn thành chính thức từ LottieFiles.

입문

After Effects, Lottie, 3d

[LottieFiles chính thức] Tạo Lottie Animation với After Effects (Cấp chứng chỉ hoàn thành)

lottiefiles

[LottieFiles chính thức] Figma to Lottie: Tạo hoạt ảnh chuyển động trong Figma (Cấp chứng chỉ hoàn thành)

lottiefiles

Khóa học chính thức đầu tiên bằng tiếng Hàn của nền tảng motion design toàn cầu LottieFiles, hãy gặp gỡ độc quyền tại Inflearn ngay! Khi hoàn thành toàn bộ khóa học, bạn sẽ nhận được chứng chỉ chính thức từ LottieFiles.

입문

Motion Graphic, Animation, Figma

[LottieFiles chính thức] Figma to Lottie: Tạo hoạt ảnh chuyển động trong Figma (Cấp chứng chỉ hoàn thành)

lottiefiles

似ている講座

同じ分野の他の講座を見てみましょう！

Khóa học tổng thể về ứng dụng Sketch [Ứng dụng Sketch]

agilelabs

Nếu bạn biết những điều cơ bản về cách sử dụng ứng dụng Sketch nhưng không sử dụng tốt các biểu tượng và tính năng tạo mẫu của ứng dụng Sketch, bạn không thể nói rằng bạn biết rõ về ứng dụng Sketch!

초급

Web Design, Sketch, Mobile App Design

Khóa học tổng thể về ứng dụng Sketch [Ứng dụng Sketch]

agilelabs

Lớp học bí kíp Midjourney, tổng hợp cốt lõi kỹ thuật prompt hình ảnh từ chuyên gia thiết kế AI đang hoạt động

masocampus

Công cụ tiêu biểu của AI tạo hình ảnh, Midjourney! Từ cách sử dụng cơ bản đến ứng dụng thực tế thông qua thực hành dự án thiết kế thực tế, tất cả trong một!

입문

Web Design, Character Design, Mobile App Design

Lớp học bí kíp Midjourney, tổng hợp cốt lõi kỹ thuật prompt hình ảnh từ chuyên gia thiết kế AI đang hoạt động

masocampus

Sử dụng ScrollTrigger của GSAP để tạo portfolio

jyoung

Hãy tạo một trang web portfolio phản ứng nhanh, tương tác và phản hồi theo thao tác cuộn bằng cách sử dụng ScrollTrigger của GSAP!

초급

HTML/CSS, scrolltrigger, gsap

Sử dụng ScrollTrigger của GSAP để tạo portfolio

jyoung

[LottieFiles chính thức] Tạo Lottie Animation với After Effects (Cấp chứng chỉ hoàn thành)

lottiefiles

입문

After Effects, Lottie, 3d

[LottieFiles chính thức] Tạo Lottie Animation với After Effects (Cấp chứng chỉ hoàn thành)

lottiefiles

Vanilla JavaScript & Tailwind CSS

csslick

Phát triển Web UI thực chiến: Học ứng dụng AI và xây dựng UI theo hướng component, Khóa học thiết yếu cho designer + developer!

초급

JavaScript, vanilla-javascript, frontend

Vanilla JavaScript & Tailwind CSS

csslick

Thiết kế trang chi tiết sản phẩm của bạn với Canva

codingai

Đây là khóa học giới thiệu hướng dẫn bạn cách thiết kế các trang chi tiết sản phẩm được sử dụng trong các khóa học trực tuyến, trung tâm mua sắm, v.v. bằng Canva, một công cụ thiết kế phổ biến.

입문

canva, Web Design

Thiết kế trang chi tiết sản phẩm của bạn với Canva

codingai

Trang trí thiết kế cửa hàng thông minh của bạn như một nhà thiết kế mà không cần thuê ngoài

speedydesign

Chỉ cần làm theo hướng dẫn trong khóa học này, bạn sẽ nhanh chóng và dễ dàng học được những điều cốt lõi và thiết kế một cửa hàng thông minh tinh tế. Hãy tạo ra cửa hàng thông minh theo đúng sở thích của bạn thông qua dịch vụ tư vấn thiết kế miễn phí 1:1!

초급

SmartStore, Photoshop, Web Design

Trang trí thiết kế cửa hàng thông minh của bạn như một nhà thiết kế mà không cần thuê ngoài

speedydesign

Tạo một trang web bán vé xem phim: Thiết kế

webs

Nếu bạn đã theo dõi các bài giảng về tiêu chuẩn web và cách tạo trang web đáp ứng, thì giờ là lúc thực hành thực tế! Chúng ta sẽ tìm hiểu cách tạo một trang web đặt trước phim bằng cách chia nó thành phần thiết kế và phần mã hóa.

초급

Photoshop, Responsive Web

Tạo một trang web bán vé xem phim: Thiết kế

webs