✨ Mind Weaver

Đây là dự án gửi tham gia thử thách Google AI Studio Multimodal Challenge

Giới Thiệu Về Mind Weaver

Tôi đã phát triển Mind Weaver, một ứng dụng thiết kế để ghi lại những ý tưởng chưa hoàn thiện, những giấc mơ thoáng qua, và những câu chuyện chưa thành hình, sau đó kết nối chúng thành một thực tại đa phương thức phong phú. Bạn có bao giờ có một ý tưởng mà bạn không thể diễn đạt thành lời, như "một thư viện nơi những cuốn sách thì thầm bí mật" hoặc "một thành phố được điều khiển bởi những ký ức quên lãng"? Mind Weaver sẽ biến ngọn lửa đó thành một câu chuyện ngắn hấp dẫn và một bài thơ được thiết kế đẹp mắt.

Tuy nhiên, ứng dụng không chỉ dừng lại ở văn bản. Mind Weaver chuyển đổi bài thơ đã tạo thành một tác phẩm nghệ thuật thị giác độc đáo, có thể chia sẻ - một "thẻ thơ" có thể tải xuống với phông chữ thanh lịch và nền màu gradient tuyệt đẹp. Để hoàn thiện trải nghiệm, nó cũng có thể đọc câu chuyện to lên, mang đến giọng nói cho những ý tưởng mà bạn luôn muốn khám phá. Đây là công cụ dành cho bất kỳ ai muốn thấy những ý tưởng mới nảy nở thành điều gì đó hữu hình và đẹp đẽ.

🚀 Trải Nghiệm Ngay

Hãy thử ngay: ✨ Mind Weaver

🎥 Video Demo

📸 Ảnh Chụp Màn Hình

⚒️ Cách Hoạt Động:

Người dùng nhập một ý tưởng đơn giản, một suy nghĩ thoáng qua, hoặc một đoạn giấc mơ vào ô văn bản.
Họ có thể chọn ngôn ngữ ưa thích cho đầu ra.
Chỉ cần nhấn nút "Weave My Thought", Mind Weaver sẽ bắt đầu công việc!
Chỉ trong vài giây, một câu chuyện xuất hiện, sẵn sàng để đọc.
Đồng thời, một bài thơ được tạo ra và hiển thị trên một thẻ đẹp mắt.
Người dùng có thể tùy chỉnh phông chữ của bài thơ, tải thẻ xuống dưới dạng hình ảnh, hoặc chia sẻ trực tiếp.
Đối với câu chuyện, họ có thể nhấn nút "Narrate" và chọn một giọng nói để nghe sáng tạo của mình được đọc to.

Cách Tôi Sử Dụng Google AI Studio

Google AI Studio là động cơ chính cho toàn bộ dự án này. Tôi đã tận dụng mô hình Gemini 2.5 Flash với tốc độ và khả năng sáng tạo tuyệt vời, hoàn hảo cho việc tạo ra văn bản chất lượng cao ngay lập tức.

Tâm điểm của quá trình tích hợp nằm ở hai cuộc gọi API song song tới API Gemini sử dụng SDK @google/genai:

Tạo câu chuyện: Tôi gửi một prompt như: Viết một câu chuyện ngắn, tưởng tượng trong [ngôn ngữ đã chọn] dựa trên đầu vào này: [ý tưởng của người dùng].
Tạo bài thơ: Một prompt tương tự được gửi cho bài thơ: Viết một bài thơ đẹp, sáng tạo trong [ngôn ngữ đã chọn] dựa trên đầu vào này: [ý tưởng của người dùng].

Để tạo ra trải nghiệm người dùng mượt mà và phản hồi nhanh chóng, tôi đã sử dụng phương thức generateContentStream. Điều này cho phép câu chuyện và bài thơ xuất hiện trên màn hình từng token một khi chúng đang được tạo ra, thay vì khiến người dùng phải chờ đợi toàn bộ phản hồi. Điều này làm cho ứng dụng cảm thấy sống động và cực kỳ nhanh chóng.

Các Tính Năng Đa Phương Thức

Điều kỳ diệu thực sự của Mind Weaver nằm ở cách nó kết hợp các chế độ nội dung khác nhau để tạo ra điều gì đó thực sự đặc biệt.

1. Từ Văn Bản Đến Hình Ảnh (thông qua HTML & Canvas)

Đây là tính năng đa phương thức độc đáo nhất của ứng dụng. Thay vì sử dụng một mô hình tạo hình ảnh chuyên dụng, nó tạo ra một đại diện hình ảnh của bài thơ đã tạo ra theo cách lập trình. Dưới đây là quy trình:

Gemini tạo ra văn bản bài thơ.
Mã frontend động tạo ra một phần tử <div>, tạo kiểu với nền gradient được chọn ngẫu nhiên và phông chữ do người dùng chọn.
Thư viện nổi tiếng html2canvas sau đó sẽ chụp lại <div> đã được tạo kiểu này và chuyển đổi nó thành một hình ảnh PNG chất lượng cao.

