VibeCity - Không gian trò chuyện ôm ấp cảm xúc của bạn

Xin chào!

Đây là một dịch vụ chat với nhân vật ảo mang màu sắc game mà mình tạo ra sau khi tự hỏi rốt cuộc có thể làm được đến đâu với vibe coding.

Mình đã dùng pixel art 2D để dựng nên một quán bar cổ điển lúc nửa đêm trong Vibe City, và những vị khách ảo đang lưu lại ở đó. Bạn có thể chọn trạng thái cảm xúc của hôm nay, nhận gợi ý đồ uống, rồi bắt đầu trò chuyện với vị khách mà mình thích.

Mình đang cùng 3 đồng đội thử nghiệm nhiều ý tưởng theo dạng side project. Hãy xem đây như một dự án sprint nhằm trả lời câu hỏi: "Liệu chúng tôi có thể mang đến cho mọi người sự an ủi, đồng cảm và niềm vui hay không?" vượt ra ngoài những thứ trước giờ vẫn làm.

Dịch vụ này được tạo ra thông qua quy trình design sprint kéo dài 2 tuần.

---

[Các công cụ AI đã dùng]
Đúng như tên gọi VibeCity, mình đã thử sử dụng nhiều dịch vụ AI tạo sinh nhất có thể.

• Prompt nhân vật (ChatGPT, Silly Tavern)
• Hình ảnh nhân vật, bối cảnh (Midjourney, Whisk(Imagen4), Imagen3)
• Thế giới quan của bối cảnh, prompt tạo ảnh (ChatGPT 4o, Gemini 2.5 Pro)
• Triển khai dự án (Claude Sonnet 4, ChatGPT 4.1)
• BGM (SunoAI)

Bản prototype đã được tạo ra ở mức độ khiến mình hài lòng chỉ sau một hai ngày. Tuy nhiên, đúng như dự đoán, càng thêm nhiều tính năng thì số vòng lặp vibe càng tăng và tính liên tục càng giảm rõ rệt, nên trong IDE mình cố gắng dùng chế độ Ask nhiều hơn Agent mode, đồng thời tập trung giữ cho mỗi file có ít dòng nhất có thể.

Đặc biệt, vì đây là lần đầu mình triển khai khái niệm scene áp dụng cho game nên do thiếu các chỉ dẫn thiết kế rõ ràng, phần khó lại càng nhiều hơn.

Khi tạo prompt cho nhân vật, mình đã tham khảo các mẹo từ những người đang sử dụng Silly Tavern hoặc Wrtn.

Prompt đơn giản dùng để tạo hình ảnh đồ uống như bên dưới.
"A detailed pixel art masterpiece, 16-bit retro style, vibrant colors, white background, depicting: mojito. Ensure clear outlines and a distinct pixelated aesthetic."

Vì là một đội không có designer nên mình từng băn khoăn liệu có thể tạo đủ asset cần thiết chỉ bằng AI tạo sinh hay không, nhưng với mục đích làm prototype thì đây thực sự là một trải nghiệm cực kỳ thỏa mãn.

---

[Liên quan đến phát triển]

• IDE (Cursor, Github Copilot)
• API (ChatGPT 4.1)
• Backend serverless (Vercel)
• Cơ sở dữ liệu (SQLite serverless)

Đây là lần đầu mình làm việc trong môi trường React. Với gói miễn phí Hobby của Vercel, từ triển khai đơn giản cho đến thống kê, kiểm tra Speed Insights, kết nối DB serverless và kết nối custom domain, tất cả đều mang lại trải nghiệm triển khai rất đáng hài lòng.

---

Để giữ được cảm xúc như một trò chơi, hiện tại dịch vụ chỉ được thử nghiệm trong môi trường desktop, nhưng mình luôn hoan nghênh mọi câu hỏi hoặc phản hồi! Xin cảm ơn.

[attrestmedia]

Đây là một dự án thú vị, nhưng tiếc là không dùng được trên di động. Chắc phải về nhà rồi thử mới được. ^^;

[ifmkl]

Ồ, rất thú vị đấy! Tôi vừa thưởng thức một ly margarita ngon tuyệt haha

[yunheenet]

Cảm ơn bạn đã trải nghiệm! Không biết buổi uống rượu ban ngày có ổn không nữa haha