Nâng cao thẩm mỹ front-end
Hướng dẫn
Hãy tránh lối thiết kế "mớm rụm" theo kiểu AI tầm thường và tạo ra một giao diện người dùng độc đáo đến bất ngờ.
Năm khía cạnh cốt lõi
**1. Nghệ thuật sắp chữ**
- ❌ Cấm sử dụng: Inter, Roboto, Arial, phông chữ hệ thống
- ✅ Lựa chọn: Phông chữ độc đáo, khác biệt
- ✅ Kết hợp: Phông chữ nổi bật + Phông chữ chính, độ tương phản cao
- ✅ Mẹo: Độ tương phản phông chữ cực cao (100 so với 900), phạm vi kích thước phông chữ lớn (gấp 3 lần trở lên)
2. Màu sắc & Chủ đề
- ✅ Duy trì tính thẩm mỹ nhất quán bằng cách sử dụng các biến CSS.
- ✅ Màu chủ đạo + màu nhấn rực rỡ
- ❌ Tránh: Hiệu ứng chuyển màu tím + nền trắng
- ✅ Nguồn cảm hứng: Chủ đề IDE, thẩm mỹ văn hóa
**3. Chuyển động**
- ✅ Hiệu ứng hoạt ảnh CSS được ưu tiên (HTML)
- ✅ Thư viện chuyển động
- ✅ Tập trung vào hiệu quả cao: Trải nghiệm tải trang được tối ưu hóa kỹ lưỡng > Các tương tác nhỏ rải rác
- ✅ Kích hoạt cuộn, bất ngờ khi di chuột
4. Bố cục không gian
- ✅ Luồng chảy không đối xứng, chồng chéo, chéo
- ✅ Phá vỡ bố cục lưới, sử dụng khoảng trắng táo bạo HOẶC mật độ được kiểm soát
5. Thông tin cơ bản**
- ✅ Tạo không khí và chiều sâu
- ✅ Lưới chuyển sắc, nhiễu, họa tiết hình học
- ✅ Độ trong suốt nhiều lớp, hiệu ứng đổ bóng ấn tượng, viền trang trí
## Nguyên tắc chính
- Mỗi thiết kế nên khác nhau để tránh sự trùng lặp.
- Đạt được tầm nhìn thẩm mỹ phù hợp với độ phức tạp
Sự phức tạp tột độ đòi hỏi thiết kế tỉ mỉ, trong khi chủ nghĩa tối giản lại cần sự tiết chế và chính xác.
- Thoát khỏi lối suy nghĩ truyền thống và đưa ra những lựa chọn thực sự độc đáo.
⚡ Tóm tắt một dòng
Phông chữ độc đáo + phối màu táo bạo + hoạt ảnh tỉ mỉ + bố cục sáng tạo + hình nền ấn tượng = thiết kế giao diện người dùng khó quên
Từ chối: Inter/Roboto, nền trắng chuyển sắc tím, bố cục đơn điệu
📋 Danh sách kiểm tra nhanh
Kích thước và các hạng mục kiểm tra
Liệu các phông chữ có nên tránh sử dụng Inter/Roboto không? Có sự kết hợp màu sắc độc đáo nào không?
Liệu bảng màu có chủ đề thống nhất không? Có nên tránh sử dụng hiệu ứng chuyển màu tím không?
Liệu hoạt hình đó có hiệu ứng tải được dàn dựng tỉ mỉ không?
Cách bố trí này có khác biệt so với lưới bố cục thông thường không?
Phông nền có tạo chiều sâu và không khí cho bức tranh không?
Mô tả
Được đề xuất bởi
nene@YouMind
Vì sao chúng tôi đề xuất kỹ năng này
Chán ngấy với thiết kế 'AI slop' na ná nhau? Kỹ năng này sẽ giúp bạn thoát khỏi sự tầm thường, thông qua cách sắp chữ độc đáo, màu sắc táo bạo, hiệu ứng động tinh tế, bố cục không gian sáng tạo và nền tảng có chiều sâu, tạo ra giao diện front-end ấn tượng. Nó cung cấp một bộ hướng dẫn thẩm mỹ thực tế, giúp tác phẩm của bạn nổi bật giữa vô số trang web, thực sự đạt được đột phá về mặt thị giác.
Cá tính phông chữ độc đáo Thẩm mỹ cyberpunk tối Bố cục động bất đối xứng Hoạt ảnh tải được dàn dựng tinh tế Tạo bầu không khí đắm chìm
Kỹ năng liên quan
Xem tất cả
Trình chiếuPhong cách biên tập brutalist
Chuyển đổi nội dung chủ đề, bài viết, kiến thức, tổng kết dự án, giáo trình hoặc giới thiệu công cụ của bạn thành một bộ Slides ngang với phong cách biên tập tân brutalist dành cho nhà phát triển. Phong cách tổng thể kết hợp thiết kế tân brutalist, bố cục tạp chí độc lập và thẩm mỹ terminal của nhà phát triển: nền trắng kem, viền đen đậm, bóng cứng, mảng màu tương phản cao, tiêu đề siêu đậm, phông chữ đẳng rộng, bố cục module web/terminal/card, tạo cảm giác thể hiện nội dung kỹ thuật mạnh mẽ. Kỹ năng này sẽ trước tiên trích xuất cấu trúc nội dung, sau đó xác định một ý chính cho mỗi trang, tự động tạo tiêu đề, câu giải thích, module kiến thức, kết luận và thành phần hình ảnh phù hợp. Nó đặc biệt phù hợp với các tình huống nội dung như giới thiệu công cụ AI, thực hành Agent, phân tích dự án mã nguồn mở, sắp xếp nội dung khóa học, tổng kết phương pháp luận, giải thích tính năng sản phẩm và đánh giá kỹ thuật. Đầu ra cuối cùng là Slides ngang tỷ lệ 16:9, với hình ảnh tổng thể thống nhất, dễ đọc, khoảng trắng đầy đủ, phong cách rõ ràng, mang lại hiệu ứng trình bày cao cấp như 'tác giả dự án mã nguồn mở đang chia sẻ kỹ thuật, lại như tạp chí thiết kế độc lập đang kể chuyện'.
Hình ảnhPoster phong cách đá họa Hán
Một hệ thống thị giác được chắt lọc từ đá họa Hán: nhân vật hình cắt hình học × nền cổ điển × bố cục biên tập bất đối xứng. Phù hợp cho poster sự kiện, quảng cáo livestream, bìa podcast, v.v. Bạn chỉ cần nói chủ đề, nó sẽ khắc nội dung hiện đại vào mỹ học 2000 năm.
ViếtTiêu đề Dan Koe cho IP tinh tế
Tạo 7 tiêu đề cho nội dung của người dùng, mỗi tiêu đề phải đại diện cho một đặc điểm phong cách cốt lõi của Dan Koe, đảm bảo tính đa dạng và không gian lựa chọn. Đây là một bậc thầy sáng tạo tiêu đề, am hiểu tâm lý lan truyền virus và thẩm mỹ nội dung của Dan Koe. Nó được thiết kế dành riêng cho người sáng tạo, người xây dựng thương hiệu cá nhân và dân du mục kỹ thuật số, nhằm biến chủ đề khô khan của bạn thành những tiêu đề bùng nổ mang chất 'nhà lãnh đạo tư tưởng'. 🌟 Năng lực cốt lõi Phân tích nội dung chuyên sâu: Tự động trích xuất các điểm đau cốt lõi, chân dung khán giả và cam kết giá trị từ các từ khóa rời rạc hoặc kịch bản dài. Bảy chiều vàng: Tuân thủ chặt chẽ logic hình ảnh của Dan Koe, tạo ra 7 góc tiếp cận hoàn toàn khác biệt trong một lần.
Nâng cao thẩm mỹ front-end
Hướng dẫn
Hãy tránh lối thiết kế "mớm rụm" theo kiểu AI tầm thường và tạo ra một giao diện người dùng độc đáo đến bất ngờ.
Năm khía cạnh cốt lõi
**1. Nghệ thuật sắp chữ**
- ❌ Cấm sử dụng: Inter, Roboto, Arial, phông chữ hệ thống
- ✅ Lựa chọn: Phông chữ độc đáo, khác biệt
- ✅ Kết hợp: Phông chữ nổi bật + Phông chữ chính, độ tương phản cao
- ✅ Mẹo: Độ tương phản phông chữ cực cao (100 so với 900), phạm vi kích thước phông chữ lớn (gấp 3 lần trở lên)
2. Màu sắc & Chủ đề
- ✅ Duy trì tính thẩm mỹ nhất quán bằng cách sử dụng các biến CSS.
- ✅ Màu chủ đạo + màu nhấn rực rỡ
- ❌ Tránh: Hiệu ứng chuyển màu tím + nền trắng
- ✅ Nguồn cảm hứng: Chủ đề IDE, thẩm mỹ văn hóa
**3. Chuyển động**
- ✅ Hiệu ứng hoạt ảnh CSS được ưu tiên (HTML)
- ✅ Thư viện chuyển động
- ✅ Tập trung vào hiệu quả cao: Trải nghiệm tải trang được tối ưu hóa kỹ lưỡng > Các tương tác nhỏ rải rác
- ✅ Kích hoạt cuộn, bất ngờ khi di chuột
4. Bố cục không gian
- ✅ Luồng chảy không đối xứng, chồng chéo, chéo
- ✅ Phá vỡ bố cục lưới, sử dụng khoảng trắng táo bạo HOẶC mật độ được kiểm soát
5. Thông tin cơ bản**
- ✅ Tạo không khí và chiều sâu
- ✅ Lưới chuyển sắc, nhiễu, họa tiết hình học
- ✅ Độ trong suốt nhiều lớp, hiệu ứng đổ bóng ấn tượng, viền trang trí
## Nguyên tắc chính
- Mỗi thiết kế nên khác nhau để tránh sự trùng lặp.
- Đạt được tầm nhìn thẩm mỹ phù hợp với độ phức tạp
Sự phức tạp tột độ đòi hỏi thiết kế tỉ mỉ, trong khi chủ nghĩa tối giản lại cần sự tiết chế và chính xác.
- Thoát khỏi lối suy nghĩ truyền thống và đưa ra những lựa chọn thực sự độc đáo.
⚡ Tóm tắt một dòng
Phông chữ độc đáo + phối màu táo bạo + hoạt ảnh tỉ mỉ + bố cục sáng tạo + hình nền ấn tượng = thiết kế giao diện người dùng khó quên
Từ chối: Inter/Roboto, nền trắng chuyển sắc tím, bố cục đơn điệu
📋 Danh sách kiểm tra nhanh
Kích thước và các hạng mục kiểm tra
Liệu các phông chữ có nên tránh sử dụng Inter/Roboto không? Có sự kết hợp màu sắc độc đáo nào không?
Liệu bảng màu có chủ đề thống nhất không? Có nên tránh sử dụng hiệu ứng chuyển màu tím không?
Liệu hoạt hình đó có hiệu ứng tải được dàn dựng tỉ mỉ không?
Cách bố trí này có khác biệt so với lưới bố cục thông thường không?
Phông nền có tạo chiều sâu và không khí cho bức tranh không?
Mô tả
Được đề xuất bởi
nene@YouMind
Vì sao chúng tôi đề xuất kỹ năng này
Chán ngấy với thiết kế 'AI slop' na ná nhau? Kỹ năng này sẽ giúp bạn thoát khỏi sự tầm thường, thông qua cách sắp chữ độc đáo, màu sắc táo bạo, hiệu ứng động tinh tế, bố cục không gian sáng tạo và nền tảng có chiều sâu, tạo ra giao diện front-end ấn tượng. Nó cung cấp một bộ hướng dẫn thẩm mỹ thực tế, giúp tác phẩm của bạn nổi bật giữa vô số trang web, thực sự đạt được đột phá về mặt thị giác.
Cá tính phông chữ độc đáo Thẩm mỹ cyberpunk tối Bố cục động bất đối xứng Hoạt ảnh tải được dàn dựng tinh tế Tạo bầu không khí đắm chìm
Kỹ năng liên quan
Xem tất cảTrình chiếuPhong cách biên tập brutalist
Chuyển đổi nội dung chủ đề, bài viết, kiến thức, tổng kết dự án, giáo trình hoặc giới thiệu công cụ của bạn thành một bộ Slides ngang với phong cách biên tập tân brutalist dành cho nhà phát triển. Phong cách tổng thể kết hợp thiết kế tân brutalist, bố cục tạp chí độc lập và thẩm mỹ terminal của nhà phát triển: nền trắng kem, viền đen đậm, bóng cứng, mảng màu tương phản cao, tiêu đề siêu đậm, phông chữ đẳng rộng, bố cục module web/terminal/card, tạo cảm giác thể hiện nội dung kỹ thuật mạnh mẽ. Kỹ năng này sẽ trước tiên trích xuất cấu trúc nội dung, sau đó xác định một ý chính cho mỗi trang, tự động tạo tiêu đề, câu giải thích, module kiến thức, kết luận và thành phần hình ảnh phù hợp. Nó đặc biệt phù hợp với các tình huống nội dung như giới thiệu công cụ AI, thực hành Agent, phân tích dự án mã nguồn mở, sắp xếp nội dung khóa học, tổng kết phương pháp luận, giải thích tính năng sản phẩm và đánh giá kỹ thuật. Đầu ra cuối cùng là Slides ngang tỷ lệ 16:9, với hình ảnh tổng thể thống nhất, dễ đọc, khoảng trắng đầy đủ, phong cách rõ ràng, mang lại hiệu ứng trình bày cao cấp như 'tác giả dự án mã nguồn mở đang chia sẻ kỹ thuật, lại như tạp chí thiết kế độc lập đang kể chuyện'.
Hình ảnhPoster phong cách đá họa Hán
Một hệ thống thị giác được chắt lọc từ đá họa Hán: nhân vật hình cắt hình học × nền cổ điển × bố cục biên tập bất đối xứng. Phù hợp cho poster sự kiện, quảng cáo livestream, bìa podcast, v.v. Bạn chỉ cần nói chủ đề, nó sẽ khắc nội dung hiện đại vào mỹ học 2000 năm.
ViếtTiêu đề Dan Koe cho IP tinh tế
Tạo 7 tiêu đề cho nội dung của người dùng, mỗi tiêu đề phải đại diện cho một đặc điểm phong cách cốt lõi của Dan Koe, đảm bảo tính đa dạng và không gian lựa chọn. Đây là một bậc thầy sáng tạo tiêu đề, am hiểu tâm lý lan truyền virus và thẩm mỹ nội dung của Dan Koe. Nó được thiết kế dành riêng cho người sáng tạo, người xây dựng thương hiệu cá nhân và dân du mục kỹ thuật số, nhằm biến chủ đề khô khan của bạn thành những tiêu đề bùng nổ mang chất 'nhà lãnh đạo tư tưởng'. 🌟 Năng lực cốt lõi Phân tích nội dung chuyên sâu: Tự động trích xuất các điểm đau cốt lõi, chân dung khán giả và cam kết giá trị từ các từ khóa rời rạc hoặc kịch bản dài. Bảy chiều vàng: Tuân thủ chặt chẽ logic hình ảnh của Dan Koe, tạo ra 7 góc tiếp cận hoàn toàn khác biệt trong một lần.
Tìm kỹ năng yêu thích tiếp theo của bạn
Khám phá thêm các kỹ năng AI được tuyển chọn cho nghiên cứu, sáng tạo và công việc hằng ngày.