Cách tiếp cận này tạo ra một tác phẩm "nghệ thuật từ chữ" độc đáo từ văn bản, biến đầu ra thơ của AI thành một hình ảnh đẹp mà có thể được lưu lại và chia sẻ.

2. Từ Văn Bản Đến Giọng Nói (Kể Chuyện)

Để thêm một chiều âm thanh, tôi đã tích hợp Web Speech API của trình duyệt.

Khi câu chuyện được tạo ra, nút "Narrate" sẽ trở nên hoạt động.
Ứng dụng lấy danh sách các giọng nói có sẵn từ trình duyệt của người dùng và điền vào menu dropdown, cho phép người dùng cá nhân hóa.
Khi người dùng nhấn "Narrate", API sẽ đọc câu chuyện đã tạo ra, biến từ viết thành một màn trình diễn lời nói.

3. Cá Nhân Hóa Ngôn Ngữ và Giọng Nói

Để tạo ra trải nghiệm thực sự toàn cầu và cá nhân, Mind Weaver kết hợp:

Tạo Đa Ngôn Ngữ: Người dùng có thể chọn tạo cả câu chuyện và bài thơ bằng nhiều ngôn ngữ khác nhau, bao gồm tiếng Anh, Tây Ban Nha, Pháp, Đức, Nhật Bản và Hindi. Điều này được thực hiện bằng cách điều chỉnh động các prompt gửi đến API Gemini.
Giọng Nói Đa Dạng Khi Kể Chuyện: Tính năng văn bản thành giọng nói kết nối với API Web Speech gốc của trình duyệt, điền vào dropdown với tất cả các giọng nói hệ thống có sẵn. Điều này cho phép người dùng nghe câu chuyện của họ được đọc với nhiều giọng nói và ngữ điệu khác nhau, tạo thêm một lớp cá nhân hóa cho trải nghiệm âm thanh.

Sự kết hợp này của văn bản được tạo ra, hình ảnh được tạo ra, và giọng nói tổng hợp tạo ra một trải nghiệm đa giác quan phong phú từ một prompt người dùng duy nhất, minh họa cho tiềm năng sáng tạo và đa dạng của việc kết hợp Gemini với các công nghệ web khác.

Thực Hành Tốt Nhất

Tối ưu hóa trải nghiệm người dùng: Đảm bảo rằng quá trình tạo nội dung là nhanh chóng và mượt mà.
Bảo trì mã nguồn: Luôn cập nhật SDK và thư viện để tận dụng các tính năng mới và sửa lỗi.

Cạm Bẫy Thường Gặp

Chất lượng văn bản: Đôi khi, văn bản được tạo ra có thể không đạt yêu cầu về chất lượng. Cần kiểm tra và chỉnh sửa lại để đảm bảo tính hợp lý.
Hiệu suất: Đảm bảo rằng ứng dụng hoạt động ổn định trên nhiều trình duyệt và thiết bị.

Mẹo Tối Ưu Hiệu Suất

Sử dụng bộ nhớ cache: Tối ưu hóa việc gọi API bằng cách sử dụng bộ nhớ cache cho các đầu vào đã được xử lý.
Tối ưu hóa hình ảnh: Đảm bảo hình ảnh được tạo ra có kích thước và định dạng tối ưu để tải nhanh hơn.

Giải Quyết Vấn Đề

Lỗi không phản hồi: Kiểm tra kết nối Internet và đảm bảo rằng API hoạt động bình thường.
Vấn đề ngôn ngữ: Kiểm tra xem ngôn ngữ đã chọn có khả dụng trong API hay không, và điều chỉnh đầu vào cho phù hợp.

Kết Luận

Mind Weaver không chỉ là một công cụ sáng tạo, mà còn là một trải nghiệm phong phú cho những ai yêu thích việc khám phá và phát triển ý tưởng. Hãy thử nghiệm ngay hôm nay để thấy sức mạnh của trí tuệ nhân tạo trong việc biến những ý tưởng của bạn thành hiện thực! Hãy truy cập Mind Weaver để bắt đầu.

Câu Hỏi Thường Gặp (FAQ)

Mind Weaver có miễn phí không?
- Có, bạn có thể sử dụng Mind Weaver miễn phí với một số tính năng hạn chế.
Có thể sử dụng Mind Weaver trên thiết bị di động không?
- Có, ứng dụng hỗ trợ cả trên desktop và thiết bị di động.
Tôi có thể tạo bài thơ bằng ngôn ngữ nào?
- Bạn có thể tạo bài thơ bằng nhiều ngôn ngữ khác nhau, bao gồm tiếng Anh, Tây Ban Nha, và nhiều ngôn ngữ khác.

✨ Mind Weaver: Tạo Nghệ Thuật Từ Ý Tưởng