Framer: căn bản đến thực chiến, tự xây dựng portfolio xịn – TELOS Academy

Giới Thiệu Khóa Học:

• Khóa học này sẽ trang bị cho bạn những kiến thức nền tảng vững chắc về thiết kế website nói chung và công cụ Framer nói riêng. Từ đó, bạn sẽ có thể tự tin xây dựng một trang portfolio cá nhân ấn tượng, thể hiện rõ nét phong cách và năng lực của bản thân.

Đối Tượng Tham Gia:

• Designer & Web developer muốn thiết kế website đẹp và mượt mà
• Người muốn tự xây dựng trang portfolio cá nhân
• Người có nhu cầu thiết kế prototype, reference nhanh về hiệu ứng cho các bộ phận liên quan
• Các bạn học viên Figma căn bản tại TELOS Academy

Nội Dung Khóa Học:

Với sự hướng dẫn của Toàn Bùi người có hơn 10 năm kinh nghiệm trong tư vấn và triển khai các dự án website cho khách hàng, đồng thời cũng là một marketer & nhà tuyển dụng bạn sẽ nhận được những nội dung cô đọng và rõ ràng về:

• Những kiến thức cốt lõi cần nắm về Framer (layout, component, text style, color style, responsive, các loại hiệu ứng)
• Giải thích cặn kẽ về effect trigger, cách thiết kế hiệu ứng.
• Thực chiến tạo ra một trang portfolio sáng tạo và hấp dẫn mà không cần viết code.

Lợi Ích Sau Khóa Học:

• Tự tin nắm vững kiến thức nền tảng Framer
• Tự tay thiết kế trang portfolio với các hiệu ứng có cơ sở, khởi đầu cho cảm hứng trở thành Framer designer chuyên nghiệp
• Tham gia nhóm hỗ trợ Framer.

Nội Dung Khóa Học

▶️ Chương 1: Tổng quan
Bài 1: Tổng quan về các nền tảng tạo website
Bài 2: Các nguồn tài nguyên cho Framer
Bài 3: Cơ bản về khung giao diện Framer
Bài 4: Khám phá kho template phong phú
—–
▶️ Chương 2: Layout & nền tảng
Bài 5: Định layout: Frame, Stack, Grid
Bài 6: Breakpoints & Responsive
Bài 7: Thiết lập phong cách text & bảng màu
Bài 8: Điều hướng trang web (Navigation)
Bài 9: Tổng quan về các element
Bài 10: Ticker Element
Bài 11: Carousel Element
Bài 12: Slideshow Element
Bài 13: Hand on & thực hành: Chuyển từ thiết kế Figma sang Framer
Bài 14: Scroll section
Bài 15: Position Sticky & Fixed
—–
▶️ Chương 3: Component
Bài 16: Component, Variants & Variables
—–
▶️ Chương 4: Hiệu ứng
Bài 17: Hiệu ứng trên text
Bài 18: Tổng quan về các hiệu ứng khác
Bài 19: Kích hoạt hiệu ứng khi “Layer in view”
Bài 20: Kích hoạt hiệu ứng khi “Section in view”
Bài 21: Hiệu ứng Parallax
Bài 22: Thay đổi variant khi scroll
—–
▶️ Chương 5: CMS
Bài 23: Collection, Template cho danh sách và trang chi tiết, kết nối dữ liệu động
—–
▶️ Chương 6: Tạo trang portfolio & xuất bản
Bài 24: Giới thiệu & phân tích
Bài 25: Navigation / Header
Bài 26: Hero section
Bài 27: About
Bài 28: Services
Bài 29: Projects
Bài 30: Testimonial
Bài 31: Contact / Footer
Bài 32: Hiệu ứng cho navigation / header
Bài 33: Responsive
Bài 34: Publish website