강의

멘토링

로드맵

Design

/

UI/UX

[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)

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.

(4.9) 36 đánh giá

874 học viên

Motion Graphic
Animation
Figma
No-code
UIUX
Thumbnail

Đánh giá từ những học viên đầu tiên

Dịch cái này sang tiếng Việt

  • Toàn bộ quá trình từ cài đặt đến ứng dụng thực tế plugin LottieFiles

  • Cách làm animation không cần code trên Figma

  • Áp dụng animation cho UI: text, icon, character, v.v.

  • Cách tạo animation Lottie (JSON) áp dụng ngay cho web/app

KIỂM TRA 1

Lottie là gì?

Lottie là tệp hoạt hình dựa trên JSON

Sử dụng Lottie, bạn có thể chuyển đổi animation dễ dàng như chuyển đổi hình ảnh.

Dung lượng nhỏ và có thể hoạt động trên bất kỳ thiết bị nào

Việc điều chỉnh kích thước mà không làm giảm độ phân giải là ưu điểm mạnh mẽ của Lottie.

KIỂM TRA 2

Tại sao nên sử dụng Lottie?

Điều chỉnh kích thước tự do

Không bị ảnh hưởng bởi độ phân giải
có thể phóng to hoặc thu nhỏ.

Kích thước nhỏ
So với các định dạng như GIF hay MP4
chất lượng giống nhau nhưng nhỏ hơn rất nhiều.

Tính tương tác
Lottie có các yếu tố hoạt hình được hiển thị
có thể chỉnh sửa để tương tác và phản ứng
với các tương tác như cuộn, nhấp chuột, di chuột.

Hỗ trợ đa nền tảng và thư viện
Việc bàn giao Lottie cho các nhà phát triển thực sự rất dễ dàng. Bạn có thể sử dụng hoạt ảnh Lottie trực tiếp trên iOS, Android, web, React Native mà không cần chỉnh sửa gì.

KIỂM TRA 3

Các dịch vụ web và ứng dụng hàng đầu thế giới đang
sử dụng Lottie

Hãy xem các trường hợp sử dụng của Lottie đang được sử dụng tích cực trong thực tế!

cashbag - showcase card
Gmarket - showcase card(kr) (1)
Qcells - showcase card (2)
showcase card (1)
showcase card (2)
showcase card_kr
showcase card
KR - riid - showcase card


gbike-kr card
Spoon - showcase card kr

Các trường hợp sử dụng đa dạng khác bạn có thể xem tại đây.

KIỂM TRA 4

Chỉ có tại Inflearn!
Tham gia khóa học LottieFiles chính thức được bản địa hóa tiếng Hàn
và áp dụng ngay vào công việc của bạn!

[[SPAN_1]]🫠 [[/SPAN_2]][[SPAN_2]]Tôi muốn tạo animation UI đơn giản nhưng không biết cách làm..[[/SPAN_2]]

[[SPAN_1]]🧐[[/SPAN_2]][[SPAN_2]] Làm thế nào để chuyển file animation được tạo trong Figma cho developer?[[/SPAN_2]]

Chỉ có thiết kế tĩnh thôi là chưa đủ trong thời đại hiện tại, chúng ta cần 'thiết kế chuyển động' để nâng cao trải nghiệm người dùng.
Trong khóa học này, từ việc cài đặt plugin LottieFiles đến cách áp dụng animation cho các thành phần UI khác nhau,
chúng tôi sẽ hướng dẫn bạn một cách có hệ thống để có thể thực hiện trực tiếp trong Figma.

Cách tạo giao diện sống động mà không cần code, hãy bắt đầu ngay bây giờ!

KIỂM TRA 5

<Figma to Lottie: Tạo animation chuyển động trong Figma>
Làm thế nào để học khóa học này?

Các khóa học Inflearn hỗ trợ nhiều ngôn ngữ âm thanh và phụ đề khác nhau.

Nhấn vào biểu tượng bánh răng (cài đặt) ở phía dưới màn hình học,
sau đó tự do chọn ngôn ngữ âm thanh và phụ đề mong muốn.

CHECK 6

LottieFiles chứng nhận
Nhận chứng chỉ hoàn thành!

Khi hoàn thành tất cả các bài gi강의
và nộp bài quiz cuối cùng,
bạn sẽ nhận được cả chứng chỉ LottieFileschứng chỉ Inflearn!
Hãy tự do sử dụng chứng chỉ đã nhận trên LinkedIn hoặc portfolio của bạn.

Chứng chỉ hoàn thành Inflearn có thể
được xem trực tiếp tại menu Trang cá nhân > Học tập của tôi > Chứng chỉ.

Khuyến nghị cho
những người này

Khóa học này dành cho ai?

  • Nhà thiết kế UI/UX muốn thử sức với thiết kế tương tác

  • Tự tay làm animation prototype không cần developer.

  • Người chỉ mới nghe nói LottieFiles là gì, người đang tìm cơ hội tốt để thử ngay!

Cần biết trước khi bắt đầu?

  • Không cần kiến thức After Effects hay coding chút nào.

  • 기본적인 Figma 사용 경험이 있다면 충분해요!

Xin chào
Đây là

1,301

Học viên

41

Đánh giá

4.9

Xếp hạng

4

Các khóa học

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

Chương trình giảng dạy

Tất cả

10 bài giảng ∙ (26phút)

Tài liệu khóa học:

Tài liệu bài giảng
Ngày đăng: 
Cập nhật lần cuối: 

Đánh giá

Tất cả

36 đánh giá

4.9

36 đánh giá

  • 권자영님의 프로필 이미지
    권자영

    Đánh giá 1

    Đánh giá trung bình 5.0

    5

    100% đã tham gia

    • ksrtt님의 프로필 이미지
      ksrtt

      Đánh giá 9

      Đánh giá trung bình 5.0

      5

      100% đã tham gia

      • 최유빈님의 프로필 이미지
        최유빈

        Đánh giá 2

        Đánh giá trung bình 5.0

        5

        100% đã tham gia

        젛아요 쉽게 설명해주셔서 감사합니당!!!!

        • ksjung님의 프로필 이미지
          ksjung

          Đánh giá 4

          Đánh giá trung bình 4.0

          4

          60% đã tham gia

          • 쿠카이든님의 프로필 이미지
            쿠카이든

            Đánh giá 469

            Đánh giá trung bình 5.0

            5

            30% đã tham gia

            피그마에서 로띠를 어떻게 적용하면 되는지 배웠습니다. 좋은 강의 감사합니다.

            Miễn phí

            Khóa học khác của LottieFiles

            Hãy khám phá các khóa học khác của giảng viên!

            Khóa học tương tự

            Khám phá các khóa học khác trong cùng lĩnh vực!