docs: stage-1 i18n coverage + news
This commit is contained in:
sanbuphy
@@ -0,0 +1,82 @@
|
||||
# Giới thiệu dự án
|
||||
|
||||
Năm 2025 được nhiều người coi là năm khởi đầu của lập trình AI. Ngày càng có nhiều người bắt đầu dùng AI để viết code, nhưng những gì tạo ra thường chỉ dừng lại ở mức đồ chơi -- không biết cách dùng Vibe Coding để tổ chức quy trình phát triển, không biết nên chọn công cụ nào, và càng không rõ từ nguyên mẫu đến khi đưa lên mạng còn thiếu những bước quan trọng nào.
|
||||
|
||||
Chúng tôi áp dụng lộ trình thực chiến **ba giai đoạn tuần tự**: giai đoạn người mới bắt đầu làm quen với lập trình AI thông qua các trò chơi nhỏ, giai đoạn một làm chủ cách làm việc của Vibe Coding và hoàn thành nguyên mẫu ứng dụng Web, giai đoạn hai học phát triển full-stack và triển khai trực tuyến, giai đoạn ba xây dựng ứng dụng phức tạp đa nền tảng.
|
||||
|
||||
Mỗi giai đoạn đều đi kèm với thực chiến dự án hoàn chỉnh, giúp bạn tiến từ đồ chơi đến sản phẩm thực tế trong những thử thách thật, cuối cùng có khả năng **biến bất kỳ ý tưởng nào thành ứng dụng sử dụng được**.
|
||||
|
||||
Chúng tôi tin rằng, khi làm chủ Vibe Coding kết hợp với đào tạo hệ thống, bạn một mình có thể trở thành **nhà phát triển toàn năng kết hợp giữa phát triển front-end/back-end, tích hợp năng lực AI và thiết kế sản phẩm**.
|
||||
|
||||
Dự án này chủ yếu hướng tới ba loại học viên:
|
||||
|
||||
- **Người mới (người bình thường / phía sản phẩm và vận hành)**: Giúp những người không có nền tảng kỹ thuật và người mới học hiểu được các khái niệm quan trọng, hoàn thành công cụ AI nhỏ hoặc nguyên mẫu sản phẩm đầu tiên.
|
||||
- **Nhà phát triển trung cấp (sinh viên và nhà phát triển có nền tảng nhất định)**: Làm chủ hệ thống vibe coding và phát triển ứng dụng AI nguyên bản.
|
||||
- **Nhà phát triển cấp cao (công ty và startup, mã nguồn mở và nhà phát triển độc lập)**: Hỗ trợ đội ngũ và cá nhân nhanh chóng xây dựng, xác minh và lặp lại ứng dụng AI nguyên bản.
|
||||
|
||||
## 📖 Điều hướng nội dung
|
||||
|
||||
### Phụ lục tổng hợp
|
||||
|
||||
[Từ điển năng lực AI: Các khái niệm và thuật ngữ cốt lõi AI phổ biến, giải thích theo kịch bản](/vi-vn/appendix/8-artificial-intelligence/ai-capability-dictionary)
|
||||
|
||||
### Số 0, Mầm non
|
||||
|
||||
| Chương | Nội dung chính | Trạng thái |
|
||||
| :------------------------------------------------------------------------------------- | :------------------------------------------- | :--- |
|
||||
| [Người mới bắt đầu: Bản đồ học tập](/vi-vn/stage-1/learning-map/) | Tổng quan lộ trình học tập | ✅ |
|
||||
| [Người mới bắt đầu: Kỷ nguyên AI, biết nói là biết lập trình](/vi-vn/stage-1/ai-capabilities-through-games/) | Cảm nhận ban đầu về năng lực lập trình AI thông qua các ví dụ như rắn săn mồi | ✅ |
|
||||
|
||||
### Số 1, Quản lý sản phẩm AI
|
||||
|
||||
| Chương | Nội dung chính | Trạng thái |
|
||||
| :---------------------------------------------------------------------------- | :------------------------------------------------------- | :--- |
|
||||
| [Sơ cấp 2: Làm quen với công cụ AI IDE](/vi-vn/stage-1/introduction-to-ai-ide/) | Học cách sử dụng IDE, làm chủ cấu trúc giao diện và cách gợi ý hiệu quả | ✅ |
|
||||
| [Sơ cấp 3: Tự tay tạo nguyên mẫu](/vi-vn/stage-1/building-prototype/) | Vòng lặp hoàn chỉnh từ phân tích sản phẩm, phân tách đến thực hiện nguyên mẫu sản phẩm đa trang | ✅ |
|
||||
| [Sơ cấp 4: Thêm năng lực AI cho nguyên mẫu](/vi-vn/stage-1/integrating-ai-capabilities/) | Hiểu và hoàn thành tích hợp API các năng lực AI phổ biến (văn bản, hình ảnh, video) | ✅ |
|
||||
| [Sơ cấp 5: Thực chiến dự án hoàn chỉnh](/vi-vn/stage-1/complete-project-practice/) | Mô phỏng kịch bản thực tế, nhận phản hồi người dùng để lặp lại và hoàn thành trình bày dự án (bao gồm bài tập lớn) | ✅ |
|
||||
|
||||
#### Phụ lục
|
||||
|
||||
| Chương | Nội dung chính | Trạng thái |
|
||||
| :-------------------------------------------------------------------- | :---------------------------------------- | :--- |
|
||||
| [Phụ lục A: Bổ sung tư duy sản phẩm](/vi-vn/stage-1/appendix-a-product-thinking/) | Khung tư duy sản phẩm từ đánh giá ý tưởng đến phân tách nhu cầu và MVP | ✅ |
|
||||
| [Phụ lục B: Lỗi phổ biến và giải pháp](/vi-vn/stage-1/appendix-b-common-errors/) | Các lỗi phổ biến trong vibe coding và phương pháp khắc phục | ✅ |
|
||||
| [Phụ lục: Tìm ý tưởng ở đâu](/vi-vn/stage-1/appendix-idea-sources/) | Rút ra hướng ngách từ ứng dụng tham khảo, xu hướng và danh sách VC | ✅ |
|
||||
| [Phụ lục: Mô hình Double Diamond](/vi-vn/stage-1/appendix-double-diamond/) | Hiểu nhịp độ hoàn chỉnh của việc xác định vấn đề trước rồi mới triển khai thiết kế giải pháp | ✅ |
|
||||
| [Phụ lục: Jobs to Be Done](/vi-vn/stage-1/appendix-jobs-to-be-done/) | Dùng phương pháp JTBD để thấy rõ điều người dùng thực sự muốn hoàn thành | ✅ |
|
||||
| [Phụ lục: Phương pháp phỏng vấn The Mom Test](/vi-vn/stage-1/appendix-mom-test/) | Phương pháp nghiên cứu xác minh nhu cầu thông qua phỏng vấn người dùng | ✅ |
|
||||
|
||||
### Số 2, Kỹ sư phát triển trung cấp
|
||||
|
||||
#### Phần front-end
|
||||
|
||||
| Chương | Nội dung chính | Trạng thái |
|
||||
| :------------------------------------------------------------------------------------------------------------------ | :--------------------------------------------------------------------------- | :--- |
|
||||
| Sử dụng lovart để sản xuất tài liệu | Học cách dùng lovart để tạo hàng loạt tài liệu hình ảnh nhân vật, bối cảnh, v.v., cung cấp nền tảng tài liệu cho thiết kế UI và phát triển front-end | 🚧 |
|
||||
| Figma và MasterGo nhập môn | Dùng công cụ thiết kế để sắp xếp kiến trúc thông tin và cấu trúc trang, tạo nền tảng cho thực hiện front-end | 🚧 |
|
||||
| Xây dựng ứng dụng hiện đại đầu tiên - Thiết kế UI | Dựa trên bản thiết kế hoàn thành giao diện component hóa, thực hiện chuỗi liên kết đầu tiên từ thiết kế đến code | 🚧 |
|
||||
| Tham khảo quy chuẩn thiết kế UI để thiết kế trang và nút | Học cách dùng quy chuẩn thiết kế phổ biến để tổ chức cấu trúc trang, phân cấp nút, và dùng AI để tạo phương án thiết kế | 🚧 |
|
||||
| [Cùng làm chân dung Hogwarts](/vi-vn/stage-2/frontend/hogwarts-portraits/) | Từ 0 đến 1 tạo ứng dụng front-end tích hợp năng lực AI, kết nối thiết kế và phát triển | 🚧 |
|
||||
|
||||
#### Phần phát triển back-end
|
||||
|
||||
| Chương | Nội dung chính | Trạng thái |
|
||||
| :---------------------------------------------------------------------------------------------------------------------- | :------------------------------------------------------------ | :--- |
|
||||
| API là gì | Hiểu giao diện HTTP và mô hình yêu cầu-phản hồi, chuẩn bị cho tích hợp back-end và debug liên thông | 🚧 |
|
||||
| [Từ cơ sở dữ liệu đến Supabase](/vi-vn/stage-2/backend/database-supabase/) | Triển khai cơ sở dữ liệu và API trên Supabase, kết nối mô hình dữ liệu và trang front-end | 🚧 |
|
||||
| Mô hình lớn hỗ trợ viết code giao diện và tài liệu giao diện | Dùng mô hình lớn hỗ trợ tạo tài liệu giao diện và cơ sở dữ liệu, code, thực hiện back-end có thể đọc và kiểm tra | 🚧 |
|
||||
| Quy trình làm việc Git và triển khai Zeabur | Quản lý code trong quy trình Git và triển khai ứng dụng lên Zeabur trực tuyến | 🚧 |
|
||||
| Công cụ phát triển CLI hiện đại | Sử dụng công cụ lập trình AI loại CLI để tăng tốc phát triển và gỡ lỗi, hình thành quy trình làm việc kỹ thuật cá nhân | 🚧 |
|
||||
| Cách tích hợp hệ thống thanh toán như stripe | Tích hợp hệ thống thanh toán, hoàn thành chuỗi thanh toán và quy trình thanh toán cơ bản | 🚧 |
|
||||
| Xây dựng ứng dụng hiện đại đầu tiên - Ứng dụng full-stack | Tổng hợp front-end, back-end và module thanh toán, hoàn thành ứng dụng Web full-stack có thể trực tuyến | 🚧 |
|
||||
| Thư viện component front-end hiện đại + Thực chiến Trae | Sử dụng thư viện component front-end hiện đại và Trae, độc lập hoàn thành sản phẩm hỗ trợ đăng ký và thanh toán | 🚧 |
|
||||
|
||||
#### Phụ lục năng lực AI
|
||||
|
||||
| Chương | Nội dung chính | Trạng thái |
|
||||
| :-------------------------------------------------------------------------------------------------------------------------------------------------------------------- | :------------------------------------------------------------- | :--- |
|
||||
| [Nhập môn Dify và tích hợp kiến thức](/vi-vn/stage-2/ai-capabilities/dify-knowledge-base/) | Dùng Dify Workflow và RAG cơ bản để xây dựng sản phẩm loại công cụ, tạo mẫu cho việc nâng cấp ứng dụng sau này | 🚧 |
|
||||
| Học cách tra cứu từ điển AI và tích hợp API đa phương thức | Học cách tìm mô hình và API phù hợp, và tích hợp năng lực đa phương thức như văn bản, hình ảnh vào sản phẩm | 🚧 |
|
||||
|
||||
### Số 3, Kỹ sư phát triển cấp cao
|
||||
@@ -0,0 +1,225 @@
|
||||
# So cap 1: Thoi dai AI, biet noi la biet lap trinh
|
||||
|
||||
Day la mot bai hoc **hoc theo du an**. Ban hay lam theo tung buoc va co gang tai hien ket qua.
|
||||
Dung lo sai hay sua. Hay nho:
|
||||
|
||||
<div style="text-align: center;">
|
||||
<div style="display: inline-block; padding: 8px 20px; border-radius: 8px; border: 1px dashed #FFB6C1; background: linear-gradient(135deg, #FFF0F5 0%, #FFE4EC 100%); margin: 12px 0;">
|
||||
<span style="font-size: 15px; font-weight: 500; color: #666;">Hoan thanh quan trong hon hoan hao</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script setup>
|
||||
import { relatedArticlesMap } from '@theme/data/relatedArticles'
|
||||
|
||||
const duration = 'khoang <strong>4 gio</strong> (co the chia nhieu lan)'
|
||||
const relatedArticles =
|
||||
relatedArticlesMap['vi-vn/stage-1/ai-capabilities-through-games'] ?? []
|
||||
</script>
|
||||
|
||||
## Dan nhap chuong
|
||||
|
||||
<ChapterIntroduction :duration="duration" :tags="['Lap trinh doi thoai', 'Mini game AI-native', 'Thuc hanh Snake']" coreOutput="Snake AI-native + mini game tu tao" expectedOutput="1 Snake AI-native chay duoc + (tuy chon) 1 mini game/demo tu tao">
|
||||
|
||||
Neu ban <strong>hoan toan khong biet lap trinh</strong> hoac chi biet mot chut, chuong nay danh cho ban. Ta se bat dau tu co ban: dung <strong>doi thoai</strong> de AI giup ban viet code. Khong can nho cu phap, khong can cau hinh phuc tap, nhieu truong hop co the chay ngay tren web.
|
||||
|
||||
Ban se tu tay lam ra <strong>chuong trinh dau tien chay duoc</strong>: mot phien ban Snake co the "an tu", "viet tho", "ve ve". Ban se cam nhan lap trinh voi AI la gi: khong phai AI nghi thay ban, ma ban noi ro y muon, AI giup ban hien thuc.
|
||||
|
||||
</ChapterIntroduction>
|
||||
|
||||
<div style="margin: 50px 0;">
|
||||
<ClientOnly>
|
||||
<StepBar :active="0" :items="[
|
||||
{ title: 'Khoi dong', description: 'Thoi dai AI: biet noi la biet lap trinh' },
|
||||
{ title: 'Kham pha nhanh', description: 'Trai nghiem 60 giay' },
|
||||
{ title: 'Thuc hanh AI-native', description: 'Xay Snake AI-native' },
|
||||
{ title: 'Mo rong sang tao', description: 'Tu lam mot game khac' }
|
||||
]" />
|
||||
</ClientOnly>
|
||||
</div>
|
||||
|
||||
## 1. Kho khan cua nguoi binh thuong va co hoi moi
|
||||
|
||||
Rat nhieu nguoi co y tuong san pham: cong cu ghi chep chi tieu, mot trang web ghi lai qua trinh lon len cua con, hoac mot mini game. Nhung chi can nghi toi "viet code" va "tim lap trinh vien" la thay met.
|
||||
|
||||
AI tao ra mot kha nang moi: ban khong nhat thiet phai biet code ngay lap tuc; ban can hoc cach noi ro rang voi AI ve dieu ban muon. Ke ca voi lap trinh vien chuyen nghiep, AI dang dan tro thanh mot phan cua quy trinh lam viec. Voi nguoi moi, kha nang "giao tiep dung voi agent" la cuc ky co gia tri.
|
||||
|
||||
Muc tieu cua bai hoc la giup ban hinh thanh ky nang moi: <strong>dung ngon ngu tu nhien de lam ung dung</strong>. Ban se hoc cach mo ta muc tieu, chia buoc, xac dinh dau vao/dau ra, va sua loi khi ket qua chua dung y.
|
||||
|
||||
<div style="margin: 50px 0;">
|
||||
<ClientOnly>
|
||||
<StepBar :active="1" :items="[
|
||||
{ title: 'Kho khan va co hoi', description: 'Mot cach moi de tao san pham' },
|
||||
{ title: 'Kham pha nhanh', description: 'Trai nghiem 60 giay' },
|
||||
{ title: 'Thuc hanh AI-native', description: 'Xay Snake AI-native' },
|
||||
{ title: 'Mo rong sang tao', description: 'Tu lam mot game khac' }
|
||||
]" />
|
||||
</ClientOnly>
|
||||
</div>
|
||||
|
||||
## 2. AI co the lam duoc toi muc nao hien nay
|
||||
|
||||
Cau hoi cu the: neu ban khong biet viet code, ban co the lam duoc toi muc nao voi AI doi thoai?
|
||||
|
||||
Thuc te, hien nay AI rat hop de:
|
||||
|
||||
- cong cu noi bo nho,
|
||||
- bang dieu khien/truc quan du lieu,
|
||||
- mini game nhe,
|
||||
- prototype de kiem chung y tuong tu goc nhin san pham.
|
||||
|
||||
Voi san pham lon va dua vao san xuat, van can con nguoi dau tu vao thiet ke luong, chi tiet, bao mat, hieu nang va kha nang bao tri. Nhưng doi voi prototype va cong cu tu dung, chat luong da rat thuc dung.
|
||||
|
||||
### 2.1 Lam Snake trong 60 giay (voi z.ai)
|
||||
|
||||
Mo trang web thuc hanh cua khoa hoc: [z.ai](https://chat.z.ai/). Trong bai nay, ta dung che do "phat trien full-stack" de xem AI tao du an va xem truoc ket qua.
|
||||
|
||||
::: details Lap trinh ngay tren web la gi?
|
||||
|
||||
Truoc day, lam mot app web thuong can:
|
||||
|
||||
- cai moi truong (Node.js, Python),
|
||||
- cau hinh editor,
|
||||
- hoc HTML/CSS/JavaScript,
|
||||
- xu ly dependency va loi.
|
||||
|
||||
Gio day, voi nen tang lap trinh AI:
|
||||
|
||||
- mo trinh duyet,
|
||||
- mo ta tinh nang bang ngon ngu tu nhien,
|
||||
- AI tu dong sinh code va xem truoc.
|
||||
|
||||
No chuyen trong tam tu "viet cu phap" sang "mo ta yeu cau".
|
||||
|
||||
:::
|
||||
|
||||
|
||||
|
||||
Dan yeu cau don gian nhu sau va chay:
|
||||
|
||||
```txt
|
||||
Lam giup toi game Snake:
|
||||
1. Dieu khien bang phim mui ten
|
||||
2. An thuc an thi dai ra va tang diem
|
||||
3. Cham tuong hoac cham than thi Game Over
|
||||
4. Co nut bat dau va choi lai
|
||||
5. Giao dien gon va dep
|
||||
```
|
||||
|
||||
|
||||
|
||||
Khi xong, ban se thay trang web o ben phai. Thuong ban co the:
|
||||
|
||||
- cuon de xem,
|
||||
- vao full-screen,
|
||||
- tai du an,
|
||||
- xem code.
|
||||
|
||||
|
||||
|
||||
De xem ma nguon, bam vao bieu tuong code o goc tren ben phai.
|
||||
|
||||
|
||||
|
||||
::: tip Thu them cong cu khac
|
||||
|
||||
Ngoai z.ai, ban co the thu nhieu cong cu khac. Dieu quan trong khong phai ten cong cu, ma la vong lap:
|
||||
|
||||
1. mo ta yeu cau,
|
||||
2. thu chay,
|
||||
3. chi ro hien tuong sai,
|
||||
4. yeu cau sua cu the,
|
||||
5. lap lai.
|
||||
|
||||
:::
|
||||
|
||||
### 2.2 Lap trinh doi thoai lam duoc gi va khong lam duoc gi
|
||||
|
||||
Tom tat thuc dung:
|
||||
|
||||
- AI rat gioi voi bai toan "nho va ro rang" neu ban mo ta UI va tuong tac cu the.
|
||||
- Voi du an lon, ban can goc nhin theo quy trinh: chia thanh buoc, dinh nghia input/output va giao cho AI lam tung phan.
|
||||
- "Viet duoc" khong dong nghia "dung duoc cho nguoi that". San xuat can test, bao mat va review.
|
||||
|
||||
::: warning Huong dan theo tinh huong
|
||||
|
||||
- **Prototype / demo / cong cu noi bo**: rat hop de AI lam ban dau, ban iter tiep.
|
||||
- **San pham lon cho nguoi dung that**: can dau tu dai han ve ky thuat.
|
||||
- **He thong yeu cau bao mat/tuân thu cao (thanh toan, y te, rui ro)**: khong nen "sinh xong la deploy", phai co quy trinh kiem tra nghiem ngat.
|
||||
|
||||
:::
|
||||
|
||||
<div style="margin: 50px 0;">
|
||||
<ClientOnly>
|
||||
<StepBar :active="2" :items="[
|
||||
{ title: 'Kho khan va co hoi', description: 'Mot cach moi de tao san pham' },
|
||||
{ title: 'Kham pha nhanh', description: 'Trai nghiem 60 giay' },
|
||||
{ title: 'Thuc hanh AI-native', description: 'Xay Snake AI-native' },
|
||||
{ title: 'Mo rong sang tao', description: 'Tu lam mot game khac' }
|
||||
]" />
|
||||
</ClientOnly>
|
||||
</div>
|
||||
|
||||
## 3. Thuc hanh: lam mot Snake "AI-native"
|
||||
|
||||
"AI-native" o day nghia la: game khong chi la Snake co ban, ma co them mot kha nang AI gan vao gameplay. Vi du:
|
||||
|
||||
- an mot tu thi dich va tao vi du cau,
|
||||
- an mot chu de thi sinh ra mot cau/noi dung ngan,
|
||||
- an mot prompt thi sinh ra mot hinh.
|
||||
|
||||
Quan trong nhat la tap quy trinh: mo ta ro -> de AI lam -> thu chay -> sua theo ket qua.
|
||||
|
||||
> Meo khi yeu cau sua:
|
||||
>
|
||||
> 1. mo ta hien tuong quan sat duoc,
|
||||
> 2. noi ro hanh vi ky vong,
|
||||
> 3. neu co loi, copy day du log/stack,
|
||||
> 4. yeu cau sua toi thieu can thiet.
|
||||
|
||||
De theo doi trinh tu thuc hanh, ban se thay cac anh minh hoa:
|
||||
|
||||
> 
|
||||
>
|
||||
> 
|
||||
>
|
||||
> 
|
||||
|
||||
|
||||
|
||||
Khi gap loi, dung doan. Hay copy loi va yeu cau AI giai thich bang ngon ngu don gian, sau do dua ra sua doi cu the.
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
## 4. Mo rong: tu lam mot mini game cua rieng ban
|
||||
|
||||
Khi Snake da chay, muc tieu khong phai nho het code, ma la tao bien the.
|
||||
|
||||
Goi y:
|
||||
|
||||
- game phan xa (bam dung thoi diem),
|
||||
- quiz tu vung,
|
||||
- dong ho dem nguoc voi phan thuong,
|
||||
- tao the (card) voi diem so.
|
||||
|
||||
Buoc quan trong: dinh nghia vong lap cua game (input -> state -> output) roi moi nho AI implement.
|
||||
|
||||
|
||||
|
||||
## Bai tap
|
||||
|
||||
1. Lam lai Snake co ban voi mau sac va UI cua ban.
|
||||
2. Them it nhat 1 kha nang AI (dich, tom tat, sinh text...).
|
||||
3. Tu tao mot mini game/dem o don gian nhung choi duoc.
|
||||
|
||||
## Buoc tiep theo
|
||||
|
||||
O cac chuong tiep theo, ta se ket noi cac nang luc AI cu the hon (text-to-text, image-to-text, text-to-image) va tien toi cac du an day du hon.
|
||||
|
||||
<RelatedArticles :articles="relatedArticles" />
|
||||
---
|
||||
title: 'So cap 1: Thoi dai AI, noi la lap trinh'
|
||||
description: 'Lam game ran AI-native bang doi thoai, sau do ap dung workflow de tao mini game hoac demo cua rieng ban.'
|
||||
---
|
||||
@@ -0,0 +1,152 @@
|
||||
---
|
||||
title: 'Tu duy san pham va thiet ke giai phap'
|
||||
description: 'Chuyen tu "lam tool" sang "lam san pham": nguon y tuong, cach tach nho thanh MVP, cai thien trai nghiem va dung AI de tang gia tri.'
|
||||
---
|
||||
|
||||
<script setup>
|
||||
const duration = 'Khoang <strong>6 gio</strong>'
|
||||
</script>
|
||||
|
||||
# Tu duy san pham va thiet ke giai phap
|
||||
|
||||
## Gioi thieu chuong
|
||||
|
||||
<ChapterIntroduction :duration="duration" :tags="['Tu duy san pham', 'Phan tich nhu cau', 'Thiet ke giai phap', 'Hieu nguoi dung']" coreOutput="1 ban phac thao san pham hoan chinh" expectedOutput="Huong san pham co the trien khai">
|
||||
|
||||
O cac chuong truoc, ban da quen voi viec dung AI IDE de lam prototype va cac tool nho. Phan nay tap trung vao cau hoi lon hon: <strong>"Lam gi thi dang?"</strong>
|
||||
|
||||
Muc tieu:
|
||||
|
||||
1. Tim y tuong dang tin hon (khong chi la cam hung).
|
||||
2. Bien y tuong thanh mot flow co the build.
|
||||
3. Di tu "chay duoc" sang "nguoi ta thich dung".
|
||||
4. Dung AI o dung cho, de tang gia tri that.
|
||||
|
||||
</ChapterIntroduction>
|
||||
|
||||
<div style="margin: 50px 0;">
|
||||
<ClientOnly>
|
||||
<StepBar :active="0" :items="[
|
||||
{ title: 'Nguon y tuong', description: 'Tim y tuong dang tin' },
|
||||
{ title: 'Tach nho giai phap', description: 'Bien y tuong thanh app co the lam' },
|
||||
{ title: 'Danh gia va cai thien', description: 'Tu dung duoc den dung suong' },
|
||||
{ title: 'AI phong dai gia tri', description: 'Dung AI hop ly' }
|
||||
]" />
|
||||
</ClientOnly>
|
||||
</div>
|
||||
|
||||
## Ban se hoc duoc gi
|
||||
|
||||
Sau phan nay, ban co the tra loi:
|
||||
|
||||
1. Y tuong den tu dau thi on?
|
||||
2. Tach y tuong ra sao de lam MVP?
|
||||
3. Lam sao de biet app co tot khong va cach nang cap?
|
||||
4. Dung AI o buoc nao de tang gia tri?
|
||||
5. Tim nguoi dung dau tien nhu the nao?
|
||||
|
||||
---
|
||||
|
||||
# 1. Nguon y tuong dang tin
|
||||
|
||||
Ban khong can "y tuong sieu doc". Ban can van de that, lap lai, trong boi canh ro rang.
|
||||
|
||||
## 1.1 The nao la mot y tuong (theo goc san pham)?
|
||||
|
||||
Mot y tuong co the build can:
|
||||
|
||||
1. Nguoi dung muc tieu ro rang (ai?).
|
||||
2. Tinh huong cu the (khi nao/o dau?).
|
||||
3. Nhiem vu cu the (muon dat ket qua gi?).
|
||||
4. Cai tien hop ly so voi cach lam hien tai.
|
||||
|
||||
## 1.2 Y tuong vs nhu cau that
|
||||
|
||||
Y tuong la gia thuyet. Nhu cau that la thu nguoi dung dang tu tim cach giai (du la workaround).
|
||||
|
||||
Quy tac nhanh:
|
||||
|
||||
- Nhu cau that: nguoi dung dang tra gia bang thoi gian/tien/cong suc.
|
||||
- Nhu cau gia: nghe hay nhung khong doi hanh vi, khong tra tien.
|
||||
|
||||
|
||||
|
||||
## 1.3 Vi sao co y tuong tu nhien tang truong
|
||||
|
||||
Neu gia tri den nhanh va flow ngan, nguoi dung se tu gioi thieu:
|
||||
|
||||
Van de -> gia tri nho ngay lap tuc -> lap lai -> gioi thieu.
|
||||
|
||||
Neu can "keo" lien tuc bang quang cao va giai thich, thuong la dau hieu pain chua du manh.
|
||||
|
||||
## 1.4 4 nguon y tuong on dinh
|
||||
|
||||
1. Cong viec hang ngay: quy trinh lap, bao cao, phoi hop, QA.
|
||||
2. Cong dong: cau hoi lap lai, van de nhieu nguoi gap.
|
||||
3. Review/binh luan: ma sat, buc xuc "sao kho vay?".
|
||||
4. San pham co san: tim lo hong (qua dat, qua phuc tap, thieu chuyen sau).
|
||||
|
||||
|
||||
|
||||
---
|
||||
|
||||
# 2. Tach nho: tu y tuong thanh app
|
||||
|
||||
Y tuong chi build duoc khi chuyen thanh quyet dinh.
|
||||
|
||||
## 2.1 Toi thieu: nguoi dung, tinh huong, flow
|
||||
|
||||
Xac dinh:
|
||||
|
||||
1. Nguoi dung: vai tro, muc tieu, rang buoc, kha nang chi tra.
|
||||
2. Tinh huong: trigger -> cac buoc -> ket qua.
|
||||
3. Flow chinh: 3-7 buoc de tao gia tri.
|
||||
|
||||
## 2.2 Cat scope (MVP)
|
||||
|
||||
MVP khong phai "it feature", ma la "loi hua ro rang va lam duoc".
|
||||
|
||||
Cau hoi:
|
||||
|
||||
- Phut dau tien nao nguoi dung thay "co loi"?
|
||||
- Cat gi ma khong lam mat gia tri cot loi?
|
||||
- Gia thuyet rui ro nhat la gi? (can validate som)
|
||||
|
||||
---
|
||||
|
||||
# 3. Cai thien: tu dung duoc den dung suong
|
||||
|
||||
Sau khi co ban dau, tap trung vao:
|
||||
|
||||
1. Ro rang: nguoi moi biet lam gi tiep theo.
|
||||
2. It ma sat: it click, it form, it doi.
|
||||
3. Tao tin tuong: ket qua giai thich duoc, default an toan.
|
||||
|
||||
Test nhanh: nguoi moi co the nhan gia tri trong 60 giay khong?
|
||||
|
||||
---
|
||||
|
||||
# 4. Dung AI de phong dai gia tri
|
||||
|
||||
AI manh nhat khi:
|
||||
|
||||
1. Bien ngon ngu thanh cau truc (text -> task, note -> plan).
|
||||
2. Tom tat va uu tien (nhieu thong tin -> hanh dong).
|
||||
3. Ca nhan hoa (goi y theo boi canh).
|
||||
|
||||
AI yeu khi chi "dan chat" ma khong cai thien flow cot loi.
|
||||
|
||||
---
|
||||
|
||||
## Output mong doi
|
||||
|
||||
Mot ban phac thao san pham gom:
|
||||
|
||||
1. Nguoi dung va use-case
|
||||
2. Van de cot loi va chi phi hien tai
|
||||
3. Flow chinh (3-7 buoc)
|
||||
4. Scope MVP
|
||||
5. Ke hoach validate (7 ngay) va metric
|
||||
|
||||
<RelatedArticlesSection />
|
||||
|
||||
+359
@@ -0,0 +1,359 @@
|
||||
# So sánh 7 công cụ lập trình AI
|
||||
|
||||
## Hướng dẫn chương này
|
||||
|
||||
Đối mặt với vô số công cụ lập trình AI, công cụ nào mới phù hợp với bạn nhất? Chương này thông qua một nhiệm vụ thực chiến thống nhất -- phát triển trò chơi "Rắn ăn mồi + AI làm thơ", đánh giá chéo 7 nền tảng Web Vibe Coding phổ biến như Lovable, Replit, Z.ai. Chúng ta sẽ so sánh đa chiều từ mức độ thân thiện với người mới, khả năng kiểm soát code, tính tiện lợi triển khai, giúp bạn nhanh chóng chọn ra công cụ hỗ trợ phát triển mạnh nhất.
|
||||
|
||||
---
|
||||
|
||||
# 1. Dùng Vibe Coding xây trò Snake: Hướng dẫn thực chiến hoàn chỉnh
|
||||
|
||||
Bài viết giới thiệu một phương pháp phát triển phần mềm mới nổi -- "Vibe Coding", sử dụng trí tuệ nhân tạo để tăng tốc quá trình xây dựng ứng dụng.
|
||||
|
||||
Tiếp theo chúng ta sẽ lần lượt giới thiệu khái niệm cốt lõi của Vibe Coding, giải thích AI Agent là gì, và cung cấp phương pháp viết prompt thực dụng. Cuối cùng, thông qua thực chiến hoàn chỉnh xây dựng trò "Snake (Rắn săn mồi)" từ đầu, và đánh giá so sánh chi tiết nhiều nền tảng Vibe Coding phổ biến, giúp bạn chọn bộ công cụ phù hợp nhất với mình.
|
||||
|
||||
## Bạn sẽ học được:
|
||||
|
||||
- **Vibe Coding là gì:** Hiểu định nghĩa, workflow và lợi thế chính của nó.
|
||||
- **Vai trò của AI Agent:** Hiểu cách làm việc của AI Agent, và sự khác biệt với chương trình truyền thống.
|
||||
- **Cách viết prompt tốt:** Nắm vững cách viết prompt rõ ràng, cụ thể, để nhận kết quả tốt hơn.
|
||||
- **Công cụ Vibe Coding:** Làm quen với một loạt nền tảng lập trình và thiết kế AI phổ biến.
|
||||
- **So sánh nền tảng:** Đánh giá và so sánh ưu nhược điểm của 7 nền tảng AI Agent khác nhau từ góc nhìn người mới bắt đầu.
|
||||
- **Công cụ UI / UX:** Học cách tích hợp các công cụ UI/UX như Figma, Mastergo vào workflow tổng thể.
|
||||
|
||||
## 1. Giới thiệu
|
||||
|
||||
Trong các bài học trước, chúng ta luôn sử dụng mô hình phát triển fullstack của z.ai để hoàn thành nhiệm vụ lập trình.
|
||||
|
||||
Tuy nhiên, chúng ta có bao giờ nghĩ: cốt lõi của nó thực ra là "AI Agent" (khác với AI chat thông thường, và thông minh hơn nhiều)? Vì nó không chỉ trò chuyện với bạn, mà còn có thể suy nghĩ (khi bạn giao nhiệm vụ, nó sẽ trước lập kế hoạch), còn có thể chủ động hành động (ví dụ gọi tìm kiếm web, thực thi lệnh máy tính, mở trang web, v.v.). Chúng ta sẽ giới thiệu chi tiết hơn ở phần sau.
|
||||
|
||||
## 1. Vibe Coding là gì?
|
||||
|
||||
Vibe Coding là một phương pháp phát triển phần mềm kiểu mới sử dụng AI để tăng tốc quá trình phát triển ứng dụng. Nó không phải sản phẩm thay thế lập trình truyền thống, mà là một chế độ lập trình "hội thoại" hơn. Khái niệm này được nhà nghiên cứu AI Andrej Karpathy đề xuất: trong workflow này, nhà phát triển không còn tự viết code từng dòng, mà chủ yếu thông qua hướng dẫn AI Agent để tạo, tối ưu và debug ứng dụng.
|
||||
|
||||
Tư tưởng cốt lõi của Vibe Coding, là chuyển từ **"lấy code làm trung tâm (code-first)"** sang **"lấy ý định làm trung tâm (intent-first)"**. Bạn không cần suy nghĩ từ dòng code đầu tiên, mà dùng ngôn ngữ tự nhiên mô tả kết quả bạn muốn.
|
||||
|
||||
Workflow điển hình của Vibe Coding là một vòng lặp liên tục:
|
||||
|
||||
- **Mô tả mục tiêu:** Trước dùng một câu hoặc một đoạn mô tả chức năng bạn muốn triển khai, ví dụ: "Làm một trò Snake đơn giản có backend Python, có thể sinh thơ."
|
||||
- **AI tạo code:** AI Agent phân tích nhu cầu của bạn, tạo code phiên bản đầu, bao gồm cấu trúc cơ bản, trang frontend và logic backend.
|
||||
- **Chạy và quan sát:** Chạy code đã tạo, kiểm tra có hoạt động đúng như mong đợi không, đồng thời phát hiện bug hoặc điểm chưa tốt.
|
||||
- **Phản hồi và lặp lại:** Nếu có lỗi hoặc hiệu quả không lý tưởng, tiếp tục ra lệnh trong hội thoại, ví dụ: "Rắn di chuyển quá chậm, tăng tốc độ lên", hoặc "Hiện file `.env` không đọc đúng API Key, xin sửa code backend."
|
||||
- **Lặp lại các bước trên:** Liên tục lặp trong vòng "mô tả → tạo → chạy → phản hồi" cho đến khi ứng dụng đạt trạng thái hài lòng.
|
||||
|
||||
### Lợi thế chính của Vibe Coding:
|
||||
|
||||
- **Giảm rào cản:** Để nhà thiết kế, doanh nhân, sinh viên thiếu kinh nghiệm lập trình cũng có thể tham gia phát triển ứng dụng thông qua ngôn ngữ tự nhiên.
|
||||
- **Prototype nhanh chóng:** Thời gian từ ý tưởng đến sản phẩm khả thi tối thiểu (MVP) giảm đáng kể.
|
||||
- **Nâng cao hiệu quả:** Tự động xử lý lượng lớn công việc lập trình lặp đi lặp lại, cơ học (như code template), để nhà phát triển tập trung sức vào thiết kế kiến trúc và trừu tượng hóa vấn đề.
|
||||
- **Thuận lợi thử nghiệm:** Khuyến khích cách sản xuất nhanh rồi hoàn thiện dần, tiện thử ý tưởng và chức năng mới hơn.
|
||||
|
||||
## 2. Nền tảng Vibe Coding trực tuyến (Web-based) là gì?
|
||||
|
||||
Trong lần thử nghiệm thực tế này, bạn sẽ phát hiện công cụ chúng ta đánh giá được chia thành hai loại: **Web-based (nền tảng trực tuyến)** và **IDE (môi trường phát triển cục bộ)**.
|
||||
|
||||
Dù cốt lõi đều là dùng AI giúp bạn viết code, nhưng trải nghiệm sử dụng và kịch bản áp dụng có sự khác biệt rất lớn:
|
||||
|
||||
### Nền tảng Vibe Coding trực tuyến (Web-based)
|
||||
|
||||
**Công cụ đại diện:** Lovable, Replit, Z.ai, v0
|
||||
|
||||
Giống như căn hộ dịch vụ "xách vali vào ở".
|
||||
|
||||
- **Không cần cấu hình môi trường:** Bạn không cần quan tâm Python là gì, phiên bản Node.js ra sao, cũng không cần lo cài đặt dependency. Mở trình duyệt, nhập URL, có thể bắt đầu viết code ngay.
|
||||
- **Xem trước và triển khai một lần:** Sau khi code được tạo, nền tảng thường tự động hiển thị kết quả chạy ở cửa sổ bên phải. Làm xong, click một nút đã có thể tạo link chia sẻ cho bạn bè.
|
||||
- **Kịch bản phù hợp:**
|
||||
- **Xác minh ý tưởng nhanh chóng (MVP):** Trong đầu có ý tưởng, muốn mất nửa tiếng xem có thể làm ra hay không.
|
||||
- **Người mới bắt đầu:** Hoàn toàn không muốn bị lỗi môi trường phức tạp làm nản, chỉ muốn trải nghiệm niềm vui lập trình AI.
|
||||
- **Ứng dụng nhẹ:** Làm một trang công cụ đơn giản, game nhỏ hoặc trang cá nhân.
|
||||
|
||||
### AI IDE (Môi trường phát triển cục bộ)
|
||||
|
||||
**Công cụ đại diện:** Cursor, Trae, VS Code + AI plugin
|
||||
|
||||
Giống như nhà ở "trang trí đầy đủ" tự sở hữu.
|
||||
|
||||
- **Khả năng cục bộ mạnh mẽ:** Nó chạy trên máy của bạn, có thể trực tiếp truy cập tất cả file cục bộ, tận dụng sức mạnh tính toán máy của bạn.
|
||||
- **Kết nối liền mạch workflow chuyên nghiệp:** Phù hợp dự án lớn, có thể tự do cài đặt plugin, kết nối database cục bộ, debug phức tạp.
|
||||
- **Kịch bản phù hợp:**
|
||||
- **Phát triển dự án chuyên nghiệp:** Cần bảo trì dài hạn, dự án thương mại có cấu trúc phức tạp.
|
||||
- **Tùy chỉnh sâu:** Cần kiểm soát chi tiết code đến mức cực đoan, hoặc cần kết hợp sâu với workflow cục bộ hiện có (như Git, Docker).
|
||||
- **Quyền riêng tư dữ liệu:** Code hoàn toàn ở cục bộ, phù hợp hơn với quy định an toàn của một số doanh nghiệp.
|
||||
|
||||
**Tóm lại:** Nếu bạn mới tiếp xúc lập trình AI, hoặc chỉ muốn nhanh làm một thứ nhỏ để vui, **nền tảng trực tuyến** là điểm khởi đầu tuyệt vời. Nếu bạn là nhà phát triển chuyên nghiệp, hoặc dự án ngày càng phức tạp, **IDE cục bộ** sẽ cung cấp giới hạn trên cao hơn.
|
||||
|
||||
---
|
||||
|
||||
## 3. AI Agent là gì?
|
||||
|
||||
### AI Agent là gì?
|
||||
|
||||
AI Agent là một hệ thống phần mềm, có khả năng nhận thức môi trường, ra quyết định, và tự chủ hành động để đạt mục tiêu cụ thể. So với phần mềm truyền thống tuân theo chỉ thị cố định, quy trình đơn lẻ, AI Agent linh hoạt và tự thích nghi hơn.
|
||||
|
||||
Dưới đây là một số đặc điểm chính phân biệt AI Agent với chương trình truyền thống:
|
||||
|
||||
- **Tự chủ (Autonomy):** AI Agent có tính độc lập cao. Chương trình truyền thống thường cần người kích hoạt từng bước, còn Agent có thể tự quyết định bước tiếp theo làm gì dựa trên mục tiêu.
|
||||
- **Nhận thức và trí nhớ (Perception & Memory):** Agent thu thập dữ liệu từ môi trường (ví dụ phản hồi API, dữ liệu cảm biến, đầu vào người dùng, v.v.), và giữ lại ngữ cảnh thông qua "trí nhớ", từ đó tái sử dụng kinh nghiệm và cải thiện hiệu quả liên tục trong hành động sau.
|
||||
- **Lý tính và hướng mục tiêu (Rationality & Goal-Orientation):** Agent sẽ phân tích và lập kế hoạch xoay quanh mục tiêu đã cho, chọn chuỗi hành động phù hợp nhất để theo đuổi "chỉ số hiệu suất" cao hơn.
|
||||
- **Sử dụng công cụ (Tool Use):** Đặc điểm lớn của AI Agent hiện đại là có thể gọi công cụ bên ngoài, không còn giới hạn ở "tạo văn bản". Ví dụ, nó có thể duyệt web, chạy code, truy vấn database, gửi email, là một bộ não "điều độ công cụ".
|
||||
|
||||
Có thể hiểu theo phép loại suy:
|
||||
|
||||
- Một **chương trình truyền thống** giống như máy tính. Bạn cho nó nhập số và toán tử, nó chỉ thực hiện tính toán khi bạn bấm nút.
|
||||
- Một **trợ lý AI** giống như trợ lý con người. Bạn bảo "giúp tôi tìm nhà hàng gần đây", nó sẽ cho bạn kết quả tìm kiếm và liệt kê lựa chọn, nhưng cuối cùng vẫn là bạn ra quyết định.
|
||||
- Một **AI Agent** giống hơn như một đội nghiên cứu tự động. Bạn chỉ cần đưa ra mục tiêu cấp cao (ví dụ "giúp tôi lên kế hoạch một chuyến đi Nhật"), nó sẽ phân tách nhiệm vụ, tra cứu mạng, đặt vé máy bay khách sạn (qua API), sắp xếp lịch trình, cuối cùng giao kết quả cho bạn, gần như không cần bạn can thiệp chi tiết.
|
||||
|
||||
---
|
||||
|
||||
# 2. Về viết prompt
|
||||
|
||||
## 1. Prompt viết xong ngay tốt, hay chia thành nhiều bước tốt hơn?
|
||||
|
||||
Rất nhiều người sẽ không nhịn được muốn trực tiếp trong một prompt, nói rõ "làm một ứng dụng fullstack hoàn chỉnh" cùng lúc. Thực tế, công cụ hiện tại đã đủ mạnh, xác thực có cơ hội cho kết quả trông khá ổn ngay lần đầu. Nhưng xét về trải nghiệm tổng thể và tỷ lệ thành công, chia công việc thành các bước nhỏ, lặp theo giai đoạn, kết quả thường tốt hơn, cũng ít dễ rơi vào ngõ cụt "sửa không được" hơn.
|
||||
|
||||
> **Mẹo nhỏ:** Thay vì kỳ vọng "làm đúng ngay một lần", tốt hơn chia mục tiêu lớn thành các todo nhỏ có thể thực hiện.
|
||||
> Ví dụ, đừng trực tiếp nói "build me a Snake game", mà chia thành:
|
||||
> "1. Trước làm frontend của trò Snake",
|
||||
> "2. Rồi triển khai một backend ghi điểm",
|
||||
> "3. Cuối cùng nối frontend và backend lại".
|
||||
> Như vậy có thể khiến AI hiểu chính xác nhu cầu của bạn hơn và cho output đáng tin cậy hơn.
|
||||
|
||||
## 2. Càng rõ ràng, càng tốt
|
||||
|
||||
- Trong Vibe Coding, prompt bạn viết quan trọng không kém code bạn viết. Prompt càng rõ ràng, càng cụ thể, kết quả càng gần với ý bạn nghĩ.
|
||||
- Nói rõ mục tiêu và ràng buộc ngay từ đầu, có thể giảm số lần sửa đổi sau, không chỉ tiết kiệm thời gian, cũng tiết kiệm quota sử dụng và chi phí.
|
||||
|
||||
---
|
||||
|
||||
# 3. Tổng quan công cụ (Vibe Coding / UIUX)
|
||||
|
||||
## 1. Nền tảng AI Agent
|
||||
|
||||
| **Name** | **Platform** |
|
||||
| ------------------------------------------ | ------------ |
|
||||
| **[Lovable](https://lovable.dev/)** | Web-based |
|
||||
| **[Cursor](https://cursor.com/cn/agents)** | PC |
|
||||
| **[Z.ai](https://chat.z.ai/)** | Web-based |
|
||||
| **[Replit](https://replit.com/~)** | Web-based |
|
||||
| **[Minimax](https://agent.minimaxi.com/)** | Web-based |
|
||||
| **[Trae](https://www.trae.ai/)** | PC |
|
||||
| **[V0](https://v0.app/)** | Web-based |
|
||||
|
||||
## 2. Nền tảng AI UIUX
|
||||
|
||||
| **Name** | **Platform** |
|
||||
| ------------------------------------- | -------------------- |
|
||||
| **[Mastergo](https://mastergo.com/)** | Web-based |
|
||||
| **[FIgma](https://www.figma.com/)** | Web-based, PC Plugin |
|
||||
|
||||
---
|
||||
|
||||
# 4. Hướng dẫn thực chiến (Vibe Coding + UI kết hợp)
|
||||
|
||||
1. Trong cửa sổ chat của nền tảng Vibe Coding bạn chuẩn bị sử dụng, nhập mô tả chương trình bạn muốn.
|
||||
Ví dụ:
|
||||
|
||||
> Xin xây dựng một ứng dụng web Snake đơn giản với frontend và backend.
|
||||
>
|
||||
> 1. Frontend
|
||||
>
|
||||
> - Trang 1: Trang game
|
||||
> - Dùng phím điều khiển di chuyển của rắn.
|
||||
> - Rắn ăn không phải thức ăn, mà là từ tiếng Anh.
|
||||
> - Thanh bên trang hiển thị từ đã thu thập và số lượng.
|
||||
> - Sau khi game over, từ đã thu thập vẫn được giữ lại, tiếp tục trong ván mới.
|
||||
> - Trang 2: Trang làm thơ (Make Poem)
|
||||
> - Hiển thị cùng danh sách từ như trang game (dữ liệu đồng nhất).
|
||||
> - Cung cấp nút, gửi từ hiện thu thập cho backend để tạo một bài thơ.
|
||||
> - Sau khi sinh thơ, từ đã sử dụng bị xóa khỏi danh sách hoặc giảm số đếm.
|
||||
>
|
||||
> * Thêm điều hướng đơn giản, chuyển đổi giữa hai trang Game và Make Poem.
|
||||
> * Đảm bảo từ thu thập được nhìn thấy ở cả hai trang.
|
||||
>
|
||||
> 2. Backend
|
||||
>
|
||||
> - Cung cấp một API backend, nhận từ đã thu thập và trả về một bài thơ.
|
||||
> - Dùng DeepSeek API để tạo thơ.
|
||||
> - Lưu API Key trong file `.env`, và ignore file này trong `.gitignore`.
|
||||
|
||||
2. Nhập DeepSeek API Key của bạn. (Có thể lấy tại [https://platform.deepseek.com/](https://platform.deepseek.com/))
|
||||
1. API Key của LLM dùng để gọi mô hình lớn trong dự án của bạn. Vì đây là thông tin nhạy cảm, không thể công khai, nên cần viết riêng trong file cấu hình.
|
||||
**Tại sao phải dùng file `.env`, và không upload nó lên GitHub?**
|
||||
- File `.env` chuyên dùng để lưu **khóa hoặc mật khẩu** (ví dụ DeepSeek API Key).
|
||||
- Nếu file này bị upload lên GitHub, tất cả mọi người trên thế giới đều thấy được khóa của bạn và sử dụng trái phép.
|
||||
- Vì lý do an toàn, chúng ta cần khai báo ignore `.env` trong file `.gitignore`, để Git không theo dõi nó.
|
||||
- Như vậy, dự án của bạn vẫn có thể sử dụng các khóa này bình thường trên máy cục bộ, mà sẽ không bị rò rỉ trong repository.
|
||||
|
||||
3. Sau khi xem kết quả tạo, nếu phát hiện lỗi hoặc cần sửa, có thể trực tiếp nhập yêu cầu sửa trong cửa sổ chat.
|
||||
4. Nếu bạn không hài lòng với thiết kế trang, cũng có thể chọn thiết kế lại giao diện trong Figma hoặc Mastergo, rồi phản hồi ý thiết kế cho Agent.
|
||||
|
||||
- **Ví dụ**
|
||||
|
||||
> Xin thiết kế một **ứng dụng web hai trang** tên _Word-Snake_.
|
||||
>
|
||||
> - **Trang Game:**
|
||||
> - Rắn điều khiển di chuyển bằng phím.
|
||||
> - Rắn ăn là từ tiếng Anh, không phải thức ăn thông thường.
|
||||
> - Panel bên phải hiển thị từ đã thu thập và số lượng.
|
||||
> - Sau khi game over, kho từ không bị xóa, tiếp tục sử dụng ở ván mới.
|
||||
> - **Trang Make Poem:**
|
||||
> - Hiển thị cùng kho từ chia sẻ.
|
||||
> - Người dùng chọn một phần từ và click nút **Generate Poem**.
|
||||
> - Gửi các từ này cho backend, dùng DeepSeek API tạo thơ.
|
||||
> - Sau khi sinh thơ, xóa hoặc giảm số lượng từ đã sử dụng trong kho.
|
||||
> - **Điều hướng:** Chuyển đổi giữa hai trang qua Tab đơn giản hoặc menu trên cùng.
|
||||
> - **Trạng thái chia sẻ:** Đảm bảo từ thu thập luôn đồng bộ và hiển thị ở cả hai trang.
|
||||
|
||||
- **Ví dụ kết quả**
|
||||
|
||||
|
||||
|
||||
---
|
||||
|
||||
# 5. So sánh nền tảng AI Agent (Cách chọn tổ hợp tốt nhất cho dự án đơn giản)
|
||||
|
||||
Các nền tảng Vibe Coding khác nhau có đặc điểm và workflow khác nhau. Chúng ta sử dụng cùng một bộ yêu cầu "trò Snake với DeepSeek API" để thử nghiệm thực tế trên nhiều nền tảng, đánh giá ưu nhược điểm từ góc nhìn người mới bắt đầu. Dưới đây là tóm tắt.
|
||||
|
||||
## 1. Tiêu chuẩn so sánh
|
||||
|
||||
1. **Mục tiêu (Goal)**
|
||||
Xây dựng một ứng dụng web Snake kết nối DeepSeek API.
|
||||
2. **Chi tiết game (Game Details)**
|
||||
1. Game tạo thơ thông qua DeepSeek LLM API.
|
||||
2. Rắn ăn từ tiếng Anh, từ thu thập được giữ lại sau game over, tiếp tục sử dụng ở ván mới. Cùng một từ có thể thu thập nhiều lần, tính riêng.
|
||||
3. Khi tạo một bài thơ, từ đã sử dụng bị xóa khỏi kho.
|
||||
|
||||
3. **Chức năng bắt buộc (Must-Haves)**
|
||||
1. Một trang frontend có thể chạy, bao gồm trò Snake (điều khiển phím, render Canvas).
|
||||
2. Cơ chế thu thập từ (từ xuất hiện trên bàn cờ, rắn ăn từ, danh sách sidebar cập nhật).
|
||||
3. Lưu trữ kho từ liên tục giữa nhiều ván game.
|
||||
4. Backend sử dụng DeepSeek API (nếu không có API Key, có thể trước trả về thơ mô phỏng).
|
||||
5. Nút "sinh thơ": Sau khi click gọi backend, hiển thị thơ, và cập nhật kho từ theo sử dụng.
|
||||
6. Hỗ trợ API Key qua `.env`, và tránh rò rỉ khóa thông qua `.gitignore`.
|
||||
|
||||
4. **Điểm cộng (Nice-to-Haves)**
|
||||
1. Người dùng có thể chọn từ nào để sinh thơ.
|
||||
2. Trải nghiệm người dùng thân thiện (ví dụ sidebar hiển thị rõ ràng danh sách từ, layout khu vực hiển thị thơ hợp lý).
|
||||
3. Thêm comment trong code cho người mới bắt đầu, giải thích logic chính.
|
||||
|
||||
## 2. So sánh output code
|
||||
|
||||
### 1. Lovable (Web-based)
|
||||
|
||||
- **Loại nền tảng:** Web
|
||||
- **Đặc điểm chính và workflow:** Lovable làm tốt trong tích hợp và phối hợp, nó tự động hoàn thành các khởi tạo như kết nối database Supabase, khiến quá trình xây dựng dự án rất thuận lợi. Bạn chỉ cần mô tả nhu cầu dự án, Agent sẽ giúp bạn kết nối các loại dịch vụ, xây dựng cấu trúc cơ bản.
|
||||
- **Người dùng phù hợp:** Đối với người mới lần đầu thử Vibe Coding, Lovable là lựa chọn rất thân thiện. Nó đơn giản hóa độ phức tạp của liên kết đa dịch vụ, để bạn tập trung sự chú ý vào prompt và lặp lại, thay vì cấu hình môi trường. Nhờ tự động hóa cao, bạn có thể nhanh chóng nhận được prototype chạy được.
|
||||
- **Quá trình prompt:**
|
||||
|
||||
- **Hiệu quả trò Snake:**
|
||||
|
||||
|
||||
|
||||
- **Giá:** Tương đối cao, nhưng nếu bạn có email trường, có thể xác minh sinh viên để dùng với giá nửa.
|
||||
|
||||
|
||||
### 2. Cursor (IDE)
|
||||
|
||||
- **Loại nền tảng:** Ứng dụng desktop (PC)
|
||||
- **Đặc điểm chính và workflow:** Cursor là một IDE chuyên biệt tích hợp khả năng AI, hỗ trợ Windows, macOS và Linux. Nó nhúng trực tiếp tạo code, viết lại thông minh, truy vấn codebase vào môi trường phát triển. So với công cụ Web, nó gần với trải nghiệm phát triển cục bộ truyền thống hơn. Vì là môi trường cục bộ, cấu hình máy khác nhau sẽ thỉnh thoảng gặp vấn đề liên quan đến môi trường. Điểm tốt là dự án nằm ngay trên máy, không cần tải thêm hay cấu hình môi trường chạy, Cursor sẽ giúp bạn xử lý nhiều bước phức tạp.
|
||||
- **Người dùng phù hợp:** Đối với người dùng đã có nền tảng lập trình nhất định, Cursor là một môi trường rất mạnh mẽ và quen thuộc. Nhưng đối với người mới hoàn toàn không có nền tảng, cần tự hiểu cấu trúc dự án, quản lý dependency và tổ chức file, đường cong học sẽ dốc hơn. Phù hợp hơn cho nhà phát triển muốn thêm trợ lý AI vào quy trình lập trình truyền thống.
|
||||
- **Quá trình prompt:**
|
||||
|
||||
- **Hiệu quả trò Snake:**
|
||||
|
||||
|
||||
|
||||
- **Giá:**
|
||||
|
||||
|
||||
### 3. Z.ai (Web-based)
|
||||
|
||||
- **Loại nền tảng:** Web
|
||||
- **Đặc điểm chính và workflow:** Cách sử dụng Z.ai khá trực tiếp, nhưng một thách thức rõ ràng là: bạn cần **thủ công copy paste code đã tạo**. Bản thân nền tảng thiếu cửa sổ xem trước thời gian thực, nên rất khó thấy ngay hiệu quả chạy code.
|
||||
- **Người dùng phù hợp:** Nền tảng này yêu cầu cách sử dụng "động tay" hơn. Thiếu tự động hóa nghĩa là bạn phải trực tiếp đối mặt với code, điều này đối với người muốn hiểu sâu nội dung AI output lại là một dạng rèn luyện. Nhưng copy paste thường xuyên sẽ mang lại vấn đề hiệu quả và nguy cơ sai sót. Phù hợp hơn cho người muốn xem "raw AI output code", chứ không phải người theo đuổi trải nghiệm một lần click.
|
||||
- **Quá trình prompt:**
|
||||
|
||||
- **Hiệu quả trò Snake:**
|
||||
|
||||
|
||||
|
||||
- **Giá:**
|
||||
|
||||
|
||||
### 4. Replit (Web-based)
|
||||
|
||||
- **Loại nền tảng:** Web
|
||||
- **Đặc điểm chính và workflow:** Replit là môi trường phát triển và triển khai trực tuyến tất cả trong một, trong trình duyệt đã có thể viết code, chạy chương trình, tạo địa chỉ truy cập online. Trước khi bắt đầu code, nó sẽ đưa ra kế hoạch hành động rõ ràng; đồng thời cung cấp editor trực quan, bạn có thể sửa UI trực tiếp trong cửa sổ xem trước, source code tự động đồng bộ cập nhật. Như vậy có thể bạn luôn xác nhận output của AI có đúng kỳ vọng không, giảm đáng kể số lần sửa đổi qua lại.
|
||||
|
||||
|
||||
|
||||
- **Người dùng phù hợp:** Replit rất thân thiện với người mới. Nó đơn giản hóa vòng khép kín hoàn chỉnh từ code đến triển khai, không cần tự cấu hình server hay hosting thêm. Chức năng phối hợp cũng rất mạnh, phù hợp bạn học cùng làm dự án hoặc nhờ người khác hỗ trợ xem code từ xa.
|
||||
- **Quá trình prompt:** Trong quá trình xây dựng, AI không phải ngay từ đầu đã hiểu hoàn toàn nhu cầu, trải qua khoảng 3 vòng lặp, output cuối cùng mới đạt hiệu quả lý tưởng.
|
||||
|
||||
- **Hiệu quả trò Snake:**
|
||||
|
||||
|
||||
|
||||
- **Giá:**
|
||||
|
||||
|
||||
### 5. Minimax (Web-based)
|
||||
|
||||
- **Loại nền tảng:** Web
|
||||
- **Đặc điểm chính và workflow:** Minimax thường mất nhiều thời gian hơn khi thực thi nhiệm vụ. Quy trình thường bao gồm: AI tự động phát hiện và sửa lỗi, vì vậy toàn bộ quá trình có thể chậm hơn, thậm chí hơi rắc rối. Lấy dự án này làm ví dụ, Agent thường trước tạo một kế hoạch chi tiết, rồi từng bước xây dựng backend, database và logic frontend.
|
||||
- **Người dùng phù hợp:** Vì nó sẽ tự động chạy test và sửa lỗi, thời gian và tiêu thụ Token đều khá lớn, nhưng bạn có thể rõ ràng thấy AI định vị và giải quyết vấn đề thế nào, từ góc độ học tập rất có giá trị.
|
||||
- **Quá trình prompt:**
|
||||
|
||||
|
||||
|
||||
- **Hiệu quả trò Snake:**
|
||||
|
||||
|
||||
|
||||
- **Giá:** Phiên bản miễn phí trong dự án phức tạp rất có thể không chạy từ đầu đến cuối suôn sẻ, nên khuyến nghị nâng cấp trả phí, để đảm bảo dự án có thể xây dựng hoàn chỉnh.
|
||||
|
||||
|
||||
### 6. Trae (IDE)
|
||||
|
||||
- **Loại nền tảng:** Ứng dụng desktop (PC)
|
||||
- **Đặc điểm chính và workflow:** Là ứng dụng desktop, Trae so với công cụ Web thường có ưu thế hơn về hiệu năng và tốc độ phản hồi. Nhưng nó cần tải và cài đặt, đối với một số người dùng rào cản ban đầu hơi cao. Tương tự, vì là môi trường cục bộ, sự khác biệt về cấu hình máy và môi trường dependency sẽ mang lại một số không chắc chắn. Ưu điểm là Trae sẽ giúp bạn hoàn thành tạo dự án và cấu hình chạy ở cục bộ, bạn có thể trực tiếp phát triển và debug trên máy.
|
||||
- **Người dùng phù hợp:** Phù hợp hơn cho người dùng kế hoạch tiến hành dự án Vibe Coding dài hạn, và muốn sử dụng tổ hợp công cụ desktop chuyên dụng. Đối với người chỉ muốn "thỉnh thoảng chơi thử", có thể không phải lựa chọn nhẹ nhất.
|
||||
- **Quá trình prompt:**
|
||||
|
||||
- **Hiệu quả trò Snake:**
|
||||
|
||||
|
||||
|
||||
- **Giá:** Giá tương đối hợp lý, kể cả phiên bản miễn phí cũng đủ để hoàn thành dự án nhỏ chất lượng khá.
|
||||
|
||||
|
||||
### 7. V0 (Web-based)
|
||||
|
||||
- **Loại nền tảng:** Web
|
||||
- **Đặc điểm chính và workflow:** V0 là một công cụ tập trung vào tạo component UI React, do Vercel cung cấp. Nó thể hiện xuất sắc trong việc tạo giao diện chất lượng cao, có thể dùng cho môi trường production. Nhưng trong sử dụng thực tế, sẽ gặp những vấn đề như "khó tìm code view", "không nói rõ API Key nên cấu hình ở đâu".
|
||||
- **Người dùng phù hợp:** V0 rất phù hợp cho sinh viên hoặc nhà thiết kế tập trung vào frontend và UI/UX. Nhưng nó không phải giải pháp fullstack hoàn chỉnh, bạn vẫn cần sử dụng nền tảng khác để triển khai logic backend và tích hợp API, vì vậy nếu mục tiêu của bạn là "xây ứng dụng hoàn chỉnh tại chỗ", nó có thể không phải lựa chọn hàng đầu.
|
||||
- **Quá trình prompt:**
|
||||
|
||||
|
||||
|
||||
|
||||
- **Hiệu quả trò Snake:**
|
||||
|
||||
- **Giá:** Người dùng miễn phí khoảng có thể xây dựng 4-5 dự án đơn giản.
|
||||
|
||||
|
||||
## 3. Bảng so sánh tổng kết nền tảng
|
||||
|
||||
| **Nền tảng** | **Đánh giá** | **Platform** | **Ghi chú** |
|
||||
| ------------------------------------------ | ------------------------------------------------------------------------------ | ------------ | ------------------------------------------------------------------------------ |
|
||||
| **[Lovable](https://lovable.dev/)** | Rất thân thiện với người mới lập trình AI, dễ bắt đầu, trải nghiệm mượt mà, là lựa chọn khởi đầu lý tưởng. | Web-based | Tự động hoàn tất kết nối Supabase, giảm chi phí cấu hình. |
|
||||
| **[Cursor](https://cursor.com/cn/agents)** | Phù hợp người dùng đã có kinh nghiệm phát triển, nâng cao năng suất và chất lượng code đáng kể. | PC | Cần nền tảng lập trình nhất định, cần tự hiểu cấu trúc dự án và dependency trong môi trường cục bộ. |
|
||||
| **[Z.ai](https://chat.z.ai/)** | Phù hợp hơn cho người có nền tảng lập trình, muốn trực tiếp nghiên cứu chi tiết code AI output. | Web-based | Không có cửa sổ xem trước, kiểm tra kết quả khá phiền; cần thủ công paste code, tạo thư mục và file và chạy service thủ công. |
|
||||
| **[Replit](https://replit.com/~)** | Khuyến nghị cho người muốn nhanh biến ý tưởng thành dịch vụ online có thể truy cập. | Web-based | Phát triển và triển khai trực tuyến tất cả trong một, hỗ trợ phối hợp và cung cấp editor trực quan. |
|
||||
| **[Minimax](https://agent.minimaxi.com/)** | Phù hợp người muốn xem toàn bộ quá trình AI tự động tìm và sửa lỗi, và học từ đó, nhưng tổng thể khá chậm và tốn Token. | Web-based | Toàn bộ quá trình khá dài, AI sẽ nhiều lần tự động chạy test và sửa lỗi. |
|
||||
| **[Trae](https://www.trae.ai/)** | Dành cho người có kinh nghiệm lập trình, muốn sử dụng tổ hợp desktop IDE + AI Agent, là công cụ nâng cao hiệu quả mạnh mẽ. | PC | Cần cài đặt cục bộ và cấu hình môi trường, nhưng hiệu năng tốt hơn, phù hợp tiến hành dự án Vibe Coding dài hạn. |
|
||||
| **[V0](https://v0.app/)** | Tối ưu cho người phi nhà phát triển muốn nhanh tạo hiệu ứng UI React, phù hợp sinh viên hướng frontend / thiết kế. | Web-based | Tập trung tạo UI React, cần phối hợp với nền tảng khác hoàn thành backend và xây dựng ứng dụng hoàn chỉnh. |
|
||||
---
|
||||
title: 'So sanh 7 cong cu lap trinh AI'
|
||||
description: 'Danh gia thuc hanh cac nen tang Web Vibe Coding bang mot bai toan thong nhat, so sanh do de lam quen, kiem soat code va trien khai.'
|
||||
---
|
||||
+348
@@ -0,0 +1,348 @@
|
||||
# Dùng Agent thiết kế và lập trình thiết kế trang web
|
||||
|
||||
## Hướng dẫn chương này
|
||||
|
||||
Chương này sẽ trình bày thiết kế và phát triển có thể hợp tác hoàn hảo thông qua AI như thế nào. Bạn sẽ đóng vai trò product manager, chỉ huy "Agent thiết kế" hoàn thành thiết kế Logo, phối màu và bố cục trang, rồi phối hợp với "Agent lập trình" chuyển bản thiết kế thành code có thể chạy. Từ hình thành ý tưởng đến trang web lên mạng, trải nghiệm toàn bộ quy trình phát triển được AI nâng cao, khiến một người trở thành một đội ngũ.
|
||||
|
||||
---
|
||||
|
||||
# 1. Hướng dẫn bắt đầu
|
||||
|
||||
## 1. Giới thiệu hướng dẫn
|
||||
|
||||
Hãy sử dụng AI Design Agent và Coding Agent để xây dựng một trang web hoàn chỉnh từ đầu.
|
||||
|
||||
- **Agent thiết kế**: Chịu trách nhiệm tạo logo, bố cục trang web, phối màu và các yếu tố hình ảnh khác
|
||||
- **Agent lập trình**: Viết code thực tế HTML/CSS/JS, v.v. dựa trên yêu cầu và bố cục bạn đưa ra trong prompt, xây dựng trang web có thể chạy
|
||||
|
||||
## 2. Agent thiết kế và Agent lập trình
|
||||
|
||||
- **Agent thiết kế**: AI tạo hình ảnh, mô hình trang hoặc phong cách thiết kế dựa trên prompt bạn cung cấp.
|
||||
- Mastergo
|
||||
- Lovart
|
||||
- Figma MCP
|
||||
- **Agent lập trình**: AI viết code thực tế (HTML/CSS/JS, v.v.) dựa trên chức năng và bố cục bạn yêu cầu trong prompt.
|
||||
- Z.AI
|
||||
- Trae
|
||||
- Cursor
|
||||
- Lovable
|
||||
|
||||
---
|
||||
|
||||
# 2. Sử dụng Agent thiết kế tạo Logo
|
||||
|
||||
## 1. Các yếu tố cần cân nhắc khi thiết kế Logo
|
||||
|
||||
Logo là một trong những yếu tố quyết định ấn tượng đầu tiên về trang web của bạn. Để nhận kết quả hài lòng từ Agent thiết kế AI, bạn cần mô tả rõ loại Logo bạn muốn trong prompt.
|
||||
|
||||
1. **Tên thương hiệu / Văn bản**
|
||||
|
||||
- Văn bản phải xuất hiện trong Logo (ví dụ: tiêu đề trang web, tên thương hiệu, v.v.).
|
||||
|
||||
2. **Phong cách (tâm trạng / bầu không khí)**
|
||||
|
||||
- Cảm giác hoặc bầu không khí tổng thể mà Logo muốn truyền tải.
|
||||
- _Ví dụ: Tối giản, dễ thương, gọn gàng, hiện đại, retro, tương lai, v.v._
|
||||
|
||||
3. **Phối màu** (tùy chọn)
|
||||
|
||||
- Tốt nhất nên để phối màu Logo phù hợp với tông tổng thể của toàn trang web.
|
||||
- Có thể chỉ định mã hex cụ thể, hoặc gam màu chung (màu lạnh, màu ấm, v.v.).
|
||||
- _Ví dụ: **`#171721`** (đen), **`#FF7130`** (cam)._
|
||||
|
||||
4. **Hình thức (hình dáng / cấu trúc)**
|
||||
|
||||
- Làm rõ Logo có cần hình dáng hoặc bố cục cụ thể không.
|
||||
- _Ví dụ: Chữ trong vòng tròn, tổ hợp icon + chữ, Logo lấy icon làm chủ đạo, v.v._
|
||||
|
||||
5. **Yếu tố icon / biểu tượng** (tùy chọn)
|
||||
|
||||
- Đồ họa hoặc biểu tượng muốn xuất hiện trong Logo.
|
||||
- _Ví dụ: Icon sách, biểu tượng tia sét, đồ họa liên quan AI, hình học trừu tượng, v.v._
|
||||
|
||||
## 2. Viết prompt thiết kế Logo
|
||||
|
||||
**Prompt ví dụ**
|
||||
|
||||
```
|
||||
"Xin thiết kế cho tôi một Logo phong cách tối giản, tên thương hiệu là 'My First Website'.
|
||||
Sử dụng đen (#171721) và cam (#FF7130), và đặt chữ bên trong một vòng tròn."
|
||||
```
|
||||
|
||||
```
|
||||
"Xin thiết kế một Logo với tên thương hiệu 'AIID'.
|
||||
Phong cách tổng thể phải có cảm giác tương lai, sạch sẽ gọn gàng, màu chủ đạo là xanh và trắng.
|
||||
Kết hợp đồ họa trừu tượng tượng trưng cho AI với chữ, và xuất ra dưới dạng PNG với nền trong suốt."
|
||||
```
|
||||
|
||||
## 3. Yêu cầu thiết kế từ Agent
|
||||
|
||||
- Nhập prompt trên → So sánh nhiều bản thiết kế do Agent tạo.
|
||||
|
||||
|
||||
|
||||
## 4. Xác định Logo cuối cùng
|
||||
|
||||
- Chọn phiên bản bạn thích nhất từ bản nháp và tải xuống.
|
||||
|
||||
---
|
||||
|
||||
# 3. Lập kế hoạch cấu trúc trang web
|
||||
|
||||
## 1. Hiểu các khu vực cơ bản
|
||||
|
||||
Trước khi thực sự bắt đầu làm trang web, lập kế hoạch các menu (khu vực) muốn bao gồm rất quan trọng. Thiết kế menu phụ thuộc vào việc bạn muốn khách truy cập thấy gì, và muốn họ thực hiện hành động gì.
|
||||
Nói chung, trang web thường bao gồm các khu vực cơ bản như **Home / About / Contact**.
|
||||
|
||||
## 2. Tự vẽ sketch cấu trúc (tùy chọn)
|
||||
|
||||
Bạn có thể trước viết ra một cấu trúc menu đơn giản dựa trên mục tiêu trang web.
|
||||
|
||||
### Menu cơ bản
|
||||
|
||||
1. **Home**
|
||||
1. Trang chính mà khách truy cập thấy đầu tiên sau khi vào trang web
|
||||
2. Thường bao gồm Logo, hero area và một câu slogan hoặc giới thiệu ngắn
|
||||
2. **About**
|
||||
1. Giới thiệu bạn là ai, hoặc mục đích dự án / dịch vụ
|
||||
2. Portfolio cá nhân: Tự giới thiệu + CV ngắn
|
||||
3. Trang dịch vụ: Tầm nhìn, mục tiêu và chức năng cốt lõi
|
||||
3. **Contact**
|
||||
1. Thông tin liên hệ, như email, số điện thoại, link mạng xã hội, v.v.
|
||||
2. Cũng có thể thêm một form liên hệ đơn giản
|
||||
|
||||
### Menu tùy chọn
|
||||
|
||||
4. **Services / Projects**
|
||||
1. Hiển thị dịch vụ bạn cung cấp, hoặc dự án / portfolio của bạn
|
||||
2. Thường hiển thị dạng danh sách hoặc card
|
||||
|
||||
5. **Gallery**
|
||||
1. Dùng để hiển thị hình ảnh, ảnh hoặc tác phẩm thiết kế
|
||||
|
||||
6. **Blog / News**
|
||||
1. Dùng để xuất bản bài viết, cập nhật hoặc nhật ký
|
||||
|
||||
7. **FAQ**
|
||||
1. Tổng hợp các câu hỏi và câu trả lời khách truy cập thường hỏi
|
||||
|
||||
## 3. Chọn phối màu (tùy chọn)
|
||||
|
||||
Nếu bạn đã có Logo, hoặc muốn dùng kết hợp màu cụ thể để thiết kế trang web, cũng có thể trực tiếp viết mã màu bạn muốn sử dụng trong prompt.
|
||||
|
||||
**Ví dụ:** `#171721, #872B97, #FF7130, #FF3C68`
|
||||
|
||||
Kể cả bạn tạm chưa nghĩ ra phối màu nào, cũng có thể tìm cảm hứng qua trang web phối màu hoặc tìm kiếm từ khóa.
|
||||
|
||||
- **Trang web tham khảo phối màu**
|
||||
- https://colorhunt.co/
|
||||
- https://coolors.co/
|
||||
|
||||
|
||||
|
||||
- **Tìm kiếm phối màu qua từ khóa trên Google**
|
||||
|
||||
|
||||
|
||||
## 4. Viết prompt thiết kế trang web
|
||||
|
||||
**Prompt ví dụ**
|
||||
|
||||
```
|
||||
"Xin thiết kế một trang web một trang bao gồm 3 khu vực Home, About, Contact.
|
||||
Sử dụng phối màu #171721, #FF7130 và #FF3C68.
|
||||
Phong cách tổng thể hiện đại, gọn gàng."
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
# 4. Sử dụng Agent thiết kế thiết kế trang web
|
||||
|
||||
## 1. Nhập prompt → Tạo bản thiết kế
|
||||
|
||||
- Viết cấu trúc đã lên kế hoạch và phối màu đã chọn trong prompt.
|
||||
|
||||
**Ví dụ prompt Mastergo**
|
||||
|
||||
|
||||
|
||||
## 2. Xem xét bản thiết kế và đưa ra ý kiến sửa đổi
|
||||
|
||||
Bạn có thể đưa ra phản hồi cho Agent theo nhu cầu của mình, ví dụ:
|
||||
|
||||
- "Quá sặc sỡ, đổi phong cách tổng thể gọn gàng hơn."
|
||||
- "Đổi font khác."
|
||||
- "Điều chỉnh phối màu."
|
||||
- "Xóa phần này đi."
|
||||
|
||||
|
||||
|
||||
## 3. Xác định thiết kế cuối cùng
|
||||
|
||||
Khi bạn đã sửa đổi nhiều vòng và hài lòng với bản thiết kế, có thể chuyển thiết kế này thành code, để Coding Agent hiểu và tiếp tục làm việc.
|
||||
|
||||
Cách chuyển thiết kế thành code sẽ khác nhau tùy nền tảng, nhưng thường là cài đặt và sử dụng một số plugin trong nền tảng thiết kế.
|
||||
|
||||
**Ví dụ Mastergo**
|
||||
|
||||
1. Mở [trang plugin Mastergo](https://mastergo.com/community/plugin), tìm **seal**.
|
||||
|
||||
|
||||
|
||||
2. Quay lại trang thiết kế, click **icon hình vuông (plugin)**.
|
||||
|
||||
|
||||
|
||||
3. Chọn vùng thiết kế bạn muốn chuyển thành code, click nút **Generate** để tạo code.
|
||||
|
||||
|
||||
|
||||
---
|
||||
|
||||
# 5. Sử dụng Coding Agent xây trang web
|
||||
|
||||
## 1. Hiểu khái niệm cơ bản HTML/CSS/JS
|
||||
|
||||
Bản chất một trang web gồm ba ngôn ngữ:
|
||||
|
||||
- **HTML (HyperText Markup Language)** → Cấu trúc (bộ xương)
|
||||
- **CSS (Cascading Style Sheets)** → Phong cách (ngoại hình)
|
||||
- **JavaScript (JS)** → Chức năng (tương tác)
|
||||
|
||||
Ba thứ phối hợp với nhau, tạo thành trang web hoàn chỉnh mà chúng ta nhìn thấy.
|
||||
|
||||
1. **🏗️ HTML (Cấu trúc)**
|
||||
|
||||
- Định nghĩa "hiển thị gì" trên trang
|
||||
- Dùng để đặt các yếu tố như văn bản, hình ảnh, nút bấm, link
|
||||
- Tương tự như **tường và khung** của tòa nhà
|
||||
|
||||
**Ví dụ**
|
||||
|
||||
```html
|
||||
<h1>Hello!</h1>
|
||||
<p>This is my first website.</p>
|
||||
<a href="contact.html">Contact</a>
|
||||
```
|
||||
|
||||
2. **🎨 CSS (Phong cách)**
|
||||
|
||||
- Quyết định "nội dung hiển thị thế nào"
|
||||
- Điều khiển kích thước chữ, màu sắc, khoảng cách, nền, hình dạng nút, v.v.
|
||||
- Cho HTML có "quần áo" và phong cách hình ảnh
|
||||
|
||||
**Ví dụ**
|
||||
|
||||
```css
|
||||
h1 {
|
||||
color: #FF7130; /* Text color */
|
||||
font-size: 36px; /* Font size */
|
||||
text-align: center; /* Center alignment */
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: #171721; /* Background color */
|
||||
color: white; /* Default text color */
|
||||
}
|
||||
```
|
||||
|
||||
3. **⚙️ JavaScript (JS) (Chức năng)**
|
||||
|
||||
- Khiến trang web có thể tương tác với người dùng
|
||||
- Có thể triển khai các hiệu ứng động như click nút, mở menu, slideshow ảnh, submit form
|
||||
- Nếu HTML/CSS là bộ xương và ngoại hình tĩnh, thì JS là **bộ não** khiến trang web "sống động"
|
||||
|
||||
**Ví dụ**
|
||||
|
||||
```javascript
|
||||
function showAlert() {
|
||||
alert("The button has been clicked!");
|
||||
}
|
||||
```
|
||||
|
||||
```html
|
||||
<button onclick="showAlert()">Click me</button>
|
||||
```
|
||||
|
||||
## 2. Để Coding Agent tạo code
|
||||
|
||||
**Prompt ví dụ**
|
||||
|
||||
```
|
||||
"Xin viết HTML và CSS cho một trang web một trang bao gồm các khu vực Home, About và Contact.
|
||||
Sử dụng phối màu #171721, #FF7130, #FF3C68.
|
||||
Nền đen, chữ trắng."
|
||||
```
|
||||
|
||||
|
||||
|
||||
## 3. Chạy trang web
|
||||
|
||||
Khi code nháp đã được tạo, Agent thường sẽ tự động khởi động dự án và hiển thị trang web đã tạo.
|
||||
|
||||
Nếu bạn khởi động lại Agent, hoặc trang web không hiển thị, có thể nhập prompt kiểu như sau:
|
||||
|
||||
```
|
||||
"Please activate the project"
|
||||
```
|
||||
|
||||
Để Agent khởi động lại dự án và mở trang xem trước, tiện bạn xem hiệu quả hiện tại.
|
||||
|
||||
## 4. Sửa đổi đơn giản
|
||||
|
||||
Bạn có thể tiếp tục tinh chỉnh bản nháp thông qua ngôn ngữ tự nhiên, ví dụ:
|
||||
|
||||
- "Làm nút to hơn."
|
||||
- "Font đậm hơn."
|
||||
|
||||
|
||||
|
||||
## 5. Sửa đổi nội dung văn bản trang web
|
||||
|
||||
Trang web phiên bản đầu do Agent tạo, thường bao gồm một số văn bản placeholder tự động tạo. Để nó gần hơn với kịch bản thực tế của bạn, bạn có thể chuẩn bị nội dung thực tế trước, rồi để Agent giúp bạn thay thế.
|
||||
|
||||
**Ví dụ ứng dụng:** Cập nhật trang About của trang web AIID
|
||||
|
||||
1. Trước viết xong nội dung bạn muốn hiển thị trên trang About. Để Agent dễ hiểu, có thể lưu nội dung dưới định dạng Markdown.
|
||||
|
||||
|
||||
|
||||
2. Sau đó nói với Agent trong hội thoại, áp dụng nội dung từ file này lên trang được chỉ định.
|
||||
|
||||
|
||||
|
||||
3. Xem phiên bản cập nhật sau khi áp dụng nội dung.
|
||||
|
||||
|
||||
|
||||
## 6. Chèn hình ảnh
|
||||
|
||||
Nếu bạn muốn thêm hình ảnh cụ thể (ví dụ Logo, ảnh nền, v.v.), có thể trước upload hình ảnh vào thư mục dự án, sau đó trong prompt nói rõ muốn sử dụng hình ảnh này ở vị trí nào trên trang.
|
||||
|
||||
- **Ví dụ:**
|
||||
|
||||
|
||||
|
||||
- **Kết quả:**
|
||||
|
||||
|
||||
|
||||
---
|
||||
|
||||
# 6. Tích hợp thiết kế và code
|
||||
|
||||
## 1. Tích hợp file thiết kế và code trang web (tùy chọn)
|
||||
|
||||
Khi bạn đã tải xuống file code từ Agent thiết kế, có thể di chuyển chúng vào thư mục dự án hiện tại, rồi nhờ Coding Agent giúp bạn hợp nhất code thiết kế này với dự án hiện có.
|
||||
|
||||
- **Ví dụ:**
|
||||
|
||||
|
||||
|
||||
- **Kết quả:**
|
||||
|
||||
|
||||
---
|
||||
title: 'Lam website voi agent thiet ke va lap trinh'
|
||||
description: 'Tu y tuong den len song: dung agent thiet ke tao visual, sau do dung agent code tao website chay duoc voi workflow tai su dung.'
|
||||
---
|
||||
@@ -0,0 +1,325 @@
|
||||
---
|
||||
title: 'Lỗi code thì phải làm sao - Hướng dẫn thực chiến chụp màn hình hỏi AI'
|
||||
description: 'Học cách đặt câu hỏi cho AI hiệu quả để giải quyết các lỗi phát triển, làm chủ quy trình chuẩn chụp màn hình, mô tả, định vị vấn đề, biến AI thành trợ lý debug của bạn.'
|
||||
---
|
||||
|
||||
<script setup>
|
||||
const duration = 'Khoảng <strong>30 phút</strong>'
|
||||
</script>
|
||||
|
||||
# Lỗi code thì phải làm sao
|
||||
|
||||
## Hướng dẫn chương này
|
||||
|
||||
<ChapterIntroduction :duration="duration" :tags="['Kỹ năng debug', 'Hợp tác AI', 'Khắc phục vấn đề', 'Công cụ nhà phát triển']" coreOutput="Một quy trình khắc phục lỗi chuẩn hóa" expectedOutput="Có thể tự giải quyết 90% lỗi phổ biến">
|
||||
|
||||
Trong kỷ nguyên AI, cách khắc phục lỗi đã thay đổi.
|
||||
|
||||
Bạn không cần thuộc tất cả các loại lỗi, không cần trở thành chuyên gia debug, thậm chí không cần hiểu lỗi có nghĩa là gì.
|
||||
|
||||
<strong>Bạn chỉ cần học một điều: cách hỏi AI.</strong>
|
||||
|
||||
Chương này sẽ dạy bạn một quy trình khắc phục <strong>từ đơn giản đến nâng cao</strong>:
|
||||
|
||||
1. <strong>Bước 1: Hỏi trực tiếp</strong>: Mô tả hiện tượng + chụp màn hình, đặt câu hỏi bằng một câu
|
||||
2. <strong>Bước 2: Bổ sung thông tin</strong>: Nếu không giải quyết được, mở F12 để bổ sung thông tin quan trọng
|
||||
|
||||
Sau khi làm chủ quy trình này, <strong>90% lỗi bạn đều có thể tự giải quyết</strong>.
|
||||
|
||||
</ChapterIntroduction>
|
||||
|
||||
::: info Giải thích
|
||||
Tất cả các phương pháp trong chương này dựa trên kinh nghiệm sử dụng thực tế các AI IDE như Cursor/Trae/Claude, có thể áp dụng trực tiếp cho phát triển hàng ngày.
|
||||
:::
|
||||
|
||||
<div style="margin: 50px 0;">
|
||||
<ClientOnly>
|
||||
<StepBar :active="0" :items="[
|
||||
{ title: 'Đặt câu hỏi trực tiếp', description: 'Mô tả hiện tượng + chụp màn hình' },
|
||||
{ title: 'Bổ sung thông tin', description: 'Mở F12 định vị vấn đề' },
|
||||
{ title: 'Lặp lại giải quyết', description: 'Cho đến khi vấn đề được giải quyết' }
|
||||
]" />
|
||||
</ClientOnly>
|
||||
</div>
|
||||
|
||||
## 1. Tâm pháp cốt lõi: Chụp màn hình hỏi AI
|
||||
|
||||
::: warning Tại sao chương này quan trọng?
|
||||
|
||||
Rất nhiều người mới học khi gặp lỗi, phản ứng đầu tiên là:
|
||||
- Hoảng hốt, bắt đầu sửa code lung tung
|
||||
- Dùng nửa tiếng để tìm kiếm "cách giải quyết lỗi xxx"
|
||||
- Cố tự hiểu lỗi có nghĩa là gì
|
||||
- Tự debug đến khuya
|
||||
|
||||
<strong>Những điều này đều đang lãng phí thời gian.</strong>
|
||||
|
||||
Trong kỷ nguyên AI, debug đã trở thành một việc rất đơn giản:
|
||||
|
||||
```
|
||||
Thấy lỗi → Chụp màn hình → Hỏi AI → Làm theo AI nói
|
||||
```
|
||||
|
||||
Bạn không cần hiểu lỗi, không cần biết debug, thậm chí không cần biết vấn đề nằm ở đâu.
|
||||
|
||||
<strong>Bạn chỉ cần học cách hỏi.</strong>
|
||||
|
||||
:::
|
||||
|
||||
### 1.1 Cách đặt câu hỏi đơn giản nhất
|
||||
|
||||
Không cần template phức tạp, chọn một trong hai cách:
|
||||
|
||||
**Cách 1: Mô tả hiện tượng**
|
||||
|
||||
Định dạng: Vừa rồi làm gì, bây giờ xuất hiện gì
|
||||
|
||||
```
|
||||
Vừa rồi tôi sửa code trang đăng nhập, bây giờ trang trắng, phải làm sao?
|
||||
```
|
||||
|
||||
**Cách 2: Chụp màn hình**
|
||||
|
||||
Trực tiếp chụp màn hình trang hiện tại hoặc thông tin lỗi
|
||||
|
||||
```
|
||||
[Chụp màn hình]
|
||||
|
||||
Lỗi này giải quyết thế nào?
|
||||
```
|
||||
|
||||
**Cách tốt nhất: Mô tả + Chụp màn hình**
|
||||
|
||||
```
|
||||
Vừa rồi tôi sửa code trang đăng nhập, bây giờ trang trắng.
|
||||
|
||||
[Chụp màn hình]
|
||||
|
||||
Phải làm sao?
|
||||
```
|
||||
|
||||
**Nhớ: Mô tả rõ ngữ cảnh, kèm chụp màn hình, AI có thể giúp bạn giải quyết vấn đề nhanh hơn.**
|
||||
|
||||
### 1.2 Cách nói rõ vấn đề
|
||||
|
||||
Rất nhiều người mới học biết cần đặt câu hỏi, nhưng không biết nói thế nào. Thực ra chỉ cần nói rõ ba điều:
|
||||
|
||||
**1. Vừa rồi làm gì**
|
||||
|
||||
```
|
||||
Vừa rồi tôi click nút lưu
|
||||
Vừa rồi tôi sửa code trang đăng nhập
|
||||
Vừa rồi tôi refresh trang
|
||||
```
|
||||
|
||||
**2. Bây giờ thấy gì**
|
||||
|
||||
```
|
||||
Bây giờ trang trắng
|
||||
Bây giờ bấm nút không có phản ứng
|
||||
Bây giờ hiển thị thông tin lỗi
|
||||
```
|
||||
|
||||
**3. Muốn đạt hiệu quả gì**
|
||||
|
||||
```
|
||||
Tôi muốn dữ liệu lưu thành công
|
||||
Tôi muốn trang hiển thị bình thường
|
||||
Tôi muốn sau khi click nút sẽ hiện thông báo
|
||||
```
|
||||
|
||||
**Ví dụ hoàn chỉnh:**
|
||||
|
||||
```
|
||||
Vừa rồi tôi click nút lưu, bây giờ trang hiển thị lỗi "Lưu thất bại".
|
||||
|
||||
[Chụp màn hình]
|
||||
|
||||
Tôi muốn dữ liệu form lưu thành công vào cơ sở dữ liệu, phải làm sao?
|
||||
```
|
||||
|
||||
**Nguyên tắc chính:**
|
||||
- Dùng ngôn ngữ bình thường để mô tả, không dùng thuật ngữ chuyên ngành
|
||||
- Nói theo trình tự thời gian: trước làm gì, sau đó xảy ra gì
|
||||
- Nói ra kỳ vọng của bạn, để AI biết bạn muốn gì
|
||||
|
||||
## 2. Bước 1: Trực tiếp mô tả hiện tượng đặt câu hỏi
|
||||
|
||||
Khi gặp vấn đề, <strong>đừng vội mở F12</strong>. Trước hết mô tả trực tiếp hiện tượng, chụp màn hình trang hiện tại, gửi cho AI xem.
|
||||
|
||||
Rất nhiều lúc, AI thấy chụp màn hình đã có thể trực tiếp đưa ra giải pháp.
|
||||
|
||||
### 2.1 Mô tả các hiện tượng phổ biến thế nào
|
||||
|
||||
::: tip Mô tả trực tiếp là được
|
||||
|
||||
**Trang trắng**
|
||||
```
|
||||
Trang mở ra trắng trơn, phải làm sao?
|
||||
|
||||
[Chụp màn hình]
|
||||
```
|
||||
|
||||
**Nút click không phản ứng**
|
||||
```
|
||||
Click nút này không có phản ứng, giúp tôi xem.
|
||||
|
||||
[Chụp màn hình]
|
||||
```
|
||||
|
||||
**Dữ liệu không lưu được**
|
||||
```
|
||||
Bấm lưu, dữ liệu không được lưu, phải làm sao?
|
||||
|
||||
[Chụp màn hình]
|
||||
```
|
||||
|
||||
**Style hiển thị sai**
|
||||
```
|
||||
Vị trí nút này bị lệch, điều chỉnh thế nào?
|
||||
|
||||
[Chụp màn hình]
|
||||
```
|
||||
|
||||
**API báo lỗi**
|
||||
```
|
||||
Gọi API bị lỗi, giúp tôi xem.
|
||||
|
||||
[Chụp màn hình]
|
||||
```
|
||||
|
||||
:::
|
||||
|
||||
### 2.2 Nếu AI giải quyết trực tiếp
|
||||
|
||||
Chúc mừng bạn, vấn đề đã được giải quyết! Chỉ cần sửa theo AI nói.
|
||||
|
||||
### 2.3 Nếu AI nói "cần thêm thông tin"
|
||||
|
||||
Lúc này mới cần mở F12, bổ sung thông tin quan trọng. Xem tiếp bên dưới.
|
||||
|
||||
## 3. Bước 2: Bổ sung thông tin quan trọng
|
||||
|
||||
Khi AI nói cần thêm thông tin, tùy theo loại vấn đề, mở F12 chụp nội dung tương ứng.
|
||||
|
||||
### 3.1 Khi nào cần bổ sung thông tin
|
||||
|
||||
AI có thể trả lời như sau:
|
||||
- "Xin mở Console xem có lỗi không"
|
||||
- "Chụp màn hình tab Network cho tôi xem"
|
||||
- "Cần xem thông tin lỗi cụ thể"
|
||||
|
||||
Lúc này, hãy bổ sung chụp màn hình theo hướng dẫn dưới đây.
|
||||
|
||||
### 3.2 Bổ sung thông tin Console (Trang trắng/Lỗi)
|
||||
|
||||
::: tip Các bước thao tác
|
||||
|
||||
**Bước 1: Nhấn F12 mở công cụ nhà phát triển**
|
||||
|
||||
Trên Mac là `Cmd+Option+I`, hoặc click chuột phải chọn "Kiểm tra".
|
||||
|
||||
**Bước 2: Chuyển sang tab Console**
|
||||
|
||||
**Bước 3: Chụp màn hình thông tin lỗi màu đỏ**
|
||||
|
||||
**Bước 4: Gửi cho AI**
|
||||
|
||||
```
|
||||
Lỗi Console như sau:
|
||||
|
||||
[Chụp màn hình]
|
||||
```
|
||||
|
||||
:::
|
||||
|
||||
### 3.3 Bổ sung thông tin Network (Vấn đề dữ liệu/API lỗi)
|
||||
|
||||
::: tip Các bước thao tác
|
||||
|
||||
**Bước 1: Nhấn F12 mở công cụ nhà phát triển**
|
||||
|
||||
**Bước 2: Chuyển sang tab Network**
|
||||
|
||||
**Bước 3: Thao tác lại một lần** (Click lưu/Refresh trang)
|
||||
|
||||
**Bước 4: Tìm request tương ứng, chụp màn hình**
|
||||
|
||||
- Xem URL và status code
|
||||
- Xem Payload (tham số truyền đi)
|
||||
- Xem Response (kết quả trả về)
|
||||
|
||||
**Bước 5: Gửi cho AI**
|
||||
|
||||
```
|
||||
Thông tin Network như sau:
|
||||
|
||||
Request: [Chụp màn hình 1]
|
||||
Tham số: [Chụp màn hình 2]
|
||||
Kết quả: [Chụp màn hình 3]
|
||||
```
|
||||
|
||||
:::
|
||||
|
||||
### 3.4 Bổ sung thông tin Elements (Vấn đề style)
|
||||
|
||||
::: tip Các bước thao tác
|
||||
|
||||
**Bước 1: Click chuột phải vào phần tử → "Kiểm tra"**
|
||||
|
||||
Công cụ nhà phát triển sẽ tự động định vị đến phần tử đó.
|
||||
|
||||
**Bước 2: Chụp màn hình bảng Styles**
|
||||
|
||||
**Bước 3: Gửi cho AI**
|
||||
|
||||
```
|
||||
Style phần tử như sau:
|
||||
|
||||
[Chụp màn hình]
|
||||
```
|
||||
|
||||
:::
|
||||
|
||||
## 4. Bước 3: Lặp lại cho đến khi giải quyết
|
||||
|
||||
### 4.1 Cách làm kém hiệu quả
|
||||
|
||||
Những cách làm này sẽ lãng phí thời gian của bạn:
|
||||
|
||||
Thấy lỗi liền hoảng hốt, bắt đầu sửa code lung tung
|
||||
Dùng nửa tiếng tìm kiếm giải pháp lỗi
|
||||
Cố tự hiểu ý nghĩa của mỗi lỗi
|
||||
Một mình debug đến khuya
|
||||
|
||||
### 4.2 Cách làm hiệu quả
|
||||
|
||||
Làm theo quy trình này:
|
||||
|
||||
Trước hết mô tả trực tiếp hiện tượng chụp màn hình đặt câu hỏi
|
||||
Khi AI nói cần thêm thông tin, mới mở F12 bổ sung
|
||||
Sửa code theo đề xuất
|
||||
Sau khi sửa xong kiểm tra, nếu vấn đề vẫn còn thì tiếp tục chụp màn hình đặt câu hỏi
|
||||
|
||||
## 5. Tóm tắt: Quy trình hoàn chỉnh
|
||||
|
||||
```
|
||||
Gặp vấn đề
|
||||
↓
|
||||
Mô tả trực tiếp hiện tượng + Chụp màn hình
|
||||
↓
|
||||
Gửi cho AI: "Phải làm sao?"
|
||||
↓
|
||||
AI giải quyết trực tiếp?
|
||||
↓ Có
|
||||
Làm theo AI nói
|
||||
↓
|
||||
Kiểm tra đã giải quyết chưa
|
||||
↓
|
||||
↓ Không / AI cần thêm thông tin
|
||||
Mở F12, bổ sung thông tin quan trọng
|
||||
↓
|
||||
Gửi lại cho AI
|
||||
↓
|
||||
Lặp lại cho đến khi giải quyết
|
||||
```
|
||||
@@ -0,0 +1,642 @@
|
||||
---
|
||||
title: 'Tham khảo cảm hứng cho kịch bản tiêu dùng B2C'
|
||||
description: 'Tài liệu này tổng hợp các hướng ứng dụng sáng tạo của mô hình LLM trong kịch bản tiêu dùng B2C, bao gồm lối sống, đồng hành cảm xúc, giải trí, phát triển cá nhân và tương tác xã hội, làm nguồn tham khảo cho nhà phát triển ứng dụng AI hướng tới người tiêu dùng.'
|
||||
---
|
||||
|
||||
<script setup>
|
||||
import { computed, ref } from 'vue'
|
||||
|
||||
const duration = 'khoảng <strong>4 giờ</strong>'
|
||||
|
||||
const vibePoint = ref('')
|
||||
const feeling = ref('')
|
||||
|
||||
// Nhóm chủ đề theo từng kịch bản: nhấn mạnh cảm giác, bầu không khí và gợi ý tâm lý
|
||||
const topicPool = {
|
||||
'lifestyle': [
|
||||
{ title: 'Trợ lý đánh thức bằng nghi thức buổi sáng', desc: 'Tạo nghi thức buổi sáng riêng theo thời tiết, lịch trình và tâm trạng để mỗi ngày bắt đầu thật đẹp' },
|
||||
{ title: 'Nhà thiết kế bầu không khí cho người sống một mình', desc: 'Thiết kế không gian sống cho người ở một mình với gợi ý phối hợp ánh sáng, âm nhạc và hương thơm' },
|
||||
{ title: 'Trình tạo kế hoạch chữa lành cuối tuần ở nhà', desc: 'Đề xuất combo ở nhà hoàn hảo theo tâm trạng: phim + đồ ăn vặt + bố trí không gian' },
|
||||
{ title: 'Đài phát thanh an ủi tâm hồn trước khi ngủ', desc: 'Tạo câu chuyện dịu dàng và hướng dẫn thiền như một đài riêng đồng hành vào giấc ngủ' },
|
||||
{ title: 'Bộ bắt cảm hứng thẩm mỹ đời sống', desc: 'Tìm cái đẹp trong những việc nhỏ hằng ngày, tạo gợi ý thẩm mỹ và hướng dẫn nghi thức sống' }
|
||||
],
|
||||
'emotion': [
|
||||
{ title: 'Người lắng nghe tâm sự đêm khuya', desc: 'Một nơi tiếp nhận cảm xúc trực tuyến 24 giờ, không phán xét mọi điều trong lòng' },
|
||||
{ title: 'Người đồng hành chữa lành sau chia tay', desc: 'Cung cấp sự đồng hành dịu dàng, gợi ý hồi phục và lối thoát cảm xúc trong giai đoạn thấp điểm sau chia tay' },
|
||||
{ title: 'Huấn luyện viên thở giảm lo âu', desc: 'Nhận biết cảm xúc lo âu, hướng dẫn bài tập thở và thiền chánh niệm' },
|
||||
{ title: 'Cố vấn xây dựng lại tự tin', desc: 'Giúp xây dựng lại nhận thức về bản thân và cảm giác giá trị qua đối thoại tích cực và gợi ý tâm lý' },
|
||||
{ title: 'Diễn giải thông minh nhật ký cảm xúc', desc: 'Phân tích nhật ký cảm xúc, phát hiện quy luật tâm trạng và đưa ra góc nhìn, lời khuyên ấm áp' }
|
||||
],
|
||||
'entertainment': [
|
||||
{ title: 'DM nhập vai cho trò chơi suy luận', desc: 'Đóng vai người dẫn trò, tạo bầu không khí hồi hộp và thúc đẩy cốt truyện' },
|
||||
{ title: 'NPC có linh hồn trong game thế giới mở', desc: 'NPC có cá tính, nhớ câu chuyện của người chơi và tạo liên kết cảm xúc thật' },
|
||||
{ title: 'Tạo nội dung podcast cá nhân hóa', desc: 'Tạo podcast riêng theo sở thích, tự nhiên như trò chuyện với bạn bè' },
|
||||
{ title: 'Nhóm tạo không khí cho concert ảo', desc: 'Tạo cảm giác hiện trường cho concert online với tương tác, cổ vũ và hiệu ứng không khí thời gian thực' },
|
||||
{ title: 'Bạn đồng sáng tạo tiểu thuyết tương tác', desc: 'Cùng độc giả sáng tác câu chuyện, mỗi lựa chọn đều ảnh hưởng đến hướng đi của thế giới' }
|
||||
],
|
||||
'growth': [
|
||||
{ title: 'Người chứng kiến phát triển cá nhân', desc: 'Ghi lại hành trình trưởng thành, khích lệ và nhìn lại ở các mốc quan trọng' },
|
||||
{ title: 'Huấn luyện viên game hóa thói quen', desc: 'Biến quá trình xây dựng thói quen nhàm chán thành một trò phiêu lưu thú vị' },
|
||||
{ title: 'Ghép đôi bạn học kỹ năng', desc: 'Tìm bạn học cùng chí hướng để cùng giám sát và chia sẻ tiến bộ' },
|
||||
{ title: 'Người phát hiện niềm vui nhỏ mỗi ngày', desc: 'Giúp nhận ra những điều nhỏ đẹp trong đời sống, nuôi dưỡng lòng biết ơn và thái độ tích cực' },
|
||||
{ title: 'Trình mô phỏng trải nghiệm cuộc đời', desc: 'Mô phỏng các lựa chọn cuộc đời khác nhau và trải nghiệm khả năng khác trong dòng thời gian song song' }
|
||||
],
|
||||
'social': [
|
||||
{ title: 'Trình tạo chủ đề phá băng', desc: 'Cung cấp chủ đề thú vị trong bối cảnh xã hội để giảm ngượng và kéo gần khoảng cách' },
|
||||
{ title: 'Người viết caption mạng xã hội có không khí', desc: 'Tạo caption có phong cách theo ảnh và tâm trạng' },
|
||||
{ title: 'Nhà hoạch định không khí hẹn hò', desc: 'Thiết kế trọn vẹn không khí cho buổi hẹn, từ địa điểm đến chủ đề và bất ngờ' },
|
||||
{ title: 'Người khuấy động họp mặt từ xa', desc: 'Làm không khí họp mặt online sôi nổi bằng trò chơi và hướng dẫn tương tác' },
|
||||
{ title: 'Trợ lý quản lý năng lượng xã hội', desc: 'Giúp người hướng nội quản lý năng lượng xã hội và tìm nhịp giao tiếp thoải mái' }
|
||||
],
|
||||
'creative': [
|
||||
{ title: 'Bộ sơ cứu khi cạn cảm hứng', desc: 'Cung cấp tia lửa bất ngờ khi gặp nút thắt sáng tạo' },
|
||||
{ title: 'Hướng dẫn khám phá phong cách cá nhân', desc: 'Giúp phát hiện phong cách riêng, từ ăn mặc đến biểu đạt' },
|
||||
{ title: 'Cố vấn thẩm mỹ cho sổ tay và nhật ký', desc: 'Gợi ý bố cục, phối màu và ý tưởng nội dung cho journaling' },
|
||||
{ title: 'Hướng dẫn bố cục và không khí nhiếp ảnh', desc: 'Đưa ra gợi ý chụp ảnh và chỉnh ảnh theo cảnh và cảm giác mong muốn' },
|
||||
{ title: 'Người ghép nhạc theo tâm trạng', desc: 'Đề xuất tổ hợp âm nhạc hoàn hảo theo tâm trạng và bối cảnh hiện tại' }
|
||||
],
|
||||
'travel': [
|
||||
{ title: 'Hướng dẫn dạo phố khám phá', desc: 'Khám phá thành phố như người địa phương và tìm những địa điểm ẩn thú vị' },
|
||||
{ title: 'Tạo nhật ký tâm trạng du lịch', desc: 'Chuyển ảnh và cảm xúc du lịch thành bài ký và ký ức đẹp' },
|
||||
{ title: 'Trợ lý đồng hành khi du lịch một mình', desc: 'Cung cấp đồng hành, lời khuyên và cảm giác an toàn cho người đi du lịch một mình' },
|
||||
{ title: 'Xem trước bầu không khí điểm đến', desc: 'Trải nghiệm nhập vai không khí điểm đến trước khi khởi hành' },
|
||||
{ title: 'Hướng dẫn không khí nhiếp ảnh du lịch', desc: 'Hướng dẫn chụp ảnh du lịch có câu chuyện theo cảnh và ánh sáng' }
|
||||
],
|
||||
'health': [
|
||||
{ title: 'Người đánh thức động lực vận động', desc: 'Đưa ra lời khích lệ và động lực vừa đủ khi không muốn vận động' },
|
||||
{ title: 'Căn bếp cảm hứng ăn uống lành mạnh', desc: 'Tạo công thức lành mạnh và chữa lành theo tâm trạng và nguyên liệu' },
|
||||
{ title: 'Nhà tối ưu không khí chất lượng giấc ngủ', desc: 'Tạo bầu không khí ngủ tốt toàn diện từ môi trường đến tâm lý' },
|
||||
{ title: 'Người hướng dẫn cảm nhận cơ thể', desc: 'Dẫn dắt chú ý tới tín hiệu cơ thể và xây dựng kết nối thân tâm' },
|
||||
{ title: 'Trợ lý nhắc tự chăm sóc', desc: 'Nhắc bạn dừng lại và chăm sóc bản thân trong lúc bận rộn' }
|
||||
],
|
||||
'learning': [
|
||||
{ title: 'Hướng dẫn khám phá tri thức dạng game', desc: 'Biến việc học kiến thức khô khan thành cuộc phiêu lưu khám phá thú vị' },
|
||||
{ title: 'Bạn đồng hành học ngôn ngữ theo tình huống', desc: 'Đóng vai nhiều nhân vật để tiếp thu ngôn ngữ tự nhiên qua hội thoại tình huống' },
|
||||
{ title: 'Trợ lý thỏa mãn tò mò', desc: 'Trả lời những ý nghĩ kỳ lạ và nuôi dưỡng tò mò về thế giới' },
|
||||
{ title: 'Kích hoạt cảm hứng ghi chú đọc sách', desc: 'Giúp sắp xếp cảm nhận đọc sách và tìm góc suy nghĩ mới' },
|
||||
{ title: 'Tạo không khí chia sẻ kiến thức', desc: 'Chuyển kiến thức đã học thành nội dung chia sẻ thú vị' }
|
||||
],
|
||||
'relationship': [
|
||||
{ title: 'Huấn luyện viên giao tiếp trong quan hệ thân mật', desc: 'Giúp bày tỏ cảm xúc khó nói và cải thiện quan hệ thân mật' },
|
||||
{ title: 'Trợ lý nhắc quan tâm gia đình', desc: 'Nhắc bạn quan tâm gia đình và gợi ý tương tác ấm áp' },
|
||||
{ title: 'Người tạo không khí duy trì tình bạn', desc: 'Giúp duy trì tình bạn xa cách và tạo chủ đề chung' },
|
||||
{ title: 'Nhà hoạch định tỏ tình và bất ngờ', desc: 'Lên kế hoạch cho bất ngờ và khoảnh khắc lãng mạn khó quên dành cho người quan trọng' },
|
||||
{ title: 'Hướng dẫn làm dịu xung đột', desc: 'Đưa ra lời khuyên và câu nói làm dịu không khí khi quan hệ căng thẳng' }
|
||||
],
|
||||
'pet': [
|
||||
{ title: 'Nhật ký nhân hóa thú cưng', desc: 'Tạo nhật ký từ góc nhìn thú cưng, ghi lại đời sống ấm áp với chủ' },
|
||||
{ title: 'Người giải mã hành vi thú cưng', desc: 'Diễn giải ngôn ngữ hành vi của thú cưng, tăng kết nối với thú cưng' },
|
||||
{ title: 'Nhà hoạch định thời gian bên thú cưng', desc: 'Thiết kế hoạt động sáng tạo tương tác với thú cưng để tăng gắn bó' },
|
||||
{ title: 'Tạo câu chuyện kỷ niệm thú cưng', desc: 'Chuyển ảnh và ký ức về thú cưng thành câu chuyện ấm áp' },
|
||||
{ title: 'Hướng dẫn yên tâm cho người mới nuôi thú cưng', desc: 'Cung cấp đồng hành và hướng dẫn ấm áp cho người mới nuôi thú cưng' }
|
||||
],
|
||||
'finance': [
|
||||
{ title: 'Trợ lý nhận biết cảm xúc tiêu dùng', desc: 'Nhận ra cảm xúc phía sau mua sắm bốc đồng và xây dựng quan điểm tiêu dùng lành mạnh' },
|
||||
{ title: 'Động lực trực quan hóa mục tiêu tiết kiệm', desc: 'Chuyển mục tiêu tiết kiệm thành tiến độ giấc mơ có thể nhìn thấy' },
|
||||
{ title: 'Học tài chính cá nhân nhẹ nhàng', desc: 'Học kiến thức tài chính bằng cách nhẹ nhàng và thú vị' },
|
||||
{ title: 'Người làm dịu lo âu tài chính', desc: 'Cung cấp hỗ trợ cảm xúc và lời khuyên thực tế khi đối mặt áp lực tài chính' },
|
||||
{ title: 'Trò chơi trải nghiệm đầu tư nhỏ', desc: 'Trải nghiệm đầu tư theo cách game hóa, giảm rào cản nhập môn' }
|
||||
],
|
||||
'career': [
|
||||
{ title: 'Người đồng hành khi mơ hồ nghề nghiệp', desc: 'Lắng nghe, cùng khám phá và gợi ý hướng đi trong giai đoạn mơ hồ nghề nghiệp' },
|
||||
{ title: 'Người đánh thức cảm giác thành tựu trong công việc', desc: 'Giúp phát hiện giá trị và ý nghĩa trong công việc, thắp lại nhiệt huyết' },
|
||||
{ title: 'Trợ lý không khí xã giao nơi làm việc', desc: 'Cung cấp chủ đề nhẹ nhàng và gợi ý tương tác cho giao tiếp công sở' },
|
||||
{ title: 'Bộ kích hoạt cảm hứng nghề phụ', desc: 'Kích hoạt ý tưởng nghề phụ theo sở thích và kỹ năng cá nhân' },
|
||||
{ title: 'Trạm tiếp sức tự tin trước phỏng vấn', desc: 'Cung cấp chuẩn bị tâm lý và khích lệ tự tin trước phỏng vấn' }
|
||||
],
|
||||
'home': [
|
||||
{ title: 'Nhà thiết kế không khí không gian nhà ở', desc: 'Thiết kế bầu không khí nhà ở theo tâm trạng và mùa' },
|
||||
{ title: 'Hướng dẫn thay đổi nhà cửa bốn mùa', desc: 'Thay đổi bố trí nhà theo mùa để giữ cảm giác mới mẻ' },
|
||||
{ title: 'Phép màu cho căn hộ nhỏ', desc: 'Làm cho không gian nhỏ cũng có bầu không khí thoải mái và ấm áp' },
|
||||
{ title: 'Người tạo nghi thức trong nhà', desc: 'Tạo cảm giác nghi thức cho hoạt động hằng ngày tại nhà' },
|
||||
{ title: 'Đồng hành tâm lý khi declutter', desc: 'Cung cấp hỗ trợ tâm lý và gợi ý quyết định khi sắp xếp đồ đạc' }
|
||||
],
|
||||
'food': [
|
||||
{ title: 'Món ăn chữa lành cho một người', desc: 'Thiết kế món ăn đơn giản và chữa lành cho người sống một mình' },
|
||||
{ title: 'Thiết kế không khí bàn ăn ngày lễ', desc: 'Thiết kế bố trí bàn ăn có nghi thức cho những ngày đặc biệt' },
|
||||
{ title: 'Người ghép món ăn theo tâm trạng', desc: 'Đề xuất món ăn và cách nấu phù hợp theo tâm trạng hiện tại' },
|
||||
{ title: 'Xây dựng tự tin cho người mới vào bếp', desc: 'Cung cấp khích lệ ấm áp và công thức đơn giản cho người bắt đầu từ con số không' },
|
||||
{ title: 'Hướng dẫn không khí chụp ảnh món ăn', desc: 'Giúp món ăn gia đình cũng có thể được chụp thật hấp dẫn' }
|
||||
],
|
||||
'fashion': [
|
||||
{ title: 'Moodboard trang phục hôm nay', desc: 'Tạo cảm hứng phối đồ theo thời tiết, dịp và tâm trạng' },
|
||||
{ title: 'Stylist tủ đồ capsule', desc: 'Tạo vô số khả năng phối đồ từ số lượng món đồ hữu hạn' },
|
||||
{ title: 'Hành trình khám phá phong cách cá nhân', desc: 'Giúp phát hiện và xây dựng phong cách cá nhân độc đáo' },
|
||||
{ title: 'Nhà sáng tạo phối mới đồ cũ', desc: 'Cung cấp cảm hứng phối đồ mới cho quần áo cũ' },
|
||||
{ title: 'Cố vấn tạo hình dịp đặc biệt', desc: 'Thiết kế diện mạo giúp tự tin cho dịp quan trọng' }
|
||||
]
|
||||
}
|
||||
|
||||
// Bảng ánh xạ đề xuất định sẵn dựa trên bầu không khí và cảm giác
|
||||
const recommendationMap = {
|
||||
// Bầu không khí: chữa lành
|
||||
'healing': {
|
||||
'relax': ['emotion', 'lifestyle', 'health', 'home'],
|
||||
'inspire': ['creative', 'growth', 'learning', 'entertainment'],
|
||||
'connect': ['relationship', 'social', 'pet', 'emotion'],
|
||||
'escape': ['travel', 'entertainment', 'creative', 'lifestyle']
|
||||
},
|
||||
// Bầu không khí: phát triển
|
||||
'growth': {
|
||||
'relax': ['growth', 'learning', 'creative', 'health'],
|
||||
'inspire': ['career', 'learning', 'creative', 'growth'],
|
||||
'connect': ['social', 'relationship', 'career', 'learning'],
|
||||
'escape': ['travel', 'entertainment', 'creative', 'lifestyle']
|
||||
},
|
||||
// Bầu không khí: xã hội
|
||||
'social': {
|
||||
'relax': ['social', 'pet', 'food', 'home'],
|
||||
'inspire': ['social', 'creative', 'entertainment', 'travel'],
|
||||
'connect': ['relationship', 'social', 'pet', 'travel'],
|
||||
'escape': ['social', 'travel', 'entertainment', 'creative']
|
||||
},
|
||||
// Bầu không khí: khám phá
|
||||
'explore': {
|
||||
'relax': ['travel', 'creative', 'lifestyle', 'food'],
|
||||
'inspire': ['travel', 'creative', 'learning', 'entertainment'],
|
||||
'connect': ['travel', 'social', 'relationship', 'pet'],
|
||||
'escape': ['travel', 'entertainment', 'creative', 'lifestyle']
|
||||
},
|
||||
// Bầu không khí: đời thường
|
||||
'daily': {
|
||||
'relax': ['lifestyle', 'home', 'health', 'emotion'],
|
||||
'inspire': ['creative', 'food', 'fashion', 'home'],
|
||||
'connect': ['relationship', 'social', 'pet', 'lifestyle'],
|
||||
'escape': ['entertainment', 'creative', 'travel', 'lifestyle']
|
||||
}
|
||||
}
|
||||
|
||||
const vibeOptions = [
|
||||
{ label: 'Chữa lành', value: 'healing', desc: 'Ấm áp, xoa dịu, hồi phục' },
|
||||
{ label: 'Phát triển', value: 'growth', desc: 'Tiến bộ, đột phá, chuyển hóa' },
|
||||
{ label: 'Xã hội', value: 'social', desc: 'Kết nối, chia sẻ, tương tác' },
|
||||
{ label: 'Khám phá', value: 'explore', desc: 'Tò mò, phiêu lưu, phát hiện' },
|
||||
{ label: 'Đời thường', value: 'daily', desc: 'Bình dị, chân thật, hiện tại' }
|
||||
]
|
||||
|
||||
const feelingOptions = [
|
||||
{ label: 'Muốn thư giãn', value: 'relax', desc: 'Giảm áp lực, thả lỏng bản thân' },
|
||||
{ label: 'Tìm cảm hứng', value: 'inspire', desc: 'Kích hoạt sáng tạo, nhận gợi mở' },
|
||||
{ label: 'Khao khát kết nối', value: 'connect', desc: 'Kết nối với con người, cộng hưởng cảm xúc' },
|
||||
{ label: 'Tạm thời thoát ra', value: 'escape', desc: 'Rời thực tại, trải nghiệm nhập vai' }
|
||||
]
|
||||
|
||||
const scenarios = [
|
||||
{ key: 'lifestyle', name: 'Lối sống', anchor: '#_1-lối-sống' },
|
||||
{ key: 'emotion', name: 'Đồng hành cảm xúc', anchor: '#_2-đồng-hành-cảm-xúc' },
|
||||
{ key: 'entertainment', name: 'Giải trí thư giãn', anchor: '#_3-giải-trí-thư-giãn' },
|
||||
{ key: 'growth', name: 'Phát triển cá nhân', anchor: '#_4-phát-triển-cá-nhân' },
|
||||
{ key: 'social', name: 'Tương tác xã hội', anchor: '#_5-tương-tác-xã-hội' },
|
||||
{ key: 'creative', name: 'Biểu đạt sáng tạo', anchor: '#_6-biểu-đạt-sáng-tạo' },
|
||||
{ key: 'travel', name: 'Khám phá du lịch', anchor: '#_7-khám-phá-du-lịch' },
|
||||
{ key: 'health', name: 'Sức khỏe thân tâm', anchor: '#_8-sức-khỏe-thân-tâm' },
|
||||
{ key: 'learning', name: 'Khám phá tri thức', anchor: '#_9-khám-phá-tri-thức' },
|
||||
{ key: 'relationship', name: 'Nuôi dưỡng quan hệ', anchor: '#_10-nuôi-dưỡng-quan-hệ' },
|
||||
{ key: 'pet', name: 'Đồng hành thú cưng', anchor: '#_11-đồng-hành-thú-cưng' },
|
||||
{ key: 'finance', name: 'Sức khỏe tài chính', anchor: '#_12-sức-khỏe-tài-chính' },
|
||||
{ key: 'career', name: 'Phát triển nghề nghiệp', anchor: '#_13-phát-triển-nghề-nghiệp' },
|
||||
{ key: 'home', name: 'Không gian nhà ở', anchor: '#_14-không-gian-nhà-ở' },
|
||||
{ key: 'food', name: 'Ẩm thực nấu nướng', anchor: '#_15-ẩm-thực-nấu-nướng' },
|
||||
{ key: 'fashion', name: 'Phong cách ăn mặc', anchor: '#_16-phong-cách-ăn-mặc' }
|
||||
]
|
||||
|
||||
// Tính kết quả đề xuất: lấy ngẫu nhiên từ nhóm chủ đề
|
||||
const recommendationTopics = computed(() => {
|
||||
if (!vibePoint.value || !feeling.value) return []
|
||||
|
||||
const keys = recommendationMap[vibePoint.value]?.[feeling.value] || []
|
||||
const topics = []
|
||||
|
||||
// Lấy ngẫu nhiên 1-2 chủ đề từ mỗi kịch bản được đề xuất
|
||||
keys.forEach(key => {
|
||||
const scenario = scenarios.find(item => item.key === key)
|
||||
const scenarioTopics = topicPool[key] || []
|
||||
|
||||
if (scenario && scenarioTopics.length > 0) {
|
||||
// Lấy ngẫu nhiên 1-2 chủ đề
|
||||
const count = Math.floor(Math.random() * 2) + 1
|
||||
const shuffled = [...scenarioTopics].sort(() => Math.random() - 0.5)
|
||||
const selected = shuffled.slice(0, Math.min(count, shuffled.length))
|
||||
|
||||
selected.forEach(topic => {
|
||||
topics.push({
|
||||
...topic,
|
||||
scenarioKey: key,
|
||||
scenarioName: scenario.name,
|
||||
scenarioAnchor: scenario.anchor
|
||||
})
|
||||
})
|
||||
}
|
||||
})
|
||||
|
||||
// Sắp xếp ngẫu nhiên và giới hạn tổng số
|
||||
return topics.sort(() => Math.random() - 0.5).slice(0, 8)
|
||||
})
|
||||
|
||||
// Lấy mô tả của lựa chọn hiện tại
|
||||
const currentSelection = computed(() => {
|
||||
const vibe = vibeOptions.find(i => i.value === vibePoint.value)
|
||||
const feel = feelingOptions.find(p => p.value === feeling.value)
|
||||
return {
|
||||
vibe: vibe?.label || '',
|
||||
feeling: feel?.label || ''
|
||||
}
|
||||
})
|
||||
|
||||
const scrollToAnchor = (anchor) => {
|
||||
// Trì hoãn cuộn để đảm bảo DOM đã cập nhật
|
||||
setTimeout(() => {
|
||||
// Thử tìm bằng ID (hỗ trợ nhiều định dạng)
|
||||
let element = document.querySelector(anchor)
|
||||
|
||||
// Nếu không tìm thấy, thử định dạng ID khác
|
||||
if (!element) {
|
||||
// Thử bỏ tiền tố gạch dưới
|
||||
const altAnchor = anchor.replace('#_', '#')
|
||||
element = document.querySelector(altAnchor)
|
||||
}
|
||||
|
||||
// Nếu vẫn không tìm thấy, tìm theo văn bản tiêu đề
|
||||
if (!element) {
|
||||
// Trích tên kịch bản từ anchor
|
||||
const anchorText = decodeURIComponent(anchor.replace('#', '').replace(/^_/, ''))
|
||||
const headings = document.querySelectorAll('h2, h3')
|
||||
|
||||
for (let heading of headings) {
|
||||
const headingText = heading.textContent.trim()
|
||||
// Khớp chính xác hoặc khớp bao gồm
|
||||
const cleanHeading = headingText.replace(/^\d+\.\s*/, '')
|
||||
if (cleanHeading === anchorText || headingText.includes(anchorText)) {
|
||||
element = heading
|
||||
break
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (element) {
|
||||
element.scrollIntoView({
|
||||
behavior: 'smooth',
|
||||
block: 'start'
|
||||
})
|
||||
// Làm nổi bật đoạn mục tiêu
|
||||
element.style.backgroundColor = '#fdf2f8'
|
||||
element.style.transition = 'background-color 0.3s'
|
||||
element.style.padding = '8px'
|
||||
element.style.borderRadius = '4px'
|
||||
setTimeout(() => {
|
||||
element.style.backgroundColor = ''
|
||||
element.style.padding = ''
|
||||
}, 2000)
|
||||
}
|
||||
}, 100)
|
||||
}
|
||||
|
||||
const resetSelection = () => {
|
||||
vibePoint.value = ''
|
||||
feeling.value = ''
|
||||
}
|
||||
</script>
|
||||
|
||||
# Tham khảo cảm hứng cho kịch bản tiêu dùng B2C
|
||||
|
||||
## Dẫn nhập chương
|
||||
|
||||
<ChapterIntroduction :duration="duration" :tags="['Ứng dụng B2C', 'Lối sống', 'Trải nghiệm cảm xúc', 'Tạo bầu không khí']" coreOutput="Khám phá hơn 15 cảm hứng kịch bản đời sống" expectedOutput="Tìm hướng sản phẩm chạm tới người dùng">
|
||||
|
||||
Tài liệu này tổng hợp <strong>các hướng ứng dụng sáng tạo của mô hình LLM trong kịch bản tiêu dùng B2C</strong>. Khác với sản phẩm B2B tập trung vào hiệu suất và điểm đau, sản phẩm B2C chú trọng hơn đến <strong>tạo cảm giác, gợi ý tâm lý và bầu không khí</strong>, để người dùng có cộng hưởng cảm xúc và trải nghiệm tốt đẹp trong quá trình sử dụng.
|
||||
|
||||
</ChapterIntroduction>
|
||||
|
||||
## Chọn nhanh bầu không khí kịch bản
|
||||
|
||||
<el-card shadow="hover" style="margin-top: 16px; margin-bottom: 24px; border-left: 5px solid #ec4899;">
|
||||
<div style="font-weight: 600; margin-bottom: 8px;">Tìm cảm hứng kịch bản chạm tới bạn</div>
|
||||
<div style="color: #606266; font-size: 14px; line-height: 1.6; margin-bottom: 12px;">
|
||||
Chọn bầu không khí bạn muốn và cảm giác hiện tại. Hệ thống sẽ đề xuất các hướng kịch bản liên quan; bấm vào thẻ để nhảy tới phần tương ứng.
|
||||
</div>
|
||||
<el-row :gutter="16">
|
||||
<el-col :span="12">
|
||||
<el-select v-model="vibePoint" placeholder="Chọn loại bầu không khí" style="width: 100%;">
|
||||
<el-option
|
||||
v-for="item in vibeOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
>
|
||||
<div style="font-weight: 500;">{{ item.label }}</div>
|
||||
<div style="font-size: 12px; color: #909399;">{{ item.desc }}</div>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-select v-model="feeling" placeholder="Chọn cảm giác hiện tại" style="width: 100%;">
|
||||
<el-option
|
||||
v-for="item in feelingOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
>
|
||||
<div style="font-weight: 500;">{{ item.label }}</div>
|
||||
<div style="font-size: 12px; color: #909399;">{{ item.desc }}</div>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<div v-if="recommendationTopics.length > 0" style="margin-top: 16px;">
|
||||
<div style="font-weight: 600; margin-bottom: 12px; color: #ec4899;">
|
||||
Kịch bản {{ currentSelection.vibe }} × {{ currentSelection.feeling }} được đề xuất cho bạn:
|
||||
</div>
|
||||
<div style="display: flex; flex-wrap: wrap; gap: 8px;">
|
||||
<el-tag
|
||||
v-for="topic in recommendationTopics"
|
||||
:key="topic.title"
|
||||
type="danger"
|
||||
effect="light"
|
||||
style="cursor: pointer; margin-bottom: 4px;"
|
||||
@click="scrollToAnchor(topic.scenarioAnchor)"
|
||||
>
|
||||
{{ topic.title }}
|
||||
</el-tag>
|
||||
</div>
|
||||
<el-button type="text" size="small" @click="resetSelection" style="margin-top: 8px;">
|
||||
Chọn lại
|
||||
</el-button>
|
||||
</div>
|
||||
</el-card>
|
||||
|
||||
---
|
||||
|
||||
## 1. Lối sống
|
||||
|
||||
> 💡 **Ý tưởng cốt lõi**: biến đời thường thành trải nghiệm có nghi thức, tạo cái đẹp trong từng chi tiết
|
||||
|
||||
| STT | Tên kịch bản ứng dụng | Chức năng kịch bản ứng dụng |
|
||||
| :--: | ------------ | ------------ |
|
||||
| 1 | Trợ lý đánh thức bằng nghi thức buổi sáng | Tích hợp API thời tiết và dữ liệu lịch; LLM tạo kế hoạch buổi sáng cá nhân hóa; kết hợp loa thông minh phát nhạc riêng và đèn thông minh sáng dần |
|
||||
| 2 | Nhà tạo không khí cho người sống một mình | Kết nối thiết bị nhà thông minh (đèn, loa, máy khuếch tán hương); LLM tự điều chỉnh theo thời gian/tâm trạng; học sở thích người dùng để tối ưu liên tục |
|
||||
| 3 | Trình tạo kế hoạch chữa lành cuối tuần ở nhà | Kết nối API nền tảng streaming để lấy danh sách phim, kết hợp lịch sử sở thích để tạo combo phim + món ăn + bố trí không gian |
|
||||
| 4 | Đài phát thanh an ủi trước khi ngủ | Tạo câu chuyện dịu dàng bằng TTS, trộn white noise, giảm âm lượng thông minh; điều chỉnh nội dung theo dữ liệu giấc ngủ |
|
||||
| 5 | Bộ bắt cảm hứng thẩm mỹ đời sống | Dùng nhận diện hình ảnh phân tích ảnh môi trường của người dùng, LLM tạo gợi ý thẩm mỹ; đề xuất nội dung theo phong cách Pinterest/Xiaohongshu |
|
||||
|
||||
---
|
||||
|
||||
## 2. Đồng hành cảm xúc
|
||||
|
||||
> 💡 **Ý tưởng cốt lõi**: tiếp nhận và đồng hành vô điều kiện, trở thành chiếc bình dịu dàng chứa cảm xúc
|
||||
|
||||
| STT | Tên kịch bản ứng dụng | Chức năng kịch bản ứng dụng |
|
||||
| :--: | ------------ | ------------ |
|
||||
| 1 | Người lắng nghe tâm sự đêm khuya | Mã hóa đầu cuối bảo vệ quyền riêng tư; phân tích cảm xúc bằng LLM để hiểu tâm trạng; bộ nhớ dài hạn lưu câu chuyện người dùng và đồng hành qua nhiều lượt đối thoại |
|
||||
| 2 | Người đồng hành chữa lành sau chia tay | Thuật toán nhận diện giai đoạn cảm xúc, cung cấp hỗ trợ theo từng giai đoạn (tâm sự -> xả cảm xúc -> tái xây dựng); truy xuất RAG từ kho tri thức tâm lý học |
|
||||
| 3 | Huấn luyện viên thở giảm lo âu | Kết nối dữ liệu cảm biến sinh học (nhịp tim/hơi thở), giám sát mức lo âu theo thời gian thực; giọng nói hướng dẫn nhịp thở và thư giãn cơ tiến triển |
|
||||
| 4 | Cố vấn xây dựng lại tự tin | Khung đối thoại tâm lý học tích cực, ghi nhận và phản hồi các thành tựu nhỏ; kỹ thuật tái cấu trúc nhận thức giúp thay đổi tự thoại tiêu cực |
|
||||
| 5 | Diễn giải thông minh nhật ký cảm xúc | Mô hình NLP nhận diện cảm xúc, phân tích chuỗi thời gian để phát hiện quy luật tâm trạng; trực quan hóa bản đồ cảm xúc và cảnh báo dự đoán |
|
||||
|
||||
---
|
||||
|
||||
## 3. Giải trí thư giãn
|
||||
|
||||
> 💡 **Ý tưởng cốt lõi**: tạo trải nghiệm nhập vai, để giải trí trở thành nơi tâm hồn nghỉ chân
|
||||
|
||||
| STT | Tên kịch bản ứng dụng | Chức năng kịch bản ứng dụng |
|
||||
| :--: | ------------ | ------------ |
|
||||
| 1 | DM nhập vai cho trò chơi suy luận | LLM tạo nhánh cốt truyện theo thời gian thực, tổng hợp giọng nói để đóng vai NPC, điều chỉnh độ khó và nhịp theo phản ứng người chơi; dựng cảnh AR/VR |
|
||||
| 2 | NPC có linh hồn trong game thế giới mở | Cơ sở dữ liệu bộ nhớ dài hạn lưu lịch sử tương tác của người chơi, LLM tạo hội thoại cá nhân hóa; tính toán cảm xúc giúp NPC có phản ứng cảm xúc thật |
|
||||
| 3 | Tạo nội dung podcast cá nhân hóa | Tạo nội dung riêng theo biểu đồ sở thích người dùng, TTS sao chép giọng người dùng thích; tương tác thời gian thực để trả lời câu hỏi người nghe |
|
||||
| 4 | Nhóm tạo không khí cho concert ảo | Render nhân vật ảo, tương tác bình luận thời gian thực, lightstick/đạo cụ cổ vũ ảo; âm thanh không gian tạo cảm giác hiện trường |
|
||||
| 5 | Bạn đồng sáng tạo tiểu thuyết tương tác | LLM tạo cốt truyện theo thời gian thực, lựa chọn người dùng ảnh hưởng hướng đi câu chuyện; thiết kế nhiều kết thúc và phát triển quan hệ nhân vật động |
|
||||
|
||||
---
|
||||
|
||||
## 4. Phát triển cá nhân
|
||||
|
||||
> 💡 **Ý tưởng cốt lõi**: trưởng thành không phải khổ hạnh, mà là hành trình tự khám phá thú vị
|
||||
|
||||
| STT | Tên kịch bản ứng dụng | Chức năng kịch bản ứng dụng |
|
||||
| :--: | ------------ | ------------ |
|
||||
| 1 | Người chứng kiến phát triển cá nhân | Trực quan hóa hành trình trưởng thành bằng timeline, tự động đánh dấu cột mốc; ảnh so sánh hiển thị "tôi ngày trước" và "tôi hiện tại" |
|
||||
| 2 | Huấn luyện viên game hóa thói quen | Cơ chế game hóa (điểm kinh nghiệm, cấp độ, huy hiệu), bảng xếp hạng xã hội, AI coach nhập vai như "cố vấn phiêu lưu" |
|
||||
| 3 | Ghép đôi bạn học kỹ năng | Thuật toán ghép đôi theo sở thích và mục tiêu học tập, cộng đồng nhóm học, cơ chế check-in giám sát lẫn nhau |
|
||||
| 4 | Người phát hiện niềm vui nhỏ mỗi ngày | Nhận diện hình ảnh để phát hiện khoảnh khắc đẹp trong đời sống, hướng dẫn gratitude journal, nhìn lại khoảnh khắc đẹp mỗi tuần |
|
||||
| 5 | Trình trải nghiệm mô phỏng cuộc đời | Cốt truyện nhiều nhánh mô phỏng kết quả của lựa chọn khác nhau, so sánh cuộc đời song song; trực quan hóa hệ quả quyết định |
|
||||
|
||||
---
|
||||
|
||||
## 5. Tương tác xã hội
|
||||
|
||||
> 💡 **Ý tưởng cốt lõi**: làm giao tiếp trở nên nhẹ nhàng tự nhiên, tìm cách kết nối thoải mái
|
||||
|
||||
| STT | Tên kịch bản ứng dụng | Chức năng kịch bản ứng dụng |
|
||||
| :--: | ------------ | ------------ |
|
||||
| 1 | Trình tạo chủ đề phá băng | Đề xuất chủ đề thông minh theo dịp và người tham gia, phân tích hội thoại thời gian thực để gợi ý nối tiếp; nhắc cứu nguy lúc ngượng |
|
||||
| 2 | Người tạo không khí caption mạng xã hội | Phân tích nội dung ảnh, LLM tạo caption nhiều phong cách (văn nghệ/hài hước/sâu lắng); đề xuất emoji và bố cục thông minh |
|
||||
| 3 | Nhà hoạch định không khí hẹn hò | Tạo kế hoạch hẹn hò theo sở thích hai bên, đề xuất nhà hàng/hoạt động, gợi ý chủ đề trò chuyện; nhắc thời tiết và giao thông thời gian thực |
|
||||
| 4 | Người khuấy động họp mặt từ xa | Thư viện game online, trình tạo hoạt động phá băng, vòng quay chủ đề; nền ảo và filter tăng không khí |
|
||||
| 5 | Trợ lý quản lý năng lượng xã hội | Đánh giá mức tiêu hao năng lượng sau hoạt động xã hội, gợi ý phục hồi (hoạt động một mình); lập kế hoạch lịch xã hội thông minh |
|
||||
|
||||
---
|
||||
|
||||
## 6. Biểu đạt sáng tạo
|
||||
|
||||
> 💡 **Ý tưởng cốt lõi**: ai cũng có năng lực sáng tạo, chỉ cần được đánh thức
|
||||
|
||||
| STT | Tên kịch bản ứng dụng | Chức năng kịch bản ứng dụng |
|
||||
| :--: | ------------ | ------------ |
|
||||
| 1 | Bộ sơ cứu khi cạn cảm hứng | Thuật toán liên tưởng liên lĩnh vực, tạo từ kích thích ngẫu nhiên, thư viện prompt sáng tạo; công cụ mở rộng ý tưởng dạng mind map |
|
||||
| 2 | Hướng dẫn khám phá phong cách cá nhân | Phân tích hình ảnh để nhận diện phong cách hiện có, đề xuất xu hướng phong cách, thử đồ/trang điểm ảo; timeline tiến hóa phong cách |
|
||||
| 3 | Cố vấn thẩm mỹ cho sổ tay và nhật ký | Đề xuất mẫu bố cục, tạo phối màu, gợi ý yếu tố trang trí; nhận dạng chữ viết tay và làm đẹp nội dung |
|
||||
| 4 | Hướng dẫn bố cục và không khí nhiếp ảnh | Nhận diện cảnh và gợi ý bố cục, đề xuất phong cách filter, tự điều chỉnh tham số chỉnh ảnh; lộ trình học kỹ thuật nhiếp ảnh |
|
||||
| 5 | Người ghép nhạc theo tâm trạng | Thuật toán phân tích cảm xúc âm nhạc, nhận diện tâm trạng người dùng, tạo playlist cá nhân hóa; giới thiệu câu chuyện và bối cảnh âm nhạc |
|
||||
|
||||
---
|
||||
|
||||
## 7. Khám phá du lịch
|
||||
|
||||
> 💡 **Ý tưởng cốt lõi**: du lịch không chỉ là ngắm cảnh, mà còn là cảm nhận những lối sống khác nhau
|
||||
|
||||
| STT | Tên kịch bản ứng dụng | Chức năng kịch bản ứng dụng |
|
||||
| :--: | ------------ | ------------ |
|
||||
| 1 | Hướng dẫn dạo phố khám phá | Tổng hợp nội dung từ người địa phương am hiểu, đề xuất địa điểm ít người biết, chỉ dẫn AR; dịch thời gian thực và thuyết minh giọng nói |
|
||||
| 2 | Tạo nhật ký tâm trạng du lịch | Tự phân loại và chọn ảnh, LLM tạo bài du ký đẹp, timeline gắn vị trí địa lý; tạo video du lịch một chạm |
|
||||
| 3 | Trợ lý đồng hành du lịch một mình | Chia sẻ vị trí và nhắc an toàn theo thời gian thực, liên hệ khẩn cấp địa phương, AI hướng dẫn viên đồng hành bằng giọng nói; cộng đồng người đi một mình |
|
||||
| 4 | Xem trước bầu không khí điểm đến | Xem trước VR/360°, mô phỏng âm thanh và mùi địa phương, giới thiệu bối cảnh văn hóa; trải nghiệm "ở thử" ảo |
|
||||
| 5 | Hướng dẫn không khí nhiếp ảnh du lịch | Nhắc golden hour, đường hỗ trợ bố cục, đề xuất điểm chụp đặc trưng địa phương; gợi ý phong cách chỉnh màu hậu kỳ |
|
||||
|
||||
---
|
||||
|
||||
## 8. Sức khỏe thân tâm
|
||||
|
||||
> 💡 **Ý tưởng cốt lõi**: sức khỏe không phải mục tiêu, mà là một cách tự chăm sóc dịu dàng
|
||||
|
||||
| STT | Tên kịch bản ứng dụng | Chức năng kịch bản ứng dụng |
|
||||
| :--: | ------------ | ------------ |
|
||||
| 1 | Người đánh thức động lực vận động | Đề xuất loại vận động thông minh theo trạng thái người dùng, lựa chọn micro workout 5 phút, thử thách vận động game hóa; check-in vận động xã hội |
|
||||
| 2 | Căn bếp cảm hứng ăn uống lành mạnh | Nhận diện nguyên liệu trong tủ lạnh, đề xuất công thức cá nhân hóa, phân tích phối hợp dinh dưỡng; hướng dẫn nấu ăn step-by-step |
|
||||
| 3 | Nhà tối ưu không khí chất lượng giấc ngủ | Phân tích dữ liệu theo dõi giấc ngủ, tạo nghi thức trước khi ngủ, gợi ý tối ưu môi trường (nhiệt độ/độ ẩm/ánh sáng); đánh thức thông minh |
|
||||
| 4 | Người hướng dẫn cảm nhận cơ thể | Hướng dẫn thiền quét cơ thể, liên kết bộ phận cơ thể với cảm xúc, bài tập kết nối thân tâm; trực quan hóa biofeedback |
|
||||
| 5 | Trợ lý nhắc tự chăm sóc | Theo dõi cường độ làm việc, nhắc nghỉ ngơi định kỳ, gợi ý hoạt động tự chăm sóc nhỏ (uống nước/giãn cơ/hít thở sâu); ghi chép tự chăm sóc |
|
||||
|
||||
---
|
||||
|
||||
## 9. Khám phá tri thức
|
||||
|
||||
> 💡 **Ý tưởng cốt lõi**: học tập là cuộc phiêu lưu không có điểm dừng, tò mò là người thầy tốt nhất
|
||||
|
||||
| STT | Tên kịch bản ứng dụng | Chức năng kịch bản ứng dụng |
|
||||
| :--: | ------------ | ------------ |
|
||||
| 1 | Hướng dẫn khám phá tri thức dạng game | Trực quan hóa bản đồ điểm kiến thức, lộ trình học theo màn chơi, hệ thống huy hiệu thành tựu; AI mentor nhập vai |
|
||||
| 2 | Bạn đồng hành học ngôn ngữ theo tình huống | LLM đóng vai nhiều nhân vật để hội thoại, sửa phát âm, giới thiệu bối cảnh văn hóa; mô phỏng tình huống nhập vai |
|
||||
| 3 | Trợ lý thỏa mãn tò mò | Kết nối Wikipedia/knowledge graph, giải thích khái niệm phức tạp theo cách dễ hiểu, đề xuất kiến thức liên quan; ghi lại tò mò |
|
||||
| 4 | Kích hoạt cảm hứng ghi chú đọc sách | Phân tích nội dung sách, trích xuất và liên kết quan điểm, đề xuất góc suy nghĩ; mẫu ghi chú đọc sách và làm đẹp |
|
||||
| 5 | Tạo không khí chia sẻ kiến thức | Tự tạo thẻ kiến thức, tối ưu copy chia sẻ, làm đẹp thị giác; phản hồi dữ liệu chia sẻ xã hội |
|
||||
|
||||
---
|
||||
|
||||
## 10. Nuôi dưỡng quan hệ
|
||||
|
||||
> 💡 **Ý tưởng cốt lõi**: quan hệ tốt cần được chăm chút, nhưng chăm chút không cần quá phức tạp
|
||||
|
||||
| STT | Tên kịch bản ứng dụng | Chức năng kịch bản ứng dụng |
|
||||
| :--: | ------------ | ------------ |
|
||||
| 1 | Huấn luyện viên giao tiếp trong quan hệ thân mật | Tạo mẫu biểu đạt cảm xúc, hướng dẫn kỹ năng giao tiếp phi bạo lực, câu nói hóa giải xung đột; đánh giá sức khỏe quan hệ |
|
||||
| 2 | Trợ lý nhắc quan tâm gia đình | Nhắc ngày quan trọng (sinh nhật/kỷ niệm), gợi ý lời quan tâm, đề xuất hoạt động gia đình; tạo album gia đình |
|
||||
| 3 | Người tạo không khí duy trì tình bạn | Ghi lại tương tác với bạn bè, đề xuất chủ đề chung, tổ chức họp mặt từ xa; tạo timeline tình bạn và ký ức |
|
||||
| 4 | Nhà hoạch định tỏ tình và bất ngờ | Tạo phương án bất ngờ cá nhân hóa, đề xuất quà tặng, gợi ý lời nói lãng mạn; lịch thực hiện và nhắc nhở |
|
||||
| 5 | Hướng dẫn làm dịu xung đột | Câu nói hạ nhiệt cảm xúc, hướng dẫn đổi góc nhìn, gợi ý bước hòa giải; theo dõi quá trình sửa chữa quan hệ |
|
||||
|
||||
---
|
||||
|
||||
## 11. Đồng hành thú cưng
|
||||
|
||||
> 💡 **Ý tưởng cốt lõi**: thú cưng là gia đình, sự đồng hành của chúng đáng được ghi lại và trân trọng
|
||||
|
||||
| STT | Tên kịch bản ứng dụng | Chức năng kịch bản ứng dụng |
|
||||
| :--: | ------------ | ------------ |
|
||||
| 1 | Nhật ký nhân hóa thú cưng | Phân tích hành vi thú cưng, tạo nhật ký ngôi thứ nhất, tự ghép ảnh; "vòng bạn bè" của thú cưng |
|
||||
| 2 | Người giải mã hành vi thú cưng | Phân tích video hành vi thú cưng, cảnh báo sức khỏe, gợi ý huấn luyện; kho tri thức đặc tính giống loài |
|
||||
| 3 | Nhà hoạch định thời gian bên thú cưng | Đề xuất hoạt động cho thú cưng, hướng dẫn DIY đồ chơi, gợi ý địa điểm thân thiện với thú cưng; ghép đôi xã hội cho thú cưng |
|
||||
| 4 | Tạo câu chuyện kỷ niệm thú cưng | Chọn ảnh và video, tạo câu chuyện theo timeline, phối nhạc; tự tạo album/video kỷ niệm |
|
||||
| 5 | Hướng dẫn yên tâm cho người mới nuôi thú cưng | Hướng dẫn chăm sóc theo giai đoạn, trả lời câu hỏi thường gặp, xử lý tình huống khẩn cấp; hỗ trợ cộng đồng người mới |
|
||||
|
||||
---
|
||||
|
||||
## 12. Sức khỏe tài chính
|
||||
|
||||
> 💡 **Ý tưởng cốt lõi**: tự do tài chính không phải mục tiêu duy nhất, sức khỏe tài chính mới là điều cần giữ
|
||||
|
||||
| STT | Tên kịch bản ứng dụng | Chức năng kịch bản ứng dụng |
|
||||
| :--: | ------------ | ------------ |
|
||||
| 1 | Trợ lý nhận biết cảm xúc tiêu dùng | Phân tích ghi chép tiêu dùng, phân tích liên hệ cảm xúc-tiêu dùng, cảnh báo mua sắm bốc đồng; gợi ý thỏa mãn thay thế |
|
||||
| 2 | Động lực trực quan hóa mục tiêu tiết kiệm | Trực quan hóa tiến độ mục tiêu, render bối cảnh giấc mơ, ăn mừng cột mốc; trò chơi xây dựng thói quen tiết kiệm |
|
||||
| 3 | Học tài chính cá nhân nhẹ nhàng | Đẩy kiến thức dạng mảnh nhỏ, dạy bằng tình huống và case, hỏi đáp tương tác; kiểm tra kiến thức và chứng nhận |
|
||||
| 4 | Người làm dịu lo âu tài chính | Đánh giá sức khỏe tình trạng tài chính, kỹ thuật quản lý áp lực, kế hoạch hành động từng bước nhỏ; tư vấn tâm lý tài chính |
|
||||
| 5 | Trò chơi trải nghiệm đầu tư nhỏ | Mô phỏng đầu tư ảo, giáo dục rủi ro, trò chơi danh mục đầu tư; hướng dẫn đầu tư nhỏ thật |
|
||||
|
||||
---
|
||||
|
||||
## 13. Phát triển nghề nghiệp
|
||||
|
||||
> 💡 **Ý tưởng cốt lõi**: nghề nghiệp không phải đường ray cố định, mà là vùng đất rộng có thể khám phá
|
||||
|
||||
| STT | Tên kịch bản ứng dụng | Chức năng kịch bản ứng dụng |
|
||||
| :--: | ------------ | ------------ |
|
||||
| 1 | Người đồng hành khi mơ hồ nghề nghiệp | Đánh giá hứng thú nghề nghiệp, kiểm kê năng lực, đề xuất thông tin ngành; đối thoại với cố vấn nghề nghiệp |
|
||||
| 2 | Người đánh thức cảm giác thành tựu công việc | Ghi lại kết quả công việc, chắt lọc giá trị, trực quan hóa thành tựu; thu thập phản hồi tích cực từ đồng nghiệp/khách hàng |
|
||||
| 3 | Trợ lý không khí xã giao nơi làm việc | Đề xuất chủ đề công sở, kỹ năng networking, sự kiện ngành; tối ưu nội dung LinkedIn |
|
||||
| 4 | Bộ kích hoạt cảm hứng nghề phụ | Ghép kỹ năng-sở thích-nhu cầu thị trường, thư viện case nghề phụ, hướng dẫn khởi động; cộng đồng nghề phụ |
|
||||
| 5 | Trạm tiếp sức tự tin trước phỏng vấn | Phỏng vấn mô phỏng, chuẩn bị câu hỏi thường gặp, kỹ thuật tăng tự tin; gợi ý hình ảnh cá nhân |
|
||||
|
||||
---
|
||||
|
||||
## 14. Không gian nhà ở
|
||||
|
||||
> 💡 **Ý tưởng cốt lõi**: nhà không chỉ là nơi ở, mà còn là nơi tâm hồn nghỉ ngơi
|
||||
|
||||
| STT | Tên kịch bản ứng dụng | Chức năng kịch bản ứng dụng |
|
||||
| :--: | ------------ | ------------ |
|
||||
| 1 | Nhà thiết kế không khí không gian nhà ở | Phân tích ảnh không gian, đề xuất phong cách, gợi ý nội thất/trang trí; xem trước hiệu quả bằng AR |
|
||||
| 2 | Hướng dẫn thay đổi nhà cửa bốn mùa | Đề xuất chủ đề theo mùa, gợi ý lưu trữ và trưng bày, phương án trang trí ngày lễ; tạo danh sách mua sắm |
|
||||
| 3 | Phép màu cho căn hộ nhỏ | Thuật toán tối ưu không gian, đề xuất đồ nội thất đa năng, mẹo lưu trữ; kỹ thuật mở rộng thị giác |
|
||||
| 4 | Người tạo nghi thức tại nhà | Thiết kế nghi thức hằng ngày (sáng/tối/cuối tuần), nhắc thực hiện nghi thức; phản hồi hiệu quả nghi thức |
|
||||
| 5 | Đồng hành tâm lý khi declutter | Đánh giá giá trị cảm xúc của đồ vật, hướng dẫn từng bước declutter, hỗ trợ tâm lý; đề xuất kênh quyên góp/tái chế |
|
||||
|
||||
---
|
||||
|
||||
## 15. Ẩm thực nấu nướng
|
||||
|
||||
> 💡 **Ý tưởng cốt lõi**: thức ăn là ngôn ngữ của tình yêu, nấu nướng là cách biểu đạt tình yêu
|
||||
|
||||
| STT | Tên kịch bản ứng dụng | Chức năng kịch bản ứng dụng |
|
||||
| :--: | ------------ | ------------ |
|
||||
| 1 | Món ăn chữa lành cho một người | Nhận diện nguyên liệu trong tủ lạnh, đề xuất công thức đơn giản, hướng dẫn step-by-step; thẩm mỹ bày món cho một người |
|
||||
| 2 | Thiết kế không khí bàn ăn ngày lễ | Thực đơn chủ đề ngày lễ, phương án bày bàn, kỹ thuật tạo bầu không khí; tối ưu trải nghiệm khách mời |
|
||||
| 3 | Người ghép món ăn theo tâm trạng | Thuật toán liên hệ tâm trạng-thức ăn, công thức điều tiết cảm xúc, đề xuất comfort food; hướng dẫn chữa lành bằng nấu ăn |
|
||||
| 4 | Xây dựng tự tin cho người mới vào bếp | Công thức siêu đơn giản, mẹo cứu lỗi, lời động viên xây dựng tự tin; tăng độ khó dần dần |
|
||||
| 5 | Hướng dẫn không khí chụp ảnh món ăn | Gợi ý bày món, tận dụng ánh sáng tự nhiên, hướng dẫn góc chụp; gợi ý filter và hậu kỳ |
|
||||
|
||||
---
|
||||
|
||||
## 16. Phong cách ăn mặc
|
||||
|
||||
> 💡 **Ý tưởng cốt lõi**: ăn mặc là tự biểu đạt, phong cách là phần bên trong hiện ra bên ngoài
|
||||
|
||||
| STT | Tên kịch bản ứng dụng | Chức năng kịch bản ứng dụng |
|
||||
| :--: | ------------ | ------------ |
|
||||
| 1 | Moodboard trang phục hôm nay | Đề xuất tổng hợp theo thời tiết/dịp/tâm trạng, thử đồ ảo, cảm hứng phối đồ; quản lý tủ đồ |
|
||||
| 2 | Stylist tủ đồ capsule | Kiểm kê tủ đồ, tổ hợp phối từng món, nhiều cách mặc một món; gợi ý mua sắm để lấp khoảng trống |
|
||||
| 3 | Hành trình khám phá phong cách cá nhân | Trắc nghiệm phong cách, đề xuất icon tham khảo, lộ trình tiến hóa phong cách; xây dựng tự tin |
|
||||
| 4 | Nhà sáng tạo phối mới đồ cũ | Cảm hứng cải tạo đồ cũ, cách phối mới, kỹ thuật nhấn bằng phụ kiện; triết lý thời trang bền vững |
|
||||
| 5 | Cố vấn tạo hình dịp đặc biệt | Giải thích dress code theo dịp, tạo phương án tạo hình, gợi ý trang điểm và tóc; phối hợp tổng thể |
|
||||
|
||||
---
|
||||
|
||||
## Tâm pháp cốt lõi khi thiết kế sản phẩm B2C
|
||||
|
||||
### 1. Từ "chức năng" đến "cảm giác"
|
||||
|
||||
Sản phẩm B2B quan tâm "chức năng này giải quyết vấn đề gì", còn sản phẩm B2C quan tâm "chức năng này mang lại cảm giác gì".
|
||||
|
||||
| Tư duy B2B | Tư duy B2C |
|
||||
|---------|---------|
|
||||
| Nâng cao hiệu suất | Tiết kiệm thời gian để làm việc mình thích |
|
||||
| Giảm chi phí | Khiến từng đồng chi ra đều đáng giá |
|
||||
| Giải quyết điểm đau | Tạo trải nghiệm tốt đẹp |
|
||||
| Chức năng đầy đủ | Cảm giác đúng chỗ |
|
||||
|
||||
### 2. Ba tầng tạo bầu không khí
|
||||
|
||||
**Tầng giác quan**: thiết kế thị giác, thính giác và xúc giác
|
||||
- Màu sắc ấm áp
|
||||
- Âm thanh thư giãn
|
||||
- Hiệu ứng chuyển động mượt mà
|
||||
|
||||
**Tầng cảm xúc**: cộng hưởng và dẫn dắt cảm xúc
|
||||
- Hiểu tâm trạng người dùng
|
||||
- Cung cấp hỗ trợ cảm xúc
|
||||
- Tạo cảm xúc tích cực
|
||||
|
||||
**Tầng ý nghĩa**: sự công nhận giá trị và cảm giác thuộc về
|
||||
- Khiến người dùng cảm thấy được thấu hiểu
|
||||
- Tạo cảm giác thuộc về
|
||||
- Trao ý nghĩa cho hành động
|
||||
|
||||
### 3. Sức mạnh của gợi ý tâm lý
|
||||
|
||||
Copy và thiết kế của sản phẩm B2C đều đang truyền tải gợi ý tâm lý:
|
||||
|
||||
- **Gợi ý tích cực**: "Bạn đã làm rất tốt rồi", "Cứ từ từ, không sao cả"
|
||||
- **Gợi ý thuộc về**: "Nhiều người cũng giống bạn", "Bạn không cô đơn"
|
||||
- **Gợi ý trưởng thành**: "Mỗi lần thử đều là tiến bộ", "Bạn đang trở nên tốt hơn"
|
||||
|
||||
### 4. Giúp người dùng trở thành phiên bản tốt hơn của chính họ
|
||||
|
||||
Sản phẩm B2C tốt nhất không phải là thay đổi người dùng, mà là giúp họ trở thành con người họ muốn trở thành.
|
||||
|
||||
- Không phải "bạn nên...", mà là "bạn có thể..."
|
||||
- Không phải "bạn phải...", mà là "nếu bạn muốn..."
|
||||
- Không phải "bạn vẫn chưa đủ...", mà là "bạn đã..."
|
||||
|
||||
---
|
||||
|
||||
> 🌟 **Hãy nhớ**: người dùng B2C mua không phải chức năng, mà là cảm giác; không phải công cụ, mà là sự đồng hành; không phải dịch vụ, mà là sự thấu hiểu.
|
||||
@@ -0,0 +1,10 @@
|
||||
---
|
||||
title: 'Tham khảo kịch bản sản phẩm AI cho người tiêu dùng'
|
||||
description: 'Trang tương thích đường dẫn cũ cho tài liệu tham khảo kịch bản sản phẩm AI hướng tới người tiêu dùng.'
|
||||
---
|
||||
|
||||
# Tham khảo kịch bản sản phẩm AI cho người tiêu dùng
|
||||
|
||||
Trang này được giữ để tương thích với đường dẫn cũ. Trong Stage 1 tiếng Việt, vui lòng dùng tài liệu dưới đây làm bản chuẩn.
|
||||
|
||||
[Chuyển tới tài liệu tham khảo kịch bản tiêu dùng B2C](/vi-vn/stage-1/appendix-c-consumer-scenarios/)
|
||||
@@ -0,0 +1,544 @@
|
||||
---
|
||||
title: 'Mô hình Double Diamond：Làm đúng việc trước, làm đúng cách sau'
|
||||
description: 'Bài viết Double Diamond dành cho người mới. Hiểu 4 giai đoạn Discover, Define, Develop, Deliver, tránh bắt tay vào làm nguyên mẫu khi chưa hiểu rõ vấn đề.'
|
||||
---
|
||||
|
||||
<script setup>
|
||||
const duration = 'Khoảng <strong>1.5 giờ</strong>'
|
||||
</script>
|
||||
|
||||
# Mô hình Double Diamond：Làm đúng việc trước, làm đúng cách sau
|
||||
|
||||
<a id="top-dd"></a>
|
||||
|
||||
## Hướng dẫn chương này
|
||||
|
||||
<ChapterIntroduction
|
||||
:duration="duration"
|
||||
:tags="['Double Diamond', 'Tư duy thiết kế', 'Phân tích nhu cầu', 'Thiết kế giải pháp']"
|
||||
coreOutput="1 định nghĩa vấn đề rõ ràng hơn và 1 điểm vào xác minh hợp lý hơn"
|
||||
expectedOutput="Không còn vội vàng vẽ nguyên mẫu ngay từ đầu, mà biết nghĩ rõ vấn đề trước, rồi mới so sánh giải pháp"
|
||||
>
|
||||
|
||||
Rất nhiều người lần đầu làm sản phẩm, cạm bẫy dễ rơi nhất không phải "không đủ nỗ lực", mà là bước vào giải pháp quá nhanh.
|
||||
|
||||
Trong đầu vừa nảy ra một hướng, đã bắt đầu nghĩ trang vẽ thế nào, nút đặt ở đâu, có nên kết nối AI không, có nên làm đăng nhập đăng ký không, nguyên mẫu dùng công cụ gì vẽ. Bận rộn một hồi, mới phát hiện vấn đề cơ bản nhất chưa nghĩ rõ: Người dùng có thực sự có điểm đau này không? Vấn đề này có đáng giải quyết bây giờ không? Bạn tưởng mình đang thúc đẩy dự án, thực ra chỉ đang tăng tốc rất chăm chỉ trên sai hướng.
|
||||
|
||||
Mô hình Double Diamond (Kim cương kép) là để tránh tình huống này.
|
||||
|
||||
Lời nhắc có giá trị nhất của nó là: **"Làm đúng việc" và "Làm đúng cách", là hai giai đoạn hoàn toàn khác nhau.** Nếu bạn chưa hiểu rõ vấn đề, đã vội vàng làm nguyên mẫu, thường chỉ sẽ hoàn thiện hơn trên sai hướng.
|
||||
|
||||
</ChapterIntroduction>
|
||||
|
||||
::: info SOP tối thiểu
|
||||
**Mục đích**: Sau khi đọc xong, bạn sẽ rõ hơn khi làm sản phẩm lúc nào nên nghĩ vấn đề trước, lúc nào mới nên bắt đầu nghĩ giải pháp và nguyên mẫu, tránh vừa lên đã làm rất nghiêm túc trên sai hướng.
|
||||
|
||||
**Hành động**: Theo 4 bước `Discover → Define → Develop → Deliver` đi xuống, mỗi bước chỉ làm việc nên làm ở giai đoạn hiện tại.
|
||||
|
||||
**Kết quả**: Bạn sẽ có một định nghĩa vấn đề rõ ràng hơn, vài giải pháp có thể so sánh, và một phiên bản tối thiểu có thể xác minh.
|
||||
|
||||
**Từ khóa chuyển nhanh**: [Double Diamond là gì](#dd-what) · [Kim cương đầu tiên](#dd-first) · [AI giúp bạn thế nào](#dd-ai)
|
||||
:::
|
||||
|
||||
## Bạn sẽ học được những nội dung sau
|
||||
|
||||
1. Mô hình Double Diamond là gì, tại sao nó phù hợp cho người mới làm sản phẩm
|
||||
2. Bốn giai đoạn Discover, Define, Develop, Deliver lần lượt đang làm gì
|
||||
3. Làm thế nào phân biệt "bây giờ nên tiếp tục phân tán" hay "bây giờ nên bắt đầu tập trung"
|
||||
4. Cách dùng mô hình Double Diamond trong sản phẩm AI, thiết kế nguyên mẫu và xác minh nhu cầu
|
||||
|
||||
<a id="dd-what"></a>
|
||||
## [1. Mô hình Double Diamond thực chất là gì](#top-dd)
|
||||
|
||||
Mô hình Double Diamond là một quy trình thiết kế kinh điển do **Design Council** Anh quốc phổ biến. Nó vẽ một quy trình thiết kế và đổi mới hoàn chỉnh thành hai hình kim cương liên tiếp.
|
||||
|
||||
Lý do là "kim cương", là vì mỗi kim cương đều bao gồm hai động tác trái ngược nhưng đều quan trọng:
|
||||
|
||||
- **Phân tán**: Trước mở rộng tầm nhìn, xem nhiều khả năng hơn
|
||||
- **Tập trung**: Rồi thu hẹp phạm vi, đưa ra đánh giá và lựa chọn
|
||||
|
||||
Toàn bộ quá trình gồm 4 bước:
|
||||
|
||||
1. **Discover**: Hiểu rộng về người dùng, vấn đề, môi trường và thị trường
|
||||
2. **Define**: Từ lượng lớn thông tin, tinh lọc ra vấn đề cốt lõi thực sự đáng giải quyết
|
||||
3. **Develop**: Phân tán nhiều giải pháp xoay quanh vấn đề cốt lõi
|
||||
4. **Deliver**: Sàng lọc, nguyên mẫu, kiểm thử và giao phó giải pháp phù hợp hơn
|
||||
|
||||
Nếu nén 4 bước này thành một câu dễ nhớ nhất, thì là:
|
||||
|
||||
- **Kim cương đầu tiên**: Trước làm rõ phải giải quyết vấn đề gì
|
||||
- **Kim cương thứ hai**: Rồi quyết định dùng giải pháp gì để giải quyết nó
|
||||
|
||||
Cũng chính là câu bạn nói rất chính xác:
|
||||
|
||||
- **Kim cương đầu tiên: Làm đúng việc**
|
||||
- **Kim cương thứ hai: Làm đúng cách**
|
||||
|
||||
## 2. Tại sao mô hình Double Diamond đặc biệt phù hợp cho người mới
|
||||
|
||||
Nhịp điệu phổ biến nhất khi người mới làm sản phẩm, thường là như thế này:
|
||||
|
||||
- Nghĩ ra một ý tưởng
|
||||
- Thấy hướng này rất ngầu
|
||||
- Ngay lập tức bắt đầu vẽ nguyên mẫu
|
||||
- Làm làm thấy chức năng ngày càng nhiều
|
||||
- Cuối cùng không biết mình đang giải quyết vấn đề gì
|
||||
|
||||
Giá trị của mô hình Double Diamond, không phải làm cho quy trình phức tạp, mà là **ép bạn tách "hiểu vấn đề" và "thiết kế giải pháp" ra**.
|
||||
|
||||
Điều này nghe rất bình thường, nhưng thực tế rất quan trọng. Vì rất nhiều sản phẩm thất bại, không phải thực hiện không nghiêm túc, mà là:
|
||||
|
||||
- Chọn sai vấn đề
|
||||
- Hiểu sai người dùng
|
||||
- Khóa giải pháp quá sớm
|
||||
- Dành nhiều thời gian mài giũa chi tiết, lại không xác minh hướng đi
|
||||
|
||||
Mô hình Double Diamond chính là không ngừng nhắc bạn:
|
||||
|
||||
- Đừng vì ý tưởng thuận tay, thì mặc nhiên vấn đề đã thành lập
|
||||
- Đừng vì giải pháp có thể làm ra, thì mặc nhiên nó đáng làm
|
||||
- Đừng vì nguyên mẫu trông hoàn chỉnh, thì mặc nhiên người dùng thực sự cần
|
||||
|
||||
<a id="dd-first"></a>
|
||||
## [3. Kim cương đầu tiên: Làm đúng việc](#top-dd)
|
||||
|
||||
Kim cương đầu tiên tập trung vào **bản thân vấn đề**, chứ không phải giải pháp.
|
||||
|
||||
Bạn có thể hiểu nó thành một câu: **Trước đừng vội làm, trước làm rõ có đáng làm hay không.**
|
||||
|
||||
### 3.1 Discover: Trước mở rộng không gian vấn đề
|
||||
|
||||
Nhiệm vụ cốt lõi của giai đoạn Discover, là **nghiên cứu rộng, chứ không phải nhanh chóng kết luận**.
|
||||
|
||||
Bước này thường làm những việc bao gồm:
|
||||
|
||||
- Xem người dùng làm thế nào trong kịch bản thực tế
|
||||
- Phỏng vấn người dùng tiềm năng, hiểu lần gần nhất họ gặp vấn đề là khi nào
|
||||
- Quan sát họ hiện đang khắc phục tạm thế nào
|
||||
- Xem sản phẩm cạnh tranh và giải pháp thay thế đang xử lý thế nào
|
||||
- Thu thập thông tin thị trường, quy trình, ràng buộc, upstream và downstream
|
||||
|
||||
Rất nhiều người sẽ nhầm tưởng Discover là "xem thêm tài liệu". Thực ra then chốt hơn là: **Bạn cần hiểu con người và kịch bản, chứ không chỉ tìm một đống thông tin.**
|
||||
|
||||
Ví dụ bạn muốn làm một công cụ "AI giúp sắp xếp biên bản cuộc họp", ở giai đoạn Discover nên quan tâm hơn là:
|
||||
|
||||
- Người dùng sau cuộc họp rốt cuộc đau nhất ở đâu
|
||||
- Là ghi chép khó, hay sắp xếp khó, hay đồng bộ khó
|
||||
- Hiện họ tự viết, nhờ thực tập sinh viết, nghe lại ghi âm, hay đơn giản không sắp xếp
|
||||
- Kịch bản cuộc họp nào cần biên bản nhất, kịch bản nào căn bản không cần
|
||||
|
||||
Mục tiêu quan trọng nhất của bước này không phải được câu trả lời, mà là **đừng quá sớm tưởng mình đã biết câu trả lời.**
|
||||
|
||||
### 3.2 Define: Từ một đống thông tin tinh lọc ra vấn đề cốt lõi
|
||||
|
||||
Nếu Discover là mở rộng tầm nhìn, thì Define là bắt đầu thu hẹp.
|
||||
|
||||
Những gì Define cần làm, không phải giữ lại tất cả quan sát, mà là hỏi:
|
||||
|
||||
- Vấn đề thực sự đáng ưu tiên giải quyết là cái nào
|
||||
- Vấn đề nào thường xuất hiện nhất, đau nhất, có giá trị nhất
|
||||
- Phiên bản đầu tiên của chúng ta thực sự chỉ tập trung vào kịch bản nào
|
||||
|
||||
Cốt lõi của bước này, là thu một chủ đề rộng thành một định nghĩa vấn đề rõ ràng.
|
||||
|
||||
Ví dụ ban đầu bạn nói:
|
||||
|
||||
> Tôi muốn làm một công cụ AI nâng cao hiệu quả họp.
|
||||
|
||||
Đến giai đoạn Define, cách diễn đạt tốt hơn có thể trở thành:
|
||||
|
||||
> Chúng ta giải quyết trước vấn đề: sau cuộc họp điều phối 30 đến 60 phút của nhóm dự án, không thể xuất biên bản kèm việc cần làm, người phụ trách và thời hạn trong 10 phút.
|
||||
|
||||
Lúc này vấn đề bắt đầu rõ hơn:
|
||||
|
||||
- Người dùng là ai
|
||||
- Kịch bản là gì
|
||||
- Điểm nghẽn là gì
|
||||
- Tiêu chuẩn thành công là gì
|
||||
|
||||
Bản chất của Define, là **từ "nhiều vấn đề" tập trung về "lần này giải quyết vấn đề nào trước".**
|
||||
|
||||
## 4. Kim cương thứ hai: Làm đúng cách
|
||||
|
||||
Khi bạn hoàn thành kim cương đầu tiên, mới thực sự phù hợp để bước vào kim cương thứ hai. Vì lúc này bạn giải quyết không phải một hướng mơ hồ, mà là một vấn đề cụ thể đã được tập trung.
|
||||
|
||||
### 4.1 Develop: Phân tán giải pháp xoay quanh vấn đề cốt lõi
|
||||
|
||||
Trọng tâm giai đoạn Develop, là **xoay quanh cùng một vấn đề, khám phá nhiều giải pháp khả thi.**
|
||||
|
||||
Lưu ý, phân tán ở đây và giai đoạn Discover không giống nhau.
|
||||
|
||||
- Phân tán của Discover, đang khám phá không gian vấn đề
|
||||
- Phân tán của Develop, đang khám phá không gian giải pháp
|
||||
|
||||
Ví dụ vẫn là biên bản cuộc họp, đến giai đoạn Develop, bạn có thể bắt đầu nghĩ:
|
||||
|
||||
- Làm công cụ web, hay plugin cuộc họp
|
||||
- Là upload ghi âm rồi xử lý, hay ghi nhận thời gian thực
|
||||
- Chỉ làm tóm tắt, hay tập trung trích xuất việc cần làm
|
||||
- Nhấn mạnh hiệu quả cá nhân, hay nhấn mạnh đồng bộ nhóm
|
||||
- Cho người dùng tự do chỉnh sửa, hay trực tiếp xuất template có cấu trúc
|
||||
|
||||
Bước này rất phù hợp brainstorm, cũng rất phù hợp cùng nhóm kéo giải pháp ra.
|
||||
|
||||
Nhưng ở đây có một tiền đề: **Tất cả giải pháp đều phải phục vụ cùng một vấn đề đã được định nghĩa.**
|
||||
Nếu vấn đề chưa được định nghĩa rõ, Develop rất dễ lại trở thành chức năng bay tứ tung.
|
||||
|
||||
### 4.2 Deliver: Chọn giải pháp, làm nguyên mẫu, kiểm thử và giao phó
|
||||
|
||||
Giai đoạn Deliver là giai đoạn tập trung trong kim cương thứ hai.
|
||||
|
||||
Lúc này bạn cần làm không phải tiếp tục nghĩ nhiều hơn, mà bắt đầu đánh giá:
|
||||
|
||||
- Giải pháp nào phù hợp nhất với giai đoạn hiện tại
|
||||
- Phiên bản nào nhỏ nhất nhưng hữu dụng nhất
|
||||
- Chức năng nào phải làm trước, chức năng nào có thể làm sau
|
||||
- Làm nguyên mẫu, kiểm thử và xác minh quy mô nhỏ thế nào
|
||||
|
||||
Rất nhiều người tưởng Deliver đồng nghĩa với "lên mạng". Thực ra ý nghĩa chính xác hơn của nó là: **Biến một giải pháp thành thứ có thể kiểm thử, có thể xác minh, có thể lặp lại.**
|
||||
|
||||
Nó có thể là:
|
||||
|
||||
- Một flowchart độ fidelity thấp
|
||||
- Một nguyên mẫu Figma
|
||||
- Một MVP có thể chạy
|
||||
- Một lần kiểm thử người dùng quy mô nhỏ
|
||||
- Một phiên bản lặp lại sau phản hồi thực tế
|
||||
|
||||
Trọng tâm của Deliver không phải "giao phó hoàn hảo", mà là **càng sớm càng tốt đặt giải pháp vào môi trường thực tế để xác minh.**
|
||||
|
||||
## 5. Một bảng đối chiếu dễ nhớ nhất
|
||||
|
||||
Nếu bạn luôn không phân biệt được bốn giai đoạn, có thể trực tiếp ghi phiên bản dưới đây:
|
||||
|
||||
| Giai đoạn | Bạn đang làm gì | Từ khóa | Sản xuất phổ biến |
|
||||
| --- | --- | --- | --- |
|
||||
| Discover | Hiểu vấn đề | Nghiên cứu, quan sát, phỏng vấn, thu thập thông tin | Insight người dùng, ghi chú kịch bản, danh sách vấn đề |
|
||||
| Define | Định nghĩa vấn đề | Tinh lọc, tập trung, lựa chọn, viết lại vấn đề | Định nghĩa vấn đề, ưu tiên, điểm vào MVP |
|
||||
| Develop | Khám phá giải pháp | Brainstorm, so sánh, đồng sáng tạo, hình dung nguyên mẫu | Danh sách giải pháp, sketch flowchart, hướng nguyên mẫu |
|
||||
| Deliver | Xác minh giải pháp | Nguyên mẫu, kiểm thử, lặp lại, giao phó | Nguyên mẫu, phản hồi kiểm thử, phiên bản tối ưu |
|
||||
|
||||
Nén thêm một chút, thì là:
|
||||
|
||||
- **Discover / Define**: Giải quyết "làm đúng việc"
|
||||
- **Develop / Deliver**: Giải quyết "làm đúng cách"
|
||||
|
||||
## 6. Sai lầm phổ biến nhất với mô hình Double Diamond
|
||||
|
||||
### 6.1 Chưa Discover, đã trực tiếp Deliver
|
||||
|
||||
Đây là loại phổ biến nhất. Rất nhiều người vừa có ý tưởng đã vẽ nguyên mẫu, viết PRD, kết nối mô hình, làm trang.
|
||||
|
||||
Vấn đề không phải bạn làm không nghiêm túc, mà có thể bạn căn bản chưa xác nhận vấn đề có đáng giải quyết hay không.
|
||||
|
||||
### 6.2 Discover rất lâu, nhưng luôn không Define
|
||||
|
||||
Một cực đoan khác là luôn nghiên cứu, luôn xem tài liệu, luôn phỏng vấn, lại luôn không dám tập trung.
|
||||
|
||||
Double Diamond không phải để bạn phân tán vô hạn, mà nhắc bạn: Sau khi phân tán phải bước vào đánh giá và lựa chọn.
|
||||
|
||||
### 6.3 Sau khi Define, lại lén sửa vấn đề
|
||||
|
||||
Rất nhiều nhóm sẽ ở giai đoạn Develop vì một giải pháp dễ làm hơn, nên ngược lại sửa định nghĩa vấn đề, cho nó phù hợp với giải pháp hiện có.
|
||||
|
||||
Điều này rất nguy hiểm. Vì có thể bạn không đang giải quyết vấn đề, mà đang tìm lý do cho giải pháp bạn thích.
|
||||
|
||||
### 6.4 Hiểu sai Deliver thành "lên mạng đại toàn"
|
||||
|
||||
Deliver không phải nói phải làm xong sản phẩm hoàn chỉnh mới tính kết thúc. Rất nhiều lúc, một nguyên mẫu có thể kiểm thử, một vòng dùng thử người dùng thực tế, đã là một deliver rất tốt.
|
||||
|
||||
## 7. Trong sản phẩm AI, dùng mô hình Double Diamond thế nào
|
||||
|
||||
Sản phẩm AI đặc biệt dễ rơi vào bẫy "khả năng đi trước", vì khả năng mô hình trông quá hấp dẫn. Bạn sẽ rất muốn trực tiếp đi nghĩ:
|
||||
|
||||
- Có nên kết nối đa mô thức không
|
||||
- Có nên làm Agent không
|
||||
- Có nên thêm workflow không
|
||||
- Có nên kết nối giọng nói, hình ảnh, tìm kiếm mạng không
|
||||
|
||||
Nhưng mô hình Double Diamond sẽ ép bạn hỏi trước:
|
||||
|
||||
- Người dùng rốt cuộc bị kẹt ở khâu nào
|
||||
- Điểm nghẽn này có phải bắt buộc dùng AI không
|
||||
- Nếu không dùng AI, phương pháp hiện tại rốt cuộc kém nhất ở đâu
|
||||
- Sau khi thêm AI vào, tiến triển cốt lõi nhất là gì
|
||||
|
||||
Điều này giúp bạn tránh một tình huống phổ biến: **Khả năng rất mạnh, giá trị rất yếu.**
|
||||
|
||||
Một trình tự thực dụng là:
|
||||
|
||||
1. Ở giai đoạn Discover quan sát người dùng hiện đang xử lý nhiệm vụ thế nào
|
||||
2. Ở giai đoạn Define viết một kịch bản đau nhất thành một định nghĩa vấn đề rõ ràng
|
||||
3. Ở giai đoạn Develop rồi đi so sánh khả năng AI nào phù hợp nhất phục vụ vấn đề này
|
||||
4. Ở giai đoạn Deliver làm một phiên bản tối thiểu, để người dùng thực tế kiểm thử
|
||||
|
||||
## 8. Template Double Diamond có thể áp dụng trực tiếp
|
||||
|
||||
Nếu bạn đang làm sản phẩm của mình, có thể trước viết theo trình tự dưới đây:
|
||||
|
||||
### Discover
|
||||
|
||||
- Người dùng tôi quan sát là ai?
|
||||
- Lần gần nhất họ gặp vấn đề này là khi nào?
|
||||
- Hiện họ giải quyết thế nào?
|
||||
- Nơi họ phiền nhất, chậm nhất, không yên tâm nhất là gì?
|
||||
|
||||
### Define
|
||||
|
||||
- Trong đống vấn đề này, cái nào đáng ưu tiên giải quyết nhất?
|
||||
- Kịch bản nào tần suất cao nhất, hoặc quan trọng nhất?
|
||||
- Phiên bản đầu tiên của chúng ta phục vụ ai trước, giải quyết cái gì trước?
|
||||
- Sau khi giải quyết thành công, trạng thái người dùng sẽ thay đổi thế nào?
|
||||
|
||||
### Develop
|
||||
|
||||
- Đối với vấn đề này, có những giải pháp khả thi nào?
|
||||
- Giải pháp nào nhẹ nhất, nhanh nhất, dễ xác minh nhất?
|
||||
- Cái nào phải làm, cái nào làm sau?
|
||||
|
||||
### Deliver
|
||||
|
||||
- Chúng ta nhỏ nhất có thể giao phó gì để xác minh hướng này?
|
||||
- Là flowchart, nguyên mẫu, hay MVP?
|
||||
- Cần tìm ai kiểm thử?
|
||||
- Sau khi kiểm thử đánh giá thế nào: tiếp tục, sửa đổi hay dừng lại?
|
||||
|
||||
## 9. Một ví dụ người mới cũng có thể hiểu
|
||||
|
||||
Giả sử bạn muốn làm một công cụ AI "giúp sinh viên chuẩn bị CV xin việc".
|
||||
|
||||
Rất nhiều người vừa bắt đầu sẽ trực tiếp bước vào kim cương thứ hai, bắt đầu nghĩ:
|
||||
|
||||
- Có nên làm làm đẹp một lần không
|
||||
- Có nên sửa viết thông minh không
|
||||
- Có nên tự động khớp JD không
|
||||
- Có nên tạo tự giới thiệu không
|
||||
|
||||
Nhưng theo mô hình Double Diamond, quá trình tốt hơn sẽ là như thế này:
|
||||
|
||||
### Kim cương đầu tiên
|
||||
|
||||
**Discover**
|
||||
|
||||
- Đi hỏi sinh viên năm cuối lần gần nhất sửa CV là khi nào
|
||||
- Xem họ sửa từ CV cũ thành phiên bản mới thế nào
|
||||
- Hiểu họ phiền nhất là "không biết viết", "không biết sửa", hay "không biết đánh giá tốt chưa"
|
||||
|
||||
**Define**
|
||||
|
||||
- Cuối cùng tập trung thành một vấn đề cụ thể hơn:
|
||||
- Không phải "sinh viên không biết làm CV"
|
||||
- Mà là "sinh viên lần đầu nộp thực tập, rất khó sửa kinh nghiệm hiện có thành diễn đạt phù hợp với vị trí, do đó trì hoãn nộp hồ sơ"
|
||||
|
||||
### Kim cương thứ hai
|
||||
|
||||
**Develop**
|
||||
|
||||
- Nghĩ vài giải pháp: Thư viện template, AI sửa viết, đối chiếu vị trí, đánh giá CV, tham khảo case
|
||||
|
||||
**Deliver**
|
||||
|
||||
- Phiên bản đầu tiên chỉ làm "sửa viết bullet points kinh nghiệm dựa trên mô tả vị trí"
|
||||
- Cho 5 sinh viên dùng thử, xem họ có nộp nhanh hơn CV phiên bản đầu tiên không
|
||||
|
||||
Bạn sẽ phát hiện, một khi kim cương đầu tiên làm vững, kim cương thứ hai sẽ rõ ràng hơn nhiều.
|
||||
|
||||
## 10. Tóm tắt
|
||||
|
||||
Điểm mạnh nhất của mô hình Double Diamond, là nó giúp bạn chia một đống hỗn loạn thành bốn động tác rõ ràng hơn:
|
||||
|
||||
- Trước phân tán hiểu vấn đề
|
||||
- Rồi tập trung định nghĩa vấn đề
|
||||
- Rồi phân tán khám phá giải pháp
|
||||
- Cuối cùng tập trung giao phó giải pháp
|
||||
|
||||
Nó không phải làm bạn chậm lại, mà giúp bạn **đi ít hơn rất nhiều con đường tưởng bận rộn nhưng thực ra sai hướng.**
|
||||
|
||||
Đặc biệt trong thời đại AI, làm ra thứ ngày càng nhanh, mô hình Double Diamond lại càng quan trọng hơn. Vì khi "làm ra" ngày càng dễ, năng lực thực sự khan hiếm sẽ trở thành: **Bạn có đang giải quyết một vấn đề đáng giải quyết hay không, và bạn có dùng cách phù hợp để giải quyết nó hay không.**
|
||||
|
||||
Ghi nhớ câu này là đủ:
|
||||
|
||||
**Trước làm đúng việc, rồi làm đúng cách.**
|
||||
|
||||
<a id="dd-ai"></a>
|
||||
## [11. Cách dùng AI giúp bạn chạy quy trình Double Diamond](#top-dd)
|
||||
|
||||
Bản thân mô hình Double Diamond không phải công cụ AI, nhưng AI rất phù hợp đóng vai "bộ tăng tốc" trong bốn giai đoạn. Điểm mấu chốt không phải để AI thay bạn quyết định, mà là để nó giúp bạn mở rộng tầm nhìn, sắp xếp thông tin, so sánh giải pháp và tạo tài liệu xác minh.
|
||||
|
||||
### 11.1 Ở giai đoạn Discover, dùng AI làm trước một vòng lót thông tin
|
||||
|
||||
Trước khi phỏng vấn và nghiên cứu chính thức, bạn có thể để AI giúp bạn làm quét vấn đề nhẹ nhàng, ví dụ:
|
||||
|
||||
- Trên thị trường có giải pháp thay thế phổ biến nào
|
||||
- Người dùng trong cộng đồng công khai thường phàn nàn điều gì nhất
|
||||
- Vấn đề này thường gặp ở kịch bản và nhóm người nào
|
||||
- Sản phẩm hiện có thường bỏ qua điều gì
|
||||
|
||||
Bước này không thể thay thế nghiên cứu thực tế, nhưng rất phù hợp giúp bạn nhanh chóng xây bản đồ vấn đề.
|
||||
|
||||
Một input rất đơn giản có thể là:
|
||||
|
||||
```text
|
||||
Tôi muốn làm một công cụ giúp sinh viên sửa CV.
|
||||
Bạn trước đừng giúp tôi nghĩ chức năng, trước giúp tôi xem mọi người thường gặp rắc rối gì nhất trên vấn đề này.
|
||||
```
|
||||
|
||||
AI có thể xuất:
|
||||
|
||||
```text
|
||||
Bản đồ vấn đề ban đầu:
|
||||
|
||||
1. Không biết nên viết kinh nghiệm gì
|
||||
2. Không biết sửa cho phù hợp với vị trí thế nào
|
||||
3. Sửa nhiều phiên bản vẫn không chắc đã đủ tốt
|
||||
4. Cần người khác giúp xem, nhưng không tiện phiền người ta mãi
|
||||
5. Vì không chắc chắn, nên cứ kéo dài không nộp
|
||||
```
|
||||
|
||||
Tác dụng của loại output này không phải thay bạn kết luận, mà giúp bạn nhanh bước vào Discover.
|
||||
|
||||
### 11.2 Ở giai đoạn Define, để AI giúp bạn tập trung định nghĩa vấn đề
|
||||
|
||||
Rất nhiều người sau khi thu thập một đống tài liệu, khó nhất là nén vấn đề thành một câu thực sự rõ ràng. Bạn có thể giao ghi chú nghiên cứu cho AI, để nó giúp bạn nén thành vài định nghĩa vấn đề ứng viên:
|
||||
|
||||
```text
|
||||
Dưới đây là phản hồi người dùng và ghi chú nghiên cứu tôi thu thập được ở giai đoạn Discover:
|
||||
[Dán nội dung]
|
||||
|
||||
Xin giúp tôi làm ba việc:
|
||||
1. Tổng hợp mô hình vấn đề xuất hiện thường xuyên nhất
|
||||
2. Theo tần suất vấn đề, mức độ đau và tính khả thi xác minh, sắp xếp ra 3 vấn đề đáng ưu tiên giải quyết
|
||||
3. Viết mỗi vấn đề thành một định nghĩa vấn đề cụ thể
|
||||
```
|
||||
|
||||
Như vậy bạn sẽ dễ bước vào Define hơn, thay vì luôn dừng ở trạng thái "vấn đề nhiều quá".
|
||||
|
||||
Bạn thậm chí có thể viết input rất đơn giản:
|
||||
|
||||
```text
|
||||
Tôi hiện thu thập được các vấn đề:
|
||||
1. Mọi người không biết CV viết gì
|
||||
2. Mọi người không biết sửa thế nào
|
||||
3. Mọi người luôn cảm thấy chưa sửa xong, không dám nộp
|
||||
|
||||
Bạn giúp tôi xem, phiên bản đầu tiên phù hợp nhất giải quyết vấn đề nào trước.
|
||||
```
|
||||
|
||||
AI có thể xuất:
|
||||
|
||||
```text
|
||||
Đề xuất vấn đề đáng ưu tiên giải quyết:
|
||||
|
||||
"Sinh viên lần đầu nộp thực tập, không chắc CV đã đạt mức có thể nộp chưa, do đó sẽ sửa lặp đi lặp lại và trì hoãn nộp hồ sơ."
|
||||
|
||||
Lý do:
|
||||
1. Vấn đề này cụ thể hơn
|
||||
2. Nó có thể giải thích hành vi trì hoãn
|
||||
3. Dễ thiết kế một phiên bản nhỏ để xác minh hơn
|
||||
```
|
||||
|
||||
Loại output này rất hữu ích, vì nó giúp bạn từ đống vấn đề mơ hồ tập trung ra một định nghĩa gần với điểm khởi đầu MVP hơn.
|
||||
|
||||
### 11.3 Ở giai đoạn Develop, dùng AI phân tán nhiều giải pháp
|
||||
|
||||
Rất nhiều người vừa định nghĩa vấn đề xong, chỉ chăm chăm vào giải pháp đầu tiên nghĩ ra. AI ở bước này rất phù hợp giúp bạn ép phân tán:
|
||||
|
||||
```text
|
||||
Tôi đã định nghĩa một vấn đề cốt lõi: [Định nghĩa vấn đề của bạn]
|
||||
Xin đừng trực tiếp cho tôi một câu trả lời cuối cùng, mà từ các góc độ sau mỗi loại đề xuất 2-3 hướng giải quyết:
|
||||
1. MVP nhẹ nhất
|
||||
2. Giải pháp phù hợp nhất để xác minh nhu cầu
|
||||
3. Giải pháp phù hợp nhất để nâng cao trải nghiệm
|
||||
4. Giải pháp không phụ thuộc AI
|
||||
5. Giải pháp phụ thuộc AI
|
||||
Cuối cùng xin so sánh ưu điểm, rủi ro và chi phí xác minh của mỗi giải pháp.
|
||||
```
|
||||
|
||||
Như vậy bạn sẽ không quá sớm bị trói vào một giải pháp duy nhất.
|
||||
|
||||
Một input đơn giản:
|
||||
|
||||
```text
|
||||
Định nghĩa vấn đề hiện tại của tôi là:
|
||||
"Sinh viên không chắc CV đã có thể nộp chưa, nên cứ kéo dài không nộp."
|
||||
|
||||
Xin giúp tôi nghĩ 4 giải pháp khác nhau, đừng chỉ cho tôi một.
|
||||
```
|
||||
|
||||
AI có thể xuất:
|
||||
|
||||
```text
|
||||
Giải pháp 1: Danh sách kiểm tra CV có thể nộp
|
||||
Giải pháp 2: Sửa viết dựa trên mô tả vị trí
|
||||
Giải pháp 3: Người dùng upload CV rồi đưa ra cảnh báo rủi ro
|
||||
Giải pháp 4: Cung cấp đối chiếu case xuất sắc, giúp người dùng đánh giá khoảng cách
|
||||
```
|
||||
|
||||
Lúc này bạn dễ bước vào "so sánh giải pháp" hơn, thay vì vừa lên chỉ chăm chăm để AI sửa viết một hướng.
|
||||
|
||||
### 11.4 Ở giai đoạn Deliver, dùng AI giúp bạn tạo văn bản nguyên mẫu và tài liệu kiểm thử
|
||||
|
||||
Khi bạn bước vào giai đoạn Deliver, AI rất phù hợp giúp bạn tăng tốc các công việc này:
|
||||
|
||||
- Tạo văn bản trang trong nguyên mẫu độ fidelity thấp
|
||||
- Sắp xếp script kiểm thử người dùng
|
||||
- Tạo nhiều phiên bản tiêu đề, nút bấm, mô tả có thể so sánh
|
||||
- Sắp xếp phản hồi và danh sách vấn đề sau kiểm thử
|
||||
|
||||
Ví dụ bạn có thể để AI giúp bạn tạo một script kiểm thử người dùng 20 phút, hoặc giúp bạn gom 5 phản hồi người dùng thành căn cứ đánh giá "tiếp tục làm / sửa hướng / tạm dừng".
|
||||
|
||||
Ví dụ một input tối thiểu:
|
||||
|
||||
```text
|
||||
Tôi đã làm một nguyên mẫu rất đơn giản:
|
||||
Người dùng upload CV, hệ thống báo chỗ nào chưa phù hợp để nộp.
|
||||
|
||||
Xin giúp tôi tạo một script kiểm thử người dùng 15 phút.
|
||||
```
|
||||
|
||||
AI có thể xuất:
|
||||
|
||||
```text
|
||||
Script kiểm thử 15 phút:
|
||||
|
||||
1. Trước mời người dùng mô tả trải nghiệm nộp CV gần nhất
|
||||
2. Để người dùng tự hoàn thành upload CV
|
||||
3. Quan sát họ có hiểu được kết quả phản hồi không
|
||||
4. Hỏi: Trong những gợi ý này, cái nào hữu ích nhất, cái nào khiến bạn bối rối
|
||||
5. Hỏi: Nếu lần sau trước khi nộp, bạn có muốn dùng lại không
|
||||
```
|
||||
|
||||
Loại output này rất thực dụng, vì nó có thể giúp bạn từ "tôi làm xong nguyên mẫu rồi" bước đến "tôi tiếp theo kiểm thử thế nào".
|
||||
|
||||
### 11.5 Để AI đóng vai "người gác cổng giai đoạn"
|
||||
|
||||
Vấn đề phổ biến nhất của mô hình Double Diamond, là người ta sẽ nhảy giai đoạn. Bạn có thể trực tiếp để AI đóng vai người gác cổng, nhắc bạn hiện tại rốt cuộc đang ở bước nào:
|
||||
|
||||
```text
|
||||
Xin đóng vai huấn luyện viên quy trình sản phẩm.
|
||||
Dưới đây là trạng thái dự án hiện tại của tôi: [Mô tả của bạn]
|
||||
Xin đánh giá tôi hiện tại giống đang ở Discover, Define, Develop hay Deliver hơn.
|
||||
Và cho tôi biết:
|
||||
1. Tôi có phải đã nhảy quá sớm sang giai đoạn tiếp theo không
|
||||
2. Hành động đáng bổ sung nhất ở giai đoạn hiện tại là gì
|
||||
3. Những việc nào bây giờ chưa nên làm
|
||||
```
|
||||
|
||||
Điều này đặc biệt hữu ích cho người mới, vì bạn rất dễ "chưa nghĩ rõ vấn đề đã bắt đầu vẽ nguyên mẫu".
|
||||
|
||||
## 📚 Bài tập
|
||||
|
||||
Xin bạn dựa vào nội dung bài viết, hoàn thành bài tập sau:
|
||||
|
||||
1. Chọn một ý tưởng sản phẩm bạn muốn làm gần đây, viết bản nháp 4 bước Discover, Define, Develop, Deliver của nó
|
||||
2. Ở giai đoạn Define, ép mình nén vấn đề thành một câu cụ thể
|
||||
3. Ở giai đoạn Develop, ít nhất liệt kê 3 giải pháp khác nhau, thay vì chỉ chăm chăm vào cách đầu tiên nghĩ ra
|
||||
4. Ở giai đoạn Deliver, viết ra một phiên bản xác minh tối thiểu có thể giao phó trong một tuần
|
||||
|
||||
## Đọc thêm
|
||||
|
||||
Bài viết này chủ yếu tham khảo tài liệu chính thức của Design Council về Double Diamond, phù hợp để tiếp tục xem:
|
||||
|
||||
- [Design Council: The Double Diamond](https://www.designcouncil.org.uk/our-resources/the-double-diamond/)
|
||||
- [Design Council: Framework for Innovation](https://www.designcouncil.org.uk/our-work/skills-learning/tools-frameworks/framework-for-innovation-design-councils-evolved-double-diamond/)
|
||||
- [Design Council: History of the Double Diamond](https://www.designcouncil.org.uk/our-resources/the-double-diamond/history-of-the-double-diamond/)
|
||||
@@ -0,0 +1,301 @@
|
||||
---
|
||||
title: 'Tìm ý tưởng ở đâu: 3 nguồn tham khảo phù hợp nhất cho người mới'
|
||||
description: 'Bài viết tìm ý tưởng sản phẩm dành cho người mới. Tập trung tổng hợp các trang web phù hợp để lướt idea, nguồn xu hướng, nguồn nghiệp vụ thực tế và danh sách VC, giúp bạn nhanh chóng tìm thấy hướng đi cụ thể hơn từ các liên kết.'
|
||||
---
|
||||
|
||||
<script setup>
|
||||
const duration = 'Khoảng <strong>1.5 giờ</strong>'
|
||||
</script>
|
||||
|
||||
# Tìm ý tưởng ở đâu: 3 nguồn tham khảo phù hợp nhất cho người mới
|
||||
|
||||
<a id="top-idea-sources"></a>
|
||||
|
||||
## Hướng dẫn chương này
|
||||
|
||||
<ChapterIntroduction
|
||||
:duration="duration"
|
||||
:tags="['Tìm ý tưởng', 'Hướng sản phẩm', 'Phát hiện nhu cầu', 'Quan sát ngành']"
|
||||
coreOutput="1 hướng sản phẩm cụ thể hơn, đáng tiếp tục tìm hiểu"
|
||||
expectedOutput="Biết lướt ở đâu, xem thế nào, xem gì trước, không còn chỉ để lại ý tưởng trống như 'AI + ngành nào đó'"
|
||||
>
|
||||
|
||||
Rất nhiều người bị mắc kẹt ở bước đầu tiên, không phải vì hoàn toàn không có cảm hứng, mà vì sau khi lướt nhiều nội dung, những gì còn trong đầu vẫn chỉ là từ to:
|
||||
|
||||
- AI for education
|
||||
- AI for healthcare
|
||||
- AI for finance
|
||||
- AI agent for business
|
||||
|
||||
Những điều này chưa phải là ý tưởng. Chúng chỉ cho bạn biết "hướng rất lớn", không cho bạn biết:
|
||||
|
||||
- Ai đang dùng
|
||||
- Dùng trong kịch bản nào
|
||||
- Hiện đang làm tạm thế nào
|
||||
- Bước nào đáng cắt vào trước nhất
|
||||
|
||||
Bài viết này không nói về phương pháp luận suông, trực tiếp tổng hợp một loạt nguồn hữu dụng hơn cho bạn.
|
||||
|
||||
</ChapterIntroduction>
|
||||
|
||||
::: info SOP tối thiểu
|
||||
**Mục đích**: Sau khi đọc xong, bạn sẽ biết khi không có ý tưởng thì nên lướt ở đâu, link nào phù hợp để xem "nhu cầu cụ thể", link nào phù hợp để xem "xu hướng", link nào phù hợp để xem "nghiệp vụ thực tế".
|
||||
|
||||
**Hành động**: Lướt một vòng danh sách idea trước, sau đó xem một vòng sản phẩm nhỏ đang kiếm tiền, rồi xem nguồn xu hướng và nguồn nghiệp vụ, cuối cùng giữ lại 1 hướng bạn muốn tiếp tục tìm hiểu.
|
||||
|
||||
**Kết quả**: Bạn sẽ có 1 hướng cụ thể hơn, đáng tiếp tục xác minh, thay vì dừng lại ở từ to.
|
||||
|
||||
**Từ khóa chuyển nhanh**: [Danh sách ứng dụng tham khảo](#idea-apps) · [Nguồn xu hướng](#idea-trends) · [Nguồn nghiệp vụ hơn](#idea-business) · [Nguồn VC / gia tốc](#idea-vc) · [Đường ngắn nhất](#idea-path) · [AI giúp bạn thế nào](#idea-ai)
|
||||
:::
|
||||
|
||||
## Bạn sẽ học được những nội dung sau
|
||||
|
||||
1. Trang web nào phù hợp để lướt idea trực tiếp
|
||||
2. Trang web nào phù hợp để xem sản phẩm nhỏ đang kiếm tiền
|
||||
3. Nguồn nào phù hợp để xem xu hướng và thay đổi ngành
|
||||
4. Nguồn nào gần với nghiệp vụ và thanh toán thực tế hơn
|
||||
5. Một đường ngắn nhất phù hợp cho người mới bắt đầu
|
||||
|
||||
<a id="idea-apps"></a>
|
||||
## [1. Danh sách ứng dụng tham khảo: Xem người khác đang làm gì trước](#top-idea-sources)
|
||||
|
||||
Đây là điểm khởi đầu phù hợp nhất cho người mới, vì cụ thể nhất.
|
||||
|
||||
### Nhóm 1: Mở ra là danh sách idea, chọn trực tiếp
|
||||
|
||||
- [Reddit — r/SomebodyMakeThis](https://www.reddit.com/r/SomebodyMakeThis/)
|
||||
Mục đích cốt lõi của subreddit này là: người dùng thực tế trực tiếp đăng "Tôi hy vọng ai đó làm một cái XX". Mỗi bài viết thường là một nhu cầu sản phẩm cụ thể, còn kèm theo mô tả kịch bản. Sau khi vào, sắp xếp theo `Top -> Past Month` hoặc `Top -> Past Year`, 20 phút có thể quét được một loạt nhu cầu thực tế.
|
||||
- [Reddit — r/AppIdeas](https://www.reddit.com/r/AppIdeas/)
|
||||
Tương tự như trên, nhưng thiên về phần mềm / App. Định dạng bài viết phổ biến là "tôi cần một ứng dụng có thể làm XX", granularity nhỏ hơn, rất nhiều là niche nhỏ mà đẹp.
|
||||
- [Reddit — r/Startup_Ideas](https://www.reddit.com/r/Startup_Ideas/)
|
||||
Hoàn chỉnh hơn hai cái trước. Rất nhiều bài viết không chỉ là yêu cầu một câu, còn kèm theo phân tích thị trường, mô hình kinh doanh và lý do tại sao bây giờ đáng làm.
|
||||
- [Unvalidated Ideas](https://unvalidatedideas.com/)
|
||||
Mỗi tuần xuất bản ý tưởng khởi nghiệp chưa được xác minh, các trường phổ biến bao gồm người dùng mục tiêu, phương thức kiếm tiền, ý tưởng xác minh ban đầu. Định dạng thống nhất, phù hợp để quét nhanh.
|
||||
- [IdeasAI](https://ideasai.com/)
|
||||
Dùng AI tạo ý tưởng khởi nghiệp, có thể lướt liên tục. Chất lượng không ổn định, nhưng rất phù hợp để kích thích cảm hứng khi "hoàn toàn không có cảm giác gì", rồi tự mình khoan sâu vào kịch bản phân khúc.
|
||||
|
||||
### Nhóm 2: Xem sản phẩm nhỏ đang kiếm tiền người khác đã làm, suy ngược lại idea
|
||||
|
||||
Logic của các nền tảng này là: người khác đã xác minh nhu cầu, thậm chí đang kiếm tiền. Bạn xem chúng, không phải để copy, mà để xem "vấn đề nhỏ nào đã có người sẵn sàng trả tiền".
|
||||
|
||||
- [Starter Story](https://www.starterstory.com/)
|
||||
Tổng hợp nhiều case kinh doanh nhỏ thực tế, thường có phỏng vấn sáng lập, dữ liệu doanh thu, quá trình khởi đầu. Tập trung xem sản phẩm nhỏ có doanh thu hàng tháng 10 đến 100 nghìn USD, thường niche hơn, cũng gần với quy mô sản phẩm mà người bình thường có thể hiểu hơn.
|
||||
- [Indie Hackers — Products](https://www.indiehackers.com/products)
|
||||
Nơi nhà phát triển độc lập trưng bày sản phẩm, rất nhiều công khai doanh thu và tăng trưởng. Sắp xếp theo doanh thu, xem những sản phẩm kiếm hàng nghìn đến hàng chục nghìn USD mỗi tháng đang giải quyết vấn đề cụ thể nào.
|
||||
- [MicroConf Blog](https://microconf.com/blog)
|
||||
Thiên về Micro SaaS. Phù hợp để xem những điểm vào "đủ nhỏ, nhưng có người sẵn sàng trả tiền".
|
||||
- [1000 Tools](https://1000.tools/)
|
||||
Trang tổng hợp công cụ AI. Phù hợp xem loại sản phẩm nào đã có người làm, nhưng làm bình thường, hoặc hướng nào chưa được bao phủ tốt ở thị trường nội địa / một ngành dọc nào đó.
|
||||
- [Product Hunt](https://www.producthunt.com/)
|
||||
Xem loại sản phẩm xuất hiện lặp lại gần đây, đừng chỉ nhìn top 1, tập trung xem loại sản phẩm nào liên tục có người làm nhưng chưa có người chiến thắng rõ ràng.
|
||||
- [BetaList](https://betalist.com/)
|
||||
Phù hợp xem sản phẩm sớm và nhóm đang thử hướng.
|
||||
|
||||
### Khi xem sản phẩm, đừng chỉ xem bản thân sản phẩm, cũng hãy xem đánh giá xấu và "dịch vụ làm thay"
|
||||
|
||||
- [G2](https://www.g2.com/)
|
||||
Cách dùng: Xem đánh giá 1 sao, 2 sao. Đánh giá xấu thường ẩn chứa "sản phẩm hiện có làm chưa tốt bước nào".
|
||||
- [Capterra](https://www.capterra.com/)
|
||||
Cách dùng: Tương tự G2, phù hợp xem phàn nàn thực tế về sản phẩm dạng SaaS.
|
||||
- Taobao / Xianyu / [Fiverr](https://www.fiverr.com/) / [Upwork](https://www.upwork.com/) / Zhubajie
|
||||
Cách dùng: Tìm "làm thay", "sắp xếp thay", "nhập liệu thay", "chuyển đổi thay". Nếu loại dịch vụ thủ công nào đó bán chạy, phía sau thường có một quy trình có thể lặp lại, có thể sản phẩm hóa.
|
||||
|
||||
Tín hiệu đánh giá rất đơn giản:
|
||||
|
||||
- Người dùng đã phàn nàn về công cụ hiện có
|
||||
- Người dùng đã tiêu tiền thuê người làm thay
|
||||
- Người dùng đã đầu tư nhiều nhân công và thời gian cho quy trình này
|
||||
|
||||
### Nhóm 4: Xem video, có người trực tiếp giúp bạn phân tích idea
|
||||
|
||||
Nếu bạn không thích lướt diễn đàn, lướt bảng xếp hạng, mà thích "có người giúp tôi chia sẻ ý tưởng", thì video và podcast cũng rất phù hợp.
|
||||
|
||||
- Tìm kiếm `Greg Isenberg startup ideas`
|
||||
Phù hợp xem có người trực tiếp phân tích 2 đến 3 ý tưởng cụ thể, tiện thể nói về quy mô thị trường, phân tích cạnh tranh và điểm vào.
|
||||
- Tìm kiếm `My First Million podcast`
|
||||
Hai MC thường xuyên cả chương brainstorm ý tưởng kinh doanh, mật độ cao, thường nảy ra những niche rất cụ thể.
|
||||
- Tìm kiếm `YC startup ideas` hoặc `Michael Seibel startup ideas`
|
||||
Phù hợp người mới bắt đầu, nội dung trực tiếp, rất nhiều sẽ nói thẳng về cách chọn hướng.
|
||||
|
||||
<a id="idea-trends"></a>
|
||||
## [2. Nguồn xu hướng: Xem hướng nào đang tăng trưởng](#top-idea-sources)
|
||||
|
||||
Tác dụng của trang xu hướng không phải trực tiếp cho bạn ý tưởng, mà giúp bạn đánh giá: một hướng nào đó có đang tăng nhiệt không, có đáng tiếp tục xem không.
|
||||
|
||||
- [Exploding Topics](https://explodingtopics.com/)
|
||||
Dùng dữ liệu theo dõi các chủ đề và loại sản phẩm tăng trưởng nhanh nhưng chưa bước vào tầm nhìn chính thống. Phù hợp xem những hướng "đang tăng nhưng chưa quá đông đúc".
|
||||
- [Google Trends](https://trends.google.com/)
|
||||
Tìm từ khóa, xem đường xu hướng trong năm qua, sau đó xem "truy vấn liên quan" có từ nào "tăng vọt".
|
||||
- [Glimpse](https://meetglimpse.com/)
|
||||
Tương tự Google Trends
|
||||
- Trang tóm tắt báo cáo nghiên cứu ngành
|
||||
Phù hợp khi bạn đã có hướng, muốn nhanh chóng xem vị trí của hướng này trong ngành.
|
||||
- McKinsey / BCG / Gartner nội dung xu hướng
|
||||
Thiên về góc nhìn doanh nghiệp và ngành lớn, phù hợp B2B, công nghiệp, ngành truyền thống.
|
||||
- [State of AI Report](https://www.stateof.ai/)
|
||||
Nếu hướng của bạn liên quan đến bản thân công nghệ AI, báo cáo thường niên này rất phù hợp để xây dựng tầm nhìn tổng thể.
|
||||
|
||||
Khi xem xu hướng chỉ tập trung vào 3 điều:
|
||||
|
||||
- Từ này có đang tăng nhiệt liên tục không
|
||||
- Nó rơi vào kịch bản cụ thể nào
|
||||
- Ai sẽ sớm nhất chi trả thời gian, chi phí chuyển đổi hoặc ngân sách cho nó
|
||||
|
||||
<a id="idea-business"></a>
|
||||
## [3. Nguồn gần nghiệp vụ hơn: Xem ai đang tiêu tiền, ai đang phàn nàn, ai đang bán dịch vụ thủ công](#top-idea-sources)
|
||||
|
||||
Nếu bạn muốn tìm không phải hướng "nghe rất ngầu", mà là hướng "gần với nghiệp vụ thực tế" hơn, hãy xem các nguồn gần quy trình làm việc hơn.
|
||||
|
||||
### Xem ai đang thực sự tiêu tiền mua gì
|
||||
|
||||
- [Trang web Mua sắm Chính phủ Trung Quốc](https://www.ccgp.gov.cn/)
|
||||
Cách dùng: Tìm các từ như "công trường thông minh", "hệ thống quản lý phòng thí nghiệm", "thu thập dữ liệu", "quản lý phòng khám", "hệ thống báo giá", xem ngân sách, yêu cầu kỹ thuật, kịch bản sử dụng.
|
||||
- Các trung tâm giao dịch tài nguyên công cộng tỉnh/thành phố
|
||||
Cách dùng: Xem chính quyền địa phương và doanh nghiệp nhà nước đang thực sự mua hệ thống gì.
|
||||
- Bibiao / Qianlima / Biaoshitong
|
||||
Cách dùng: Xem nhu cầu mua sắm phía doanh nghiệp và loại hệ thống tần suất cao.
|
||||
|
||||
Tín hiệu mạnh từ những nguồn này là: Không phải đang thảo luận về tương lai, mà đang phơi bày "hôm nay đã có người sẵn sàng chi tiền cho việc này".
|
||||
|
||||
### Xem ai đang thực sự phàn nàn điều gì
|
||||
|
||||
- Sản xuất: Cộng đồng cơ khí, diễn đàn điều khiển công nghiệp
|
||||
- Y tế: Dingxiangyuan, Yimaitong
|
||||
- Xây dựng / Kỹ thuật: Tumuzaixian, Guanglianda Community
|
||||
- Tài chính / Kế toán: Diễn đàn China Accounting Vision
|
||||
- Ngoại thương: diễn đàn Fubu, Mikecircle
|
||||
- F&B / Bán lẻ: Zhiye Canyinwang, Lianshangwang
|
||||
- [Reddit](https://www.reddit.com/) các board dọc: `r/smallbusiness`, `r/Entrepreneur`, `r/SaaS`, `r/healthcare`, `r/manufacturing`
|
||||
- [V2EX](https://www.v2ex.com/)
|
||||
- Jike
|
||||
- Xiaohongshu
|
||||
|
||||
Khi tìm kiếm đừng chỉ tìm "AI", "đổi mới", hiệu quả hơn là tìm:
|
||||
|
||||
- Quá phiền phức rồi
|
||||
- Có cách nào tốt hơn không
|
||||
- Xin đề xuất công cụ
|
||||
- Excel quản lý không xuể rồi
|
||||
- I wish there was
|
||||
- is there a tool for
|
||||
- I hate
|
||||
|
||||
### Xem ai đang bán dịch vụ thủ công lặp đi lặp lại
|
||||
|
||||
- [Fiverr](https://www.fiverr.com/)
|
||||
- [Upwork](https://www.upwork.com/)
|
||||
- Zhubajie
|
||||
- Taobao
|
||||
- Xianyu
|
||||
|
||||
Nếu bạn thấy những dịch vụ này bán khá tốt, đáng tiếp tục tìm hiểu:
|
||||
|
||||
- Giúp bạn chuyển báo giá PDF thành Excel
|
||||
- Giúp bạn sắp xếp hàng loạt thông tin khách hàng
|
||||
- Giúp bạn sửa CV / sửa văn bản / chuyển đổi / lưu trữ
|
||||
|
||||
Loại dịch vụ này phía sau thường không phải nhu cầu một lần, mà là quy trình làm việc lặp lại.
|
||||
|
||||
### Xem quy trình làm việc hoàn chỉnh, thay vì chỉ xem danh sách idea
|
||||
|
||||
Đôi khi cách trực tiếp nhất là chọn một ngành, xem qua quy trình, tìm các bước vẫn đang hoàn thành bằng WeChat, Excel, giấy bút, điện thoại.
|
||||
|
||||
- Ngoại thương: Tìm nhà cung cấp, hỏi giá, so sánh giá, làm báo giá, gửi cho khách hàng, theo dõi phản hồi, sắp xếp kiểm hàng, book tàu, khai báo hải quan.
|
||||
Điểm vào đáng xem: Sắp xếp báo giá nhà cung cấp thành báo giá khách hàng.
|
||||
- Phòng khám nha khoa: Tiếp nhận, chụp X-quang, đọc phim, trao đổi phương án, theo dõi, điều trị, tái khám.
|
||||
Điểm vào đáng xem: Giải thích phương án cho bệnh nhân và theo dõi liên tục.
|
||||
- Công trường xây dựng: Tuần tra, chụp ảnh, gửi group, sắp xếp báo cáo, giao cho chủ đầu tư.
|
||||
Điểm vào đáng xem: Từ ảnh hiện trường đến báo cáo tuân thủ.
|
||||
|
||||
<a id="idea-vc"></a>
|
||||
## [4. Nguồn VC / Gia tốc: Xem "sóng đánh về phía nào"](#top-idea-sources)
|
||||
|
||||
Loại nguồn này phù hợp giúp bạn tìm hướng lớn, không phù hợp thay thế xác minh.
|
||||
|
||||
- [Y Combinator — Requests for Startups](https://www.ycombinator.com/rfs)
|
||||
Cách dùng: Phù hợp tìm điểm vào, vì nó thường trực tiếp nói "chúng tôi muốn thấy ai đó làm việc này".
|
||||
- [a16z — Big Ideas](https://a16z.com/big-ideas-2025/)
|
||||
Cách dùng: Thiên về xu hướng lớn và đánh giá đường đua, phù hợp xây dựng cảm nhận ngành.
|
||||
- [NFX](https://www.nfx.com/)
|
||||
Cách dùng: Phù hợp quét nhanh một nhóm đề tài khởi nghiệp.
|
||||
- [Sequoia Capital](https://www.sequoiacap.com/article/)
|
||||
Cách dùng: Không nhất thiết trực tiếp liệt kê ý tưởng, nhưng thường nói về loại biến đổi nền tảng và cơ hội nào.
|
||||
- [First Round Review](https://review.firstround.com/)
|
||||
Cách dùng: Phù hợp đào sâu một hướng nào đó, không nhất thiết là danh sách ý tưởng, nhưng chất lượng bài viết thường rất cao.
|
||||
|
||||
Ưu điểm của loại nguồn này:
|
||||
|
||||
- Có thể cho bạn biết hướng nào đáng xem trong tương lai
|
||||
- Có thể cho bạn biết đường đua nào có thể được thúc đẩy liên tục
|
||||
- Có thể giúp bạn nhanh chóng bước vào bối cảnh của một đường đua
|
||||
|
||||
Hạn chế của loại nguồn này:
|
||||
|
||||
- Thường là góc nhìn nhà đầu tư
|
||||
- Không nhất thiết cho bạn biết vai trò nào đau nhất
|
||||
- Không nhất thiết cho bạn biết bước nào trong quy trình bị kẹt nhất
|
||||
- Không nhất thiết cho bạn biết hôm nay ai đã sẵn sàng trả tiền cho việc này
|
||||
|
||||
Cách dùng tốt hơn là: Dùng chúng để tìm hướng trước, rồi quay lại sản phẩm tham khảo, diễn đàn ngành, thông tin mua sắm và quy trình làm việc thực tế để tìm điểm vào cụ thể hơn.
|
||||
|
||||
<a id="idea-path"></a>
|
||||
## [5. Đường ngắn nhất phù hợp cho "người không có ý tưởng, chỉ biết làm trợ lý"](#top-idea-sources)
|
||||
|
||||
Nếu chỉ đi một đường ngắn nhất, có thể làm như sau:
|
||||
|
||||
1. Bước 1, 30 phút.
|
||||
Mở [r/SomebodyMakeThis](https://www.reddit.com/r/SomebodyMakeThis/), sắp xếp theo `Top -> Past Year`, nhanh chóng quét 50 bài viết, lưu lại tất cả các hướng bạn thấy "có vẻ tôi có thể làm".
|
||||
2. Bước 2, 30 phút.
|
||||
Mở [Starter Story](https://www.starterstory.com/) hoặc [Indie Hackers Products](https://www.indiehackers.com/products), sắp xếp theo doanh thu, xem sản phẩm doanh thu trung bình, đừng chỉ xem thành công nhất. Tìm hướng liên quan đến bước 1, xem họ cụ thể bán cho ai, giải quyết bước nào.
|
||||
3. Bước 3, 20 phút.
|
||||
Vào [Google Trends](https://trends.google.com/) tìm từ khóa liên quan, xem xu hướng có đang tăng trưởng không, sau đó xem từ "tăng vọt" trong "truy vấn liên quan".
|
||||
4. Bước 4, 20 phút.
|
||||
Vào G2 / Capterra / diễn đàn ngành / nền tảng đấu thầu / Fiverr, xem hướng này hôm nay phiền nhất ở đâu, đâu vẫn đang dựa vào thủ công.
|
||||
|
||||
Sau khi xem xong, nói rõ được câu sau là đủ:
|
||||
|
||||
- Một loại người nào đó, trong kịch bản nào đó, bị kẹt ở bước nào trong quy trình, hiện chủ yếu dựa vào cách vụng về nào đó để cầm cự.
|
||||
|
||||
<a id="idea-ai"></a>
|
||||
## [6. AI giúp bạn thế nào](#top-idea-sources)
|
||||
|
||||
Trọng tâm của bài này không phải AI, nhưng AI rất phù hợp để làm sắp xếp.
|
||||
|
||||
Cách dùng thực tế nhất chỉ có hai:
|
||||
|
||||
- Dán các link, tiêu đề bài viết, lời gốc của người dùng bạn lướt được cho AI, để nó giúp bạn phân loại theo "nhóm người / kịch bản / điểm đau / giải pháp thay thế".
|
||||
- Để AI giúp bạn thu hàng thông tin lộn xộn thành 3 hướng ứng viên, thay vì tiếp tục phân tán ra 50 chức năng.
|
||||
|
||||
Có thể trực tiếp hỏi như sau:
|
||||
|
||||
```text
|
||||
Tôi gần đây lướt được các nguồn sau:
|
||||
1. [Dán tiêu đề hoặc lời gốc]
|
||||
2. [Dán tiêu đề hoặc lời gốc]
|
||||
3. [Dán tiêu đề hoặc lời gốc]
|
||||
|
||||
Xin đừng cho tôi danh sách chức năng.
|
||||
Chỉ làm 3 việc:
|
||||
1. Phân loại theo nhóm người và kịch bản
|
||||
2. Tìm ra bước phiền phức xuất hiện lặp lại
|
||||
3. Giúp tôi sắp xếp thành 3 hướng ứng viên cụ thể hơn
|
||||
```
|
||||
|
||||
## Đọc thêm
|
||||
|
||||
- [Y Combinator - Requests for Startups](https://www.ycombinator.com/rfs)
|
||||
- [a16z - Big Ideas](https://a16z.com/big-ideas-2025/)
|
||||
- [NFX](https://www.nfx.com/)
|
||||
- [Reddit - r/SomebodyMakeThis](https://www.reddit.com/r/SomebodyMakeThis/)
|
||||
- [Reddit - r/AppIdeas](https://www.reddit.com/r/AppIdeas/)
|
||||
- [Reddit - r/Startup_Ideas](https://www.reddit.com/r/Startup_Ideas/)
|
||||
- [Starter Story](https://www.starterstory.com/)
|
||||
- [Indie Hackers - Products](https://www.indiehackers.com/products)
|
||||
- [Product Hunt](https://www.producthunt.com/)
|
||||
- [BetaList](https://betalist.com/)
|
||||
- [IdeasAI](https://ideasai.com/)
|
||||
- [Unvalidated Ideas](https://unvalidatedideas.com/)
|
||||
- [Google Trends](https://trends.google.com/)
|
||||
- [Exploding Topics](https://explodingtopics.com/)
|
||||
- [G2](https://www.g2.com/)
|
||||
- [Capterra](https://www.capterra.com/)
|
||||
@@ -0,0 +1,765 @@
|
||||
---
|
||||
title: 'Tham chiếu hướng ứng dụng B2B trong các ngành công nghiệp'
|
||||
description: 'Tài liệu này tổng hợp các ứng dụng thực tế của mô hình ngôn ngữ lớn (LLM) trong các kịch bản doanh nghiệp B2B, bao gồm sản xuất công nghiệp, chăm sóc khách hàng thông minh, giáo dục, lập trình thông minh, y tế, an ninh mạng, tài chính, dịch vụ doanh nghiệp và các lĩnh vực khác, cung cấp tài liệu tham khảo cho các nhà phát triển ứng dụng AI hướng tới khách hàng doanh nghiệp.'
|
||||
---
|
||||
|
||||
<script setup>
|
||||
import { computed, ref } from 'vue'
|
||||
|
||||
const duration = 'Khoảng <strong>6 giờ</strong>'
|
||||
|
||||
const interestPoint = ref('')
|
||||
const purpose = ref('')
|
||||
|
||||
// Mỗi ngành có một pool chủ đề
|
||||
const topicPool = {
|
||||
'manufacturing': [
|
||||
{ title: 'Nền tảng thiết kế hỗ trợ AI ngoại hình xe buýt năng lượng mới', desc: 'Thiết kế khái niệm ngoại hình dựa trên mô hình tạo ảnh' },
|
||||
{ title: 'Trợ lý thiết kế và kiểm tra bản vẽ thông minh', desc: 'Xây dựng kho kiến thức quy tắc thiết kế doanh nghiệp bằng công nghệ RAG' },
|
||||
{ title: 'Tự động tạo và quản lý tài liệu kỹ thuật', desc: 'Tự động tạo tài liệu quy cách sản phẩm và hướng dẫn sử dụng dựa trên LLM' },
|
||||
{ title: 'Trợ lý tự động tạo báo cáo kiểm tra thiết bị sản xuất', desc: 'Mô tả tình trạng thiết bị bằng giọng nói, tạo báo cáo kiểm tra có cấu trúc' },
|
||||
{ title: 'Trợ lý hỏi đáp chẩn đoán lỗi thiết bị công nghiệp', desc: 'Xây dựng kho kiến thức vector dựa trên lịch sử lỗi thiết bị' }
|
||||
],
|
||||
'customer-service': [
|
||||
{ title: 'Hệ thống phản hồi tự động và tạo ticket chăm sóc khách hàng đa kênh', desc: 'Kết nối tin nhắn đa kênh, LLM hiểu ý định và tạo phản hồi' },
|
||||
{ title: 'Trợ lý khai thác và theo dõi khách hàng tiềm năng', desc: 'Phân tích lịch sử hội thoại, nhận diện khách hàng có ý định cao' },
|
||||
{ title: 'Trợ lý tìm kiếm và hỏi đáp kiến thức nội bộ doanh nghiệp', desc: 'Xây dựng kho kiến thức vector dựa trên tài liệu nội bộ' },
|
||||
{ title: 'Công cụ tóm tắt hội thoại CSKH và tạo ticket', desc: 'Tự động tóm tắt hội thoại và trích xuất thông tin quan trọng' },
|
||||
{ title: 'Hệ thống kho kiến thức kịch bản CSKH xuất sắc', desc: 'Phân tích ca tốt, đúc kết mẫu kịch bản xuất sắc' }
|
||||
],
|
||||
'education': [
|
||||
{ title: 'Hệ thống lập lộ trình học ngôn ngữ cá nhân hóa và hướng dẫn thông minh', desc: 'Đánh giá trình độ người học, lập kế hoạch học tập hàng ngày' },
|
||||
{ title: 'Nền tảng soạn giáo án tự động và đẩy tài liệu giảng dạy', desc: 'Tạo khung giáo án theo chương trình học' },
|
||||
{ title: 'Hệ thống chấm bài tự động và chẩn đoán tình hình học tập', desc: 'Tự động chấm câu hỏi tự luận và tạo đề xuất chấm' },
|
||||
{ title: 'Xây dựng mô hình năng lực vị trí và bản đồ học tập', desc: 'Phân tích JD vị trí, trích xuất yêu cầu năng lực' },
|
||||
{ title: 'Thực hành giao tiếp ngoại ngữ 1-1 theo tình huống', desc: 'LLM đóng vai trò khác nhau để hội thoại giao tiếp' }
|
||||
],
|
||||
'programming': [
|
||||
{ title: 'Trợ lý gợi ý code thông minh và sửa Bug tự động', desc: 'Plugin IDE gợi ý code theo thời gian thực' },
|
||||
{ title: 'Nền tảng xây dựng ứng dụng low-code và tự động hóa quy trình', desc: 'Mô tả yêu cầu bằng ngôn ngữ tự nhiên, chuyển đổi thành cấu hình low-code' },
|
||||
{ title: 'Hệ thống tạo test case đơn vị', desc: 'AST phân tích mã nguồn, tạo test case cho điều kiện biên' },
|
||||
{ title: 'Công cụ phân tích code thông minh và chuyển đổi ngôn ngữ', desc: 'Phân tích chất lượng code và đưa ra đề xuất tối ưu' },
|
||||
{ title: 'Công cụ tự động tạo code giao diện (UI) frontend', desc: 'Nhận diện ảnh thiết kế, tạo CSS responsive' }
|
||||
],
|
||||
'healthcare': [
|
||||
{ title: 'Trợ lý giải thích báo cáo xét nghiệm y khoa thông minh', desc: 'OCR nhận diện chỉ số quan trọng, giải thích giá trị bất thường' },
|
||||
{ title: 'Chuyên gia tư vấn sức khỏe dựa trên công nghệ truy xuất kiến thức', desc: 'Xây dựng biểu đồ kiến thức y khoa, RAG truy xuất và tạo câu trả lời' },
|
||||
{ title: 'Nền tảng phân tích quyết định dữ liệu nghiên cứu lâm sàng', desc: 'Tích hợp dữ liệu EMR, hỗ trợ tạo code thống kê phân tích' },
|
||||
{ title: 'Công cụ tự động tạo báo cáo hình ảnh y khoa', desc: 'Mô tả đặc điểm hình ảnh, tự động tạo báo cáo có cấu trúc' },
|
||||
{ title: 'Trợ lý nhắc thuốc thông minh quản lý bệnh mãn tính', desc: 'Tạo nhắc thuốc cá nhân hóa, hỗ trợ kiểm tra tương tác thuốc' }
|
||||
],
|
||||
'security': [
|
||||
{ title: 'Engine phát hiện và sửa lỗi bảo mật code', desc: 'SAST quét code, phân tích nguyên lý lỗ hổng' },
|
||||
{ title: 'Hệ thống nhận diện và chặn email phishing do AI tạo', desc: 'Phân tích nội dung email, nhận diện email phishing do AI tạo' },
|
||||
{ title: 'Trợ lý tự động tạo báo cáo vận hành bảo mật hàng ngày', desc: 'Tổng hợp log, tự động trích xuất sự kiện quan trọng' },
|
||||
{ title: 'Trợ lý tạo báo cáo kiểm thử xâm nhập thông minh', desc: 'Tự động tạo báo cáo theo mô tả lỗ hổng' },
|
||||
{ title: 'Trợ lý truy vấn và phân tích thông tin đe dọa thông minh', desc: 'Kết nối đa nguồn thông tin đe dọa, giải thích nội dung' }
|
||||
],
|
||||
'finance': [
|
||||
{ title: 'Trợ lý tạo báo cáo thẩm tín tín dụng thông minh', desc: 'Nhập dữ liệu tài chính, tự động tạo báo cáo thẩm tín' },
|
||||
{ title: 'Cố vấn quản lý tài sản ngân hàng tư nhân thông minh', desc: 'Phân tích mức độ rủi ro khách hàng, tạo đề xuất phân bổ tài sản' },
|
||||
{ title: 'Trợ lý tạo và kiểm tra tuân thủ prospectus IPO thông minh', desc: 'Mẫu template theo module, tự động điền mô tả kinh doanh' },
|
||||
{ title: 'Hệ thống tự động tạo báo cáo tài chính và cảnh báo bất thường kinh doanh', desc: 'Tự động tạo phân tích tài chính và thảo luận ban quản lý' },
|
||||
{ title: 'Trợ lý luyện tập kịch bản đại lý bảo hiểm thông minh', desc: 'Mô phỏng hội thoại, đánh giá tính tuân thủ và sức thuyết phục' }
|
||||
],
|
||||
'enterprise': [
|
||||
{ title: 'Nền tảng kiểm tra tuân thủ và đề xuất sửa đổi hợp đồng doanh nghiệp toàn vòng đời', desc: 'So sánh điều khoản với cơ sở dữ liệu luật pháp, tạo báo cáo kiểm tra tuân thủ' },
|
||||
{ title: 'Chuyển đổi giọng nói hội thoại bán hàng và đề xuất kịch bản', desc: 'Chuyển đổi ASR, phân tích hội thoại và đề xuất kịch bản xuất sắc' },
|
||||
{ title: 'Hệ thống tạo và thiết kế nội dung marketing thông minh', desc: 'Tạo nội dung marketing và trích xuất điểm bán hàng' },
|
||||
{ title: 'Nền tảng phân tích quảng cáo đối thủ', desc: 'Thu thập quảng cáo đối thủ, phân tích chiến lược' },
|
||||
{ title: 'Hệ thống phân tích chủ đề nóng toàn mạng và đề xuất nội dung thông minh', desc: 'Phân tích xu hướng chủ đề nóng và đề xuất góc tiếp cận' }
|
||||
],
|
||||
'content': [
|
||||
{ title: 'Nền tảng hỗ trợ sáng tạo nội dung phim ảnh và tiểu thuyết', desc: 'Cung cấp tóm tắt cốt truyện, thiết lập nhân vật, tạo thoại' },
|
||||
{ title: 'Trợ lý viết câu chuyện thương hiệu và bài PR doanh nghiệp thông minh', desc: 'Nhập từ khóa thương hiệu, tạo nội dung đa phong cách' },
|
||||
{ title: 'Hệ thống tương tác livestream và quản lý đẩy stream người ảo', desc: 'Hình ảnh người ảo + giọng nói TTS + hội thoại LLM' },
|
||||
{ title: 'Tạo kịch bản video ngắn và chỉnh sửa thông minh', desc: 'Tạo kịch bản video ngắn và phân cảnh' },
|
||||
{ title: 'Hệ thống tạo và thiết kế nội dung marketing thông minh', desc: 'Tạo nội dung marketing và trích xuất điểm bán hàng' }
|
||||
],
|
||||
'government': [
|
||||
{ title: 'Hệ thống điều hướng giọng nói thông minh và phân công tự động đường dây nóng 12345', desc: 'Nhận diện giọng nói, hiểu yêu cầu và phân công thông minh' },
|
||||
{ title: 'Robot hướng dẫn thông minh và hỏi đáp chính sách tại đại dịch vụ hành chính', desc: 'RAG truy xuất kho kiến thức hành chính' },
|
||||
{ title: 'Nền tảng đối chiếu và đẩy thông minh chính sách hỗ trợ doanh nghiệp', desc: 'Đối chiếu hồ sơ doanh nghiệp với chính sách phù hợp' },
|
||||
{ title: 'Trợ lý kiểm tra trước và xác nhận tuân thủ tài liệu hành chính thông minh', desc: 'Nhận diện OCR và trích xuất thông tin quan trọng' },
|
||||
{ title: 'Nền tảng nhận diện sự kiện lưới đô thị thông minh và điều phối quản lý', desc: 'Nhận diện loại sự kiện và phân công' }
|
||||
],
|
||||
'legal': [
|
||||
{ title: 'Agent phát hiện rủi ro hợp đồng một chạm', desc: 'Đối chiếu danh mục rủi ro để nhận diện vấn đề tiềm ẩn' },
|
||||
{ title: 'Cố vấn đánh giá tỷ lệ thắng kiện AI cho các vụ án tương tự', desc: 'Trích xuất đặc điểm vụ án, tìm kiếm và đối chiếu vụ án tương tự' },
|
||||
{ title: 'Radar theo dõi thay đổi luật pháp và phân tích tác động kinh doanh', desc: 'Phân tích nội dung thay đổi và đánh giá tác động kinh doanh' },
|
||||
{ title: 'Công cụ soạn thư luật sư AIGC tự động', desc: 'Nhập trình bày sự kiện, tạo thư luật sư chuẩn mực' },
|
||||
{ title: 'Plugin giải thích điều khoản pháp luật phức tạp sang ngôn ngữ dễ hiểu', desc: 'Tạo giải thích dễ hiểu' }
|
||||
],
|
||||
'travel': [
|
||||
{ title: 'Trình tạo lịch trình du lịch lười dựa trên AIGC', desc: 'Tạo lịch trình hàng ngày' },
|
||||
{ title: 'Robot dự đoán xu hướng giá vé máy bay khách sạn toàn mạng và tự động khóa giá rẻ', desc: 'Mô hình ML dự đoán xu hướng giá' },
|
||||
{ title: 'Hệ thống hỗ trợ kiểm tra trước tài liệu visa và điền form tự động', desc: 'Nhận diện OCR kiểm tra tính đầy đủ thông tin' },
|
||||
{ title: 'Trợ lý dịch giọng nói thời gian thực và dịch menu thị giác khi du lịch nước ngoài', desc: 'Dịch giọng nói ngoại tuyến, OCR ảnh menu' },
|
||||
{ title: 'Trợ lý tự động tạo bài du ký và nội dung mạng xã hội từ dấu chân du lịch', desc: 'Trích xuất thông tin ảnh, tạo nội dung bài du ký' }
|
||||
],
|
||||
'emotion': [
|
||||
{ title: 'Người bạn đồng hành ảo 24 giờ dựa trên mô hình LLM', desc: 'Hệ thống ghi nhớ lưu trữ lịch sử hội thoại' },
|
||||
{ title: 'Cố vấn AI nhận diện cảm xúc đa phương thức và tư vấn tâm lý', desc: 'Phân tích ngữ điệu giọng nói + nhận diện cảm xúc văn bản' },
|
||||
{ title: 'Người ảo AI huấn luyện nhận thức và kích thích trí nhớ cho người bệnh Alzheimer', desc: 'Huấn luyện trò chơi nhận thức, ảnh cũ kích thích trí nhớ' },
|
||||
{ title: 'Huấn luyện viên mô phỏng giao tiếp xã hội AIGC cho người hướng nội', desc: 'Mô phỏng tình huống giao tiếp xã hội ảo' },
|
||||
{ title: 'Trợ lý theo dõi tâm trạng và kích thích cảm xúc tích cực AI toàn thời gian', desc: 'Phân tích xu hướng tâm trạng và tạo nội dung khích lệ' }
|
||||
],
|
||||
'entertainment': [
|
||||
{ title: 'Engine quyết định tự chủ NPC game thế giới mở dựa trên LLM', desc: 'Cây hành vi NPC kết hợp quyết định LLM' },
|
||||
{ title: 'Công cụ hỗ trợ DM với diễn biến cốt truyện AIGC cho game kịch bản nhập vai', desc: 'Lựa chọn người chơi kích hoạt nhánh cốt truyện' },
|
||||
{ title: 'Trình sửa đổi kết thúc truyện tương tác dạng sinh', desc: 'Lựa chọn độc giả ảnh hướng đi cốt truyện' },
|
||||
{ title: 'Phân tích thị giác CV và bình luận viên AI thông minh cho trận đấu e-sports', desc: 'Phân tích thời gian thực màn hình game' },
|
||||
{ title: 'Hệ thống tự động tạo sách nói TTS đa vai', desc: 'Phân vai văn bản, tạo giọng nói cá nhân hóa' }
|
||||
],
|
||||
'ecommerce': [
|
||||
{ title: 'Công cụ sản xuất hàng loạt trang chi tiết sản phẩm AIGC tỷ lệ chuyển đổi cao', desc: 'Tạo nội dung điểm bán hàng và mô tả kịch bản' },
|
||||
{ title: 'Nhà máy tạo video người mẫu ảo thử đồ AI cho ngành may mặc', desc: 'Tạo hiệu ứng thử đồ người mẫu ảo' },
|
||||
{ title: 'Trợ lý dịch thuật và biên tập bản địa hóa đa ngôn ngữ LLM cho thương mại điện tử xuyên biên giới', desc: 'Dịch mô tả sản phẩm đa ngôn ngữ' },
|
||||
{ title: 'Hệ thống livestream bán hàng người ảo AIGC toàn thời gian 24 giờ', desc: 'Hình ảnh người ảo + tạo kịch bản thời gian thực' },
|
||||
{ title: 'Engine dự đoán xu hướng thị trường AI và dự đoán sản phẩm hot', desc: 'Phát hiện xu hướng hot, đề xuất lựa chọn sản phẩm' }
|
||||
],
|
||||
'energy': [
|
||||
{ title: 'Cố vấn phân tích hành vi tiêu điện gia đình và chiến lược tiết kiệm năng lượng AI', desc: 'Phân tích mô hình tiêu điện, tạo đề xuất tiết kiệm' },
|
||||
{ title: 'Hệ thống nhận diện thị giác CV drone phát hiện lỗi linh kiện quang điện', desc: 'Drone kiểm tra chụp ảnh, phân tích ảnh nhiệt hồng ngoại' },
|
||||
{ title: 'Agent dự đoán xu hướng giá giao dịch điện thời gian thực AI và chiến lược sinh lời tự động', desc: 'Mô hình dự đoán giá, tạo chiến lược' },
|
||||
{ title: 'Trợ lý tự động tính toán phát thải carbon toàn chuỗi doanh nghiệp và tạo báo cáo ESG AI', desc: 'Tính toán hệ số phát thải carbon, tạo báo cáo ESG' },
|
||||
{ title: 'Hệ thống dự đoán phụ tải AI thời tiết cực đoan và chỉ huy điều phối khẩn cấp lưới điện', desc: 'Mô hình dự đoán phụ tải, tạo chiến lược điều phối' }
|
||||
],
|
||||
'av-media': [
|
||||
{ title: 'Công cụ nhận diện đoạn hay AI và tự động cắt video ngắn từ video dài', desc: 'Phân tích nội dung video, nhận diện khung hình quan trọng' },
|
||||
{ title: 'Trợ lý tách tiếng ồn nền AI và tăng cường giọng nói video', desc: 'Mô hình tách âm thanh, loại bỏ tiếng ồn nền' },
|
||||
{ title: 'Bàn làm việc phục hồi siêu phân giải 4K và tự động tô màu AI cho video cũ', desc: 'Mô hình siêu phân giải video, tự động tô màu AI' },
|
||||
{ title: 'Hệ thống kiểm soát cảm xúc và lồng tiếng TTS chuyển văn bản thành giọng người thật', desc: 'Mô hình TTS đa giọng, kiểm soát cảm xúc' },
|
||||
{ title: 'Trợ lý chuyển đổi giọng nói thông minh và trích xuất việc cần làm từ ghi âm cuộc họp AI', desc: 'Tách và chuyển đổi giọng nói cuộc họp nhiều người' }
|
||||
],
|
||||
'ai-marketing': [
|
||||
{ title: 'Engine AIGC tự động viết nội dung viral trên Xiaohongshu', desc: 'Tạo nội dung review sản phẩm, tối ưu emoji' },
|
||||
{ title: 'Công cụ bố trí AI poster marketing và thích ứng đa kích thước', desc: 'Khớp mẫu template poster thông minh' },
|
||||
{ title: 'Nền tảng tạo sáng tạo LOGO thương hiệu AIGC và xây dựng hệ thống VI', desc: 'Tạo sáng tạo LOGO, tạo quy phạm VI' },
|
||||
{ title: 'Trợ lý theo dõi chủ đề nóng AI toàn mạng và tạo sáng tạo marketing', desc: 'Phân tích góc marketing, tạo đề án sáng tạo' },
|
||||
{ title: 'Trợ lý tạo sáng tạo kịch bản video ngắn AIGC và hướng dẫn phân cảnh', desc: 'Tạo kịch bản và phân cảnh, đề xuất quay phim' }
|
||||
],
|
||||
'data-intelligence': [
|
||||
{ title: 'Công cụ tự động chuyển đổi ngôn ngữ tự nhiên thành câu lệnh SQL', desc: 'Chuyển đổi truy vấn ngôn ngữ tự nhiên thành SQL' },
|
||||
{ title: 'Hệ thống kiểm kê và phân loại tài sản dữ liệu doanh nghiệp thông minh', desc: 'Thu thập metadata, phân loại tự động' },
|
||||
{ title: 'Engine phát hiện bất thường chất lượng dữ liệu và đề xuất sửa chữa tự động', desc: 'Engine quy tắc + mô hình ML phát hiện bất thường' },
|
||||
{ title: 'Trợ lý tạo báo cáo thông minh và cấu hình trực quan hóa', desc: 'Tạo cấu hình báo cáo theo kiểu hội thoại' },
|
||||
{ title: 'Trợ lý hỏi đáp về chỉ tiêu dữ liệu thông minh', desc: 'Xây dựng kho kiến thức dựa trên tài liệu định nghĩa chỉ tiêu' }
|
||||
]
|
||||
}
|
||||
|
||||
// Bảng ánh xạ đường dẫn khuyến nghị được xác định trước
|
||||
const recommendationMap = {
|
||||
// Điểm quan tâm: Sáng tạo nội dung
|
||||
'creative-content': {
|
||||
'increase-efficiency': ['content', 'av-media', 'ai-marketing', 'entertainment'],
|
||||
'reduce-cost': ['content', 'ecommerce', 'ai-marketing'],
|
||||
'improve-experience': ['entertainment', 'emotion', 'travel', 'content'],
|
||||
'innovate-business': ['ai-marketing', 'content', 'av-media', 'entertainment']
|
||||
},
|
||||
// Điểm quan tâm: Dịch vụ kỹ thuật
|
||||
'tech-service': {
|
||||
'increase-efficiency': ['programming', 'enterprise', 'data-intelligence', 'customer-service'],
|
||||
'reduce-cost': ['programming', 'enterprise', 'manufacturing'],
|
||||
'improve-experience': ['customer-service', 'enterprise', 'programming'],
|
||||
'innovate-business': ['data-intelligence', 'programming', 'security', 'enterprise']
|
||||
},
|
||||
// Điểm quan tâm: Trí tuệ dữ liệu
|
||||
'data-intel': {
|
||||
'increase-efficiency': ['data-intelligence', 'finance', 'enterprise', 'manufacturing'],
|
||||
'reduce-cost': ['data-intelligence', 'manufacturing', 'energy'],
|
||||
'improve-experience': ['data-intelligence', 'customer-service', 'ecommerce'],
|
||||
'innovate-business': ['data-intelligence', 'finance', 'security', 'ai-marketing']
|
||||
},
|
||||
// Điểm quan tâm: Dịch vụ người dùng
|
||||
'user-service': {
|
||||
'increase-efficiency': ['customer-service', 'ecommerce', 'travel', 'enterprise'],
|
||||
'reduce-cost': ['customer-service', 'ecommerce', 'enterprise'],
|
||||
'improve-experience': ['customer-service', 'emotion', 'travel', 'ecommerce', 'entertainment'],
|
||||
'innovate-business': ['ecommerce', 'travel', 'emotion', 'entertainment']
|
||||
},
|
||||
// Điểm quan tâm: Giải pháp ngành
|
||||
'industry-solution': {
|
||||
'increase-efficiency': ['manufacturing', 'healthcare', 'finance', 'government'],
|
||||
'reduce-cost': ['manufacturing', 'energy', 'enterprise', 'finance'],
|
||||
'improve-experience': ['healthcare', 'education', 'government', 'travel'],
|
||||
'innovate-business': ['finance', 'security', 'legal', 'healthcare', 'government']
|
||||
}
|
||||
}
|
||||
|
||||
const interestOptions = [
|
||||
{ label: 'Sáng tạo nội dung', value: 'creative-content', desc: 'Nội dung sáng tạo như văn bản, hình ảnh, video' },
|
||||
{ label: 'Công cụ dịch vụ kỹ thuật', value: 'tech-service', desc: 'Công cụ phát triển, tự động hóa, hỗ trợ code' },
|
||||
{ label: 'Phân tích trí tuệ dữ liệu', value: 'data-intel', desc: 'Phân tích dữ liệu, dự đoán, quyết định thông minh' },
|
||||
{ label: 'Trải nghiệm dịch vụ người dùng', value: 'user-service', desc: 'Chăm sóc khách hàng, marketing, trải nghiệm người dùng' },
|
||||
{ label: 'Giải pháp ngành', value: 'industry-solution', desc: 'Ứng dụng chuyên sâu trong ngành cụ thể' }
|
||||
]
|
||||
|
||||
const purposeOptions = [
|
||||
{ label: 'Tăng hiệu suất', value: 'increase-efficiency', desc: 'Tự động hóa, tăng tốc quy trình' },
|
||||
{ label: 'Giảm chi phí', value: 'reduce-cost', desc: 'Giảm nhân lực, tối ưu nguồn lực' },
|
||||
{ label: 'Cải thiện trải nghiệm', value: 'improve-experience', desc: 'Mức độ hài lòng người dùng, chất lượng dịch vụ' },
|
||||
{ label: 'Đổi mới kinh doanh', value: 'innovate-business', desc: 'Sản phẩm mới, mô hình mới' }
|
||||
]
|
||||
|
||||
const industries = [
|
||||
{ key: 'manufacturing', name: 'Sản xuất công nghiệp', anchor: '#_1-san-xuat-cong-nghiep' },
|
||||
{ key: 'customer-service', name: 'Chăm sóc khách hàng thông minh', anchor: '#_2-cham-soc-khach-hang-thong-minh' },
|
||||
{ key: 'education', name: 'Ngành giáo dục', anchor: '#_3-nganh-giao-duc' },
|
||||
{ key: 'programming', name: 'Lập trình thông minh', anchor: '#_4-lap-trinh-thong-minh' },
|
||||
{ key: 'healthcare', name: 'Y tế', anchor: '#_5-y-te' },
|
||||
{ key: 'security', name: 'An ninh mạng', anchor: '#_6-an-ninh-mang' },
|
||||
{ key: 'finance', name: 'Quản lý tài chính, ngân hàng bảo hiểm', anchor: '#_7-quan-ly-tai-chinh-ngan-hang-bao-hiem' },
|
||||
{ key: 'enterprise', name: 'Dịch vụ doanh nghiệp', anchor: '#_8-dich-vu-doanh-nghiep' },
|
||||
{ key: 'content', name: 'Sản xuất và vận hành nội dung', anchor: '#_9-san-xuat-va-van-hanh-noi-dung' },
|
||||
{ key: 'government', name: 'Quản trị hành chính thông minh', anchor: '#_10-quan-tri-hanh-chinh-thong-minh' },
|
||||
{ key: 'legal', name: 'Pháp lý và quản lý hợp đồng', anchor: '#_11-phap-ly-va-quan-ly-hop-dong' },
|
||||
{ key: 'travel', name: 'Du lịch và dịch vụ đi lại', anchor: '#_12-du-lich-va-dich-vu-di-lai' },
|
||||
{ key: 'emotion', name: 'Đồng hành cảm xúc', anchor: '#_13-dong-hanh-cam-xuc' },
|
||||
{ key: 'entertainment', name: 'Giải trí', anchor: '#_14-giai-tri' },
|
||||
{ key: 'ecommerce', name: 'Thương mại điện tử', anchor: '#_15-thuong-mai-dien-tu' },
|
||||
{ key: 'energy', name: 'Năng lượng', anchor: '#_16-nang-luong' },
|
||||
{ key: 'av-media', name: 'Âm thanh và video', anchor: '#_17-am-thanh-va-video' },
|
||||
{ key: 'ai-marketing', name: 'Marketing AI', anchor: '#_18-marketing-ai' },
|
||||
{ key: 'data-intelligence', name: 'Trí tuệ dữ liệu', anchor: '#_19-tri-tue-du-lieu' }
|
||||
]
|
||||
|
||||
// Tính kết quả khuyến nghị - lấy ngẫu nhiên từ pool chủ đề
|
||||
const recommendationTopics = computed(() => {
|
||||
if (!interestPoint.value || !purpose.value) return []
|
||||
|
||||
const keys = recommendationMap[interestPoint.value]?.[purpose.value] || []
|
||||
const topics = []
|
||||
|
||||
// Lấy ngẫu nhiên 1-2 chủ đề từ mỗi ngành được khuyến nghị
|
||||
keys.forEach(key => {
|
||||
const industry = industries.find(item => item.key === key)
|
||||
const industryTopics = topicPool[key] || []
|
||||
|
||||
if (industry && industryTopics.length > 0) {
|
||||
// Lấy ngẫu nhiên 1-2 chủ đề
|
||||
const count = Math.floor(Math.random() * 2) + 1
|
||||
const shuffled = [...industryTopics].sort(() => Math.random() - 0.5)
|
||||
const selected = shuffled.slice(0, Math.min(count, shuffled.length))
|
||||
|
||||
selected.forEach(topic => {
|
||||
topics.push({
|
||||
...topic,
|
||||
industryKey: key,
|
||||
industryName: industry.name,
|
||||
industryAnchor: industry.anchor
|
||||
})
|
||||
})
|
||||
}
|
||||
})
|
||||
|
||||
// Sắp xếp ngẫu nhiên và giới hạn tổng số
|
||||
return topics.sort(() => Math.random() - 0.5).slice(0, 8)
|
||||
})
|
||||
|
||||
// Lấy mô tả lựa chọn hiện tại
|
||||
const currentSelection = computed(() => {
|
||||
const interest = interestOptions.find(i => i.value === interestPoint.value)
|
||||
const pur = purposeOptions.find(p => p.value === purpose.value)
|
||||
return {
|
||||
interest: interest?.label || '',
|
||||
purpose: pur?.label || ''
|
||||
}
|
||||
})
|
||||
|
||||
const scrollToAnchor = (anchor) => {
|
||||
// Trì hoãn cuộn để đảm bảo DOM đã cập nhật
|
||||
setTimeout(() => {
|
||||
// Thử tìm theo ID (hỗ trợ nhiều định dạng)
|
||||
let element = document.querySelector(anchor)
|
||||
|
||||
// Nếu không tìm thấy, thử các định dạng ID khác
|
||||
if (!element) {
|
||||
// Thử bỏ tiền tố gạch dưới
|
||||
const altAnchor = anchor.replace('#_', '#')
|
||||
element = document.querySelector(altAnchor)
|
||||
}
|
||||
|
||||
// Nếu vẫn không tìm thấy, tìm theo văn bản tiêu đề
|
||||
if (!element) {
|
||||
// Trích xuất tên ngành từ anchor
|
||||
const anchorText = decodeURIComponent(anchor.replace('#', '').replace(/^_/, ''))
|
||||
const headings = document.querySelectorAll('h2, h3')
|
||||
|
||||
for (let heading of headings) {
|
||||
const headingText = heading.textContent.trim()
|
||||
// Khớp hoàn toàn hoặc khớp chứa
|
||||
const cleanHeading = headingText.replace(/^\d+\.\s*/, '')
|
||||
if (cleanHeading === anchorText || headingText.includes(anchorText)) {
|
||||
element = heading
|
||||
break
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (element) {
|
||||
element.scrollIntoView({
|
||||
behavior: 'smooth',
|
||||
block: 'start'
|
||||
})
|
||||
// Highlight đoạn mục tiêu
|
||||
element.style.backgroundColor = '#f0f9ff'
|
||||
element.style.transition = 'background-color 0.3s'
|
||||
element.style.padding = '8px'
|
||||
element.style.borderRadius = '4px'
|
||||
setTimeout(() => {
|
||||
element.style.backgroundColor = ''
|
||||
element.style.padding = ''
|
||||
}, 2000)
|
||||
}
|
||||
}, 100)
|
||||
}
|
||||
|
||||
const resetSelection = () => {
|
||||
interestPoint.value = ''
|
||||
purpose.value = ''
|
||||
}
|
||||
</script>
|
||||
|
||||
# Tham chiếu hướng ứng dụng B2B trong các ngành công nghiệp
|
||||
|
||||
## Đọc chương
|
||||
|
||||
<ChapterIntroduction :duration="duration" :tags="['Ứng dụng B2B', 'Ứng dụng ngành', 'Kịch bản AI', 'Tham chiếu triển khai', 'Giải pháp ngành']" coreOutput="Hiểu 15+ kịch bản ứng dụng B2B trong các ngành" expectedOutput="Tìm hướng dự án phù hợp với khách hàng doanh nghiệp">
|
||||
|
||||
Tài liệu này tổng hợp <strong>các ứng dụng thực tế của mô hình ngôn ngữ lớn (LLM) trong các kịch bản doanh nghiệp B2B</strong>. Khác với B2C tập trung vào trải nghiệm người dùng và cảm xúc, sản phẩm B2B chú trọng hơn vào <strong>giải quyết nhu cầu kinh doanh thực tế, tăng hiệu suất, giảm chi phí</strong>. Mỗi kịch bản đều có <strong>tính khả thi triển khai thực tế</strong>, bao gồm từ <strong>phân tích yêu cầu đến triển khai kỹ thuật</strong>, phù hợp làm tài liệu tham khảo cho nhà phát triển ứng dụng AI hướng tới khách hàng doanh nghiệp.
|
||||
|
||||
</ChapterIntroduction>
|
||||
|
||||
## Chọn nhanh hướng ngành
|
||||
|
||||
<el-card shadow="hover" style="margin-top: 16px; margin-bottom: 24px; border-left: 5px solid #409EFF;">
|
||||
<div style="font-weight: 600; margin-bottom: 8px;">Tìm kịch bản ứng dụng phù hợp với bạn</div>
|
||||
<div style="color: #606266; font-size: 14px; line-height: 1.6; margin-bottom: 12px;">
|
||||
Chọn hướng quan tâm và mục đích bạn muốn đạt được, hệ thống sẽ khuyến nghị các kịch bản ngành liên quan. Nhấp vào thẻ để chuyển đến chương tương ứng.
|
||||
</div>
|
||||
<el-row :gutter="16">
|
||||
<el-col :span="12">
|
||||
<el-select v-model="interestPoint" placeholder="Chọn hướng quan tâm" style="width: 100%;">
|
||||
<el-option
|
||||
v-for="item in interestOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value">
|
||||
<div style="display: flex; flex-direction: column;">
|
||||
<span>{{ item.label }}</span>
|
||||
<span style="font-size: 12px; color: #909399;">{{ item.desc }}</span>
|
||||
</div>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-select v-model="purpose" placeholder="Chọn mục đích" style="width: 100%;">
|
||||
<el-option
|
||||
v-for="item in purposeOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value">
|
||||
<div style="display: flex; flex-direction: column;">
|
||||
<span>{{ item.label }}</span>
|
||||
<span style="font-size: 12px; color: #909399;">{{ item.desc }}</span>
|
||||
</div>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<!-- Hiển thị kết quả khuyến nghị - dạng bảng -->
|
||||
<div v-if="recommendationTopics.length > 0" style="margin-top: 16px;">
|
||||
<div style="font-weight: 600; margin-bottom: 10px; color: #409EFF;">
|
||||
Khuyến nghị cho bạn {{ recommendationTopics.length }} kịch bản ứng dụng
|
||||
<span style="font-weight: normal; color: #909399; font-size: 13px; margin-left: 8px;">
|
||||
({{ currentSelection.interest }} + {{ currentSelection.purpose }})
|
||||
</span>
|
||||
</div>
|
||||
<el-table
|
||||
:data="recommendationTopics"
|
||||
style="width: 100%; cursor: pointer;"
|
||||
@row-click="(row) => scrollToAnchor(row.industryAnchor)"
|
||||
highlight-current-row>
|
||||
<el-table-column prop="title" label="Kịch bản ứng dụng" min-width="300">
|
||||
<template #default="scope">
|
||||
<div style="font-weight: 500; color: #303133;">{{ scope.row.title }}</div>
|
||||
<div style="font-size: 12px; color: #909399; margin-top: 4px;">{{ scope.row.desc }}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="industryName" label="Ngành" width="180" align="center">
|
||||
<template #default="scope">
|
||||
<el-tag type="info" effect="light" size="small">{{ scope.row.industryName }}</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<div style="margin-top: 10px; font-size: 12px; color: #909399;">
|
||||
Nhấp vào bất kỳ dòng nào trong bảng để chuyển đến chương ngành tương ứng
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Thông báo khi chưa chọn đủ -->
|
||||
<div v-else-if="!interestPoint || !purpose" style="margin-top: 14px; color: #909399; font-size: 13px;">
|
||||
<span v-if="!interestPoint && !purpose">Vui lòng chọn hướng quan tâm và mục đích</span>
|
||||
<span v-else-if="!interestPoint">Vui lòng chọn hướng quan tâm</span>
|
||||
<span v-else>Vui lòng chọn mục đích</span>
|
||||
</div>
|
||||
|
||||
<!-- Nút đặt lại -->
|
||||
<div v-if="interestPoint || purpose" style="margin-top: 12px;">
|
||||
<el-button size="small" @click="resetSelection">Chọn lại</el-button>
|
||||
</div>
|
||||
</el-card>
|
||||
|
||||
## Giới thiệu nhanh về các ngành
|
||||
|
||||
### Lựa chọn công nghệ chính
|
||||
|
||||
Trong phát triển ứng dụng AI, các hướng công nghệ phổ biến bao gồm:
|
||||
|
||||
1. **LLM (Mô hình ngôn ngữ lớn)**: Chuyên xử lý các tác vụ ngôn ngữ tự nhiên như hội thoại, tạo văn bản, tóm tắt, dịch thuật, v.v., phù hợp xây dựng ứng dụng chăm sóc khách hàng thông minh, sáng tạo nội dung, hỏi đáp kiến thức.
|
||||
2. **VLM (Mô hình ngôn ngữ thị giác)**: Kết hợp khả năng hiểu thị giác và ngôn ngữ, có thể thực hiện mô tả hình ảnh, hỏi đáp thị giác, tạo nội dung đa phương thức, phù hợp với phân tích hình ảnh y tế, kiểm tra chất lượng công nghiệp, thiết kế sáng tạo.
|
||||
3. **GenAI (AI sinh tạo)**: Bao gồm tạo văn bản, tạo hình ảnh (như Stable Diffusion, DALL-E), tạo video, v.v., có thể tạo nội dung sáng tạo nhanh chóng, phù hợp với hỗ trợ thiết kế, sản xuất tài liệu marketing, đào tạo giáo dục.
|
||||
|
||||
### Chiến lược lựa chọn
|
||||
|
||||
Người học có thể chọn hướng ứng dụng phù hợp theo các tiêu chí sau:
|
||||
|
||||
1. **Theo hướng quan tâm**: Ưu tiên chọn ngành hoặc hướng công nghệ mà mình yêu thích để duy trì động lực học tập. Ví dụ:
|
||||
- Quan tâm thiết kế sáng tạo: có thể thử ứng dụng sản xuất nội dung, thiết kế công nghiệp
|
||||
- Quan tâm thử thách kỹ thuật: có thể thử ứng dụng an ninh mạng, y tế
|
||||
- Quan tâm giá trị xã hội: có thể thử ứng dụng quản trị hành chính, giáo dục
|
||||
|
||||
2. **Phù hợp ngành nghề**: Kết hợp bối cảnh ngành nghề hoặc lợi thế tài nguyên của mình để chọn kịch bản:
|
||||
- Người làm sản xuất: có thể ưu tiên ứng dụng sản xuất công nghiệp, dịch vụ doanh nghiệp
|
||||
- Người làm giáo dục: có thể ưu tiên ứng dụng giáo dục, sản xuất nội dung
|
||||
- Người làm y tế: có thể khám phá ứng dụng y tế, quản lý sức khỏe
|
||||
|
||||
3. **Mức độ kỹ thuật**: Chọn độ phức tạp phù hợp với nền tảng kỹ thuật của mình:
|
||||
- Cấp độ nhập môn: Chăm sóc khách hàng thông minh, sáng tạo nội dung, hệ thống hỏi đáp đơn giản
|
||||
- Cấp độ nâng cao: Kiểm tra chất lượng công nghiệp, phân tích hình ảnh y tế, trợ lý code thông minh
|
||||
- Cấp độ chuyên nghiệp: Kiểm soát rủi ro tài chính, an ninh mạng, ứng dụng đa phương thức phức tạp
|
||||
|
||||
## 1. Sản xuất công nghiệp
|
||||
|
||||
Kịch bản sản xuất công nghiệp chủ yếu xoay quanh ba hướng: hỗ trợ thiết kế, tối ưu sản xuất, vận hành thông minh. Các ứng dụng phổ biến bao gồm sử dụng AI hỗ trợ thiết kế ngoại hình sản phẩm, kiểm tra bản vẽ tự động, tạo tài liệu kỹ thuật thông minh, chẩn đoán lỗi thiết bị công nghiệp, v.v., có thể nâng cao đáng kể hiệu suất thiết kế và giảm chi phí vận hành.
|
||||
|
||||
| STT | Tên kịch bản ứng dụng | Tham khảo triển khai |
|
||||
| :--: | -------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------- |
|
||||
| 1 | Nền tảng thiết kế hỗ trợ AI ngoại hình xe buýt năng lượng mới | Thiết kế khái niệm ngoại hình dựa trên mô hình tạo ảnh, kết hợp LLM kiểm tra quy tắc thiết kế và lặp sáng tạo; tích hợp Three.js render 3D |
|
||||
| 2 | Trợ lý thiết kế và kiểm tra bản vẽ thông minh | Sử dụng RAG xây dựng kho kiến thức quy tắc thiết kế doanh nghiệp, DALL-E tạo ảnh tham khảo hỗ trợ hiểu; tích hợp CAD API phân tích bản vẽ tự động |
|
||||
| 3 | Tự động tạo và quản lý tài liệu kỹ thuật | Dựa trên LLM tự động tạo tài liệu quy cách sản phẩm và hướng dẫn sử dụng từ cơ sở dữ liệu sản phẩm, ChromaDB vector lưu trữ tài liệu lịch sử hỗ trợ tìm kiếm thông minh |
|
||||
| 4 | Trợ lý tự động tạo báo cáo kiểm tra thiết bị sản xuất | Nhân viên kiểm tra mô tả tình trạng thiết bị bằng giọng nói, LLM tạo báo cáo kiểm tra có cấu trúc; tự động liên kết lịch sử lỗi |
|
||||
| 5 | Hệ thống điều phối và lập đường dẫn xe nâng thông minh | LLM phân tích nhiệm vụ đơn hàng và vị trí kho, kết hợp bản đồ API tạo phương án điều phối tối ưu |
|
||||
| 6 | Kho dữ liệu truy xuất thông tin dựa trên LLM | Sử dụng Text-to-SQL chuyển đổi ngôn ngữ tự nhiên thành truy vấn cơ sở dữ liệu, Superset hiển thị trực quan kết quả; Doris hoặc ClickHouse làm OLAP engine |
|
||||
| 7 | Trợ lý hỏi đáp chẩn đoán lỗi thiết bị công nghiệp | Xây dựng kho kiến thức vector dựa trên lịch sử lỗi thiết bị, LLM cung cấp đề xuất chẩn đoán và giải pháp theo mô tả lỗi |
|
||||
| 8 | Tự động tạo báo cáo kiểm tra chất lượng và phân loại lỗi sản xuất | OCR nhận diện lỗi trong ảnh kiểm tra chất lượng, LLM tạo báo cáo kiểm tra chất lượng có cấu trúc; tự động phân loại loại và mức độ nghiêm trọng của lỗi |
|
||||
| 9 | Trợ lý kiểm kê thông minh và tạo báo cáo kiểm kê | Nhập dữ liệu kiểm kê, LLM tự động so sánh tồn kho hệ thống và tạo báo cáo chênh lệch; cảnh báo tồn kho bất thường |
|
||||
| 10 | Hệ thống hỏi đáp đề xuất tối ưu quy trình công nghệ | Xây dựng kho kiến thức RAG dựa trên tài liệu quy trình sản xuất, LLM cung cấp đề xuất tối ưu theo vấn đề sản xuất |
|
||||
|
||||
## 2. Chăm sóc khách hàng thông minh
|
||||
|
||||
Kịch bản chăm sóc khách hàng thông minh tập trung vào nâng cao hiệu suất dịch vụ khách hàng và tối ưu trải nghiệm người dùng. Các ứng dụng điển hình bao gồm tích hợp chăm sóc khách hàng đa kênh, tạo phản hồi thông minh, phân tích cảm xúc khách hàng, xử lý ticket tự động, v.v., giúp doanh nghiệp cung cấp dịch vụ khách hàng 24/7.
|
||||
|
||||
| STT | Tên kịch bản ứng dụng | Tham khảo triển khai |
|
||||
| :--: | ------------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------ |
|
||||
| 1 | Hệ thống phản hồi tự động và tạo ticket chăm sóc khách hàng đa kênh | Kết nối tin nhắn đa kênh (WeChat, APP, website), LLM hiểu ý định và tạo phản hồi tự động tạo ticket; sử dụng LangChain xây dựng luồng hội thoại, MySQL lưu trữ dữ liệu ticket |
|
||||
| 2 | Trợ lý khai thác và theo dõi khách hàng tiềm năng | LLM phân tích lịch sử hội thoại chăm sóc khách hàng, nhận diện đặc điểm khách hàng có ý định cao và chấm điểm; hệ thống đề xuất kết hợp thuật toán lọc cộng tác |
|
||||
| 3 | Trợ lý tìm kiếm và hỏi đáp kiến thức nội bộ doanh nghiệp | Xây dựng kho kiến thức vector dựa trên Confluence và tài liệu nội bộ, LLM kết hợp RAG tạo câu trả lời |
|
||||
| 4 | Hệ thống khảo sát hài lòng khách hàng và cải tiến dịch vụ | LLM tự động phân tích nội dung hội thoại chăm sóc khách hàng để phân loại cảm xúc và chấm điểm hài lòng; báo cáo BI hiển thị kết quả phân tích |
|
||||
| 5 | Công cụ tóm tắt hội thoại CSKH và tạo ticket thông minh | Sau khi kết thúc hội thoại, LLM tự động tóm tắt và trích xuất thông tin quan trọng; tự động điền trường ticket |
|
||||
| 6 | Trợ lý kiểm tra tuân thủ kịch bản CSKH tự động | Nhân viên CSKH nhập nội dung phản hồi, LLM kiểm tra tuân thủ kịch bản và từ nhạy cảm theo thời gian thực; đưa ra đề xuất sửa đổi |
|
||||
| 7 | Công cụ tự động tóm tắt và phân loại ticket CSKH | LLM tóm tắt và tự động phân loại đánh tag cho lịch sử hội thoại dài; Elasticsearch hỗ trợ tìm kiếm toàn văn ticket |
|
||||
| 8 | Công cụ theo dõi cảm xúc khách hàng và cảnh báo bất thường | Phân tích đặc điểm ngữ điệu giọng nói và cảm xúc văn bản theo thời gian thực, LLM nhận diện cảm xúc bất thường và kích hoạt cảnh báo; WebSocket đẩy tin cảnh báo |
|
||||
| 9 | Hệ thống kho kiến thức kịch bản CSKH xuất sắc | LLM phân tích ca hội thoại chăm sóc khách hàng xuất sắc, đúc kết mẫu kịch bản xuất sắc; hệ thống đề xuất kịch bản theo thời gian thực theo ngữ cảnh hội thoại |
|
||||
| 10 | Trợ lý phân tích nội dung hội thoại gọi ra và kiểm tra chất lượng thông minh | Sau khi chuyển đổi ghi âm gọi ra, LLM phân tích nội dung hội thoại trích xuất thông tin quan trọng; tự động tạo báo cáo kiểm tra chất lượng và đề xuất cải tiến |
|
||||
|
||||
## 3. Ngành giáo dục
|
||||
|
||||
Kịch bản ngành giáo dục hướng tới thực hiện dạy học cá nhân hóa và quản lý giáo dục thông minh. Các ứng dụng cốt lõi bao gồm lập lộ trình học tập thông minh, chấm bài tự động, tạo giáo án, phân tích tình hình học tập, v.v., thúc đẩy tối ưu phân bổ nguồn lực giáo dục và thực hiện dạy học theo năng lực.
|
||||
|
||||
| STT | Tên kịch bản ứng dụng | Tham khảo triển khai |
|
||||
| :--: | ---------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------- |
|
||||
| 1 | Hệ thống lập lộ trình học ngôn ngữ cá nhân hóa và hướng dẫn thông minh | LLM đánh giá trình độ hiện tại của người học, lập kế hoạch học tập hàng ngày theo mục tiêu học tập; thuật toán đề xuất kết hợp biểu đồ kiến thức đề xuất tài liệu học tập |
|
||||
| 2 | Nền tảng soạn giáo án tự động và đẩy tài liệu giảng dạy | LLM tạo khung giáo án và thiết kế giảng dạy theo chương trình học; kho vector lưu trữ giáo án và bài giảng chất lượng, hỗ trợ tìm kiếm từ khóa và đề xuất tương tự |
|
||||
| 3 | Hệ thống chấm bài tự động và chẩn đoán tình hình học tập | LLM tự động chấm câu hỏi tự luận và tạo đề xuất chấm, biểu đồ kiến thức xác định điểm yếu của học sinh |
|
||||
| 4 | Xây dựng mô hình năng lực vị trí và bản đồ học tập | LLM phân tích JD vị trí trích xuất yêu cầu năng lực, xây dựng hồ sơ năng lực vị trí; tạo bản đồ học tập cá nhân hóa theo khoảng cách |
|
||||
| 5 | Công cụ xây dựng hệ thống chương trình học theo trường và làm bài giảng | LLM phân tích đặc điểm trường và nhu cầu học sinh, tạo khung chương trình học theo trường; tích hợp giao diện tạo PPT tự động làm bài giảng |
|
||||
| 6 | Thực hành giao tiếp ngoại ngữ 1-1 theo tình huống | LLM đóng vai trò khác nhau để hội thoại giao tiếp, ASR nhận diện phát âm và chấm điểm; TTS tạo mẫu phát âm chuẩn |
|
||||
| 7 | Nền tảng hướng dẫn kế hoạch nghề nghiệp và đề xuất trường đại học dựa trên dữ liệu lớn | LLM phân tích thông tin điểm số, thứ hạng, sở thích của thí sinh, kết hợp dữ liệu tuyển sinh đề xuất trường và chuyên ngành |
|
||||
| 8 | Trợ lý code lập trình thiếu nhi | LLM giải thích logic code và cung cấp hướng dẫn lập trình, hỗ trợ chuyển đổi giữa ngôn ngữ khối và Python |
|
||||
| 9 | Công cụ tự động tạo sơ đồ tư duy kiến thức và đề xuất lộ trình học tập | Nhập chủ đề khóa học, LLM tự động tạo sơ đồ tư duy kiến thức; đề xuất nội dung học tiếp theo theo tiến độ học |
|
||||
| 10 | Engine chấm và sửa bài văn Trung-Anh tự động | LLM chấm điểm nhiều chiều (ý tưởng, cấu trúc, ngôn ngữ, đa dạng) và tạo chú thích; so sánh với bài văn mẫu xuất sắc |
|
||||
|
||||
## 4. Lập trình thông minh
|
||||
|
||||
Kịch bản lập trình thông minh nhằm nâng cao hiệu suất phát triển và chất lượng code. Các ứng dụng điển hình bao gồm gợi ý code thông minh, sửa Bug tự động, tạo test tự động, chuyển đổi code, v.v., giúp nhà phát triển tập trung vào logic nghiệp vụ thay vì công việc code lặp lại.
|
||||
|
||||
| STT | Tên kịch bản ứng dụng | Tham khảo triển khai |
|
||||
| :--: | ---------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------- |
|
||||
| 1 | Trợ lý gợi ý code thông minh và sửa Bug tự động | Fine-tune mô hình code dựa trên CodeLlama, plugin IDE cung cấp gợi ý code theo thời gian thực; LLM phân tích stack lỗi tự động định vị Bug và tạo code sửa |
|
||||
| 2 | Nền tảng xây dựng ứng dụng low-code và tự động hóa quy trình | Người dùng mô tả yêu cầu bằng ngôn ngữ tự nhiên, LLM chuyển đổi thành cấu hình low-code hoặc framework code |
|
||||
| 3 | Hệ thống tạo test case đơn vị | AST phân tích mã nguồn trích xuất logic hàm, LLM tạo test case cho điều kiện biên và kịch bản bất thường; tích hợp Jest/Pytest chạy test |
|
||||
| 4 | Công cụ phân tích code thông minh và chuyển đổi ngôn ngữ | Phân tích cấu trúc code dựa trên Tree-sitter, LLM phân tích chất lượng code và đưa ra đề xuất tối ưu; kết hợp engine quy tắc thực hiện chuyển đổi ngôn ngữ |
|
||||
| 5 | Công cụ tự động chuyển đổi ngôn ngữ tự nhiên thành câu lệnh SQL | LLM chuyển đổi truy vấn ngôn ngữ tự nhiên thành SQL, hỗ trợ join và aggregate truy vấn đa bảng phức tạp |
|
||||
| 6 | Nền tảng test API tự động và tạo tài liệu | LLM phân tích chú thích code và định nghĩa interface, tự động tạo test case và tài liệu API; tích hợp Postman chạy test |
|
||||
| 7 | Công cụ ghi và duy trì script test UI thông minh | Plugin trình duyệt ghi thao tác người dùng, LLM phân tích ý định thao tác tạo script test; AI sửa locator bị lỗi |
|
||||
| 8 | Phân tích log hệ thống và định vị lỗi | ELK Stack thu thập dữ liệu log, LLM phân tích log bất thường trích xuất thông tin quan trọng và định vị nguyên nhân gốc; đề xuất phương án sửa |
|
||||
| 9 | Công cụ tự động tạo code giao diện (UI) frontend | Ảnh thiết kế nhận diện cấu trúc bố cục qua OCR, LLM tạo CSS responsive và code component; tích hợp TailwindCSS hỗ trợ nhiều framework style |
|
||||
| 10 | Trợ lý thiết kế và xây dựng cấu trúc cơ sở dữ liệu thông minh | Nhập tài liệu yêu cầu nghiệp vụ cho LLM, tự động tạo ER diagram và cấu trúc bảng dữ liệu; hỗ trợ xuất script tạo bảng MySQL/PostgreSQL |
|
||||
|
||||
## 5. Y tế
|
||||
|
||||
Kịch bản y tế hướng tới nâng cao hiệu suất chẩn đoán điều trị và chất lượng dịch vụ y tế. Các ứng dụng phổ biến bao gồm tạo bệnh án tự động, hỏi đáp kiến thức y khoa, hỗ trợ phân tích hình ảnh, hỗ trợ nghiên cứu thuốc, v.v., thúc đẩy chuyển đổi số ngành y tế.
|
||||
|
||||
| STT | Tên kịch bản ứng dụng | Tham khảo triển khai |
|
||||
| :--: | ----------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------- |
|
||||
| 1 | Trợ lý giải thích báo cáo xét nghiệm y khoa thông minh | Tải ảnh báo cáo xét nghiệm, OCR nhận diện chỉ số quan trọng, LLM giải thích giá trị bất thường và tạo giải thích dễ hiểu |
|
||||
| 2 | Chuyên gia tư vấn sức khỏe dựa trên công nghệ truy xuất kiến thức | Xây dựng biểu đồ kiến thức y khoa (ICD-10, hướng dẫn sử dụng thuốc, hướng dẫn chẩn đoán điều trị), RAG truy xuất tạo câu trả lời |
|
||||
| 3 | Nền tảng phân tích quyết định dữ liệu nghiên cứu lâm sàng | Tích hợp dữ liệu EMR và kết quả xét nghiệm, LLM hỗ trợ tạo code thống kê phân tích và biểu đồ trực quan; hỗ trợ nghiên cứu đoàn hệ và phân tích sống còn |
|
||||
| 4 | Hệ thống tạo câu hỏi y khoa thông minh và giải thích câu sai | Nhập chương giáo trình và điểm kiến thức, LLM tạo bài tập và giải thích; tự động thu thập câu sai và tạo phân tích điểm yếu |
|
||||
| 5 | Chuyên gia hỏi đáp biểu đồ kiến thức toàn quy trình nghiên cứu thuốc | Xây dựng biểu đồ kiến thức thuốc-mục tiêu-bệnh, LLM trả lời câu hỏi nghiên cứu liên quan; hỗ trợ tìm kiếm tài liệu và đề xuất phương án thử nghiệm |
|
||||
| 6 | Trợ lý hỏi đáp thông minh hướng dẫn sử dụng thuốc | Tải ảnh hướng dẫn sử dụng thuốc hoặc nhập tên thuốc, LLM trả lời các câu hỏi về liều dùng, tác dụng phụ, lưu ý |
|
||||
| 7 | Trợ lý tạo bài viết phổ biến kiến thức bệnh lý | Nhập tên bệnh và đối tượng, LLM tạo bài viết phổ biến dễ hiểu; hỗ trợ nhiều phiên bản (phiên bản bệnh nhân/phiên bản người nhà) |
|
||||
| 8 | Công cụ tự động tạo báo cáo hình ảnh y khoa | Bác sĩ khoa chẩn đoán hình ảnh mô tả đặc điểm hình ảnh, LLM tự động tạo báo cáo có cấu trúc; hỗ trợ mẫu các loại kiểm tra phổ biến |
|
||||
| 9 | Trợ lý tạo và lưu trữ hồ sơ phẫu thuật thông minh | Nhập giọng nói các bước quan trọng trong quá trình phẫu thuật, LLM tạo hồ sơ phẫu thuật có cấu trúc; tự động liên kết mã phẫu thuật |
|
||||
| 10 | Trợ lý nhắc thuốc thông minh quản lý bệnh mãn tính | Bệnh nhân nhập danh sách thuốc, LLM tạo nhắc thuốc cá nhân hóa; hỗ trợ kiểm tra tương tác thuốc và hỏi đáp tương tác |
|
||||
|
||||
## 6. An ninh mạng
|
||||
|
||||
Kịch bản an ninh mạng tập trung vào bảo vệ an toàn và quản lý rủi ro. Các ứng dụng cốt lõi bao gồm phát hiện lỗ hổng, phân tích thông tin đe dọa, nhận diện email phishing, ứng phó sự kiện an ninh, v.v., xây dựng hệ thống bảo vệ an toàn thông minh toàn diện cho doanh nghiệp.
|
||||
|
||||
| STT | Tên kịch bản ứng dụng | Tham khảo triển khai |
|
||||
| :--: | ---------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------- |
|
||||
| 1 | Engine phát hiện và sửa lỗi bảo mật code | Công cụ phân tích code tĩnh (SAST) quét code, LLM phân tích nguyên lý lỗ hổng và tạo đề xuất sửa; tích hợp pipeline CI/CD |
|
||||
| 2 | Hệ thống nhận diện và chặn email phishing do AI tạo | LLM phân tích nội dung email, đặc điểm người gửi và tính an toàn liên kết, nhận diện email phishing do AI tạo; kết nối gateway email chặn theo thời gian thực |
|
||||
| 3 | Trợ lý tự động tạo báo cáo vận hành an ninh hàng ngày | Tổng hợp log thiết bị an ninh, LLM tự động trích xuất sự kiện quan trọng và tạo báo cáo hàng ngày; đánh dấu highlight sự kiện bất thường |
|
||||
| 4 | Trợ lý hỏi đáp kho kiến thức an ninh thông minh | Xây dựng kho kiến thức vector dựa trên tài liệu an ninh, cơ sở dữ liệu CVE, LLM trả lời câu hỏi về kỹ thuật an ninh và đề xuất xử lý |
|
||||
| 5 | Trợ lý tạo báo cáo kiểm thử xâm nhập thông minh | Sau khi hoàn thành kiểm thử xâm nhập, LLM tự động tạo báo cáo theo mô tả lỗ hổng; tạo đề xuất sửa lỗi hàng loạt |
|
||||
| 6 | Bảo vệ mã độc và giám sát tuân thủ quyền riêng tư | Phân tích hành vi tệp đáng ngờ trong sandbox, LLM nhận diện đặc điểm mã độc và tạo chữ ký; quét nhận diện dữ liệu riêng tư |
|
||||
| 7 | Công cụ tạo danh sách kiểm tra cấu hình an ninh tuân thủ | Nhập loại hệ thống mục tiêu, LLM tạo danh sách kiểm tra cấu hình an ninh; hỗ trợ các tiêu chuẩn như DJCP 2.0, CIS |
|
||||
| 8 | Trợ lý truy vấn và phân tích thông tin đe dọa thông minh | Kết nối đa nguồn thông tin đe dọa (mã nguồn mở, thương mại), LLM giải thích thông tin và liên kết tài sản doanh nghiệp; đề xuất chiến lược bảo vệ |
|
||||
| 9 | Trợ lý tạo báo cáo tổng kết sự kiện an ninh | Sau khi xảy ra sự kiện an ninh, LLM tự động tạo báo cáo tổng kết theo mốc thời gian; phân tích nguyên nhân gốc và đề xuất cải tiến |
|
||||
| 10 | Trung tâm theo dõi và cảnh báo thông tin đe dọa toàn cầu | Crawler thu thập tin tức an ninh toàn cầu và công bố lỗ hổng, LLM trích xuất thông tin quan trọng và đánh giá tác động; thông báo cảnh báo qua email/SMS |
|
||||
|
||||
## 7. Quản lý tài chính, ngân hàng bảo hiểm
|
||||
|
||||
Kịch bản tài chính xoay quanh kiểm soát rủi ro và trí tuệ hóa nghiệp vụ. Các ứng dụng điển hình bao gồm đánh giá rủi ro tín dụng, cố vấn quản lý tài sản, tạo báo cáo tài chính, giám sát chống rửa tiền, v.v., nâng cao hiệu suất vận hành và khả năng kiểm soát rủi ro của tổ chức tài chính.
|
||||
|
||||
| STT | Tên kịch bản ứng dụng | Tham khảo triển khai |
|
||||
| :--: | ---------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------- |
|
||||
| 1 | Trợ lý tạo báo cáo thẩm tín tín dụng thông minh | Nhập thông tin cơ bản doanh nghiệp và dữ liệu tài chính, LLM tự động tạo báo cáo thẩm tín tín dụng; tự động đánh dấu điểm rủi ro |
|
||||
| 2 | Cố vấn quản lý tài sản ngân hàng tư nhân thông minh | LLM phân tích sở thích rủi ro và mục tiêu tài chính của khách hàng, tạo đề xuất phân bổ tài sản; kết nối kho sản phẩm tài chính và quỹ |
|
||||
| 3 | Trợ lý tạo và kiểm tra tuân thủ prospectus IPO thông minh | Template modular prospectus, LLM tự động điền mô tả kinh doanh và yếu tố rủi ro; engine quy tắc kiểm tra tuân thủ tính nhất quán |
|
||||
| 4 | Hệ thống tự động tạo báo cáo tài chính và cảnh báo bất thường kinh doanh | Thu thập dữ liệu hệ thống tài chính tự động, LLM tạo phân tích tài chính và phần thảo luận ban quản lý; quy tắc cảnh báo chỉ tiêu bất thường |
|
||||
| 5 | Trợ lý trích xuất thông tin hóa đơn tài chính và hỏi đáp | Tải ảnh hóa đơn, OCR nhận diện thông tin, LLM trả lời câu hỏi liên quan đến hóa đơn; hỗ trợ hóa đơn VAT, vé tàu, v.v. |
|
||||
| 6 | Trợ lý tìm kiếm và hỏi đáp ca tuân thủ thông minh | Xây dựng kho kiến thức dựa trên ca xử phạt giám sát, LLM trả lời câu hỏi tuân thủ và cung cấp tham khảo ca |
|
||||
| 7 | Trợ lý luyện tập kịch bản đại lý bảo hiểm thông minh | LLM đóng vai các loại khách hàng khác nhau để hội thoại mô phỏng, đánh giá tính tuân thủ và sức thuyết phục kịch bản đại lý; phân tích chuyển đổi ghi âm |
|
||||
| 8 | Nền tảng phân tích điều khoản sản phẩm bảo hiểm và so sánh đối thủ | Phân tích cấu trúc điều khoản, LLM tạo tóm tắt điểm nổi bật và lưu ý |
|
||||
| 9 | Dịch vụ nhận diện cảm xúc kịch bản khách hàng | Nhận diện cảm xúc giọng nói kết hợp kiểm tra tuân thủ kịch bản, phản hồi theo thời gian thực đề xuất cải tiến cho đại lý |
|
||||
| 10 | Trợ lý hỏi đáp và truy vấn tiến độ bồi thường bảo hiểm thông minh | Người dùng nhập số hợp đồng bảo hiểm hoặc số báo cáo, LLM truy vấn tiến độ bồi thường và trả lời câu hỏi liên quan đến bồi thường |
|
||||
|
||||
## 8. Dịch vụ doanh nghiệp
|
||||
|
||||
Kịch bản dịch vụ doanh nghiệp hướng tới nâng cao hiệu suất vận hành tổ chức và mức độ quản lý. Các ứng dụng phổ biến bao gồm quản lý quan hệ khách hàng, dự báo bán hàng, theo dõi dư luận, quản lý nhân sự thông minh, v.v., giúp doanh nghiệp thực hiện chuyển đổi số.
|
||||
|
||||
| STT | Tên kịch bản ứng dụng | Tham khảo triển khai |
|
||||
| :--: | ----------------------------------------------- | ----------------------------------------------------------------------------------------------------------- |
|
||||
| 1 | Nền tảng phân tích giữ chân khách hàng và cảnh báo rời đi | Thu thập thao tác người dùng qua tracking hành vi, mô hình ML dự đoán xác suất rời đi, LLM tạo đề xuất giữ chân |
|
||||
| 2 | Nền tảng tiếp cận và email marketing khách hàng tiềm năng B2B | Lọc khách hàng mục tiêu qua dữ liệu đăng ký doanh nghiệp, LLM tạo nội dung marketing cá nhân hóa; kết nối nền tảng gửi email hàng loạt |
|
||||
| 3 | Nền tảng theo dõi pipeline bán hàng và dự báo doanh thu | Thu thập dữ liệu CRM tự động, LLM phân tích phễu bán hàng và dự báo hoàn thành doanh thu; cảnh báo bất thường đẩy cho quản lý |
|
||||
| 4 | Radar theo dõi dư luận thương hiệu và cảnh báo khủng hoảng | Thu thập dữ liệu dư luận toàn mạng (mạng xã hội, tin tức, diễn đàn), LLM phân tích cảm xúc và xu hướng lan truyền; đẩy cảnh báo khủng hoảng |
|
||||
| 5 | Trợ lý viết email công sở thông minh và quản lý cảm xúc giao tiếp | Hiểu ngữ cảnh email, LLM tạo nháp email chuyên nghiệp; phân tích cảm xúc phản hồi đề xuất cải tiến |
|
||||
| 6 | Hệ thống phân tích CV và khớp vị trí thông minh | Phân tích CV PDF trích xuất thông tin quan trọng, LLM khớp vị trí phù hợp và tạo đề xuất phỏng vấn; kết nối hệ thống ATS |
|
||||
| 7 | Trợ lý hướng dẫn và hỏi đáp nhân viên mới | RAG truy xuất kho kiến thức tài liệu nhập học, LLM trả lời câu hỏi phổ biến của nhân viên mới |
|
||||
| 8 | Nền tảng phản hồi hiệu suất nhân viên và quản lý mục tiêu OKR | Thu thập dữ liệu hệ thống OKR, LLM phân tích hoàn thành mục tiêu và tạo đề xuất phản hồi; thu thập phản hồi 360 độ |
|
||||
| 9 | Ghi chép cuộc họp thông minh và quản lý việc cần làm | Chuyển đổi ghi âm cuộc họp, LLM trích xuất điểm thảo luận quan trọng và việc cần làm; hệ thống task tự động tạo việc cần làm |
|
||||
| 10 | Nhận diện hóa đơn và xử lý hoàn phí tự động | OCR nhận diện thông tin hóa đơn, tự động kiểm tra tính xác thực và tuân thủ hoàn phí hóa đơn; kết nối hệ thống tài chính |
|
||||
|
||||
## 9. Sản xuất và vận hành nội dung
|
||||
|
||||
Kịch bản sản xuất và vận hành nội dung tập trung vào sáng tạo và vận hành lưu lượng. Các ứng dụng cốt lõi bao gồm sáng tạo văn bản, sản xuất video ngắn, livestream người ảo, tối ưu SEO, v.v., giúp doanh nghiệp nâng cao hiệu suất sản xuất nội dung và tỷ lệ chuyển đổi marketing.
|
||||
|
||||
| STT | Tên kịch bản ứng dụng | Tham khảo triển khai |
|
||||
| :--: | -------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------- |
|
||||
| 1 | Nền tảng hỗ trợ sáng tạo nội dung phim ảnh và tiểu thuyết | LLM cung cấp hỗ trợ sáng tạo như tóm tắt cốt truyện, thiết lập nhân vật, tạo thoại; sơ đồ tư duy trực quan hóa cấu trúc cốt truyện |
|
||||
| 2 | Trợ lý viết câu chuyện thương hiệu và bài PR doanh nghiệp thông minh | Nhập từ khóa thương hiệu và thông tin sản phẩm, LLM tạo phiên bản nội dung đa phong cách; kết hợp giao diện A/B test |
|
||||
| 3 | Hệ thống tương tác livestream và quản lý đẩy stream người ảo | Xây dựng hình ảnh người ảo + giọng nói TTS + hội thoại LLM, phản hồi bình luận khán giả theo thời gian thực; tích hợp đẩy stream OBS |
|
||||
| 4 | Tạo kịch bản video ngắn và chỉnh sửa thông minh | LLM tạo kịch bản video ngắn và phân cảnh, Sora/Runway tạo đoạn video; công cụ chỉnh sửa tự động ghép nối |
|
||||
| 5 | Chuyển đổi giọng nói hội thoại bán hàng và đề xuất kịch bản | Ghi âm điện thoại chuyển đổi ASR, LLM phân tích hội thoại và đề xuất kịch bản xuất sắc; tích hợp hệ thống CRM |
|
||||
| 6 | Hệ thống tạo và thiết kế nội dung marketing thông minh | Nhập thông tin sản phẩm, LLM tạo nội dung marketing và trích xuất điểm bán hàng; tích hợp template Canva/Gianding |
|
||||
| 7 | Hệ thống giám sát ROI quảng cáo đa nền tảng theo thời gian thực và tối ưu chiến lược | Kết nối API nền tảng quảng cáo thu thập dữ liệu, LLM phân tích hiệu quả chạy quảng cáo và tạo đề xuất tối ưu; đẩy cảnh báo bất thường |
|
||||
| 8 | Phân tích từ khóa công cụ tìm kiếm và lưu lượng | Thu thập dữ liệu Baidu Index, 5118, LLM phân tích xu hướng từ khóa và mức độ cạnh tranh; đề xuất chủ đề nội dung |
|
||||
| 9 | Nền tảng phân tích quảng cáo đối thủ | Thu thập quảng cáo đối thủ qua API nền tảng dữ liệu bên thứ ba, LLM phân tích chiến lược chạy quảng cáo và đặc điểm sáng tạo |
|
||||
| 10 | Hệ thống phân tích chủ đề nóng toàn mạng và đề xuất nội dung thông minh | Thu thập dữ liệu top trending Weibo, top trending Douyin, LLM phân tích xu hướng chủ đề nóng và đề xuất góc tiếp cận; lịch nội dung theo dạng lịch |
|
||||
|
||||
## 10. Quản trị hành chính thông minh
|
||||
|
||||
Kịch bản quản trị hành chính thông minh hướng tới nâng cao hiệu năng dịch vụ chính phủ và năng lực quản trị. Các ứng dụng điển hình bao gồm điều hướng thông minh đường dây nóng chính phủ, hỏi đáp chính sách thông minh, tối ưu phê duyệt hành chính, quản lý sự kiện đô thị, v.v., thúc đẩy xây dựng chính phủ số.
|
||||
|
||||
| STT | Tên kịch bản ứng dụng | Tham khảo triển khai |
|
||||
| :--: | ---------------------------------------------------- | ------------------------------------------------------------------------------------------------------------- |
|
||||
| 1 | Hệ thống điều hướng giọng nói thông minh và phân công tự động đường dây nóng 12345 | Nhận diện giọng nói cuộc gọi của công dân, LLM hiểu yêu cầu và phân công thông minh đến bộ phận tương ứng; hệ thống ticket tự động luân chuyển |
|
||||
| 2 | Robot hướng dẫn thông minh và hỏi đáp chính sách tại đại dịch vụ hành chính | RAG truy xuất kho kiến thức hành chính, LLM trả lời câu hỏi về quy trình thủ tục và chính sách; kết nối hệ thống lấy số |
|
||||
| 3 | Nền tảng đối chiếu và đẩy thông minh chính sách hỗ trợ doanh nghiệp | Phân tích cấu trúc chính sách, hồ sơ doanh nghiệp tự động đối chiếu chính sách phù hợp; đẩy nhắc nhở qua SMS/email |
|
||||
| 4 | Trợ lý kiểm tra trước và xác nhận tuân thủ tài liệu phê duyệt hành chính thông minh | Nhận diện OCR tài liệu và trích xuất thông tin quan trọng, LLM kiểm tra tính đầy đủ và tuân thủ tài liệu |
|
||||
| 5 | Hệ thống phát hiện hành vi bất thường trong camera giám sát an toàn công cộng | Phân tích luồng video theo thời gian thực, mô hình CV phát hiện hành vi bất thường (đánh nhau, té ngã, v.v.); đẩy cảnh báo |
|
||||
| 6 | Nền tảng nhận diện sự kiện lưới đô thị thông minh và điều phối quản lý | Thu thập dữ liệu cảm biến đô thị (IoT, camera), LLM nhận diện loại sự kiện và phân công |
|
||||
| 7 | Hệ thống phân tích dữ liệu lớn dư luận xã hội và cảnh báo rủi ro | Phân tích tích hợp đa nguồn dữ liệu (đường dây nóng chính phủ, dư luận mạng, khảo sát xã hội); LLM nhận diện điểm nóng rủi ro |
|
||||
| 8 | Nền tảng số hóa hồ sơ hành chính và quản lý lưu trữ thông minh | Nhận diện văn bản hồ sơ qua OCR, LLM trích xuất thông tin quan trọng và phân loại tự động; hỗ trợ tìm kiếm toàn văn |
|
||||
| 9 | Nền tảng chỉ huy ứng phó khẩn cấp và điều phối nguồn lực cứu hộ sự kiện công cộng | Thu thập thông tin sự kiện, LLM tạo phương án ứng phó khẩn cấp; thuật toán tối ưu điều phối nguồn lực |
|
||||
| 10 | Hệ thống giám sát phân mảnh ô nhiễm môi trường không khí và truy nguồn chính xác | Thu thập dữ liệu cảm biến chất lượng không khí, mô hình CV nhận diện nguồn ô nhiễm; LLM phân tích xu hướng ô nhiễm và truy nguồn |
|
||||
|
||||
## 11. Pháp lý và quản lý hợp đồng
|
||||
|
||||
Kịch bản pháp lý tập trung vào nâng cao hiệu suất dịch vụ pháp lý và quản lý tuân thủ. Các ứng dụng phổ biến bao gồm kiểm tra hợp đồng, phân tích vụ án, theo dõi luật pháp, tạo văn bản pháp lý, v.v., cung cấp hỗ trợ công cụ thông minh cho người hành nghề pháp lý.
|
||||
|
||||
| STT | Tên kịch bản ứng dụng | Tham khảo triển khai |
|
||||
| :--: | ---------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------- |
|
||||
| 1 | Agent phát hiện rủi ro hợp đồng một chạm | Phân tích cấu trúc văn bản hợp đồng, LLM đối chiếu danh mục rủi ro nhận diện vấn đề tiềm ẩn; đánh dấu điều khoản rủi ro cao |
|
||||
| 2 | Nền tảng kiểm tra tuân thủ và đề xuất sửa đổi hợp đồng doanh nghiệp toàn vòng đời | So sánh điều khoản hợp đồng với cơ sở dữ liệu luật pháp, LLM tạo báo cáo kiểm tra tuân thủ; theo dõi đề xuất sửa đổi |
|
||||
| 3 | Cố vấn đánh giá tỷ lệ thắng kiện AI cho các vụ án tương tự | Trích xuất đặc điểm vụ án, tìm kiếm và đối chiếu vụ án tương tự; LLM phân tích yếu tố ảnh hưởng đến thắng kiện |
|
||||
| 4 | Radar theo dõi thay đổi luật pháp và phân tích tác động kinh doanh | Cơ sở dữ liệu luật pháp cập nhật theo thời gian thực, LLM phân tích nội dung thay đổi và đánh giá tác động kinh doanh; đẩy cảnh báo |
|
||||
| 5 | Công cụ soạn thư luật sư AIGC tự động | Nhập trình bày sự kiện, LLM tạo template thư luật sư chuẩn mực; kiểm tra yếu tố và xác nhận tuân thủ |
|
||||
| 6 | Máy ghi âm chuyển đổi theo thời gian thực tại tòa và trích xuất tự động trọng điểm tranh chấp | Chuyển đổi ASR ghi âm tòa án, LLM trích xuất trọng điểm tranh chấp và luận điểm quan trọng; đánh dấu timestamp |
|
||||
| 7 | Hệ thống theo dõi tự động vi phạm sở hữu trí tuệ và thu thập chứng cứ blockchain toàn mạng | Giám sát vi phạm trên nền tảng thương mại điện tử, mạng xã hội; tự động thu thập và lưu chứng cứ vi phạm |
|
||||
| 8 | Agent kiểm tra nhất quán dữ liệu quan trọng và cảnh báo rủi ro prospectus IPO dựa trên LLM | So sánh dữ liệu nhiều chương prospectus, LLM nhận diện không nhất quán và dữ liệu bất thường; đánh dấu rủi ro |
|
||||
| 9 | Plugin giải thích điều khoản pháp luật phức tạp sang ngôn ngữ dễ hiểu | Chọn điều khoản luật, LLM tạo giải thích dễ hiểu |
|
||||
| 10 | Hệ thống sắp xếp chuỗi chứng cứ vụ án thông minh và hiển thị trực quan | Tải tài liệu chứng cứ, LLM phân tích quan hệ chứng cứ và mốc thời gian |
|
||||
|
||||
## 12. Du lịch và dịch vụ đi lại
|
||||
|
||||
Kịch bản du lịch hướng tới nâng cao trải nghiệm du lịch và sự tiện lợi của dịch vụ. Các ứng dụng cốt lõi bao gồm lập lịch trình thông minh, dự báo giá, tham quan ảo, dịch thuật, v.v., giúp du lịch trở nên dễ dàng và thú vị hơn.
|
||||
|
||||
| STT | Tên kịch bản ứng dụng | Tham khảo triển khai |
|
||||
| :--: | ---------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------- |
|
||||
| 1 | Trình tạo lịch trình du lịch lười dựa trên AIGC | Nhập sở thích người dùng (số ngày, ngân sách, sở thích), LLM tạo lịch trình hàng ngày; API điểm tham quan lấy giờ mở cửa và vé |
|
||||
| 2 | Robot dự đoán xu hướng giá vé máy bay khách sạn toàn mạng và tự động khóa giá rẻ | Thu thập dữ liệu giá OTA, mô hình ML dự đoán xu hướng giá; nhắc nhở giám sát giá |
|
||||
| 3 | Cố vấn đề xuất phương án khẩn cấp và tái tổ chức lịch trình liên hãng khi hủy chuyến | Giám sát trạng thái chuyến bay, LLM phân tích phương án lịch trình thay thế; so sánh giá đa hãng |
|
||||
| 4 | Hệ thống hỗ trợ kiểm tra trước tài liệu visa và điền form tự động | Chụp ảnh tải tài liệu, nhận diện OCR kiểm tra tính đầy đủ thông tin; tự động điền form |
|
||||
| 5 | Trợ lý dịch giọng nói thời gian thực và dịch menu thị giác khi du lịch nước ngoài | Mô hình dịch giọng nói ngoại tuyến, nhận diện OCR ảnh menu và dịch |
|
||||
| 6 | Máy phân tích hướng dẫn "tránh rủi ro" khách sạn dựa trên đánh giá thực tế dữ liệu lớn | Thu thập dữ liệu đánh giá khách sạn, LLM trích xuất từ khóa đánh giá tích cực/tiêu cực |
|
||||
| 7 | Nền tảng tương tác chọn phòng ảo và xem trước VR immerrsive tại điểm đến | Thu thập ảnh toàn cảnh 360°, công nghệ VR xem trước immerrsive; tham quan ảo phòng |
|
||||
| 8 | Trợ lý tự động tạo bài du ký và nội dung mạng xã hội từ dấu chân du lịch | Trích xuất thông tin thời gian địa điểm từ ảnh, LLM tạo nội dung bài du ký; tạo bố cục theo template |
|
||||
| 9 | Nền tảng quản lý hoàn phí tuân thủ và thu thập hóa đơn công tác tự động doanh nghiệp | Kết nối API nền tảng công tác, thu thập thông tin hóa đơn tự động; kiểm tra tuân thủ |
|
||||
| 10 | Dự đoán tắc nghẽn khách du lịch theo thời gian thực và điều hướng lộ trình du lịch tránh giờ cao điểm | Thu thập dữ liệu khách du lịch điểm tham quan, mô hình ML dự đoán khung giờ tắc nghẽn; đề xuất tránh giờ cao điểm |
|
||||
|
||||
## 13. Đồng hành cảm xúc
|
||||
|
||||
Kịch bản đồng hành cảm xúc tập trung vào sức khỏe tâm thần và an ủi cảm xúc. Các ứng dụng điển hình bao gồm người bạn đồng hành ảo, tư vấn cảm xúc, huấn luyện nhận thức, tư vấn tâm lý, v.v., cung cấp đồng hành và hỗ trợ toàn thời gian cho người dùng.
|
||||
|
||||
| STT | Tên kịch bản ứng dụng | Tham khảo triển khai |
|
||||
| :--: | ---------------------------------------------------- | ------------------------------------------------------------------------------------------------------- |
|
||||
| 1 | Người bạn đồng hành ảo 24 giờ dựa trên mô hình LLM | Hệ thống ghi nhớ lưu trữ lịch sử hội thoại, LLM tạo phản hồi cá nhân hóa; module hỗ trợ cảm xúc |
|
||||
| 2 | Cố vấn AI nhận diện cảm xúc đa phương thức và tư vấn tâm lý | Phân tích ngữ điệu giọng nói + nhận diện cảm xúc văn bản, LLM tạo đề xuất tư vấn; cảnh báo can thiệp khủng hoảng |
|
||||
| 3 | Người ảo AI huấn luyện nhận thức và kích thích trí nhớ cho người bệnh Alzheimer | Huấn luyện trò chơi nhận thức (trí nhớ, tính toán, ngôn ngữ); ảnh cũ/bài hát cũ kích thích trí nhớ |
|
||||
| 4 | Huấn luyện viên mô phỏng giao tiếp xã hội AIGC cho người hướng nội | Mô phỏng tình huống giao tiếp xã hội ảo, LLM đóng vai khác nhau; đề xuất kỹ năng giao tiếp |
|
||||
| 5 | Máy tạo câu chuyện trước khi ngủ cá nhân hóa GenAI | Cha mẹ nhập chủ đề và sở thích, LLM tạo câu chuyện cá nhân hóa; tạo nhạc nền |
|
||||
| 6 | Hệ thống phục hồi cuộc sống số người đã khuất và hội thoại xuyên không gian thời gian LLM | Đào tạo mô hình cá nhân hóa từ tài liệu khi còn sống (giọng nói, văn bản); tạo hội thoại ghi nhớ |
|
||||
| 7 | Robot chat đồng cảm và phản chiếu tính cách AI dựa trên dữ liệu MBTI | Nhập kết quả test MBTI, LLM tạo phân tích tính cách và phản hồi đồng cảm; đề xuất khớp tính cách |
|
||||
| 8 | Trợ lý theo dõi tâm trạng toàn thời gian và kích thích cảm xúc tích cực AI | Ghi nhận trạng thái tâm trạng hàng ngày, LLM phân tích xu hướng và tạo nội dung khích lệ; đẩy nhắc nhở tích cực |
|
||||
| 9 | Hòm thư AI tâm sự ẩn danh bảo vệ quyền riêng tư cho thanh thiếu niên | Lối vào tâm sự ẩn danh, LLM cung cấp lắng nghe và đề xuất; cảnh báo từ nhạy cảm |
|
||||
| 10 | Hệ thống nuôi thú ảo AI có khả năng tiến hóa tự chủ | Đào tạo mô hình tính cách thú cưng, tương tác hội thoại lớn lên tiến hóa; hệ thống trang phục ảo |
|
||||
|
||||
## 14. Giải trí
|
||||
|
||||
Kịch bản giải trí hướng tới cung cấp trải nghiệm giải trí số phong phú. Các ứng dụng phổ biến bao gồm quyết định thông minh NPC game, hỗ trợ kịch bản nhập vai, sáng tạo nội dung, xử lý âm thanh video, v.v., đáp ứng nhu cầu giải trí đa dạng của người dùng.
|
||||
|
||||
| STT | Tên kịch bản ứng dụng | Tham khảo triển khai |
|
||||
| :--: | ---------------------------------------------------- | ------------------------------------------------------------------------------------------------------- |
|
||||
| 1 | Engine quyết định tự chủ NPC game thế giới mở dựa trên LLM | Cây hành vi NPC kết hợp quyết định LLM, hệ thống hội thoại tạo tương tác cá nhân hóa; engine hành vi |
|
||||
| 2 | Công cụ hỗ trợ DM với diễn biến cốt truyện AIGC cho game kịch bản nhập vai | Lựa chọn người chơi kích hoạt nhánh cốt truyện, LLM tạo logic suy luận; tự động tạo thẻ manh mối |
|
||||
| 3 | Trình sửa đổi kết thúc truyện tương tác dạng sinh | Lựa chọn độc giả ảnh hưởng hướng đi cốt truyện, LLM tạo nhiều nhánh kết thúc |
|
||||
| 4 | Bàn làm việc tạo mô hình 3D nhân vật anime AIGC tự động | Mô tả văn bản tạo phác thảo nhân vật, công cụ mô hình 3D tự động xây dựng; render vật liệu texture |
|
||||
| 5 | Phân tích thị giác CV và bình luận viên AI thông minh cho trận đấu e-sports | Phân tích thời gian thực màn hình game, nhận diện khoảnh khắc quan trọng; LLM tạo bình luận |
|
||||
| 6 | Engine thuật toán đề xuất nội dung hài hước cá nhân hóa | Hồ sơ sở thích người dùng, đề xuất khớp nội dung hài hước |
|
||||
| 7 | Phần mềm chỉnh giọng hát và làm đẹp giọng KTV AI | Xử lý giảm nhiễu và tăng cường giọng người; thuật toán chỉnh giọng AI |
|
||||
| 8 | Công cụ trích xuất AI cốt truyện riêng nhân vật phim truyền hình và tự động chỉnh sửa | Phân tích nội dung video, trích xuất đoạn liên quan nhân vật; tự động chỉnh sửa tạo |
|
||||
| 9 | Hệ thống tự động tạo sách nói TTS đa vai | Phân vai văn bản, tạo giọng nói cá nhân hóa; thêm nhạc nền và hiệu ứng âm thanh |
|
||||
| 10 | Huấn luyện viên đối chiến và phân tích ván cờ board game reinforcement learning | Phân tích ván cờ, mô phỏng đối chiến đối thủ AI; tạo đề xuất phân tích ván |
|
||||
|
||||
## 15. Thương mại điện tử
|
||||
|
||||
Kịch bản thương mại điện tử tập trung vào nâng cao hiệu suất vận hành và tỷ lệ chuyển đổi. Các ứng dụng cốt lõi bao gồm tạo nội dung sản phẩm, livestream bán hàng, dịch vụ khách hàng, phân tích giá, v.v., giúp người bán thực hiện vận hành thông minh.
|
||||
|
||||
| STT | Tên kịch bản ứng dụng | Tham khảo triển khai |
|
||||
| :--: | ----------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------- |
|
||||
| 1 | Công cụ sản xuất hàng loạt trang chi tiết sản phẩm AIGC tỷ lệ chuyển đổi cao | Nhập thông tin sản phẩm, LLM tạo nội dung điểm bán hàng và mô tả kịch bản; tạo ảnh nền |
|
||||
| 2 | Nhà máy tạo video người mẫu ảo thử đồ AI cho ngành may mặc | Xử lý ảnh sản phẩm may mặc phẳng, tạo hiệu quả thử đồ người mẫu ảo; video trình diễn đa góc độ |
|
||||
| 3 | Trợ lý dịch thuật và biên tập bản địa hóa đa ngôn ngữ LLM cho thương mại điện tử xuyên biên giới | Dịch mô tả sản phẩm đa ngôn ngữ, biên tập thích ứng văn hóa; giao diện phát hành đa nền tảng |
|
||||
| 4 | Robot phân tích cảm xúc khách hàng và phản hồi thông minh dựa trên NLP | Phân tích cảm xúc hội thoại tư vấn, tự động tạo phản hồi xoa dịu; phân loại đánh giá tốt/xấu |
|
||||
| 5 | Hệ thống livestream bán hàng người ảo AIGC toàn thời gian 24 giờ | Hình ảnh người ảo + tạo kịch bản theo thời gian thực, gọi thông tin sản phẩm theo thời gian thực; phản hồi tương tác bình luận |
|
||||
| 6 | Plugin so sánh giá AI sản phẩm tương tự toàn mạng và dự đoán xu hướng | Crawl giá nền tảng thương mại điện tử, hiển thị biểu đồ so sánh giá; dự đoán xu hướng giá |
|
||||
| 7 | Nền tảng lọc thông minh ảnh review khách hàng và tổng hợp video ngắn | Chấm điểm chất lượng ảnh review khách hàng, tự động đề xuất nội dung chất lượng; tổng hợp template video ngắn |
|
||||
| 8 | Phân tích giọng nói hội thoại bán hàng theo thời gian thực và đề xuất kịch bản xuất sắc dựa trên LLM | Chuyển đổi ASR cuộc gọi, kiểm tra tuân thủ kịch bản theo thời gian thực; đề xuất kịch bản |
|
||||
| 9 | Engine dự đoán xu hướng thị trường AI và dự đoán sản phẩm hot | Thu thập và phân tích dữ liệu mạng xã hội và thương mại điện tử, LLM phát hiện xu hướng hot; đề xuất lựa chọn sản phẩm |
|
||||
| 10 | Hệ thống vận hành tinh tế và phân cụm hồ sơ người dùng traffic riêng AI | Phân tích cụm dữ liệu hành vi người dùng, tạo tag hồ sơ; kích hoạt marketing tự động |
|
||||
|
||||
## 16. Năng lượng
|
||||
|
||||
Kịch bản năng lượng hướng tới thực hiện quản lý thông minh và chuyển đổi xanh trong ngành năng lượng. Các ứng dụng điển hình bao gồm phân tích tiêu điện, phát hiện thiết bị, tính toán phát thải carbon, tối ưu điều phối, v.v., thúc đẩy vận hành hiệu quả hệ thống năng lượng.
|
||||
|
||||
| STT | Tên kịch bản ứng dụng | Tham khảo triển khai |
|
||||
| :--: | -------------------------------------------------------- | ------------------------------------------------------------------------------------------------------- |
|
||||
| 1 | Cố vấn phân tích hành vi tiêu điện gia đình và chiến lược tiết kiệm năng lượng AI | Thu thập dữ liệu đồng hồ điện thông minh, phân tích mô hình tiêu điện; LLM tạo đề xuất tiết kiệm năng lượng |
|
||||
| 2 | Hệ thống nhận diện thị giác CV drone phát hiện lỗi linh kiện quang điện | Drone kiểm tra chụp ảnh, phân tích ảnh nhiệt hồng ngoại; đánh dấu phát hiện lỗi |
|
||||
| 3 | Agent dự đoán xu hướng giá giao dịch điện thời gian thực AI và chiến lược sinh lời tự động | Thu thập dữ liệu thị trường điện, mô hình dự đoán giá; tạo chiến lược và thực hiện giao dịch |
|
||||
| 4 | Hệ thống phát hiện sức khỏe không phá hủy AI và cảnh báo rủi ro mất kiểm soát nhiệt pin lưu trữ | Giám sát dữ liệu vận hành pin, mô hình đánh giá sức khỏe; đẩy cảnh báo rủi ro |
|
||||
| 5 | Trợ lý tự động tính toán phát thải carbon toàn chuỗi doanh nghiệp và tạo báo cáo ESG AI | Thu thập dữ liệu tiêu thụ năng lượng, tính toán hệ số phát thải carbon; tự động tạo báo cáo ESG |
|
||||
| 6 | Hệ thống dự đoán phụ tải AI thời tiết cực đoan và chỉ huy điều phối khẩn cấp lưới điện | Kết nối dữ liệu thời tiết, mô hình dự đoán phụ tải; tạo chiến lược điều phối |
|
||||
| 7 | Bảo vệ video AI phát hiện hành vi vi phạm và cảnh báo tại trạm xăng | Phân tích giám sát video, phát hiện hành vi vi phạm (điện thoại, hút thuốc, v.v.); đẩy cảnh báo |
|
||||
| 8 | Hệ thống giám sát sóng âm AI phát hiện rò rỉ và định vị chính xác đường ống dẫn dầu khí dài | Thu thập dữ liệu cảm biến sóng âm, mô hình phát hiện rò rỉ; thuật toán tính định vị |
|
||||
| 9 | Hệ thống quyết định giao dịch điện AI và tập hợp nguồn lực nhà máy ảo | Kết nối nguồn lực phân tán, điều phối tối ưu tập hợp; thực hiện chiến lược giao dịch |
|
||||
| 10 | Theo dõi vị trí nhân viên AI mỏ và cảnh báo xâm phạm khu vực nguy hiểm | Định vị UWB/Bluetooth, theo dõi quỹ đạo nhân viên; hàng rào điện tử khu vực nguy hiểm |
|
||||
|
||||
## 17. Âm thanh và video
|
||||
|
||||
Kịch bản âm thanh video tập trung vào sản xuất nội dung và xử lý media. Các ứng dụng phổ biến bao gồm cắt video, tổng hợp giọng nói, tạo phụ đề, phục hồi video, v.v., nâng cao hiệu suất và chất lượng sản xuất nội dung âm thanh video.
|
||||
|
||||
| STT | Tên kịch bản ứng dụng | Tham khảo triển khai |
|
||||
| :--: | ---------------------------------------------------- | --------------------------------------------------------------------------------------------------- |
|
||||
| 1 | Công cụ nhận diện đoạn hay AI và tự động cắt video ngắn từ video dài | Phân tích nội dung video, nhận diện khung hình quan trọng; tự động cắt đoạn hay |
|
||||
| 2 | Trợ lý tách tiếng ồn nền AI và tăng cường giọng nói video | Mô hình tách âm thanh, loại bỏ tiếng ồn nền; xử lý tăng cường giọng người |
|
||||
| 3 | Bàn làm việc phục hồi siêu phân giải 4K và tự động tô màu AI cho video cũ | Mô hình siêu phân giải video, phục hồi chất lượng video cũ; tự động tô màu AI |
|
||||
| 4 | Hệ thống kiểm soát cảm xúc và lồng tiếng TTS chuyển văn bản thành giọng người thật | Mô hình TTS đa giọng, tạo kiểm soát cảm xúc; xuất âm thanh |
|
||||
| 5 | Công cụ tự động nhận diện giọng nói video ASR và tạo phụ đề song ngữ | Nhận diện giọng nói tạo phụ đề, dịch đa ngôn ngữ; ghép phụ đề song ngữ |
|
||||
| 6 | Engine tách đối tượng thừa AI trong khung hình video | Theo dõi đối tượng video, loại bỏ và sửa khung; xử lý tính nhất quán giữa các khung |
|
||||
| 7 | Máy soạn nhạc tự động AIGC nhạc nền không bản quyền | Mô hình tạo nhạc, phong cách cảm xúc có thể kiểm soát; kiểm tra bản quyền |
|
||||
| 8 | Phần mềm nhân bản giọng người cụ thể AI và chuyển đổi giọng nói | Đào tạo mô hình giọng từ ít mẫu giọng nói; xử lý chuyển đổi giọng |
|
||||
| 9 | Nền tảng chuyển đổi kịch bản sang phân cảnh một chạm và tạo video dự diễn AI | Phân tích kịch bản tạo phân cảnh, AI tạo video dự diễn |
|
||||
| 10 | Trợ lý chuyển đổi giọng nói thông minh và trích xuất việc cần làm từ ghi âm cuộc họp AI | Tách và chuyển đổi giọng nói cuộc họp nhiều người, LLM trích xuất việc cần làm; đánh dấu timestamp |
|
||||
|
||||
## 18. Marketing AI
|
||||
|
||||
Kịch bản marketing AI hướng tới nâng cao hiệu suất marketing và sản xuất sáng tạo. Các ứng dụng cốt lõi bao gồm tạo nội dung, thiết kế poster, theo dõi chủ đề nóng, phân tích đối thủ, v.v., giúp doanh nghiệp thực hiện marketing chính xác và truyền thông thương hiệu.
|
||||
|
||||
| STT | Tên kịch bản ứng dụng | Tham khảo triển khai |
|
||||
| :--: | -------------------------------------------------- | --------------------------------------------------------------------------------------------------------- |
|
||||
| 1 | Engine AIGC tự động viết nội dung viral trên Xiaohongshu | Nhập chủ đề, LLM tạo nội dung review sản phẩm; tối ưu emoji và thẻ chủ đề |
|
||||
| 2 | Công cụ bố trí AI poster marketing và thích ứng đa kích thước | Nhập nội dung, khớp template poster thông minh và xuất đa kích thước |
|
||||
| 3 | Nền tảng tạo sáng tạo LOGO thương hiệu AIGC và xây dựng hệ thống VI | Nhập từ khóa thương hiệu, tạo sáng tạo LOGO; tạo quy phạm VI |
|
||||
| 4 | Trợ lý theo dõi chủ đề nóng AI toàn mạng và tạo sáng tạo marketing | Thu thập dữ liệu chủ đề nóng, LLM phân tích góc marketing; tạo đề án sáng tạo |
|
||||
| 5 | Quản lý đấu giá ngân sách AI và giám sát ROI quảng cáo theo thời gian thực | Kết nối dữ liệu nền tảng quảng cáo, mô hình phân tích hiệu quả; tối ưu chiến lược đấu giá |
|
||||
| 6 | Máy tạo báo cáo tuần phân tích sâu chiến lược marketing đối thủ AI | Thu thập và phân tích nội dung đối thủ, trích xuất chiến lược; tự động tạo báo cáo tuần |
|
||||
| 7 | Viết hàng loạt bài thu hút traffic và bố trí từ khóa SEO AI | Phân tích từ khóa, tạo bài hàng loạt; đề xuất tối ưu SEO |
|
||||
| 8 | Chuyên gia viết email marketing cá nhân hóa AI | Dữ liệu hồ sơ người dùng, tạo nội dung cá nhân hóa; A/B test |
|
||||
| 9 | Radar cảnh báo khủng hoảng dư luận và theo dõi danh tiếng thương hiệu AI toàn mạng | Thu thập dữ liệu dư luận toàn mạng, phân tích cảm xúc; đẩy cảnh báo khủng hoảng |
|
||||
| 10 | Trợ lý tạo sáng tạo kịch bản video ngắn AIGC và hướng dẫn phân cảnh | Nhập chủ đề, tạo kịch bản và phân cảnh; hướng dẫn quay phim |
|
||||
|
||||
## 19. Trí tuệ dữ liệu
|
||||
|
||||
Kịch bản trí tuệ dữ liệu tập trung vào phân tích dữ liệu và khai thác giá trị. Các ứng dụng điển hình bao gồm truy vấn ngôn ngữ tự nhiên, tạo trực quan, quản trị dữ liệu, xây dựng biểu đồ kiến thức, v.v., giúp doanh nghiệp thực hiện hỗ trợ quyết định dựa trên dữ liệu.
|
||||
|
||||
| STT | Tên kịch bản ứng dụng | Tham khảo triển khai |
|
||||
| :--: | ---------------------------------------------- | --------------------------------------------------------------------------------------------------------------- |
|
||||
| 1 | Engine truy vấn dữ liệu ngôn ngữ tự nhiên dựa trên Text-to-SQL | Chuyển đổi ngôn ngữ tự nhiên thành truy vấn SQL, hiển thị trực quan kết quả |
|
||||
| 2 | BI hội thoại: tạo biểu đồ trực quan bằng một câu | Mô tả nhu cầu dữ liệu, tự động tạo biểu đồ; hỗ trợ chuyển đổi đa loại biểu đồ |
|
||||
| 3 | Công cụ nhận diện bảng Excel từ ảnh chụp màn hình một chạm | Tải ảnh chụp màn hình, VLM nhận diện cấu trúc bảng và dữ liệu; xuất file Excel |
|
||||
| 4 | Công cụ nhận diện AI chuyển ảnh và ảnh chụp màn hình thành bảng Excel | Nhận diện cấu trúc bảng qua OCR ảnh, xuất dữ liệu sang Excel |
|
||||
| 5 | Xây dựng biểu đồ kiến thức dữ liệu đa nguồn dị cấu tự động | Kết nối đa nguồn dữ liệu, trích xuất thực thể và quan hệ; lưu trữ cơ sở dữ liệu đồ thị |
|
||||
| 6 | Trợ lý giải thích thông minh báo cáo dữ liệu và phân tích xu hướng | Tải ảnh báo cáo dữ liệu hoặc nhập dữ liệu, VLM giải thích nội dung biểu đồ và phân tích xu hướng |
|
||||
| 7 | Trợ lý giải thích cấu trúc bảng cơ sở dữ liệu và tạo ví dụ truy vấn thông minh | Nhập tên bảng hoặc mô tả trường, LLM tạo giải thích tạo bảng và SQL truy vấn ví dụ |
|
||||
| 8 | Căn chỉnh master data doanh nghiệp thông minh và quản trị trùng lặp AI | Khớp master data đa nguồn, nhận diện bản ghi trùng; cấu hình quy tắc gộp |
|
||||
| 9 | Công cụ chuyển đổi tài liệu yêu cầu dữ liệu thành test case thông minh | Nhập mô tả yêu cầu dữ liệu, LLM tạo kịch bản test và test case xác minh |
|
||||
| 10 | Trợ lý hỏi đáp về chỉ tiêu dữ liệu thông minh | Xây dựng kho kiến thức dựa trên tài liệu định nghĩa chỉ tiêu, LLM trả lời câu hỏi về định nghĩa chỉ tiêu, logic tính toán, v.v. |
|
||||
@@ -0,0 +1,496 @@
|
||||
---
|
||||
title: 'Dùng Jobs to Be Done tìm ra việc người dùng thực sự muốn hoàn thành'
|
||||
description: 'Bài viết Jobs to Be Done dành cho người mới. Hiểu người dùng không phải mua chức năng, mà đang "thuê" sản phẩm của bạn để hoàn thành tiến triển trong kịch bản cụ thể, học cách dùng JTBD phân tích hướng sản phẩm, câu hỏi phỏng vấn và AI prompt.'
|
||||
---
|
||||
|
||||
<script setup>
|
||||
const duration = 'Khoảng <strong>1.5 giờ</strong>'
|
||||
</script>
|
||||
|
||||
# Dùng Jobs to Be Done tìm ra việc người dùng thực sự muốn hoàn thành
|
||||
|
||||
<a id="top-jtbd"></a>
|
||||
|
||||
## Hướng dẫn chương này
|
||||
|
||||
<ChapterIntroduction
|
||||
:duration="duration"
|
||||
:tags="['JTBD', 'Nhu cầu người dùng', 'Tư duy sản phẩm', 'Insight nhu cầu']"
|
||||
coreOutput="1 câu JTBD giống nhu cầu thực tế hơn"
|
||||
expectedOutput="Có thể thu ý tưởng mơ hồ thành kịch bản người dùng và hướng MVP cụ thể hơn"
|
||||
>
|
||||
|
||||
Rất nhiều người vừa bắt đầu làm sản phẩm, sai lầm dễ phạm phải nhất là đặt toàn bộ sự chú ý lên "tôi muốn làm chức năng gì". Thấy người khác có phân loại thông minh, bạn cũng muốn thêm; thấy người khác có tóm tắt tự động, bạn cũng muốn kết nối; thấy người khác làm Agent, đa mô thức, workflow, bạn cũng cảm thấy không thể thiếu.
|
||||
|
||||
Nhưng trong thực tế, người dùng hiếm khi vì "tên chức năng này rất ngầu" mới quyết định dùng một sản phẩm. Họ nhiều hơn là ở một thời điểm cụ thể, muốn đẩy một việc tiến lên phía trước, thế là tạm thời "thuê" một công cụ, một dịch vụ, thậm chí một người, để giúp mình hoàn thành bước này.
|
||||
|
||||
Đây chính là điều phương pháp **Jobs to Be Done (JTBD)** muốn nhắc chúng ta: **Người dùng không phải đang mua bản thân chức năng, mà đang thuê một loại giải pháp nào đó, giúp mình hoàn thành một tiến triển.**
|
||||
|
||||
Bài viết này sẽ dùng ngôn ngữ dễ hiểu nhất, đưa bạn từ không hiểu gì đến hiểu JTBD, và biến nó thành công cụ phân tích bạn có thể trực tiếp dùng khi làm ứng dụng AI.
|
||||
|
||||
</ChapterIntroduction>
|
||||
|
||||
::: info SOP tối thiểu
|
||||
**Mục đích**: Sau khi đọc xong, bạn sẽ rõ hơn cách thu một ý tưởng mơ hồ thành một câu nhu cầu thực sự có kịch bản người dùng, thay vì trong đầu chỉ có một đống tên chức năng.
|
||||
|
||||
**Hành động**: Viết 1 câu ý tưởng mơ hồ, tìm 3 người dùng tiềm năng trò chuyện "lần gần nhất xử lý thế nào", rồi sắp xếp thành 1 câu JTBD.
|
||||
|
||||
**Kết quả**: Bạn sẽ có một giả định nhu cầu rõ ràng hơn, biết phiên bản đầu nên giải quyết gì trước.
|
||||
|
||||
**Từ khóa chuyển nhanh**: [JTBD là gì](#jtbd-what) · [Công thức một câu](#jtbd-formula) · [AI giúp bạn thế nào](#jtbd-ai)
|
||||
:::
|
||||
|
||||
## Bạn sẽ học được những nội dung sau
|
||||
|
||||
1. Jobs to Be Done là gì, tại sao nó gần với nhu cầu thực tế hơn "brainstorm chức năng"
|
||||
2. Cách phân biệt "chức năng người dùng nói muốn" và "việc người dùng thực sự muốn hoàn thành"
|
||||
3. Dùng một template đơn giản thế nào, để thu một ý tưởng mơ hồ thành kịch bản, kích hoạt, rào cản và tiêu chuẩn thành công
|
||||
4. Cách dùng JTBD trong sản phẩm AI, câu hỏi phỏng vấn và sắp xếp AI prompt
|
||||
|
||||
<a id="jtbd-what"></a>
|
||||
## [1. Jobs to Be Done là gì](#top-jtbd)
|
||||
|
||||
Jobs to Be Done thường được viết tắt là **JTBD**. Ý tưởng cốt lõi phía sau nó, liên quan đến cách diễn đạt kinh điển mà nhóm Clayton Christensen phổ biến: **Người dùng sẽ "thuê" một sản phẩm nào đó để hoàn thành một việc.**
|
||||
|
||||
"Việc" ở đây, không phải loại hành động bề mặt trong to-do list, mà là một **tiến triển** mà người dùng hy vọng trạng thái của mình sẽ xảy ra. Ví dụ:
|
||||
|
||||
- Không phải "tôi muốn một công cụ biên bản AI", mà là "tôi muốn trong vòng 10 phút sau cuộc họp sắp xếp rõ trọng tâm, việc cần làm và người phụ trách, đừng nữa dựa vào trí nhớ bù ghi chú"
|
||||
- Không phải "tôi muốn một App ghi chép", mà là "tôi muốn biết tiền rốt cuộc tiêu đi đâu, để cuối tháng đừng nữa lo lắng"
|
||||
- Không phải "tôi muốn một công cụ tối ưu CV", mà là "tôi muốn nộp một CV khá đàng hoàng với nhiều tự tin hơn, không muốn mỗi lần nộp đều hoài nghi mình viết quá kém"
|
||||
|
||||
Vì vậy, **JTBD quan tâm không phải sản phẩm trông thế nào, mà là tại sao người dùng cần nó vào thời điểm này.**
|
||||
|
||||
Đây cũng là lý do rất nhiều sản phẩm nhìn có vẻ khác nhau, thực tế đang cạnh tranh cùng một job. Người dùng muốn "trên đường đi làm không nhàm chán", đối tượng có thể thuê bao gồm video ngắn, podcast, game, chat, thậm chí ngủ gật. Người dùng muốn "nhanh chóng hiểu một PDF rất dài", đối tượng có thể thuê bao gồm công cụ tóm tắt AI, thực tập sinh, đồng nghiệp, tự mình cố đọc, hoặc đơn giản là không xem trước.
|
||||
|
||||
Một khi bạn dùng góc nhìn này để xem vấn đề, bạn sẽ phát hiện đối thủ cạnh tranh thực sự của bạn, thường không chỉ là "một App khác trông giống bạn", mà là **tất cả giải pháp thay thế mà người dùng hiện tại có thể chấp nhận**.
|
||||
|
||||
## 2. JTBD khác gì với chân dung người dùng và danh sách chức năng
|
||||
|
||||
Rất nhiều người mới vừa bắt đầu phân tích nhu cầu, sẽ trước viết chân dung người dùng: 25 tuổi, nữ, thành phố tuyến 1, dân văn phòng, thích công cụ hiệu quả, sẵn sàng thử sản phẩm mới. Loại thông tin này không thể nói hoàn toàn vô dụng, nhưng nó thường **không đủ giải thích tại sao một người sẽ hành động vào thời điểm này.**
|
||||
|
||||
JTBD quan tâm hơn đến những vấn đề dưới đây:
|
||||
|
||||
- Anh/chị trong kịch bản nào quyết định tìm giải pháp
|
||||
- Lúc đó rốt cuộc bị kẹt cái gì
|
||||
- Anh/chị muốn đẩy việc gì bước tới bước tiếp theo
|
||||
- Hiện đang dùng cách vụng về nào gồng gánh
|
||||
- Nếu việc giải quyết tốt, kết quả nào sẽ khiến anh/chị thấy "đáng"
|
||||
|
||||
Nói cách khác, **chân dung người dùng giống hơn "người này đại khái là ai", JTBD giống hơn "người này hiện tại rốt cuộc muốn hoàn thành cái gì".**
|
||||
|
||||
Tương tự, danh sách chức năng cũng dễ dẫn dắt sai hướng. Người dùng nói "tôi muốn xuất Word", "tôi muốn AI sửa viết", "tôi muốn nhập giọng nói", đây đều chỉ là diễn đạt bề mặt. JTBD sẽ tiếp tục hỏi sâu:
|
||||
|
||||
- Tại sao bạn hiện tại cần xuất Word, chứ không phải PDF?
|
||||
- Bạn muốn sửa viết, là vì văn phong quá kém, hay vì cần phù hợp với đối tượng khác nhau?
|
||||
- Bạn muốn nhập giọng nói, là vì lười gõ phím, hay vì bạn thường xuyên đang đi bộ, đang lái xe, vừa họp xong cần ghi chép ngay?
|
||||
|
||||
Rất nhiều lúc, **chức năng chỉ là một loại dịch thuật tạm thời của job**. Nếu bạn chỉ thu thập chức năng, rất dễ làm sản phẩm thành "người dùng nói gì thì chất gì"; Nếu bạn nhìn thấy job phía sau, mới có nhiều cơ hội làm ra giải pháp thực sự thuận tay, thực sự có sức cạnh tranh.
|
||||
|
||||
## 3. Một ví dụ người mới cũng có thể hiểu
|
||||
|
||||
Trước đừng vội nghĩ đến sản phẩm AI phức tạp, chúng ta bắt đầu từ một ví dụ cuộc sống.
|
||||
|
||||
Giả sử có người trước khi ra cửa buổi sáng luôn không kịp ăn sáng, nên thường xuyên mua sandwich và cà phê ở cửa tàu điện ngầm. Nhìn bề ngoài, anh ấy "mua" là bữa sáng; nhưng nếu nhìn bằng JTBD, việc anh ấy thực sự muốn hoàn thành có thể là:
|
||||
|
||||
- Trong buổi sáng vội vã, dùng cách ít tốn sức não nhất giải quyết một bữa ăn
|
||||
- Để mình trước khi đến công ty không bị đói phát hoảng
|
||||
- Không vì ăn sáng mà ảnh hưởng nhịp độ đi làm
|
||||
|
||||
Lúc này, người dùng thuê không phải "sandwich của một thương hiệu cố định nào đó", mà là một giải pháp giúp anh ấy đẩy buổi sáng thuận lợi tiến lên. Nếu cửa hàng tiện lợi bên cạnh nhanh hơn, gần hơn, ổn định hơn, anh ấy có thể ngay lập tức đổi lựa chọn ban đầu.
|
||||
|
||||
Đem logic này sang sản phẩm AI thì rõ ràng hơn.
|
||||
|
||||
Ví dụ bạn muốn làm một "công cụ biên bản cuộc họp AI". Nếu chỉ dừng lại ở cấp chức năng, bạn sẽ rất dễ bắt đầu nghĩ:
|
||||
|
||||
- Có nên hỗ trợ upload audio không
|
||||
- Có nên kết nối tách người nói không
|
||||
- Có nên xuất Markdown không
|
||||
- Có nên tự động sinh việc cần làm không
|
||||
|
||||
Những điều này đều không sai, nhưng chưa đủ. Dùng JTBD hỏi thêm một tầng, việc người dùng thực sự muốn hoàn thành có thể là:
|
||||
|
||||
- Tôi muốn trong 10 phút sau cuộc họp, đồng bộ kết quả thảo luận cho người không tham dự
|
||||
- Tôi muốn trích xuất sạch việc cần làm, người phụ trách và thời hạn, đừng để nhóm dựa vào trí nhớ phối hợp
|
||||
- Tôi muốn giảm thời gian sắp xếp nội dung cuộc họp lặp đi lặp lại, dành sức lực cho quyết sách và thúc đẩy
|
||||
|
||||
Một khi job được nói rõ, rất nhiều ưu tiên chức năng sẽ tự động nổi lên. Phiên bản đầu quan trọng nhất có thể không phải "hỗ trợ 12 định dạng xuất", mà là:
|
||||
|
||||
- Cấu trúc biên bản đủ rõ ràng
|
||||
- Trích xuất việc cần làm ổn định
|
||||
- Link chia sẻ thuận tiện
|
||||
- Kết quả xuất ra khiến người ta dám trực tiếp chuyển tiếp cho nhóm
|
||||
|
||||
Đây là giá trị của JTBD: **Nó có thể giúp bạn từ "tôi muốn chất những khả năng nào" quay về "tôi muốn giúp người dùng thúc đẩy tiến triển gì".**
|
||||
|
||||
## 4. Một template JTBD hữu dụng
|
||||
|
||||
Nếu bạn là người mới, có thể trước đừng cố nghĩ JTBD quá học thuật. Trước nắm 5 yếu tố thực dụng nhất là đủ.
|
||||
|
||||
### 4.1 Kịch bản
|
||||
|
||||
Người dùng ở thời điểm nào, trong môi trường nào nhớ đến sản phẩm này?
|
||||
|
||||
- Là sau khi họp xong
|
||||
- Là lúc sếp đột xuất đòi tài liệu
|
||||
- Là buổi tối chuẩn bị nộp CV
|
||||
- Là cuối tháng phát hiện tiền lại không đủ
|
||||
|
||||
**Nhu cầu không có kịch bản, thường đều chưa đủ thực tế.**
|
||||
|
||||
### 4.2 Kích hoạt
|
||||
|
||||
Là cái gì khiến anh/chị quyết định ngay lập tức tìm giải pháp?
|
||||
|
||||
- Bị đè nén bởi tài liệu dài, không biết bắt đầu đọc từ đâu
|
||||
- Ngày mai phải nộp tài liệu, hôm nay mới phát hiện format lộn xộn
|
||||
- Vừa bị sếp hỏi tiến độ, nhận ra mình chưa sắp xếp rõ ràng
|
||||
- Muốn kiên trì ghi chép, nhưng viết tay, copy, sắp xếp đều quá phiền
|
||||
|
||||
Điểm kích hoạt thường mang theo cảm xúc. Cảm xúc này rất quan trọng, vì nó quyết định tại sao người dùng sẽ hành động vào khoảnh khắc này.
|
||||
|
||||
### 4.3 Tiến triển muốn hoàn thành
|
||||
|
||||
Anh/chị không chỉ muốn "làm một hành động", mà muốn đẩy mình tiến tới trạng thái mới nào?
|
||||
|
||||
- Từ hỗn loạn đến rõ ràng
|
||||
- Từ lo lắng đến an tâm
|
||||
- Từ trì hoãn đến khởi động
|
||||
- Từ kém hiệu quả đến thuận tay
|
||||
- Từ nói không rõ ràng đến có thể trực tiếp giao nộp
|
||||
|
||||
Trong bước này, từ "tiến triển" rất then chốt. Vì rất nhiều người thực sự mua không phải công cụ, mà là **sự thay đổi trạng thái**.
|
||||
|
||||
### 4.4 Giải pháp thay thế hiện tại
|
||||
|
||||
Hiện không có sản phẩm của bạn, anh/chị làm thế nào?
|
||||
|
||||
- Thủ công copy paste
|
||||
- Dùng Excel hoặc sổ tay gồng gánh
|
||||
- Tìm đồng nghiệp giúp đỡ
|
||||
- Kéo dài không làm
|
||||
- Chuyển qua lại giữa vài công cụ
|
||||
|
||||
Ai là giải pháp thay thế, ai là môi trường cạnh tranh thực sự của bạn.
|
||||
|
||||
### 4.5 Tiêu chuẩn thành công
|
||||
|
||||
Việc thế nào mới tính thực sự được giải quyết?
|
||||
|
||||
- Trong 10 phút nhận được kết quả có thể chia sẻ
|
||||
- Không cần sửa lớn lần hai đã có thể gửi cho người khác
|
||||
- Không dễ bị sót, bị sai, quên việc
|
||||
- Lần đầu dùng đã biết bước tiếp theo làm gì
|
||||
|
||||
Nếu bạn thậm chí "người dùng đánh giá đáng hay không" đều nói không rõ, thì hướng này đa số chưa được thu tốt.
|
||||
|
||||
<a id="jtbd-formula"></a>
|
||||
## [5. Công thức một câu có thể áp dụng trực tiếp](#top-jtbd)
|
||||
|
||||
Khi bạn muốn sắp xếp một hướng sản phẩm, có thể trước áp câu rất thực dụng này:
|
||||
|
||||
> Khi __________, tôi muốn __________, để __________.
|
||||
> Hiện tôi chỉ có thể thông qua __________ để miễn cưỡng hoàn thành việc này.
|
||||
|
||||
Ví dụ:
|
||||
|
||||
> Khi tôi vừa xong một cuộc họp dự án với lượng thông tin rất lớn, tôi muốn nhanh chóng nhận được một biên bản kèm việc cần làm, người phụ trách và thời hạn, để tôi có thể ngay lập tức đồng bộ nhóm và thúc đẩy thực hiện.
|
||||
> Hiện tôi chỉ có thể dựa vào tự mình nhớ, lướt lịch sử chat và thủ công sắp xếp để miễn cưỡng hoàn thành việc này.
|
||||
|
||||
Lại ví dụ:
|
||||
|
||||
> Khi tôi chuẩn bị nộp một vị trí mới, tôi muốn nhanh chóng sửa kinh nghiệm hiện có thành phiên bản phù hợp với vị trí hơn, để tôi có thể nộp một CV khá đàng hoàng với nhiều tự tin hơn.
|
||||
> Hiện tôi chỉ có thể liên tục copy CV cũ, sửa cách diễn đạt bằng tay, sửa đến cuối cùng càng ngày càng không chắc chắn.
|
||||
|
||||
Nếu bạn có thể viết một câu rõ ràng đến mức này, thiết kế trang, thiết kế prompt, đánh giá ưu tiên chức năng phía sau, đều sẽ dễ hơn nhiều.
|
||||
|
||||
## 6. Khi làm sản phẩm AI, đặc biệt phải xem ba tầng job
|
||||
|
||||
Rất nhiều sản phẩm AI khi demo chức năng trông rất mạnh, nhưng sau khi thực sự lên mạng lại không giữ chân được người dùng, lý do phổ biến là chỉ giải quyết hành động bề mặt, chưa giải quyết job sâu hơn.
|
||||
|
||||
Bạn có thể thô chia một job thành ba tầng để xem:
|
||||
|
||||
### 6.1 Tầng chức năng
|
||||
|
||||
Nhiệm vụ bề mặt nhất là gì?
|
||||
|
||||
- Tóm tắt tài liệu
|
||||
- Sửa viết văn bản
|
||||
- Trích xuất việc cần làm
|
||||
- Tạo hình ảnh
|
||||
|
||||
Đây là tầng dễ nói ra nhất bằng miệng người dùng.
|
||||
|
||||
### 6.2 Tầng cảm xúc
|
||||
|
||||
Người dùng hy vọng giảm bớt sự không thoải mái nào, hoặc thu được cảm giác gì?
|
||||
|
||||
- Không muốn hoảng hốt như vậy
|
||||
- Không muốn trông thiếu chuyên nghiệp
|
||||
- Không muốn mỗi lần đều bắt đầu từ đầu
|
||||
- Muốn có nhiều cảm giác kiểm soát hơn
|
||||
|
||||
Rất nhiều ý muốn trả phí, thực tế quan hệ rất lớn với tầng cảm xúc.
|
||||
|
||||
### 6.3 Tầng xã hội
|
||||
|
||||
Người dùng hy vọng trong mắt người khác trở thành kiểu người nào?
|
||||
|
||||
- Trông đáng tin cậy hơn
|
||||
- Có khả năng tổ chức hơn trong nhóm
|
||||
- Chuyên nghiệp hơn trước mặt khách hàng
|
||||
- Biết diễn đạt hơn trên nền tảng xã hội
|
||||
|
||||
Nếu bạn chỉ làm tầng chức năng, sản phẩm rất dễ bị thay thế; Nếu bạn đồng thời hiểu tầng cảm xúc và tầng xã hội, bạn sẽ dễ tìm được giá trị có độ dính thực sự hơn.
|
||||
|
||||
## 7. Dùng JTBD ngược lại sàng lọc hướng sản phẩm
|
||||
|
||||
Đôi khi không phải bạn đã có sản phẩm, mà trong tay có 3 đến 5 ý tưởng, không biết làm cái nào. Lúc này JTBD rất phù hợp để làm sàng lọc.
|
||||
|
||||
Bạn có thể cầm mỗi ý tưởng, lần lượt hỏi mình 5 câu:
|
||||
|
||||
1. Kịch bản tương ứng với ý tưởng này có đủ cụ thể không?
|
||||
2. Người dùng hiện đã dùng cách vụng về nào đó để giải quyết chưa?
|
||||
3. Mức độ đau của job này có đủ mạnh, hoặc tần suất có đủ cao không?
|
||||
4. Nếu tôi làm tốt, người dùng có cảm nhận rõ ràng "trạng thái tốt lên" không?
|
||||
5. Phiên bản đầu có thể chỉ xoay quanh bước quan trọng nhất của job này, làm ra một phiên bản rất nhỏ nhưng hữu dụng không?
|
||||
|
||||
Nếu một hướng nói đến cuối cùng vẫn chỉ có thể nói "cảm giác khá thú vị", nhưng nói không rõ kích hoạt, giải pháp thay thế và tiêu chuẩn thành công, thì nó đa số vẫn chỉ là một cảm hứng mơ hồ, không phải một hướng trưởng thành.
|
||||
|
||||
## 8. Câu hỏi có thể trực tiếp mang đi phỏng vấn người dùng
|
||||
|
||||
Rất nhiều người vừa làm nghiên cứu đã hỏi: "Bạn muốn chức năng gì?" Cách hỏi này rất dễ nhận được câu trả lời bề mặt.
|
||||
|
||||
JTBD phù hợp hỏi những câu dưới đây:
|
||||
|
||||
- Lần gần nhất bạn gặp vấn đề này là khi nào?
|
||||
- Lúc đó bạn đang làm gì, tại sao bị kẹt?
|
||||
- Cuối cùng bạn đã giải quyết thế nào?
|
||||
- Trong quá trình này, nơi phiền nhất, chậm nhất, không yên tâm nhất là gì?
|
||||
- Nếu có một công cụ giúp bạn, kết quả nào khiến bạn thấy thực sự hữu dụng?
|
||||
- Bạn đã thử cách thay thế nào? Tại sao chúng không đủ tốt?
|
||||
|
||||
Lợi ích của cách hỏi này: Nó sẽ kéo đối thoại về trải nghiệm thực tế, thay vì dừng lại ở sở thích trong tưởng tượng.
|
||||
|
||||
## 9. Dùng AI giúp bạn phân tích JTBD
|
||||
|
||||
Bản thân JTBD không phải do AI phát minh, nhưng AI rất phù hợp giúp bạn sắp xếp và tinh lọc JTBD.
|
||||
|
||||
Ví dụ bạn đã thu thập 5 đến 10 phản hồi người dùng, có thể ném cho mô hình, để nó tổng kết theo cấu trúc dưới đây:
|
||||
|
||||
```text
|
||||
Xin đóng vai trợ lý nghiên cứu sản phẩm.
|
||||
Tôi sẽ cho bạn một số lời gốc của người dùng, xin đừng cho gợi ý chức năng trước,
|
||||
mà trước sắp xếp theo framework Jobs to Be Done:
|
||||
|
||||
1. Người dùng đang ở kịch bản nào
|
||||
2. Sự kiện kích hoạt anh/chị hành động là gì
|
||||
3. Tiến triển anh/chị thực sự muốn hoàn thành là gì
|
||||
4. Giải pháp thay thế hiện tại là gì
|
||||
5. Tiêu chuẩn thành công anh/chị quan tâm nhất là gì
|
||||
6. Những từ cảm xúc xuất hiện lặp đi lặp lại trong những phản hồi này là gì
|
||||
|
||||
Cuối cùng, xin sắp xếp nội dung này thành 3 giả định JTBD đáng ưu tiên xác minh nhất.
|
||||
```
|
||||
|
||||
Nếu bạn đã có một ý tưởng, cũng có thể để AI giúp bạn làm vòng thu thứ nhất:
|
||||
|
||||
```text
|
||||
Tôi muốn làm một [ý tưởng sản phẩm của bạn].
|
||||
Xin đừng trực tiếp cho tôi danh sách chức năng, mà dùng phương pháp Jobs to Be Done giúp tôi phân tích:
|
||||
|
||||
1. Sản phẩm này có thể phục vụ những kịch bản cụ thể nào
|
||||
2. Job cốt lõi người dùng muốn hoàn thành trong mỗi kịch bản là gì
|
||||
3. Những giải pháp thay thế hiện có nào
|
||||
4. Job nào phù hợp nhất làm điểm khởi đầu MVP, tại sao
|
||||
5. Xin viết job cuối cùng được đề xuất thành một câu JTBD rõ ràng
|
||||
```
|
||||
|
||||
Lợi ích của việc này là, bạn sẽ không vừa lên đã bị AI dẫn đi "brainstorm 50 chức năng", mà trước làm rõ hướng đã.
|
||||
|
||||
## 10. 4 sai lầm phổ biến nhất của người mới
|
||||
|
||||
### 10.1 Viết job thành tên chức năng
|
||||
|
||||
"AI tóm tắt", "phân loại thông minh", "tự động tạo" đều không phải job, chúng chỉ là cách triển khai khả thi.
|
||||
|
||||
### 10.2 Viết nhóm người rất rộng
|
||||
|
||||
"Tất cả dân văn phòng", "tất cả sinh viên", "tất cả doanh nhân" thường đều quá rộng. Càng rộng, bạn càng khó nhìn thấy kịch bản thực tế.
|
||||
|
||||
### 10.3 Chỉ nghe người dùng nói, không xem người dùng làm thế nào
|
||||
|
||||
Người dùng sẽ mô tả mình muốn gì, nhưng ưu tiên thực sự của họ, thường giấu trong cách họ hiện khắc phục tạm thời giải quyết vấn đề.
|
||||
|
||||
### 10.4 Vừa bắt đầu đã muốn làm nền tảng hoàn chỉnh
|
||||
|
||||
Cách mở đúng của JTBD, thường không phải "tôi làm một nền tảng vạn năng bao trùm", mà là trước tiên tập trung vào một bước quan trọng nhất trong một kịch bản, làm nó rất thuận tay.
|
||||
|
||||
## 11. Tóm tắt
|
||||
|
||||
Giá trị lớn nhất của Jobs to Be Done, không phải cho bạn một danh từ mới, mà giúp bạn đổi một góc quan sát: **Đừng chỉ tập trung vào chức năng sản phẩm, mà hãy tập trung vào việc người dùng muốn đẩy cái gì bước tới bước tiếp theo.**
|
||||
|
||||
Khi bạn bắt đầu liên tục hỏi mình:
|
||||
|
||||
- Người dùng trong kịch bản nào thuê sản phẩm này
|
||||
- Anh/chị rốt cuộc bị kẹt ở đâu
|
||||
- Hiện đang dùng cách nào gồng gánh
|
||||
- Sau khi việc giải quyết xong, trạng thái sẽ thay đổi thế nào
|
||||
|
||||
Bạn sẽ phát hiện, rất nhiều ý tưởng mơ hồ ban đầu bỗng trở nên rõ ràng, rất nhiều chức năng hoa mỹ cũng bỗng không quan trọng như vậy.
|
||||
|
||||
Làm sản phẩm, đặc biệt là làm sản phẩm AI, sợ nhất là vừa bắt đầu đã đắm chìm trong trưng bày khả năng. JTBD có thể giúp kéo sự chú ý của bạn về nơi thực sự quan trọng: **Tại sao người dùng cần bạn, và bạn rốt cuộc đang giúp anh/chị hoàn thành tiến triển gì.**
|
||||
|
||||
<a id="jtbd-ai"></a>
|
||||
## [12. Cách dùng AI giúp bạn thực hành JTBD](#top-jtbd)
|
||||
|
||||
JTBD không phải do AI phát minh, nhưng AI rất phù hợp đóng vai trợ lý nghiên cứu, trợ lý sắp xếp và trợ lý đối chiếu trong phương pháp này. Điểm mấu chốt là: **Để AI giúp bạn sắp xếp và mở rộng, thay vì thay bạn phỏng đoán người dùng.**
|
||||
|
||||
Bạn có thể dùng như sau:
|
||||
|
||||
### 12.1 Để AI giúp bạn viết lại ý tưởng mơ hồ thành giả định JTBD
|
||||
|
||||
Khi trong đầu bạn chỉ có một câu mô tả mơ hồ, ví dụ "tôi muốn làm một công cụ giúp sinh viên tìm thực tập", có thể trước để AI giúp bạn tách thành vài job khả dĩ:
|
||||
|
||||
```text
|
||||
Tôi hiện có một ý tưởng sản phẩm mơ hồ: [Ý tưởng của bạn]
|
||||
Xin đừng trực tiếp cho tôi danh sách chức năng, mà dùng cách Jobs to Be Done giúp tôi phân tích:
|
||||
1. Có thể tương ứng với những kịch bản cụ thể nào
|
||||
2. Trong mỗi kịch bản, tiến triển người dùng thực sự muốn hoàn thành là gì
|
||||
3. Giải pháp thay thế hiện tại có thể là gì
|
||||
4. Job nào phù hợp nhất làm MVP trước
|
||||
Xin cuối cùng viết mỗi job thành một câu JTBD rõ ràng.
|
||||
```
|
||||
|
||||
Bạn thậm chí có thể viết input rất nhỏ:
|
||||
|
||||
```text
|
||||
Tôi muốn làm một thứ giúp sinh viên tìm thực tập.
|
||||
Tôi hiện cũng nói không rõ cụ thể làm cái gì, bạn giúp tôi nghĩ xem người dùng rốt cuộc muốn hoàn thành việc gì.
|
||||
```
|
||||
|
||||
AI có thể cho output hữu ích trông như thế này:
|
||||
|
||||
```text
|
||||
Hướng JTBD khả dĩ:
|
||||
|
||||
1. Khi tôi lần đầu chuẩn bị nộp thực tập, tôi muốn nhanh chóng biết nên chuẩn bị những tài liệu nào trước,
|
||||
để tôi không vì thông tin lộn xộn mà kéo dài không nộp.
|
||||
|
||||
2. Khi tôi thấy một vị trí thực tập, tôi muốn nhanh chóng đánh giá mình có đáng nộp hay không,
|
||||
để tôi không lãng phí quá nhiều thời gian ở vị trí không phù hợp.
|
||||
|
||||
3. Khi tôi bắt đầu nộp hồ sơ, tôi muốn sửa CV hiện có thành phiên bản phù hợp với vị trí hơn,
|
||||
để tôi có thể hoàn thành nộp nhanh hơn và tăng tỷ lệ được thông qua.
|
||||
```
|
||||
|
||||
Giá trị của loại output này là, nó sẽ tách ý tưởng rất rộng của bạn thành vài hướng gần với kịch bản thực tế hơn.
|
||||
|
||||
### 12.2 Để AI giúp bạn sắp xếp lời gốc phỏng vấn
|
||||
|
||||
Nếu bạn đã làm vài lần phỏng vấn người dùng, có thể giao bản ghi phỏng vấn cho AI, để nó giúp bạn tinh lọc kịch bản, điểm kích hoạt, giải pháp thay thế và tiêu chuẩn thành công xuất hiện lặp đi lặp lại.
|
||||
|
||||
```text
|
||||
Dưới đây là lời gốc phỏng vấn của 5 người dùng.
|
||||
Xin đừng cho giải pháp trước, mà sắp xếp theo framework JTBD:
|
||||
1. Người dùng đang ở kịch bản nào
|
||||
2. Sự kiện kích hoạt anh/chị hành động là gì
|
||||
3. Tiến triển anh/chị thực sự muốn hoàn thành là gì
|
||||
4. Giải pháp thay thế hiện tại là gì
|
||||
5. Tiêu chuẩn thành công anh/chị quan tâm nhất là gì
|
||||
6. Thông tin nào xuất hiện lặp lại ở nhiều người dùng
|
||||
Cuối cùng sắp xếp thành 3 giả định JTBD đáng ưu tiên xác minh nhất.
|
||||
```
|
||||
|
||||
Một input rất đơn giản cũng có thể viết như sau:
|
||||
|
||||
```text
|
||||
Tôi hỏi 3 người, họ đại khái nói như thế này:
|
||||
|
||||
1. Mỗi lần nộp thực tập tôi đều phải sửa lại CV, rất phiền.
|
||||
2. Tôi thực sự sợ nhất là không biết mình viết đúng chưa.
|
||||
3. Hiện tôi sẽ tìm anh chị khóa trên giúp xem, nhưng mỗi lần đều ngại phiền người ta mãi.
|
||||
|
||||
Bạn giúp tôi sắp xếp, việc họ thực sự muốn hoàn thành là gì.
|
||||
```
|
||||
|
||||
AI có thể xuất:
|
||||
|
||||
```text
|
||||
Kết quả sắp xếp:
|
||||
|
||||
- Kịch bản chung: Trước khi chuẩn bị nộp thực tập, cần xử lý CV
|
||||
- Khó khăn chung: Không biết sửa đến mức nào thì "đủ tốt"
|
||||
- Giải pháp thay thế hiện tại: Tìm anh chị khóa trên giúp xem, tự mình sửa lặp đi lặp lại
|
||||
- JTBD khả dĩ:
|
||||
Khi tôi chuẩn bị nộp thực tập, tôi muốn nhanh hơn đánh giá CV đã đạt mức có thể nộp chưa,
|
||||
để tôi không luôn kẹt ở "sửa thêm chút nữa" mà mãi không nộp được.
|
||||
```
|
||||
|
||||
Loại output này rất hữu dụng, vì nó giúp bạn từ lời gốc phân tán tinh lọc ra thứ giống "nhu cầu" hơn.
|
||||
|
||||
### 12.3 Để AI giúp bạn làm một vòng nghiên cứu mạng nhẹ nhàng
|
||||
|
||||
Trước khi bạn chưa bắt đầu phỏng vấn quy mô lớn, có thể trước để AI giúp bạn làm một số quét thông tin bên ngoài rất nhẹ, ví dụ:
|
||||
|
||||
- Trong diễn đàn hoặc cộng đồng công khai, mọi người phàn nàn về vấn đề này thế nào
|
||||
- Sản phẩm hiện có trên thị trường chủ yếu đang giải quyết tầng vấn đề nào
|
||||
- Giải pháp thay thế phổ biến nhất của người dùng là gì
|
||||
- Trong đánh giá phổ biến, điểm mọi người hài lòng và không hài lòng nhất là gì
|
||||
|
||||
Loại nghiên cứu này không thể thay thế phỏng vấn người dùng thực tế, nhưng rất phù hợp làm khởi động cho giai đoạn Discover, giúp bạn xây bản đồ vấn đề trước.
|
||||
|
||||
Một input đơn giản:
|
||||
|
||||
```text
|
||||
Xin giúp tôi kiểm tra:
|
||||
"Sinh viên sửa CV, nộp thực tập thường gặp điểm đau nhất là gì?"
|
||||
Ưu tiên xem trong diễn đàn công khai, bài viết kinh nghiệm, cộng đồng tìm việc những gì mọi người tự nói.
|
||||
Giúp tôi sắp xếp thành 5 vấn đề phổ biến nhất.
|
||||
```
|
||||
|
||||
AI có thể xuất:
|
||||
|
||||
```text
|
||||
Sắp xếp điểm đau phổ biến:
|
||||
|
||||
1. Không biết CV nên viết kinh nghiệm gì, kinh nghiệm quá ít
|
||||
2. Không biết sửa cho phù hợp với vị trí khác nhau thế nào
|
||||
3. Sửa nhiều phiên bản, nhưng luôn không chắc đã đủ tốt
|
||||
4. Không tìm được người đáng tin cậy giúp xem
|
||||
5. Quy trình nộp hồ sơ phức tạp, dễ trì hoãn
|
||||
```
|
||||
|
||||
Loại output này không thể làm kết luận cuối cùng, nhưng rất phù hợp giúp bạn trước quyết định ưu tiên phỏng vấn loại vấn đề nào.
|
||||
|
||||
### 12.4 Để AI đóng vai "bên phản đối"
|
||||
|
||||
Rất nhiều lúc, chúng ta quá có cảm tình với ý tưởng của mình. Bạn có thể chuyên để AI đóng vai người bắt lỗi, ép bạn nói rõ vấn đề hơn:
|
||||
|
||||
```text
|
||||
Xin đóng vai một cố vấn nghiên cứu sản phẩm rất nghiêm ngặt.
|
||||
Dưới đây là giả định JTBD của tôi: [Giả định của bạn]
|
||||
Xin phê bình nó từ các góc độ sau:
|
||||
1. Kịch bản này có quá rộng không
|
||||
2. Job này có phải viết thành chức năng thay vì tiến triển thực sự không
|
||||
3. Giải pháp thay thế có quá yếu không
|
||||
4. Tiêu chuẩn thành công có đủ rõ ràng không
|
||||
5. Rủi ro cần được xác minh nhất của giả định này là gì
|
||||
```
|
||||
|
||||
Lợi ích của việc này là, bạn nhanh hơn phát hiện mình đang nhìn nhu cầu hay chỉ đang nhìn giải pháp mình thích.
|
||||
|
||||
## 📚 Bài tập
|
||||
|
||||
Xin bạn dựa vào nội dung bài viết, hoàn thành bài tập sau:
|
||||
|
||||
1. Chọn một ý tưởng sản phẩm bạn muốn làm gần đây, dùng một công thức JTBD viết rõ nó
|
||||
2. Bổ sung 5 yếu tố cho ý tưởng này: Kịch bản, kích hoạt, tiến triển, giải pháp thay thế, tiêu chuẩn thành công
|
||||
3. Tìm 3 người dùng tiềm năng, ít nhất hỏi được một lần "lần gần nhất bạn gặp vấn đề này là khi nào"
|
||||
4. Giao lời gốc phỏng vấn cho AI, sắp xếp thành 3 giả định JTBD đáng ưu tiên xác minh nhất
|
||||
|
||||
## Đọc thêm
|
||||
|
||||
- [Christensen Institute: Jobs to Be Done](https://www.christenseninstitute.org/theory/jobs-to-be-done/)
|
||||
- [Harvard Business School Online: What Is Jobs to Be Done?](https://online.hbs.edu/blog/post/jobs-to-be-done)
|
||||
- [Intercom: Jobs-to-be-Done: A framework for customer needs](https://www.intercom.com/blog/jobs-to-be-done-framework/)
|
||||
- [Mural: Jobs to Be Done framework guide](https://www.mural.co/blog/jobs-to-be-done-framework)
|
||||
@@ -0,0 +1,589 @@
|
||||
---
|
||||
title: 'The Mom Test：Xác minh nhu cầu thông qua phỏng vấn người dùng'
|
||||
description: 'Bài viết The Mom Test dành cho người mới. Học cách tránh phản hồi lịch sự, tập trung vào hành vi thực tế, sự kiện cụ thể và vấn đề hiện có trong phỏng vấn người dùng, biến "nghe có vẻ ổn" thành đánh giá nhu cầu đáng tin cậy hơn.'
|
||||
---
|
||||
|
||||
<script setup>
|
||||
const duration = 'Khoảng <strong>1.5 giờ</strong>'
|
||||
</script>
|
||||
|
||||
# The Mom Test：Xác minh nhu cầu thông qua phỏng vấn người dùng
|
||||
|
||||
<a id="top-mom"></a>
|
||||
|
||||
## Hướng dẫn chương này
|
||||
|
||||
<ChapterIntroduction
|
||||
:duration="duration"
|
||||
:tags="['Phỏng vấn người dùng', 'Xác minh nhu cầu', 'Nghiên cứu người dùng', 'Nghiên cứu sản phẩm']"
|
||||
coreOutput="1 bộ câu hỏi phỏng vấn có thể khai thác thông tin thực tế hơn"
|
||||
expectedOutput="Không còn coi phản hồi lịch sự của người dùng là xác minh, mà có thể dùng hành vi thực tế để đánh giá hướng đi"
|
||||
>
|
||||
|
||||
Rất nhiều người lần đầu làm nghiên cứu sản phẩm, nghĩ rằng điều quan trọng nhất là "tìm người trò chuyện". Thế là họ đi hỏi bạn bè, đồng nghiệp, thậm chí người thân:
|
||||
|
||||
- Bạn thấy ý tưởng này của tôi thế nào?
|
||||
- Nếu có một sản phẩm như vậy, bạn có dùng không?
|
||||
- Chức năng này nghe có vẻ khá chứ?
|
||||
|
||||
Đối phương cũng thường cho phản hồi rất đáng khích lệ:
|
||||
|
||||
- Khá lắm
|
||||
- Nghe có vẻ hữu ích
|
||||
- Tôi nghĩ bạn có thể thử
|
||||
|
||||
Vấn đề là, những câu trả lời này thường không giúp bạn đưa ra đánh giá. Chúng giống như sự lịch sự, ủng hộ, hoặc phản ứng tự nhiên không muốn làm mất lòng bạn tại chỗ. Bạn tưởng mình đã "xác minh thị trường", thực ra chỉ thu thập được một đống lời an ủi khó dùng để ra quyết định.
|
||||
|
||||
Phương pháp The Mom Test là để giải quyết vấn đề này. Nó nhắc nhở chúng ta: **Không phải người dùng cố tình lừa bạn, mà là cách bạn hỏi câu hỏi, tự nhiên sẽ dẫn đối phương đến những câu trả lời nghe hay nhưng vô dụng.**
|
||||
|
||||
</ChapterIntroduction>
|
||||
|
||||
::: info SOP tối thiểu
|
||||
**Mục đích**: Sau khi đọc xong, bạn sẽ rõ hơn cách trò chuyện với người dùng thế nào để không chỉ nghe "nghe có vẻ ổn", mà thực sự hỏi được thông tin giúp bạn đánh giá hướng đi.
|
||||
|
||||
**Hành động**: Viết lại 5 câu hỏi bạn định hỏi, ưu tiên hỏi "lần gần nhất xảy ra khi nào", "bạn đã xử lý thế nào lúc đó".
|
||||
|
||||
**Kết quả**: Bạn sẽ dễ dàng phân biệt hơn đâu là ý kiến, đâu mới là bằng chứng thực sự có thể hỗ trợ đánh giá.
|
||||
|
||||
**Từ khóa chuyển nhanh**: [The Mom Test là gì](#mom-what) · [Ba nguyên tắc cốt lõi](#mom-principles) · [AI giúp bạn thế nào](#mom-ai)
|
||||
:::
|
||||
|
||||
## Bạn sẽ học được những nội dung sau
|
||||
|
||||
1. The Mom Test đang giải quyết vấn đề gì, tại sao nhiều "nghiên cứu người dùng" thực ra không nghiên cứu được thông tin thực tế
|
||||
2. Vài nguyên tắc cốt lõi nhất của phương pháp này: Hỏi ít ý kiến, hỏi nhiều hành vi; Hỏi ít giả định, hỏi nhiều sự kiện
|
||||
3. Làm thế nào biến một câu hỏi dễ nhận được phản hồi dương tính giả thành câu hỏi phỏng vấn có giá trị hơn
|
||||
4. Cách kết hợp The Mom Test với JTBD, xác minh nhu cầu, đánh giá MVP
|
||||
|
||||
<a id="mom-what"></a>
|
||||
## [1. The Mom Test thực chất là gì](#top-mom)
|
||||
|
||||
The Mom Test đến từ cuốn sách cùng tên của Rob Fitzpatrick. Tên nó nghe hơi giống đùa, nhưng chỉ trúng rất chuẩn:
|
||||
|
||||
**Ngay cả mẹ bạn, cũng rất khó trực tiếp nói với bạn "đây là một ý tưởng tồi".**
|
||||
|
||||
Lý do không phải bà không trung thực, mà là:
|
||||
|
||||
- Bà không muốn làm bạn tổn thương
|
||||
- Bà sẽ vô thức khích lệ bạn
|
||||
- Bà rất dễ trả lời theo cách bạn diễn đạt
|
||||
|
||||
Thực ra không chỉ mẹ, bạn bè, đồng nghiệp, bạn học cũ, thậm chí rất nhiều người lạ, khi đối mặt với ý tưởng sản phẩm của bạn, cũng thường cho "phản hồi tích cực" tương tự. Điều này không có nghĩa nhu cầu thực sự tồn tại, chỉ có nghĩa là bạn đã hỏi câu hỏi thành một dạng dễ nhận được câu trả lời nghe hay.
|
||||
|
||||
Vì vậy, trọng tâm của The Mom Test chưa bao giờ là "đừng hỏi mẹ", mà là:
|
||||
|
||||
**Đừng hỏi câu hỏi thành dạng ai cũng sẽ thuận theo bạn mà trả lời.**
|
||||
|
||||
Phương pháp này thực sự muốn dạy bạn, là cách thông qua đối thoại, lấy được thông tin gần với nhu cầu thực tế hơn, thay vì thu thập một đống lời bình luận khiến bạn cảm thấy tốt.
|
||||
|
||||
## 2. Vấn đề cốt lõi mà nó giải quyết là gì
|
||||
|
||||
The Mom Test chủ yếu giải quyết một loại nhận thức ảo rất phổ biến:
|
||||
|
||||
**Coi phản hồi tích cực lịch sự, thành nhu cầu thực tế.**
|
||||
|
||||
Ví dụ bạn hỏi:
|
||||
|
||||
- Bạn thấy ý tưởng App này thế nào?
|
||||
- Nếu tôi làm một công cụ AI giúp bạn viết CV, bạn có dùng không?
|
||||
- Chức năng này có giá trị không?
|
||||
|
||||
Điểm chung của những câu hỏi này là:
|
||||
|
||||
- Chúng đều đang hỏi "ý kiến"
|
||||
- Chúng đều mang theo chút gợi ý
|
||||
- Chúng đều đang nói về một tương lai chưa xảy ra
|
||||
|
||||
Mà câu trả lời của con người về "ý kiến" và "giả định tương lai", thường không ổn định. Rất nhiều người sẽ đánh giá quá cao sự hứng thú của mình, đánh giá quá cao khả năng thực thi của mình, cũng sẽ đánh giá quá cao ý muốn mua hàng trong tương lai.
|
||||
|
||||
Vì vậy The Mom Test nhắc bạn:
|
||||
|
||||
- Đừng quá tin vào đánh giá của người khác về ý tưởng của bạn
|
||||
- Đừng quá tin vào dự đoán của người khác về hành vi tương lai
|
||||
- Hãy cố gắng quay về hành vi thực tế đã xảy ra của người dùng
|
||||
|
||||
Bởi vì so với "bạn có dùng không", "bạn lần trước xử lý việc này thế nào" thường gần với sự thật hơn.
|
||||
|
||||
<a id="mom-principles"></a>
|
||||
## [3. Ba nguyên tắc cốt lõi nhất](#top-mom)
|
||||
|
||||
Nếu bạn chỉ muốn ghi nhớ phần quan trọng nhất trước, có thể ghi trước ba nguyên tắc dưới đây.
|
||||
|
||||
### 3.1 Nói ít về ý tưởng của bạn, hỏi nhiều về trải nghiệm thực tế trong quá khứ của người dùng
|
||||
|
||||
Rất nhiều phỏng vấn vô hiệu vừa mở đầu đã kể về giải pháp của mình, kể mình hào hứng thế nào, kể mình chuẩn bị làm sản phẩm gì. Vấn đề là, một khi bạn nói quá nhiều, đối phương rất dễ chuyển sang trạng thái "phối hợp bạn", "khích lệ bạn".
|
||||
|
||||
So với đó, cách tốt hơn là tập trung vào trải nghiệm của đối phương:
|
||||
|
||||
- Lần gần nhất bạn gặp vấn đề này là khi nào?
|
||||
- Lúc đó bạn đang làm gì?
|
||||
- Cuối cùng bạn đã xử lý thế nào?
|
||||
- Bước nào phiền phức nhất?
|
||||
|
||||
Bạn sẽ phát hiện, loại câu hỏi này có thể tự nhiên hơn kéo đối thoại về thực tế, thay vì dừng lại ở sở thích trong tưởng tượng.
|
||||
|
||||
### 3.2 Hỏi ít ý kiến trừu tượng, hỏi nhiều sự kiện cụ thể
|
||||
|
||||
"Tôi thấy chức năng này khá hay", "nghe có vẻ ổn", "dường như hơi hữu ích", những cách diễn đạt này đều quá trừu tượng, rất khó hướng dẫn quyết định sản phẩm.
|
||||
|
||||
Thông tin có giá trị hơn thường trông như thế này:
|
||||
|
||||
- Tuần trước tôi vừa mất 2 tiếng vì việc này
|
||||
- Hiện tôi đang dùng Excel cộng WeChat gồng gánh
|
||||
- Tháng trước tôi đã tiêu tiền cho công cụ tương tự
|
||||
- Tôi sợ nhất là làm sai, không phải làm chậm
|
||||
|
||||
Đây mới là thông tin thực sự có thể giúp bạn đánh giá cường độ vấn đề, tần suất và khả năng trả phí.
|
||||
|
||||
### 3.3 Hỏi ít về giải pháp người dùng muốn, xem nhiều cách họ đang giải quyết vấn đề hiện tại
|
||||
|
||||
Người dùng rất giỏi mô tả rắc rối của mình, nhưng không nhất thiết giỏi thiết kế giải pháp.
|
||||
|
||||
Nếu bạn hỏi:
|
||||
|
||||
- Bạn có muốn một AI giúp bạn tự động làm việc này không?
|
||||
- Bạn thấy thêm chức năng thông minh có giúp ích không?
|
||||
|
||||
Bạn nhận được, thường chỉ là thái độ mơ hồ đối với một giải pháp nào đó, chứ không phải bản thân nhu cầu.
|
||||
|
||||
Câu hỏi tốt hơn là:
|
||||
|
||||
- Hiện bạn dùng phương pháp nào để xử lý vấn đề này?
|
||||
- Tại sao bạn lại chọn cách này?
|
||||
- Nó không tốt ở điểm nào?
|
||||
|
||||
Nhìn rõ giải pháp thay thế hiện tại, thường quan trọng hơn trực tiếp hỏi "bạn muốn gì".
|
||||
|
||||
## 4. Tại sao người ta luôn cho bạn câu trả lời nghe hay nhưng vô dụng
|
||||
|
||||
Nếu bạn hiểu được điều này, khi làm phỏng vấn sẽ ít sai lầm hơn.
|
||||
|
||||
### 4.1 Con người vô thức giữ lịch sự
|
||||
|
||||
Đặc biệt khi đối tượng đối thoại có quan hệ với bạn, đối phương rất khó trực tiếp nói:
|
||||
|
||||
- Hướng này nghe không ổn lắm
|
||||
- Tôi căn bản không dùng
|
||||
- Vấn đề này không quan trọng với tôi lắm
|
||||
|
||||
Họ có khả năng nói hơn là "khá lắm", "có dịp có thể làm thử".
|
||||
|
||||
### 4.2 Con người đánh giá quá cao bản thân trong tương lai
|
||||
|
||||
Rất nhiều người thực sự tin rằng trong tương lai mình sẽ:
|
||||
|
||||
- Tự giác hơn
|
||||
- Sẵn sàng học hỏi hơn
|
||||
- Sẵn sàng trả phí hơn
|
||||
- Sẵn sàng thử công cụ mới hơn
|
||||
|
||||
Nên câu "nếu có thì chắc tôi sẽ dùng" thường không đồng nghĩa với thực sự dùng trong tương lai.
|
||||
|
||||
### 4.3 Cách bạn hỏi câu hỏi tự thân đã đang dẫn dắt câu trả lời
|
||||
|
||||
Khi bạn hỏi:
|
||||
|
||||
- Ý tưởng này của tôi có khá không?
|
||||
- Chức năng này có rất hữu ích với bạn không?
|
||||
|
||||
Thực ra bạn đã lén nhét "câu trả lời đúng" vào câu hỏi rồi.
|
||||
|
||||
Đây cũng là lý do The Mom Test đặc biệt nhấn mạnh: **Đừng biến phỏng vấn thành bạn đang tìm kiếm sự công nhận.**
|
||||
|
||||
## 5. So sánh trực tiếp: Câu hỏi nào dễ hỏi hỏng, câu hỏi nào có giá trị hơn
|
||||
|
||||
Những đối chiếu dưới đây, hầu như người mới nào cũng dùng đến.
|
||||
|
||||
| Câu hỏi dễ hỏi hỏng | Câu hỏi có giá trị hơn |
|
||||
| --- | --- |
|
||||
| Bạn thấy ý tưởng này của tôi thế nào? | Lần gần nhất bạn gặp vấn đề này là khi nào? |
|
||||
| Nếu có sản phẩm này bạn có dùng không? | Hiện bạn xử lý việc này thế nào? |
|
||||
| Bạn có sẵn sàng trả phí cho chức năng này không? | Lần trước bạn đã tiêu tiền cho vấn đề này chưa? Tiêu vào cái gì? |
|
||||
| Bạn thấy chức năng này quan trọng không? | Trong quy trình này, bước nào phiền nhất, chậm nhất, không yên tâm nhất? |
|
||||
| Bạn có muốn một AI giúp bạn tự động làm không? | Tại sao hiện tại bạn chưa tìm được giải pháp thuận tiện hơn? |
|
||||
|
||||
Điều quan trọng nhất của bảng này không phải câu cụ thể, mà là hướng phía sau:
|
||||
|
||||
- Từ ý kiến tiến về sự kiện
|
||||
- Từ tương lai tiến về quá khứ
|
||||
- Từ giải pháp của bạn tiến về vấn đề của người dùng
|
||||
|
||||
## 6. Một nhịp độ phỏng vấn người mới cũng có thể dùng ngay
|
||||
|
||||
Nếu bây giờ bạn muốn đi tìm người trò chuyện, có thể trực tiếp làm theo trình tự dưới đây.
|
||||
|
||||
### 6.1 Mở đầu: Nói rõ bạn đang học hỏi, không phải đang bán hàng
|
||||
|
||||
Ví dụ:
|
||||
|
||||
> Tôi gần đây đang nghiên cứu mọi người xử lý loại vấn đề này thế nào, muốn hiểu tình hình thực tế trước, không phải đến bán hàng đâu.
|
||||
|
||||
Cách diễn đạt này sẽ giúp đối phương dễ dàng bỏ gánh nặng tâm lý "tôi phải cho bạn phản hồi tích cực".
|
||||
|
||||
### 6.2 Bắt đầu từ trải nghiệm thực tế gần nhất
|
||||
|
||||
Có thể bắt đầu từ loại câu hỏi này:
|
||||
|
||||
- Lần gần nhất bạn gặp vấn đề này là khi nào?
|
||||
- Lúc đó đã xảy ra chuyện gì?
|
||||
- Phản ứng đầu tiên của bạn là xử lý thế nào?
|
||||
|
||||
Một khi đối thoại bước vào sự kiện cụ thể, chất lượng thông tin thường sẽ nâng cao rõ rệt.
|
||||
|
||||
### 6.3 Hỏi sâu về hành vi, chi phí và giải pháp thay thế
|
||||
|
||||
Tiếp tục hỏi:
|
||||
|
||||
- Bạn đang dùng cách nào để giải quyết?
|
||||
- Điểm không thoải mái nhất của cách này là gì?
|
||||
- Bạn đã dành bao nhiêu thời gian, tiền hoặc sức lực cho việc này?
|
||||
- Bạn đã thử cách nào khác chưa? Tại sao không tiếp tục dùng?
|
||||
|
||||
### 6.4 Cuối cùng mới đánh giá mức độ đau và ưu tiên
|
||||
|
||||
Bạn không cần trực tiếp hỏi "có đau không", có thể đánh giá từ chi tiết:
|
||||
|
||||
- Anh/chị có thường xuyên gặp phải không
|
||||
- Anh/chị có đang chủ động tìm cách khắc phục không
|
||||
- Anh/chị đã sẵn sàng trả chi phí cho việc này chưa
|
||||
- Khi kể về việc này, anh/chị có mang theo cảm xúc rõ ràng không
|
||||
|
||||
Tất cả những điều này đều hữu dụng hơn một câu "đây có phải là điểm đau của bạn không".
|
||||
|
||||
## 7. Một ví dụ hoàn chỉnh hơn
|
||||
|
||||
Giả sử bạn muốn làm một sản phẩm "AI giúp sinh viên sửa CV".
|
||||
|
||||
### Cách hỏi sai
|
||||
|
||||
Bạn đi hỏi bạn học:
|
||||
|
||||
> Tôi muốn làm một công cụ tối ưu CV bằng AI, bạn thấy thế nào?
|
||||
> Nếu nó có thể tự động sửa CV theo vị trí, bạn có dùng không?
|
||||
|
||||
Lúc này, đối phương rất có thể sẽ nói:
|
||||
|
||||
- Nghe khá lắm
|
||||
- Tôi nghĩ nên hữu ích
|
||||
> Nếu miễn phí tôi sẽ thử
|
||||
|
||||
Những câu trả lời này hầu như không giúp bạn đánh giá nhu cầu mạnh hay yếu.
|
||||
|
||||
### Cách hỏi tốt hơn
|
||||
|
||||
Bạn có thể đổi thành:
|
||||
|
||||
> Lần gần nhất bạn sửa CV là khi nào?
|
||||
> Lúc đó tại sao phải sửa?
|
||||
> Bạn đã sửa thế nào?
|
||||
> Bước nào kẹt nhất?
|
||||
> Bạn có tìm ai giúp bạn xem không?
|
||||
> Trước đây bạn đã từng tiêu tiền hoặc nhiều thời gian cho việc CV chưa?
|
||||
|
||||
Qua những câu hỏi này, thông tin bạn có thể nhận được là:
|
||||
|
||||
- Rất nhiều người không phải không biết viết, mà không biết sửa cho phù hợp với vị trí khác nhau
|
||||
- Điểm đau nhất của họ không phải là bố cục, mà là "không biết kinh nghiệm nào đáng viết"
|
||||
- Họ trì hoãn, không phải vì lười, mà vì mỗi lần sửa CV rất mất sức
|
||||
- Họ đang dùng gợi ý của anh chị khóa trên, trang web template, công cụ AI và bạn bè giúp xem để giải lý tạm
|
||||
|
||||
Lúc này, bạn đã gần với vấn đề thực tế hơn nhiều.
|
||||
|
||||
## 8. The Mom Test kết hợp với JTBD thế nào
|
||||
|
||||
Nếu JTBD giúp bạn nhìn rõ "người dùng muốn hoàn thành tiến triển gì", thì The Mom Test giống như đang dạy bạn:
|
||||
|
||||
**Cách thông qua phỏng vấn, xác nhận job này có thực sự tồn tại hay không.**
|
||||
|
||||
Bạn hoàn toàn có thể kết nối cả hai:
|
||||
|
||||
1. Trước dùng JTBD giả định một job
|
||||
2. Rồi dùng cách The Mom Test, đi hỏi người dùng về trải nghiệm thực tế gần nhất
|
||||
3. Xem job này có thực sự tần suất cao, thực tế, đáng ưu tiên không
|
||||
|
||||
Ví dụ giả định JTBD của bạn là:
|
||||
|
||||
> Khi tôi chuẩn bị nộp hồ sơ thực tập, tôi muốn nhanh chóng sửa CV cũ thành phiên bản phù hợp với vị trí, để hoàn thành nộp hồ sơ càng sớm càng tốt.
|
||||
|
||||
Thì bạn có thể dùng câu hỏi phong cách The Mom Test để xác minh:
|
||||
|
||||
- Lần gần nhất bạn nộp hồ sơ là khi nào?
|
||||
- Lúc đó bạn đã sửa CV thế nào?
|
||||
- Đoạn nào khó viết nhất?
|
||||
- Sau khi sửa xong bạn đánh giá thế nào biết là đủ tốt chưa?
|
||||
|
||||
Như vậy, phương pháp đã được kết nối:
|
||||
|
||||
- JTBD giúp bạn định nghĩa giả định nhu cầu
|
||||
- The Mom Test giúp bạn phỏng vấn xác minh giả định
|
||||
|
||||
## 9. Sai lầm phổ biến nhất khi người mới làm phỏng vấn người dùng
|
||||
|
||||
### 9.1 Biến phỏng vấn thành hội thảo giới thiệu sản phẩm
|
||||
|
||||
Bạn vừa nói quá nhiều về ý tưởng của mình, đối phương dễ bắt đầu phối hợp bạn, thay vì nói cho bạn tình hình thực tế.
|
||||
|
||||
### 9.2 Đối tượng phỏng vấn toàn người quen
|
||||
|
||||
Người quen không phải không thể trò chuyện, nhưng người quen dễ khích lệ bạn hơn. Bạn ít nhất cần pha trộn một số người gần với người dùng thực tế hơn, thay vì chỉ tìm người ủng hộ bạn.
|
||||
|
||||
### 9.3 Theo đuổi hỏi chi tiết chức năng quá sớm
|
||||
|
||||
Nếu bạn chưa làm rõ vấn đề, đã bắt đầu hỏi chi tiết nút bấm, giao diện, chức năng, thường là đang bước vào giải pháp quá sớm.
|
||||
|
||||
### 9.4 Coi một câu "tôi sẽ dùng" thành kết quả xác minh
|
||||
|
||||
Phỏng vấn nhiều nhất giúp bạn đánh giá hướng đi, không đồng nghĩa đã hoàn thành xác minh. Xác minh thực sự, cuối cùng vẫn phải xem người dùng có sẵn sàng trả chi phí thực tế hay không, ví dụ thời gian, chi phí chuyển đổi, hành vi dùng thử, thậm chí trả phí.
|
||||
|
||||
### 9.5 Không sắp xếp sau khi phỏng vấn xong
|
||||
|
||||
Nếu bạn trò chuyện xong rồi để đó, thông tin nhanh chóng sẽ trở thành ấn tượng mơ hồ. Tốt nhất nên sắp xếp sớm:
|
||||
|
||||
- Vấn đề xuất hiện với tần suất cao
|
||||
- Từ ngữ cảm xúc trong lời gốc của người dùng
|
||||
- Giải pháp thay thế hiện tại
|
||||
- Chi phí đã trả
|
||||
- Đánh giá mới của bạn
|
||||
|
||||
## 10. Danh sách câu hỏi có thể copy để dùng ngay
|
||||
|
||||
Nếu bạn muốn bắt đầu nhanh nhất, đây là một bộ câu hỏi đủ thông dụng.
|
||||
|
||||
### Câu hỏi mở đầu
|
||||
|
||||
- Lần gần nhất bạn gặp vấn đề này là khi nào?
|
||||
- Lúc đó cụ thể đã xảy ra chuyện gì?
|
||||
|
||||
### Câu hỏi hành vi
|
||||
|
||||
- Lúc đó bạn đã xử lý thế nào?
|
||||
- Tại sao bạn lại chọn cách này?
|
||||
|
||||
### Câu hỏi chi phí
|
||||
|
||||
- Việc này thường tiêu bao nhiêu thời gian hoặc sức lực của bạn?
|
||||
- Bạn có từng tiêu tiền để giải quyết nó chưa?
|
||||
|
||||
### Câu hỏi giải pháp thay thế
|
||||
|
||||
- Bạn đã thử công cụ hoặc cách nào khác chưa?
|
||||
- Tại sao cuối cùng không tiếp tục dùng?
|
||||
|
||||
### Câu hỏi kết thúc
|
||||
|
||||
- Nếu sau này còn gặp vấn đề tương tự, bạn thấy cách giải quyết lý tưởng nhất nên trông như thế nào?
|
||||
|
||||
Lưu ý, câu hỏi kết thúc này có thể hỏi, nhưng tốt nhất đặt phía sau. Vì phía trước bạn cần lấy sự kiện trước, thay vì ước mơ.
|
||||
|
||||
## 11. Tóm tắt
|
||||
|
||||
Đóng góp quan trọng nhất của The Mom Test, không phải cho bạn một bộ kỹ năng "giỏi trò chuyện hơn", mà là giúp bạn xây dựng một cách đánh giá tỉnh táo hơn:
|
||||
|
||||
- Đừng quá nhanh tin vào lời khen của người khác về ý tưởng của bạn
|
||||
- Đừng coi "nếu có tôi sẽ dùng" thành nhu cầu thực tế
|
||||
- Đừng để phỏng vấn biến thành bạn đang tìm kiếm sự công nhận
|
||||
|
||||
Phỏng vấn thực sự có giá trị, nên cố gắng quay về những thứ này:
|
||||
|
||||
- Trải nghiệm thực tế gần nhất của người dùng
|
||||
- Họ đang xử lý thế nào hiện tại
|
||||
- Họ đã trả chi phí gì
|
||||
- Họ không thoải mái rõ ràng ở điểm nào
|
||||
|
||||
Khi bạn bắt đầu hỏi như thế, thông tin bạn nhận được tuy đôi khi không nghe hay bằng, nhưng thường hữu dụng hơn.
|
||||
Và khi làm sản phẩm, **sự thật hữu dụng, mãi mãi quan trọng hơn lời khích lệ nghe hay.**
|
||||
|
||||
<a id="mom-ai"></a>
|
||||
## [12. Cách dùng AI giúp bạn làm phỏng vấn người dùng](#top-mom)
|
||||
|
||||
The Mom Test bản chất vẫn là phương pháp "trò chuyện với người thật", nên AI không thể thay thế phỏng vấn thực tế. Nhưng AI rất phù hợp hỗ trợ bạn trước, trong và sau phỏng vấn, đặc biệt giúp người mới giảm rào cản.
|
||||
|
||||
### 12.1 Để AI giúp bạn viết lại câu hỏi "dễ hỏi hỏng"
|
||||
|
||||
Rất nhiều người biết mình không nên hỏi "bạn thấy ý tưởng này của tôi thế nào", nhưng vừa mở miệng vẫn sẽ quay lại câu kiểu này. Bạn có thể đưa câu hỏi chuẩn bị hỏi cho AI trước, để nó giúp bạn viết lại:
|
||||
|
||||
```text
|
||||
Dưới đây là những câu hỏi tôi chuẩn bị dùng để phỏng vấn người dùng:
|
||||
[Dán câu hỏi của bạn]
|
||||
|
||||
Xin dùng nguyên tắc The Mom Test giúp tôi viết lại:
|
||||
1. Xóa câu hỏi dạng ý kiến
|
||||
2. Xóa câu hỏi giả định tương lai
|
||||
3. Cố gắng đổi thành câu hỏi xoay quanh hành vi thực tế trong quá khứ, giải pháp thay thế hiện có và chi phí đã trả
|
||||
4. Cuối cùng sắp xếp thành một bộ 8-10 câu hỏi phỏng vấn có thể dùng trực tiếp
|
||||
```
|
||||
|
||||
Một input rất nhỏ cũng hoàn toàn có thể:
|
||||
|
||||
```text
|
||||
Tôi muốn hỏi người dùng:
|
||||
1. Bạn thấy tôi làm một công cụ AI sửa CV thế nào?
|
||||
2. Bạn có dùng không?
|
||||
3. Bạn có sẵn sàng trả phí không?
|
||||
|
||||
Giúp tôi đổi thành cách hỏi tốt hơn.
|
||||
```
|
||||
|
||||
AI có thể cho output hữu ích trông như thế này:
|
||||
|
||||
```text
|
||||
Câu hỏi sau khi viết lại:
|
||||
|
||||
1. Lần gần nhất bạn sửa CV là khi nào?
|
||||
2. Lúc đó tại sao phải sửa?
|
||||
3. Bạn đã sửa thế nào?
|
||||
4. Bước nào mất thời gian nhất?
|
||||
5. Bạn có tìm ai giúp bạn xem không?
|
||||
6. Trước đây bạn có từng tiêu tiền hoặc nhiều thời gian cho việc sửa CV không?
|
||||
```
|
||||
|
||||
Loại output này rất hữu ích, vì nó trực tiếp biến câu hỏi "đang hỏi ý kiến" của bạn thành câu hỏi "đang hỏi hành vi thực tế".
|
||||
|
||||
### 12.2 Để AI giúp bạn tạo đề cương phỏng vấn cho các đối tượng khác nhau
|
||||
|
||||
Cùng một hướng, đối mặt với các nhóm người khác nhau, trọng tâm phỏng vấn sẽ khác. Ví dụ sinh viên, HR, freelancer, điểm quan tâm hoàn toàn khác. Bạn có thể để AI giúp bạn xuất một bản đề cương cho từng đối tượng:
|
||||
|
||||
- Hướng người dùng mới, tập trung hiểu trải nghiệm thực tế gần nhất
|
||||
- Hướng người dùng nặng, tập trung hiểu giải pháp thay thế và mức độ đau
|
||||
- Hướng người dùng trả phí, tập trung hiểu đã từng trả chi phí cho việc này chưa
|
||||
|
||||
Như vậy khi thực sự trò chuyện bạn sẽ có nhịp điệu hơn, thay vì hỏi cùng một bộ câu hỏi với tất cả mọi người.
|
||||
|
||||
Ví dụ bạn có thể nhập trực tiếp như sau:
|
||||
|
||||
```text
|
||||
Tôi sẽ trò chuyện với hai loại người:
|
||||
1. Sinh viên lần đầu tìm thực tập
|
||||
2. Anh chị khóa trên đã giúp nhiều người xem CV
|
||||
|
||||
Xin cho tôi mỗi loại một bản đề cương phỏng vấn, mỗi bản 6 câu hỏi.
|
||||
```
|
||||
|
||||
AI có thể xuất:
|
||||
|
||||
```text
|
||||
Cho sinh viên:
|
||||
1. Lần gần nhất nộp thực tập là khi nào?
|
||||
2. Lúc đó bước nào kẹt nhất?
|
||||
3. Bạn làm sao biết CV mình có thể nộp được không?
|
||||
...
|
||||
|
||||
Cho anh chị khóa trên:
|
||||
1. Lần gần nhất bạn giúp người khác xem CV là khi nào?
|
||||
2. Bạn thường thấy vấn đề rõ ràng nhất là gì?
|
||||
3. Các em khóa dưới dễ kẹt ở bước nào nhất?
|
||||
...
|
||||
```
|
||||
|
||||
Như vậy, bạn không cần tự biên soạn câu hỏi từ đầu, chuẩn bị phỏng vấn sẽ nhẹ nhàng hơn nhiều.
|
||||
|
||||
### 12.3 Để AI giúp bạn sắp xếp bản ghi phỏng vấn
|
||||
|
||||
Sau khi phỏng vấn xong, vấn đề dễ xuất hiện nhất không phải "không có thông tin", mà là "thông tin quá phân tán". AI rất phù hợp giúp bạn sắp xếp đối thoại phân mảnh thành ghi chú có cấu trúc:
|
||||
|
||||
```text
|
||||
Dưới đây là bản ghi phỏng vấn của tôi với 3 người dùng.
|
||||
Xin sắp xếp theo góc nhìn The Mom Test:
|
||||
1. Nội dung nào là sự kiện, nội dung nào chỉ là ý kiến
|
||||
2. Hành vi thực tế gần nhất của người dùng là gì
|
||||
3. Giải pháp thay thế hiện tại là gì
|
||||
4. Chi phí thời gian, tiền bạc hoặc sức lực người dùng đã trả là gì
|
||||
5. Vấn đề nào được nhắc đến lặp đi lặp lại
|
||||
6. Cách nói nào nghe tích cực nhưng bằng chứng không đủ
|
||||
```
|
||||
|
||||
Bước này đặc biệt có giá trị, vì nó có thể giúp bạn phân biệt nội dung "nghe có vẻ ổn" với nội dung "thực sự có thể hỗ trợ đánh giá".
|
||||
|
||||
Một input đơn giản có thể là:
|
||||
|
||||
```text
|
||||
Đây là bản ghi sau khi tôi trò chuyện với một người dùng:
|
||||
|
||||
- Cô ấy nói nếu có công cụ chắc sẽ thử
|
||||
- Tuần trước cô ấy mất một tối để sửa CV
|
||||
- Hiện cô ấy chủ yếu nhờ bạn bè giúp xem
|
||||
- Cô ấy nói khó nhất là không biết sửa đến mức nào thì có thể nộp
|
||||
|
||||
Xin giúp tôi phân biệt, đâu là ý kiến, đâu là sự kiện.
|
||||
```
|
||||
|
||||
AI có thể xuất:
|
||||
|
||||
```text
|
||||
Ý kiến:
|
||||
- Nếu có công cụ chắc sẽ thử
|
||||
|
||||
Sự kiện:
|
||||
- Tuần trước mất một tối để sửa CV
|
||||
- Giải pháp thay thế hiện tại là nhờ bạn bè giúp xem
|
||||
- Điểm khó nhất là không biết khi nào "có thể nộp"
|
||||
|
||||
Trọng tâm có thể dùng để đánh giá nhu cầu:
|
||||
- Vấn đề này vừa mới xảy ra gần đây
|
||||
- Người dùng đã đầu tư chi phí thời gian rõ ràng
|
||||
- Giải pháp hiện tại dựa vào người khác, không ổn định
|
||||
```
|
||||
|
||||
Output này có thể trực giác cho người mới thấy: lời nào có thể dùng để đánh giá, lời nào chỉ có thể nghe.
|
||||
|
||||
### 12.4 Để AI làm trước một vòng tìm kiếm mạng nhẹ nhàng
|
||||
|
||||
Nếu bạn chưa bắt đầu phỏng vấn, có thể để AI giúp bạn làm một số nghiên cứu bên ngoài rất nhẹ, ví dụ:
|
||||
|
||||
- Trong cộng đồng công khai, mọi người gần đây phàn nàn về vấn đề này thế nào
|
||||
- Công cụ hiện có bị phàn nàn nhiều nhất là gì
|
||||
- Người dùng đã từng trả tiền cho vấn đề tương tự chưa
|
||||
- Trên thị trường có những giải pháp thay thế nào đã tồn tại
|
||||
|
||||
Loại thông tin này không thể thay thế phỏng vấn người thật, nhưng có thể giúp bạn nhanh chóng vào trạng thái, biết nên bắt đầu hỏi từ đâu.
|
||||
|
||||
Ví dụ một input đơn giản:
|
||||
|
||||
```text
|
||||
Xin giúp tôi tìm:
|
||||
"Sinh viên sửa CV thường phàn nàn nhiều nhất điều gì"
|
||||
Giúp tôi sắp xếp 5 phàn nàn phổ biến nhất, viết bằng ngôn ngữ rất bình dân.
|
||||
```
|
||||
|
||||
AI có thể xuất:
|
||||
|
||||
```text
|
||||
Phàn nàn phổ biến:
|
||||
|
||||
1. Không biết CV nên viết kinh nghiệm gì
|
||||
2. Mỗi lần nộp một vị trí lại phải sửa, quá mệt
|
||||
3. Sửa nhiều phiên bản vẫn không chắc tốt chưa
|
||||
4. Không tìm được ai cho phản hồi đáng tin cậy
|
||||
5. Luôn cảm thấy chưa chuẩn bị xong, nên cứ kéo dài
|
||||
```
|
||||
|
||||
Giá trị của loại kết quả này là, nó sẽ giúp bạn dễ dàng tìm được điểm vào phỏng vấn hơn.
|
||||
|
||||
### 12.5 Để AI đóng vai "huấn luyện viên tổng kết phỏng vấn"
|
||||
|
||||
Bạn cũng có thể ném bản ghi phỏng vấn vừa hoàn thành cho AI, để nó giúp bạn bắt lỗi:
|
||||
|
||||
```text
|
||||
Dưới đây là một bản ghi phỏng vấn người dùng của tôi.
|
||||
Xin giúp tôi tổng kết từ góc nhìn The Mom Test:
|
||||
1. Câu hỏi nào của tôi hỏi quá giống đang tìm kiếm sự công nhận
|
||||
2. Câu hỏi nào mang dẫn dắt rõ ràng
|
||||
3. Đâu có thể tiếp tục hỏi sâu sự kiện
|
||||
4. Nếu làm lại một lần, đoạn đối thoại này có thể hỏi tốt hơn thế nào
|
||||
```
|
||||
|
||||
Điều này đặc biệt hữu ích cho người mới, vì bạn sẽ nhanh chóng xây dựng độ nhạy "tôi đang thu thập bằng chứng hay đang thu thập lời khích lệ".
|
||||
|
||||
## 📚 Bài tập
|
||||
|
||||
Xin bạn dựa vào nội dung bài viết, hoàn thành bài tập sau:
|
||||
|
||||
1. Chọn một hướng sản phẩm bạn muốn làm gần đây, trước viết ra 5 câu hỏi "dễ hỏi hỏng" bạn sẽ hỏi
|
||||
2. Viết lại 5 câu hỏi này thành câu hỏi phù hợp hơn với phong cách The Mom Test
|
||||
3. Tìm 3 người dùng tiềm năng, ít nhất hỏi được một lần "lần gần nhất bạn gặp vấn đề này là khi nào"
|
||||
4. Sau khi phỏng vấn xong sắp xếp 4 loại thông tin: Hành vi thực tế, giải pháp thay thế, chi phí đã trả, khó khăn xuất hiện lặp đi lặp lại
|
||||
|
||||
## Đọc thêm
|
||||
|
||||
- [The Mom Test trang web chính thức](https://momtestbook.com/)
|
||||
- [Rob Fitzpatrick: The Mom Test](https://www.robfitz.com/the-mom-test/)
|
||||
@@ -0,0 +1,489 @@
|
||||
---
|
||||
title: 'Tự tay làm nguyên mẫu - từ phân tích nghiệp vụ đến prototype nhiều trang'
|
||||
description: 'Trải nghiệm vòng khép kín từ phân tích nghiệp vụ đến xây dựng prototype sản phẩm nhiều trang. Học cách hỏi nghiệp vụ, tách nhu cầu, dùng AI IDE tạo ứng dụng một trang và nhiều trang, rồi làm đẹp và kiểm thử prototype.'
|
||||
---
|
||||
|
||||
<script setup>
|
||||
import { relatedArticlesMap } from '@theme/data/relatedArticles'
|
||||
|
||||
const duration = 'khoảng <strong>8 giờ</strong>'
|
||||
const relatedArticles =
|
||||
relatedArticlesMap['vi-vn/stage-1/building-prototype'] ?? []
|
||||
</script>
|
||||
|
||||
# Sơ cấp 3: Tự tay làm nguyên mẫu
|
||||
|
||||
## Dẫn nhập chương
|
||||
|
||||
<ChapterIntroduction :duration="duration" :tags="['Phân tích nghiệp vụ', 'Thiết kế prototype', 'Lập trình với AI', 'Ứng dụng nhiều trang']" coreOutput="1 prototype bàn làm việc nội dung thương mại điện tử" expectedOutput="Prototype Web có thể tương tác">
|
||||
|
||||
Ở chương trước, chúng ta đã học cách <strong>tìm một ý tưởng tốt</strong>: bắt đầu từ nhu cầu người dùng và tìm hướng có người sẵn sàng trả tiền. Nhưng tìm được hướng mới chỉ là bước đầu. Thử thách thật sự là: <strong>làm thế nào biến một nhu cầu mơ hồ thành một sản phẩm dùng được</strong>.
|
||||
|
||||
Trong chương này, ta xử lý một vấn đề rất thực tế: sếp nói "hãy dùng AI để tăng hiệu suất đăng sản phẩm lên nền tảng thương mại điện tử". Bạn sẽ biến câu nói đó thành <strong>một prototype sản phẩm có thể thao tác</strong> như thế nào?
|
||||
|
||||
Khác với trò rắn săn mồi hay máy tính bỏ túi, nghiệp vụ thật không thể nghĩ chức năng trong phòng kín. Ta cần:
|
||||
|
||||
1. <strong>Làm rõ điểm đau</strong>: nói chuyện với vận hành để tìm vấn đề thật phía sau câu "tăng hiệu suất".
|
||||
2. <strong>Chọn phần quan trọng nhất</strong>: trong nhiều vấn đề, làm trước điểm đau nhất.
|
||||
3. <strong>Kiểm chứng nhanh</strong>: dùng AI IDE tạo prototype một trang trước, chạy được rồi mới mở rộng.
|
||||
4. <strong>Làm ra thứ dùng được</strong>: cuối cùng có một bàn làm việc nội dung thương mại điện tử có thể demo và thao tác.
|
||||
|
||||
Mục tiêu của chương là chuyển từ "làm đồ chơi" sang "làm ứng dụng", đồng thời học cách đồng cảm và suy nghĩ về nhu cầu thật của khách hàng.
|
||||
|
||||
</ChapterIntroduction>
|
||||
|
||||
::: info Ghi chú
|
||||
Trong bài có một số thuật ngữ nghiệp vụ. Nếu chưa hiểu, hãy hỏi AI giải thích bằng ngôn ngữ đơn giản.
|
||||
:::
|
||||
|
||||
<div style="margin: 50px 0;">
|
||||
<ClientOnly>
|
||||
<StepBar :active="0" :items="[
|
||||
{ title: 'Phân tích nhu cầu', description: 'Từ mơ hồ đến cụ thể' },
|
||||
{ title: 'Kiểm chứng một trang', description: 'Làm ra lõi trải nghiệm' },
|
||||
{ title: 'Mở rộng nhiều trang', description: 'Hoàn thiện cấu trúc ứng dụng' },
|
||||
{ title: 'Làm đẹp và hoàn thiện', description: 'Nâng trải nghiệm người dùng' }
|
||||
]" />
|
||||
</ClientOnly>
|
||||
</div>
|
||||
|
||||
## 1. Xác định nhu cầu trước khi viết code
|
||||
|
||||
Trong các bài trước, ta dùng AI IDE để tạo trò chơi nhỏ rất nhanh. Nhưng đó chủ yếu là dự án tự dùng. Nếu muốn năng lực AI thật sự phục vụ công việc và đời sống, ta phải đặt vibe coding vào một bối cảnh cụ thể.
|
||||
|
||||
Khi làm sản phẩm thật, khoảng cách giữa "biết muốn làm gì" và "biết phải làm thế nào" rất lớn. Khoảng cách đó chính là quá trình cụ thể hóa nhu cầu.
|
||||
|
||||
Trong dự án cá nhân, ta thường bắt đầu bằng một chức năng đơn giản:
|
||||
|
||||
- "Làm một bảng Kanban để liệt kê nhiệm vụ."
|
||||
- "Làm một công cụ vẽ."
|
||||
- "Làm một phần mềm thu thập khảo sát."
|
||||
|
||||
Những câu này thường chỉ mô tả một công cụ hoặc một module, chưa chắc đã là vấn đề nghiệp vụ rõ ràng. Quan trọng hơn: chúng có thể chỉ là "mình thấy hữu ích", chứ chưa chắc người dùng thật sự cần.
|
||||
|
||||
Trong dự án doanh nghiệp hoặc khởi nghiệp, sản phẩm thường bắt đầu từ một đề bài rộng hơn. Ví dụ:
|
||||
|
||||
<el-card shadow="hover" style="border-left: 5px solid #409EFF; background-color: #ecf5ff; margin: 20px 0;">
|
||||
<div style="font-weight: bold; color: #303133; margin-bottom: 10px;">Kịch bản nghiệp vụ:</div>
|
||||
<div style="color: #606266; line-height: 1.6;">
|
||||
<p>Bạn là product manager phụ trách vận hành thương mại điện tử của một cửa hàng. Sếp giao một đề bài khá mơ hồ nhưng áp lực:</p>
|
||||
<p style="font-style: italic; margin-top: 10px;">"Bây giờ ai cũng nói dùng AI làm ảnh và viết copy rất dễ. Em nghiên cứu thử, làm sao để khi chúng ta đăng sản phẩm mới lên Douyin Ecommerce thì hiệu suất cao hơn."</p>
|
||||
</div>
|
||||
</el-card>
|
||||
|
||||
Phản ứng đầu tiên có thể là: đưa câu này cho AI Agent và yêu cầu nó thiết kế một bàn làm việc nội dung. Ví dụ:
|
||||
|
||||
```txt
|
||||
Hãy dựa trên nhu cầu của tôi,
|
||||
thiết kế một bàn làm việc nội dung thương mại điện tử,
|
||||
bao gồm tạo và quản lý mô tả sản phẩm, ảnh, video và các tài nguyên khác.
|
||||
```
|
||||
|
||||
Nếu làm ngay như vậy rồi đem đi trình bày, khả năng cao kết quả sẽ không dùng được. Lý do là:
|
||||
|
||||
- **Bạn chưa phải người dùng thật**: sếp nói "hiệu suất cao hơn", nhưng bạn chưa biết vận hành đang làm gì mỗi ngày và đang kẹt ở đâu.
|
||||
- **AI cũng không hiểu nghiệp vụ của bạn**: yêu cầu mơ hồ sẽ khiến AI đoán theo kiến thức chung.
|
||||
- **Ý tưởng tốt không tự động thành sản phẩm tốt**: thêm một chức năng AI nhìn có vẻ hay, nhưng có thể làm quy trình rối hơn.
|
||||
|
||||
Vì vậy, trước khi viết code, cần học cách đi từ ý tưởng đến hiểu người dùng.
|
||||
|
||||
### 1.1 Từ tưởng tượng đến thực tế: học cách hỏi nghiệp vụ
|
||||
|
||||
::: info Nhu cầu và nghiệp vụ là gì?
|
||||
|
||||
**Nhu cầu** là điều người dùng thật sự muốn giải quyết: rắc rối, mục tiêu, hoặc áp lực của họ. Ví dụ "đăng sản phẩm nhanh hơn" là một nhu cầu.
|
||||
|
||||
**Nghiệp vụ** là cách người dùng đang làm việc mỗi ngày: đăng sản phẩm, sửa giá, làm ảnh, xem dữ liệu, theo dõi chiến dịch.
|
||||
|
||||
Nếu không hiểu nghiệp vụ, công cụ rất dễ rơi vào trạng thái "nhìn hay nhưng không ai dùng".
|
||||
|
||||
:::
|
||||
|
||||
Bạn có thể bắt đầu bằng vài câu hỏi đơn giản:
|
||||
|
||||
- "Hiệu suất cao hơn" cụ thể là nhanh hơn, ít tốn tiền hơn, hay bán được nhiều hơn?
|
||||
- Hiện tại quy trình đăng sản phẩm diễn ra như thế nào?
|
||||
- Mỗi ngày có bao nhiêu sản phẩm mới? Mỗi sản phẩm cần bao nhiêu ảnh và bao nhiêu chữ?
|
||||
- Việc nào tốn thời gian nhất, khó chịu nhất, hoặc bị phàn nàn nhiều nhất?
|
||||
|
||||
Sau khi hỏi người làm vận hành, ta có thể thu được vài nhận xét:
|
||||
|
||||
::: info Kết quả phỏng vấn nghiệp vụ
|
||||
|
||||
**1. Công việc quá nhiều và quá vụn**
|
||||
|
||||
- Một người phải quản lý nhiều cửa hàng, mỗi cửa hàng có nhiều sản phẩm.
|
||||
- Mỗi ngày phải đăng hàng mới, sửa giá, làm ảnh, xem dữ liệu, việc này chưa xong đã đến việc khác.
|
||||
|
||||
**2. Nội dung không phải làm một lần là xong**
|
||||
|
||||
- Ban đầu thường dùng ảnh nhà cung cấp, tư liệu cũ hoặc ảnh tham khảo trên mạng để đăng thử nhanh.
|
||||
- Chạy quảng bá nhỏ để xem có ai mua không.
|
||||
- Chỉ khi sản phẩm bán tốt mới đầu tư làm ảnh, viết chi tiết, quay video.
|
||||
|
||||
:::
|
||||
|
||||
Đến đây vẫn chưa nên làm tất cả. Nếu cố thỏa mãn mọi yêu cầu trong một lần, sản phẩm sẽ quá lớn và khó hoàn thành trong thời gian học. Cần tiếp tục thu hẹp phạm vi.
|
||||
|
||||
### 1.2 Từ mở rộng đến thu hẹp: khóa điểm đau cốt lõi
|
||||
|
||||
::: info Vì sao cần thu hẹp?
|
||||
|
||||
Người dùng có thể nói rất nhiều vấn đề. Nhưng nếu cố làm hết A, B, C cùng lúc, ta thường không làm tốt được vấn đề nào. Thu hẹp nghĩa là chọn một điểm đau cấp bách, cụ thể và có thể giải quyết trước.
|
||||
|
||||
**Điểm đau** là việc khiến người dùng tốn thời gian, khó chịu và muốn giải quyết nhất, không phải điều ta tự tưởng tượng là hữu ích.
|
||||
|
||||
:::
|
||||
|
||||
Qua phỏng vấn, vấn đề vận hành gặp phải có thể chia thành ba nhóm:
|
||||
|
||||
1. **Nhịp vận hành**: khi nào đăng hàng, khi nào điều chỉnh giá.
|
||||
2. **Hiệu suất quản lý**: làm sao quản lý nhiều cửa hàng và nhiều sản phẩm.
|
||||
3. **Nội dung**: làm sao tạo ảnh sản phẩm và copy nhanh hơn.
|
||||
|
||||
Với bài học này, ta chọn nhóm thứ ba. Sau khi hỏi kỹ hơn, có hai điểm đau nổi bật:
|
||||
|
||||
::: info Hai điểm đau khi làm nội dung
|
||||
|
||||
**Điểm đau 1: Làm ảnh và copy hàng loạt quá mất công**
|
||||
|
||||
- Tư liệu nằm rải rác ở ổ đám mây, lịch sử chat, backend nền tảng.
|
||||
- Một lần phải đăng nhiều sản phẩm, không đủ thời gian làm từng cái thật đẹp.
|
||||
- Giai đoạn thử nghiệm chỉ cần "nhìn ổn, đăng được", chưa cần hoàn hảo.
|
||||
|
||||
**Điểm đau 2: Cách làm tốt không lưu lại để dùng lại được**
|
||||
|
||||
- Tiêu đề, bố cục hoặc copy từng dùng tốt rất khó tìm lại.
|
||||
- Mẫu nằm trong chat cũ hoặc link sản phẩm cũ.
|
||||
- Khi cần lại phải lục, copy, sửa rất lâu.
|
||||
- Cần một công cụ để lưu, quản lý và áp dụng lại mẫu.
|
||||
|
||||
:::
|
||||
|
||||
Vì vậy, prototype đầu tiên chỉ cần làm hai việc:
|
||||
|
||||
::: info Chức năng 1: tạo ảnh và copy sản phẩm hàng loạt
|
||||
|
||||
**Đầu vào**
|
||||
|
||||
| Loại | Nội dung |
|
||||
| --- | --- |
|
||||
| Thông tin sản phẩm | Tên, danh mục, thương hiệu, chất liệu, kích thước, màu sắc |
|
||||
| Ảnh sản phẩm | Ảnh nền trắng hoặc ảnh bối cảnh đơn giản |
|
||||
| Ảnh tham khảo | Ảnh sản phẩm từng bán tốt hoặc link tham khảo |
|
||||
| Cách nhập | Nhập Excel hàng loạt hoặc nhập trực tiếp trên trang |
|
||||
|
||||
**Đầu ra**
|
||||
|
||||
- Ảnh chính có điểm bán cơ bản.
|
||||
- Tiêu đề chứa từ khóa chính.
|
||||
- Một đến hai câu copy bán hàng.
|
||||
- Kết quả đủ để vận hành chọn, sửa nhẹ rồi đăng.
|
||||
|
||||
:::
|
||||
|
||||
::: info Chức năng 2: lưu phương án tốt thành mẫu
|
||||
|
||||
| Đầu vào | Nội dung |
|
||||
| --- | --- |
|
||||
| Một bộ kết quả | Ảnh chính + tiêu đề + copy |
|
||||
|
||||
| Đầu ra | Mô tả |
|
||||
| --- | --- |
|
||||
| Áp dụng | Khi làm sản phẩm mới, dùng mẫu để tạo bản nháp |
|
||||
| Chỉnh sửa | Sửa trực tiếp tiêu đề hoặc copy |
|
||||
| Quản lý | Đặt tên, gắn tag, phân loại theo cửa hàng hoặc chiến dịch |
|
||||
|
||||
Quy trình mong muốn: nhập sản phẩm mới, chọn tạo mặc định hoặc dùng mẫu đã lưu, sau đó hệ thống áp dụng phong cách của mẫu để tạo kết quả mới.
|
||||
|
||||
:::
|
||||
|
||||
Tóm lại, trước khi viết code ta đã làm ba việc: hỏi người dùng, tìm điểm đau, thu hẹp phạm vi. Code chỉ là công cụ; hiểu người dùng và chọn đúng vấn đề mới là bước đầu.
|
||||
|
||||
<div style="margin: 50px 0;">
|
||||
<ClientOnly>
|
||||
<StepBar :active="1" :items="[
|
||||
{ title: 'Phân tích nhu cầu', description: 'Từ mơ hồ đến cụ thể' },
|
||||
{ title: 'Kiểm chứng một trang', description: 'Làm ra lõi trải nghiệm' },
|
||||
{ title: 'Mở rộng nhiều trang', description: 'Hoàn thiện cấu trúc ứng dụng' },
|
||||
{ title: 'Làm đẹp và hoàn thiện', description: 'Nâng trải nghiệm người dùng' }
|
||||
]" />
|
||||
</ClientOnly>
|
||||
</div>
|
||||
|
||||
## 2. Tạo prototype trong 10 phút: để AI IDE làm ra lõi trải nghiệm
|
||||
|
||||
::: info Gợi ý về Coding Plan
|
||||
Nếu IDE hiện tại không đủ thông minh hoặc hạn mức hết quá nhanh, bạn có thể tìm hiểu các Coding Plan hoặc công cụ CLI ở bài [Moderne CLI Coding Werkzeuge](../../stage-2/backend/modern-cli/).
|
||||
:::
|
||||
|
||||
Không nên suy nghĩ quá lâu. Khi phạm vi đã rõ, hãy bắt đầu từ một trang đơn giản.
|
||||
|
||||
### 2.1 Bước một: nói với AI bằng ngôn ngữ đời thường
|
||||
|
||||
Người mới không cần viết prompt hoàn hảo ngay. Hãy mô tả như đang nói chuyện với đồng nghiệp:
|
||||
|
||||
```txt
|
||||
Tôi muốn làm một công cụ giúp vận hành thương mại điện tử tự động tạo ảnh chính và copy sản phẩm.
|
||||
Hiện tại họ phải tự làm từng ảnh và từng đoạn chữ, rất mất thời gian.
|
||||
Ý tưởng là: họ nhập thông tin sản phẩm, hệ thống tạo một nhóm bản nháp,
|
||||
vận hành chọn bản ổn rồi sửa nhẹ để dùng.
|
||||
|
||||
Phiên bản đầu tiên chỉ cần một trang:
|
||||
bên trái nhập thông tin sản phẩm,
|
||||
bên phải hiển thị kết quả tạo ra.
|
||||
Hỗ trợ tải ảnh, nhập chữ,
|
||||
sau khi tạo thì hiển thị ảnh xem trước và copy.
|
||||
```
|
||||
|
||||
Sau đó đưa đoạn này cho AI và yêu cầu nó mở rộng thành tài liệu nghiệp vụ và prompt cho AI IDE:
|
||||
|
||||
```txt
|
||||
Hãy mở rộng ý tưởng trên thành một tài liệu logic nghiệp vụ rõ ràng,
|
||||
sau đó tạo một prompt phù hợp để gửi cho AI IDE như Cursor hoặc Trae,
|
||||
dùng để sinh prototype ứng dụng một trang.
|
||||
```
|
||||
|
||||
AI thường sẽ bổ sung các chi tiết bạn chưa nghĩ tới. Bạn cần đọc lại, bỏ những chức năng chưa cần, rồi mới dùng prompt đó để sinh code.
|
||||
|
||||
### 2.2 Có tài liệu rồi thì gửi thẳng cho AI IDE
|
||||
|
||||
Nếu bạn đã tự viết tài liệu nghiệp vụ, có thể dùng mẫu sau:
|
||||
|
||||
```txt
|
||||
Hãy dựa trên logic nghiệp vụ sau để xây dựng một ứng dụng một trang nhằm kiểm chứng chức năng cốt lõi.
|
||||
|
||||
Logic nghiệp vụ:
|
||||
1. Giúp vận hành tạo bản nháp ảnh và copy sản phẩm hàng loạt.
|
||||
- Đầu vào:
|
||||
- Thông tin cơ bản: tên, danh mục, thương hiệu, chất liệu, kích thước, màu sắc, nhóm người dùng.
|
||||
- Ảnh sản phẩm: ảnh nền trắng hoặc ảnh bối cảnh đơn giản.
|
||||
- Ảnh tham khảo hoặc link sản phẩm từng bán tốt.
|
||||
- Có thể nhập bằng Excel hoặc nhập trực tiếp trên trang.
|
||||
- Có tùy chọn lưu tư liệu vào thư viện.
|
||||
- Đầu ra:
|
||||
- Mỗi sản phẩm có một ảnh chính nháp với điểm bán cơ bản.
|
||||
- Một tiêu đề có cấu trúc hợp lý và một đến hai câu copy bán hàng.
|
||||
- Cách dùng mong muốn:
|
||||
Thay vì bắt đầu từ trang trắng, vận hành đưa một lô sản phẩm vào hệ thống,
|
||||
rồi chọn và chỉnh nhẹ bản nháp do hệ thống tạo.
|
||||
|
||||
Trước tiên chỉ làm chức năng thứ nhất. Thư viện mẫu để thêm sau.
|
||||
```
|
||||
|
||||
### 2.3 Cách nâng cao: để AI viết "prompt cho prompt"
|
||||
|
||||
Bạn cũng có thể yêu cầu một AI khác viết prompt dành riêng cho coding Agent:
|
||||
|
||||
```txt
|
||||
Dựa trên ý tưởng sau, hãy viết một prompt dùng để gửi cho coding Agent.
|
||||
|
||||
[Dán mô tả nghiệp vụ của bạn ở đây]
|
||||
|
||||
Yêu cầu:
|
||||
1. Có mô tả bố cục trang rõ ràng.
|
||||
2. Nêu rõ cấu trúc dữ liệu và logic tương tác.
|
||||
3. Chỉ định stack kỹ thuật, ví dụ React + Tailwind.
|
||||
4. Liệt kê các chức năng cốt lõi cần làm.
|
||||
```
|
||||
|
||||
|
||||
|
||||
### 2.4 Để AI IDE sinh code
|
||||
|
||||
Nếu chưa quen AI IDE như Cursor, Trae hoặc Windsurf, hãy xem trước [IDE cơ bản](/vi-vn/appendix/2-development-tools/ide-basics/): cách tạo dự án, nói chuyện với Agent và đọc quá trình sinh code.
|
||||
|
||||
Tạo một thư mục mới rồi mở trong AI IDE:
|
||||
|
||||
|
||||
|
||||
|
||||
Trong thanh bên, chọn mô hình bạn muốn dùng, ví dụ Gemini, GPT, GLM, Kimi hoặc MiniMax, rồi dán prompt đã chuẩn bị:
|
||||
|
||||
|
||||
|
||||
Sau khi gửi, AI sẽ lập kế hoạch thư mục, tạo file và viết nội dung ban đầu.
|
||||
|
||||
::: warning Lưu ý: Agent có thể dừng để chờ xác nhận
|
||||
Trong quá trình sinh code, Agent thường dừng lại để chờ bạn xác nhận: nhấn Enter, chọn phương án, hoặc cho phép chạy lệnh. Nếu thấy AI không chạy tiếp, hãy kiểm tra khung chat xem nó đang chờ phản hồi hay không.
|
||||
:::
|
||||
|
||||
|
||||
|
||||
Nếu xuất hiện một dịch vụ local, bạn cần mở đường dẫn trong trình duyệt hoặc bấm bỏ qua bước chờ trong IDE:
|
||||
|
||||
|
||||
|
||||
::: info Giải thích nhanh về localhost
|
||||
Khi tạo dự án React bằng Vite, máy tính sẽ chạy một server local để bạn xem trang. `localhost` nghĩa là "chính máy tính này". Cổng như `5174` là số để phân biệt các dịch vụ khác nhau. Nếu `5173` bị chiếm, hệ thống tự đổi sang cổng khác là bình thường.
|
||||
:::
|
||||
|
||||
Sau khi xác nhận xong, chờ Agent chạy một lúc, bạn sẽ có phiên bản đầu tiên:
|
||||
|
||||
|
||||
|
||||
Nếu giao diện còn xấu, hãy nói thẳng với AI:
|
||||
|
||||
|
||||
|
||||
Sau khi tối ưu có thể nhận được giao diện đẹp hơn:
|
||||
|
||||
|
||||
|
||||
Bạn có thể tiếp tục điều chỉnh bằng yêu cầu cụ thể:
|
||||
|
||||
- "Tôi chưa cần nhập hàng loạt, hãy bỏ chức năng này."
|
||||
- "Bên trái có quá nhiều trường, chỉ giữ lại các trường quan trọng."
|
||||
- "Hãy tham khảo bố cục trong ảnh này, không cần giống hoàn toàn."
|
||||
|
||||
|
||||
|
||||
Kết quả cuối có thể tiến gần hơn đến một prototype chuyên nghiệp:
|
||||
|
||||
|
||||
|
||||
### 2.5 Gặp lỗi thì làm gì?
|
||||
|
||||
Gặp lỗi là bình thường. Người mới không cần hiểu toàn bộ lỗi, chỉ cần đưa đầy đủ hiện tượng cho AI.
|
||||
|
||||
- **Trang hoặc terminal báo lỗi**: chụp ảnh hoặc copy toàn bộ lỗi đỏ gửi cho AI.
|
||||
- **Chức năng sai nhưng không báo lỗi**: mô tả "hiện tại xảy ra gì" và "tôi mong muốn gì".
|
||||
- **Không chắc có lỗi hay không**: hỏi AI kiểm tra chức năng có vấn đề rõ ràng không.
|
||||
|
||||
Một vài câu hỏi thường gặp:
|
||||
|
||||
- **Không biết lỗi nằm ở đâu?** Hãy tìm chữ màu đỏ trong terminal, console hoặc trang web rồi copy cho AI.
|
||||
- **AI sửa xong vẫn lỗi?** Gửi lỗi mới nhất, yêu cầu sửa trên nền bản vừa sửa.
|
||||
- **Có cần hiểu hết cách sửa không?** Không cần ngay. Mỗi lần hiểu một hai điểm là đủ.
|
||||
- **Sửa nhiều lần vẫn không được?** Dùng Revert quay lại bản chạy được, đổi mô hình, hoặc gửi "code hiện tại + log lỗi + hành vi mong muốn" để AI xử lý tổng thể.
|
||||
|
||||
## 3. Từ một trang mở rộng thành ứng dụng nhiều trang
|
||||
|
||||
<div style="margin: 50px 0;">
|
||||
<ClientOnly>
|
||||
<StepBar :active="2" :items="[
|
||||
{ title: 'Phân tích nhu cầu', description: 'Từ mơ hồ đến cụ thể' },
|
||||
{ title: 'Kiểm chứng một trang', description: 'Làm ra lõi trải nghiệm' },
|
||||
{ title: 'Mở rộng nhiều trang', description: 'Hoàn thiện cấu trúc ứng dụng' },
|
||||
{ title: 'Làm đẹp và hoàn thiện', description: 'Nâng trải nghiệm người dùng' }
|
||||
]" />
|
||||
</ClientOnly>
|
||||
</div>
|
||||
|
||||
Khi logic cốt lõi đã chạy, hãy bổ sung các phần còn thiếu. Ví dụ nút cài đặt chưa hoạt động, trang thư viện mẫu chưa có, hoặc luồng lưu mẫu chưa hoàn chỉnh. Bạn có thể yêu cầu AI kiểm tra theo tài liệu nghiệp vụ và triển khai từng trang.
|
||||
|
||||
|
||||
|
||||
Sau một lúc, ứng dụng có thể được bổ sung nhiều trang và chức năng tương tác:
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
Lúc này bạn cần tự bấm thử những nút quan trọng. Nếu phần nào không tương tác, hãy mô tả hiện tượng và để AI sửa.
|
||||
|
||||
## 4. Làm prototype trông "ra dáng"
|
||||
|
||||
<div style="margin: 50px 0;">
|
||||
<ClientOnly>
|
||||
<StepBar :active="3" :items="[
|
||||
{ title: 'Phân tích nhu cầu', description: 'Từ mơ hồ đến cụ thể' },
|
||||
{ title: 'Kiểm chứng một trang', description: 'Làm ra lõi trải nghiệm' },
|
||||
{ title: 'Mở rộng nhiều trang', description: 'Hoàn thiện cấu trúc ứng dụng' },
|
||||
{ title: 'Làm đẹp và hoàn thiện', description: 'Nâng trải nghiệm người dùng' }
|
||||
]" />
|
||||
</ClientOnly>
|
||||
</div>
|
||||
|
||||
Sau khi có nhiều trang, bước cuối là để prototype từ "chạy được" thành "dễ dùng và nhìn chuyên nghiệp". Hãy đi lại toàn bộ quy trình như một người dùng mới: nhập dữ liệu, tạo kết quả, lưu mẫu, mở thư viện, áp dụng lại mẫu.
|
||||
|
||||
Nếu mỗi lần kiểm thử đều phải nhập dữ liệu mới, rất tốn thời gian. Hãy yêu cầu AI tạo lối vào dữ liệu thử:
|
||||
|
||||
```txt
|
||||
Tôi cần kiểm thử luồng người dùng này. Hãy thêm một lối vào dữ liệu mẫu để tôi có thể bấm một nút và nhanh chóng kiểm tra toàn bộ quy trình:
|
||||
1. Nhập thông tin sản phẩm.
|
||||
2. Tạo ảnh và copy nháp.
|
||||
3. Chọn một kết quả.
|
||||
4. Lưu kết quả thành mẫu.
|
||||
5. Mở thư viện mẫu và xem lại tham số tạo.
|
||||
```
|
||||
|
||||
Nếu một bộ dữ liệu quá ít, hãy yêu cầu AI tạo nhiều case kiểm thử:
|
||||
|
||||
|
||||
|
||||
Bấm vào có thể nhận kết quả:
|
||||
|
||||
|
||||
|
||||
Nếu kết quả xuất hiện quá nhanh, không giống quá trình tạo thật, có thể yêu cầu:
|
||||
|
||||
> Hãy mô phỏng một quá trình tạo thật: sau khi bấm nút, chờ một khoảng thời gian rồi mới hiển thị kết quả.
|
||||
|
||||
|
||||
|
||||
Sau đó kiểm tra thư viện mẫu. Nếu card kết quả chưa có chức năng lưu, hãy yêu cầu:
|
||||
|
||||
> Hãy đảm bảo người dùng có thể bấm vào một kết quả để lưu thành mẫu. Khi mở mẫu, cần thấy được tham số tạo và nội dung đã lưu.
|
||||
|
||||
Quá trình này thường cần sửa nhiều vòng bằng ảnh chụp và mô tả:
|
||||
|
||||
|
||||
|
||||
Kết quả kỳ vọng:
|
||||
|
||||
|
||||
|
||||
Ngoài tự trải nghiệm, bạn cũng có thể nhờ AI làm kiểm tra yêu cầu:
|
||||
|
||||
- "Hãy đối chiếu yêu cầu ban đầu và kiểm tra ứng dụng hiện tại đã bao phủ các chức năng cốt lõi chưa."
|
||||
- "Hãy liệt kê checklist chức năng, đánh dấu phần đã xong, phần chưa làm và phần trải nghiệm còn yếu."
|
||||
|
||||
Checklist này giúp bạn quyết định nên tiếp tục chỉnh gì.
|
||||
|
||||
## 5. Bài tập: làm lại bàn làm việc thương mại điện tử của riêng bạn
|
||||
|
||||
<el-card shadow="hover" style="margin: 20px 0; border-radius: 12px;">
|
||||
<template #header>
|
||||
<div style="font-weight: bold; font-size: 16px;">Nhiệm vụ thử thách: làm lại bàn làm việc nội dung thương mại điện tử</div>
|
||||
</template>
|
||||
|
||||
<p>
|
||||
Hãy tham khảo prompt và quy trình của bài này để hoàn thành một vòng khép kín:
|
||||
</p>
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<strong>Thực hành vòng khép kín</strong>
|
||||
<ul>
|
||||
<li>Tạo prompt phân tích nghiệp vụ -> tạo prototype một trang -> mở rộng thành prototype nhiều trang</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<strong>Chia sẻ kết quả</strong>
|
||||
<ul>
|
||||
<li>Chụp ảnh chương trình của bạn và chia sẻ với mọi người</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<strong>Câu hỏi suy nghĩ</strong>
|
||||
<ul>
|
||||
<li>Chuẩn bị cho bài tiếp theo về LLM và tạo ảnh: trong bàn làm việc của bạn, có thể nhúng các năng lực như viết copy, tạo ảnh minh họa hoặc tạo kịch bản ở đâu?</li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</el-card>
|
||||
|
||||
## Bước tiếp theo
|
||||
|
||||
Ở bài tiếp theo, ta sẽ dựa trên bàn làm việc nội dung này để kết nối năng lực AI cụ thể: text-to-text, image-to-text và text-to-image. Ví dụ:
|
||||
|
||||
- Tự động tạo bản nháp copy và nhiều tiêu đề cho một nhiệm vụ nội dung.
|
||||
- Tạo ảnh nháp theo mô tả nhiệm vụ.
|
||||
- Phân loại và tóm tắt nhiệm vụ nội dung cũ để hỗ trợ lên kế hoạch cho chiến dịch tiếp theo.
|
||||
|
||||
<RelatedArticlesSection
|
||||
title="Tiếp tục học"
|
||||
description="Nên học theo thứ tự: kết nối năng lực AI -> vòng khép kín dự án -> kỹ thuật hóa thiết kế."
|
||||
:items="relatedArticles"
|
||||
/>
|
||||
@@ -0,0 +1,301 @@
|
||||
---
|
||||
title: 'Thực chiến dự án hoàn chỉnh - Từ Demo đến nguyên mẫu cấp sản phẩm'
|
||||
description: 'Vượt qua giai đoạn Demo, học cách hoàn thiện chuỗi sản phẩm, xây dựng dữ liệu mô phỏng chân thực, lặp lại nhanh chóng thông qua phản hồi, cuối cùng hoàn thành một nguyên mẫu AI hoàn chỉnh có thể trình diễn và tương tác.'
|
||||
---
|
||||
|
||||
<script setup>
|
||||
import { relatedArticlesMap } from '@theme/data/relatedArticles'
|
||||
|
||||
const duration = 'Khoảng <strong>3 ngày</strong>'
|
||||
const relatedArticles =
|
||||
relatedArticlesMap['vi-vn/stage-1/complete-project-practice'] ?? []
|
||||
</script>
|
||||
|
||||
# Cơ bản 5: Thực chiến dự án hoàn chỉnh
|
||||
|
||||
## Hướng dẫn chương này
|
||||
|
||||
<ChapterIntroduction :duration="duration" :tags="['Tư duy sản phẩm', 'Dữ liệu mô phỏng', 'Hoàn thiện tương tác', 'LocalStorage']" coreOutput="1 nguyên mẫu AI sản phẩm đầy đủ chức năng" expectedOutput="Ứng dụng Web với chuỗi hoàn chỉnh và dữ liệu chân thực">
|
||||
|
||||
Chương trước đã tích hợp khả năng AI, Demo đã chạy được, nhưng so với "sản phẩm" thực sự còn <strong>xa lắm</strong>: trang vừa refresh là <strong>dữ liệu mất sạch</strong>, báo lỗi là <strong>trang trắng</strong>, danh sách chỉ có "dữ liệu thử 1, dữ liệu thử 2", người dùng bấm nhầm cũng <strong>không thể hoàn tác</strong>...
|
||||
|
||||
Chương này sẽ <strong>lấp đầy tất cả những khoảng trống này</strong>: chúng ta sẽ <strong>hoàn thiện chuỗi sản phẩm đầy đủ</strong>, dùng AI tạo <strong>dữ liệu nghiệp vụ chân thực</strong> thay thế dữ liệu giả, thêm <strong>xử lý lỗi và phản hồi người dùng</strong>, cuối cùng hoàn thiện một nguyên mẫu <strong>đẹp mắt, có thể trình diễn cho người khác</strong>.
|
||||
|
||||
Đây là <strong>chương cuối cùng</strong> của giai đoạn cơ bản, hoàn thành bước này, bạn đã hoàn thành sự chuyển đổi từ "hoàn toàn không biết lập trình" đến "<strong>có thể tự làm nguyên mẫu AI sản phẩm</strong>".
|
||||
|
||||
</ChapterIntroduction>
|
||||
|
||||
<div style="margin: 50px 0;">
|
||||
<ClientOnly>
|
||||
<StepBar :active="0" :items="[
|
||||
{ title: 'Hoàn thiện chuỗi', description: 'Từ tính năng đơn lẻ đến vòng lặp hoàn chỉnh' },
|
||||
{ title: 'Tiêm linh hồn', description: 'Mô phỏng dữ liệu nghiệp vụ thực tế' },
|
||||
{ title: 'Lặp lại phản hồi', description: 'Sửa chữa trải nghiệm dựa trên phản hồi thực tế' },
|
||||
{ title: 'Bài tập lớn cuối kỳ', description: 'Thiết kế tốt nghiệp của bạn' }
|
||||
]" />
|
||||
</ClientOnly>
|
||||
</div>
|
||||
|
||||
## 1. Từ chối "Happy Path": Hoàn thiện chuỗi cốt lõi
|
||||
|
||||
Rất nhiều người mới làm nguyên mẫu, thường chỉ làm "Happy Path" (con đường lý tưởng nhất): người dùng click -> API phản hồi thành công -> hiển thị kết quả.
|
||||
Nhưng trong thế giới thực, mọi thứ thường không suôn sẻ như vậy. Để nguyên mẫu của bạn trông giống một sản phẩm thực sự, bạn cần cân nhắc các khâu "vô hình" sau đây.
|
||||
|
||||
### 1.1 Thêm "chờ đợi" và "phản hồi"
|
||||
|
||||
Khi người dùng click "tạo văn bản", AI thường mất vài giây để phản hồi. Nếu giao diện không có phản ứng gì, người dùng sẽ tưởng chương trình bị lỗi.
|
||||
**Bạn cần để AI IDE thêm trạng thái Loading:**
|
||||
|
||||
> Ví dụ prompt:
|
||||
> "Khi tôi click nút tạo, hãy đổi nút thành 'Đang tạo...' và không cho click, đồng thời hiển thị hoạt ảnh tải ở khu vực bên phải. Cho đến khi API trả về kết quả, mới khôi phục bình thường."
|
||||
|
||||
### 1.2 Xử lý "thất bại" và "ngoại lệ"
|
||||
|
||||
API Key có thể hết hạn, mạng có thể bị ngắt.
|
||||
**Bạn cần để AI IDE xử lý lỗi:**
|
||||
|
||||
> Ví dụ prompt:
|
||||
> "Nếu API request thất bại, đừng báo lỗi trong console, hãy hiện một hộp thoại màu đỏ (Toast) ở đầu trang, báo người dùng 'Tạo thất bại, vui lòng thử lại sau', và cho phép người dùng click lại nút tạo."
|
||||
|
||||
### 1.3 Lưu trữ lịch sử hội thoại
|
||||
|
||||
Trong quá trình tương tác với AI, chúng ta cần lưu nội dung hội thoại, để người dùng có thể xem lại lịch sử, tiếp tục trao đổi trước đó. Hiện tại chưa cần cơ sở dữ liệu, có thể chọn các giải pháp nhẹ sau:
|
||||
|
||||
**Lựa chọn phương án lưu trữ:**
|
||||
|
||||
| Phương án | Kịch bản sử dụng | Đặc điểm |
|
||||
| ---------------- | -------------------------------- | ------------------------------------ |
|
||||
| **LocalStorage** | Dự án thuần frontend, dữ liệu người dùng lưu trên trình duyệt | Dễ triển khai, refresh không mất, không đồng bộ được giữa các thiết bị |
|
||||
| **File JSON** | Nguyên mẫu cục bộ, dữ liệu lưu dạng file | Cấu trúc rõ ràng, dễ debug, có thể chỉnh sửa thủ công |
|
||||
| **File TXT** | Phương án đơn giản nhất, ghi nhanh nội dung văn bản | Định dạng tự do, khả năng tương thích tốt |
|
||||
|
||||
**Ví dụ nội dung hội thoại:**
|
||||
Lịch sử hội thoại đã lưu thường bao gồm:
|
||||
|
||||
```json
|
||||
[
|
||||
{
|
||||
"role": "user",
|
||||
"content": "Giúp tôi tạo văn bản livestream bán tai nghe bluetooth",
|
||||
"timestamp": "2026-01-20 10:30:00"
|
||||
},
|
||||
{
|
||||
"role": "assistant",
|
||||
"content": "[Văn bản gợi ý tai nghe bluetooth]\n\n🎧 Tạm biệt độ trễ, trải nghiệm nghe nhạc chìm đắm\n\nChị em ơi! Chiếc tai nghe bluetooth này thực sự quá tuyệt 👇\n\n✅ Chống ồn chủ động 40dB, ngay lập tức bước vào thế giới âm nhạc\n✅ Thời lượng pin siêu dài 30 giờ, cả tuần đi làm không cần sạc\n✅ Gọi điện rõ như đối thoại, tàu điện ngầm ồn ào cũng trò chuyện được\n✅ Thiết kế nửa lọt tai, đeo lâu không đau không bí\n\n💰 Ưu đãi có hạn, click vào link bên dưới để mua ngay!",
|
||||
"timestamp": "2026-01-20 10:30:05"
|
||||
}
|
||||
]
|
||||
```
|
||||
|
||||
**Prompt triển khai:**
|
||||
|
||||
> "Hãy giúp tôi triển khai tính năng lưu lịch sử hội thoại. Hỗ trợ lưu bản ghi hội thoại giữa người dùng và AI dưới dạng file JSON (hoặc sử dụng LocalStorage). Tự động tải lịch sử hội thoại mỗi khi vào trang, hỗ trợ xem và xóa từng bản ghi hội thoại."
|
||||
|
||||
<div style="margin: 50px 0;">
|
||||
<ClientOnly>
|
||||
<StepBar :active="1" :items="[
|
||||
{ title: 'Hoàn thiện chuỗi', description: 'Từ tính năng đơn lẻ đến vòng lặp hoàn chỉnh' },
|
||||
{ title: 'Tiêm linh hồn', description: 'Mô phỏng dữ liệu nghiệp vụ thực tế' },
|
||||
{ title: 'Lặp lại phản hồi', description: 'Sửa chữa trải nghiệm dựa trên phản hồi thực tế' },
|
||||
{ title: 'Bài tập lớn cuối kỳ', description: 'Thiết kế tốt nghiệp của bạn' }
|
||||
]" />
|
||||
</ClientOnly>
|
||||
</div>
|
||||
|
||||
## 2. Tiêm linh hồn: Mô phỏng dữ liệu thực tế (Mock Data)
|
||||
|
||||
Một trang trống rỗng không thể thuyết phục ai. Tưởng tượng, bạn giới thiệu "bàn làm việc tư liệu thương mại điện tử" cho người khác, kết quả lịch sử trống không, hoặc chỉ có một dòng "test / test / test".
|
||||
Để hiệu quả trình diễn tốt nhất, chúng ta cần "giả" một số dữ liệu chân thực, để nguyên mẫu trông giống một sản phẩm thực tế đã vận hành nửa năm.
|
||||
|
||||
### 2.1 Để AI giúp bạn thiết kế cấu trúc dữ liệu
|
||||
|
||||
Chúng ta không cần tự nghĩ xem mỗi trường nên đặt tên gì (ví dụ nên gọi `name` hay `title`), việc này hoàn toàn có thể giao cho AI.
|
||||
|
||||
Bạn chỉ cần cho AI biết **kịch bản nghiệp vụ** của bạn:
|
||||
|
||||
> **Ví dụ prompt:**
|
||||
> "Tôi đang làm nguyên mẫu **bàn làm việc tư liệu thương mại điện tử TikTok**.
|
||||
> Hãy giúp tôi thiết kế một cấu trúc dữ liệu JSON, để mô tả một 'nhiệm vụ sản phẩm'.
|
||||
> Nhiệm vụ này nên bao gồm: thông tin cơ bản sản phẩm (tên, danh mục), tư liệu đầu vào (link hình ảnh), và kết quả AI tạo ra (tiêu đề, văn bản, ảnh poster).
|
||||
> Hãy cho tôi trực tiếp một ví dụ JSON."
|
||||
|
||||
AI sẽ dựa trên mô tả của bạn, tự động giúp bạn nghĩ ra các trường như `productName`, `generatedContent`.
|
||||
|
||||
### 2.2 Để AI sản xuất loạt dữ liệu "chân thực"
|
||||
|
||||
Có cấu trúc dữ liệu rồi, bước tiếp theo là để AI giúp bạn "điền vào", tạo ra một loạt dữ liệu trông thật.
|
||||
|
||||
**Kỹ thuật prompt:**
|
||||
Bạn không thể chỉ nói AI "giúp tôi tạo dữ liệu", bạn cần như giao việc cho thực tập sinh, cho nó biết **bối cảnh nghiệp vụ** và **yêu cầu nội dung**:
|
||||
|
||||
- **Bối cảnh nghiệp vụ**: Cho AI biết chúng ta làm "thương mại điện tử TikTok", nên tiêu đề sản phẩm phải thu hút (như "bí quyết thon dáng", "sinh viên phải có"), văn bản phải khẩu ngữ hóa.
|
||||
- **Yêu cầu hình ảnh**: Để nguyên mẫu đẹp, hình ảnh không phải placeholder đen trắng, tốt nhất là ảnh phong cảnh hoặc vật thật nhiều màu ngẫu nhiên.
|
||||
|
||||
> **Ví dụ prompt:**
|
||||
> "Dựa trên cấu trúc vừa thiết kế, giúp tôi tạo 10 bản ghi dữ liệu mô phỏng chân thực.
|
||||
> (Ghi chú: không nhất thiết phải là JSON. Nếu bạn đang làm frontend, có thể yêu cầu tạo mảng JavaScript; nếu dùng Python, có thể tạo List.)
|
||||
>
|
||||
> **Yêu cầu kịch bản nghiệp vụ**:
|
||||
>
|
||||
> 1. Giả sử đây là một cửa hàng bách hóa tổng hợp, sản phẩm bao gồm 3 danh mục: 'thời trang nữ', 'kỹ thuật số', 'mỹ phẩm'.
|
||||
> 2. **Tiêu đề và văn bản tạo ra phải mang phong cách TikTok**: ví dụ tiêu đề phải chứa Emoji (🔥, ✨), văn bản phải dùng giọng điệu 'cực phẩm', 'trải nghiệm thực'.
|
||||
> 3. **Trường hình ảnh**: Sử dụng thống nhất định dạng `https://picsum.photos/seed/{random_id}/300/400`, đảm bảo mỗi ảnh đều khác nhau."
|
||||
|
||||
**Ví dụ Mock Data đã tạo:**
|
||||
|
||||
```javascript
|
||||
export const mockProductTasks = [
|
||||
{
|
||||
id: 'task_001',
|
||||
name: 'Đầm vintage hoa Pháp mùa hè',
|
||||
status: 'completed',
|
||||
input: {
|
||||
category: 'Thời trang nữ',
|
||||
features: ['Eo thon', 'Giảm cân', 'Phong cách'],
|
||||
originalImage: 'https://picsum.photos/seed/dress_input/300/400'
|
||||
},
|
||||
output: {
|
||||
generatedTitle: '✨Ai mặc cũng đẹp! Chiếc đầm hoa Pháp này thực sự cực phẩm🔥',
|
||||
generatedCopy:
|
||||
'Chị em ơi! Chiếc váy này thực sự quá thon dáng! Thiết kế vòng eo cực phẩm, mặc vào ngay lập tức có eo. Vải rất thoáng khí, mùa hè mặc hoàn toàn không bí. Lựa chọn hàng đầu cho hẹn hò và dạo phố!👗',
|
||||
generatedPosterImage: 'https://picsum.photos/seed/dress_output/300/400'
|
||||
},
|
||||
createdAt: '2026-01-20T10:00:00Z'
|
||||
},
|
||||
{
|
||||
id: 'task_002',
|
||||
name: 'Tai nghe chống ồn siêu mạnh Pro',
|
||||
status: 'completed',
|
||||
input: {
|
||||
category: 'Kỹ thuật số',
|
||||
features: ['Chống ồn', 'Pin siêu dài', 'Độ trễ thấp'],
|
||||
originalImage: 'https://picsum.photos/seed/tech_input/300/400'
|
||||
},
|
||||
output: {
|
||||
generatedTitle: '🎧 Cuối cùng cũng tìm được! Chiếc tai nghe chống ồn này quá mạnh!🔇',
|
||||
generatedCopy:
|
||||
'Đeo vào, thế giới ngay lập tức yên tĩnh. Chất âm tuyệt vời, nghe nhạc như đang ở hiện trường. Pin cũng rất bền, sạc một lần dùng cả tuần! Sinh viên phải có!',
|
||||
generatedPosterImage: 'https://picsum.photos/seed/tech_output/300/400'
|
||||
},
|
||||
createdAt: '2026-01-21T14:30:00Z'
|
||||
}
|
||||
// ... thêm dữ liệu
|
||||
]
|
||||
```
|
||||
|
||||
### 2.3 (Nâng cao) Sử dụng LocalStorage để "giả" thêm/xóa/sửa
|
||||
|
||||
Nếu bạn muốn "dữ liệu mô phỏng" vừa tạo không chỉ xem được mà còn xóa được, sửa được, thậm chí nhiệm vụ mới tạo sau khi refresh trang vẫn còn, bạn có thể kết hợp `LocalStorage`.
|
||||
|
||||
> **Ví dụ prompt:**
|
||||
> "Hãy giúp tôi triển khai tính năng lưu trữ dữ liệu.
|
||||
>
|
||||
> 1. Ưu tiên đọc dữ liệu từ `localStorage`.
|
||||
> 2. Nếu `localStorage` trống, sử dụng Mock data vừa tạo để khởi tạo, và lưu chúng vào `localStorage`.
|
||||
> 3. Đồng thời giúp tôi viết các hàm `addProductTask` và `deleteProductTask`, mỗi thao tác đều cập nhật `localStorage` đồng bộ."
|
||||
|
||||
Qua bước này, nguyên mẫu của bạn đã có "bộ nhớ", trải nghiệm người dùng gần như không khác gì sản phẩm thực.
|
||||
|
||||
<div style="margin: 50px 0;">
|
||||
<ClientOnly>
|
||||
<StepBar :active="2" :items="[
|
||||
{ title: 'Hoàn thiện chuỗi', description: 'Từ tính năng đơn lẻ đến vòng lặp hoàn chỉnh' },
|
||||
{ title: 'Tiêm linh hồn', description: 'Mô phỏng dữ liệu nghiệp vụ thực tế' },
|
||||
{ title: 'Lặp lại phản hồi', description: 'Sửa chữa trải nghiệm dựa trên phản hồi thực tế' },
|
||||
{ title: 'Bài tập lớn cuối kỳ', description: 'Thiết kế tốt nghiệp của bạn' }
|
||||
]" />
|
||||
</ClientOnly>
|
||||
</div>
|
||||
|
||||
## 3. Thu thập phản hồi và lặp lại nhanh chóng
|
||||
|
||||
Làm sản phẩm trong phòng kín thì không thể tốt. Bây giờ nguyên mẫu đã có "chức năng cốt lõi" + "chuỗi hoàn chỉnh" + "dữ liệu trình diễn", đã đến lúc cho người khác xem.
|
||||
|
||||
### 3.1 Tìm ai test? Test như thế nào?
|
||||
|
||||
- **Tìm bạn bè/đồng nghiệp**: Không cần họ hiểu kỹ thuật, chỉ cần để họ thử dùng.
|
||||
- **Quan sát thay vì hướng dẫn**: Đừng nói "click vào đây", mà xem họ sẽ click vào đâu. Nếu họ không tìm thấy nút, nghĩa là thiết kế có vấn đề.
|
||||
- **Phương pháp "Wizard of Oz"**: Nếu AI của bạn chưa kết nối xong, bạn có thể thủ công sửa dữ liệu ở backend (hoặc database) để mô phỏng phản hồi của AI, xác minh trước người dùng có cần tính năng này không.
|
||||
|
||||
### 3.2 Đối mặt với Bug và phàn nàn
|
||||
|
||||
- **Style bị lỗi**: Có thể bị lỗi ở các kích thước màn hình khác nhau.
|
||||
- **Hành động**: Chụp màn hình gửi cho AI IDE -> "Bị lỗi ở độ rộng màn hình này, giúp tôi sửa."
|
||||
- **Thao tác gượng gạo**: "Quy trình này quá phiền phức".
|
||||
- **Hành động**: Cho AI IDE biết đề xuất -> "Người dùng thấy upload rồi mới tạo quá chậm, có thể đổi thành tạo một lần không?"
|
||||
- **Yêu cầu mới**: "Nếu có tính năng này thì tốt quá."
|
||||
- **Hành động**: Đánh giá xem có phải cốt lõi không, nếu có, để AI nhanh chóng triển khai phiên bản đơn giản.
|
||||
|
||||
**Nhớ: Trong giai đoạn này, AI là trợ lý sửa chữa tốt nhất của bạn. Bạn chỉ cần chịu trách nhiệm phát hiện vấn đề, sửa code giao cho nó.**
|
||||
|
||||
<div style="margin: 50px 0;">
|
||||
<ClientOnly>
|
||||
<StepBar :active="3" :items="[
|
||||
{ title: 'Hoàn thiện chuỗi', description: 'Từ tính năng đơn lẻ đến vòng lặp hoàn chỉnh' },
|
||||
{ title: 'Tiêm linh hồn', description: 'Mô phỏng dữ liệu nghiệp vụ thực tế' },
|
||||
{ title: 'Lặp lại phản hồi', description: 'Sửa chữa trải nghiệm dựa trên phản hồi thực tế' },
|
||||
{ title: 'Bài tập lớn cuối kỳ', description: 'Thiết kế tốt nghiệp của bạn' }
|
||||
]" />
|
||||
</ClientOnly>
|
||||
</div>
|
||||
|
||||
## 4. 🎓 Bài tập lớn: Hoàn thành "thiết kế tốt nghiệp" của bạn
|
||||
|
||||
Chúc mừng bạn! Bạn đã hoàn thành toàn bộ quá trình từ "nhu cầu" đến "nguyên mẫu" rồi đến "tích hợp AI". Bây giờ, đã đến lúc trình bày kết quả cuối cùng.
|
||||
|
||||
**Bài tập lớn này không giới hạn ở "bàn làm việc tư liệu thương mại điện tử"**. Bạn cần kết hợp sở thích hoặc bối cảnh ngành nghề của mình, tạo ra một nguyên mẫu AI sản phẩm độc nhất vô nhị.
|
||||
|
||||
### Lựa chọn đề tài và yêu cầu
|
||||
|
||||
Bạn cần chọn một kịch bản phù hợp nhất từ **[Tham khảo hướng kịch bản đa ngành](../appendix-industry-scenarios/index.md)**, hoặc tự lên ý tưởng một kịch hoàn toàn mới.
|
||||
|
||||
**Dự án phải sử dụng tổng hợp tất cả nội dung đã học ở các bài trước:**
|
||||
|
||||
1. **Xây dựng nguyên mẫu**: Sử dụng công nghệ frontend để xây dựng giao diện đẹp, dễ sử dụng.
|
||||
2. **Kiểm soát nhu cầu**: Không cầu toàn diện, nhưng logic chức năng cốt lõi phải khép kín.
|
||||
3. **Tích hợp API**: Kết nối mô hình AI thực tế (LLM/VLM, v.v.), trao cho ứng dụng trí thông minh thực sự.
|
||||
4. **Triển khai ứng dụng có thể chơi**: Không chỉ là trang tĩnh, mà là ứng dụng động có luồng dữ liệu và phản hồi tương tác.
|
||||
|
||||
### Sản phẩm nộp bài
|
||||
|
||||
Cuối cùng bạn cần nộp hai nội dung sau:
|
||||
|
||||
1. **Một ứng dụng nguyên mẫu hoàn chỉnh**: Triển khai lên mạng hoặc chạy được cục bộ, có chuỗi sử dụng hoàn chỉnh.
|
||||
2. **Video trình diễn 30 giây**: Quay một video, giới thiệu ngắn gọn kịch bản ứng dụng của bạn, và trình diễn thao tác thực tế của các chức năng cốt lõi.
|
||||
|
||||
<el-card shadow="hover" style="margin: 20px 0; border-radius: 12px;">
|
||||
<template #header>
|
||||
<div style="font-weight: bold; font-size: 16px;">🚀 Danh sách kiểm tra thử thách cuối cùng</div>
|
||||
</template>
|
||||
|
||||
<p>
|
||||
Đây là trận chiến cuối cùng của Stage 1. Hãy kiểm tra tác phẩm của bạn theo danh sách dưới đây:
|
||||
</p>
|
||||
|
||||
<div style="font-weight: bold; margin-bottom: 10px;">Tự kiểm tra chức năng cốt lõi</div>
|
||||
<ul style="list-style-type: none; padding-left: 0;">
|
||||
<li><label><input type="checkbox" disabled /> <strong>Kịch bản rõ ràng</strong>: Đã chọn một ngành hoặc kịch bản ứng dụng cụ thể</label></li>
|
||||
<li><label><input type="checkbox" disabled /> <strong>Logic khép kín</strong>: Quy trình cốt lõi chạy thông suốt, không chỉ Happy Path</label></li>
|
||||
<li><label><input type="checkbox" disabled /> <strong>Lái bởi AI</strong>: Đã gọi API mô hình lớn thực sự, không phải phản hồi định sẵn</label></li>
|
||||
<li><label><input type="checkbox" disabled /> <strong>Trải nghiệm hoàn chỉnh</strong>: Bao gồm Loading, xử lý lỗi và dữ liệu mô phỏng</label></li>
|
||||
</ul>
|
||||
|
||||
<div style="font-weight: bold; margin: 20px 0 10px;">Chuẩn bị sản phẩm bàn giao</div>
|
||||
<ul style="list-style-type: none; padding-left: 0;">
|
||||
<li><label><input type="checkbox" disabled /> <strong>Ứng dụng nguyên mẫu</strong>: Code đã hoàn thành và có thể chạy</label></li>
|
||||
<li><label><input type="checkbox" disabled /> <strong>Video trình diễn</strong>: Khoảng 30 giây, thể hiện rõ điểm nổi bật cốt lõi</label></li>
|
||||
</ul>
|
||||
</el-card>
|
||||
|
||||
## Bước tiếp theo
|
||||
|
||||
Sau khi hoàn thành bài tập lớn, bạn đã có khả năng "độc lập phát triển nguyên mẫu ứng dụng AI".
|
||||
Trong Stage 2 tiếp theo, chúng ta sẽ đi sâu vào phát triển fullstack phức tạp hơn, học cách biến nguyên mẫu này thành một ứng dụng thương mại thực sự có thể lên mạng, có database, có hệ thống người dùng.
|
||||
|
||||
Hẹn gặp lại ở giai đoạn tiếp theo!
|
||||
|
||||
<RelatedArticlesSection
|
||||
title="Tiếp tục nâng cao"
|
||||
description="Chúc mừng hoàn thành Stage 1, các chương dưới đây có thể giúp bạn bước vào phát triển kỹ thuật."
|
||||
:items="relatedArticles"
|
||||
/>
|
||||
@@ -0,0 +1,206 @@
|
||||
---
|
||||
title: 'Tim y tuong tot - tu nhu cau nguoi dung den san pham co nguoi tra tien'
|
||||
description: 'Hoc cach phat hien co hoi tu nhung noi dau hang ngay, phan tich nhu cau co he thong, va mai dua mot y tuong binh thuong thanh khai niem san pham ma nguoi dung san sang tra tien.'
|
||||
---
|
||||
|
||||
<script setup>
|
||||
const duration = 'Khoang <strong>3 gio</strong>'
|
||||
</script>
|
||||
|
||||
# So cap 2: Tim y tuong tot
|
||||
|
||||
## Dan nhap chuong
|
||||
|
||||
<ChapterIntroduction :duration="duration" :tags="['Khai pha nhu cau', 'Tu duy san pham', 'Phan tich nguoi dung', 'Mo hinh kinh doanh']" coreOutput="3 khai niem san pham da duoc kiem chung" expectedOutput="Huong san pham/co hoi khoi nghiep co the trien khai">
|
||||
|
||||
O chuong truoc, ban da thay AI IDE co the giup ta tao ra san pham rat nhanh. Nhung truoc khi viet dong code dau tien, co mot cau hoi can ban hon:
|
||||
|
||||
<strong>Minh se lam cai gi?</strong>
|
||||
|
||||
Rat nhieu nguoi bat dau bang "lam mot cong cu AI" hoac "lam mot mang xa hoi", nhung lam xong thi khong ai dung. Van de thuong nam o dau? <strong>Chua tim duoc nhu cau that.</strong>
|
||||
|
||||
Thuc te con kho hon: <strong>co san pham giai quyet dung van de nhung nguoi dung van khong muon tra tien</strong>.
|
||||
|
||||
Trong chuong nay, thong qua cau chuyen cua Minh, ban se hoc mot phuong phap hoan chinh de tim y tuong: tu tieu chuan danh gia, khai pha noi dau, phan nhom nguoi dung, dao sau boi canh, kiem chung nhu cau, va mai dua khai niem san pham.
|
||||
|
||||
</ChapterIntroduction>
|
||||
|
||||
<div style="margin: 50px 0;">
|
||||
<ClientOnly>
|
||||
<StepBar :active="0" :items="[
|
||||
{ title: 'Step 1', description: 'Xay tieu chuan danh gia' },
|
||||
{ title: 'Step 2', description: 'Khai pha noi dau hang ngay' },
|
||||
{ title: 'Step 3', description: 'Phan nhom nguoi dung theo chieu ngang' },
|
||||
{ title: 'Step 4', description: 'Dao sau boi canh theo chieu doc' },
|
||||
{ title: 'Step 5', description: 'Kiem chung nhu cau that/gia' },
|
||||
{ title: 'Step 6', description: 'Mai dua khai niem san pham' }
|
||||
]" />
|
||||
</ClientOnly>
|
||||
</div>
|
||||
|
||||
## Step 1: Xay tieu chuan danh gia - nhu cau nao khien nguoi dung san sang tra tien
|
||||
|
||||
::: warning Vi sao chuong nay quan trong?
|
||||
|
||||
Co the ban se nghi: "Day la khoa hoc Vibe Coding, sao lai hoc tim nhu cau truoc? Khong viet code luon duoc a?"
|
||||
|
||||
Rat nhieu khoa hoc lap trinh bat dau bang du an: Todo List, may tinh, blog ca nhan... Nhung neu huong di sai, ban cang lam nhieu cang xa muc tieu.
|
||||
|
||||
Hay tuong tuong:
|
||||
|
||||
- Ban bo 2 tuan lam "he thong quan ly lich", trong khi thi truong da co hang tram san pham tot hon.
|
||||
- Ban lam app "chup anh tinh calo", nhung nguoi dung dung 1 lan roi go.
|
||||
- Ban lam "so chi tieu ca nhan", nhung chinh ban cung it dung.
|
||||
|
||||
Lam xong, ban co cam thay tu tin de coi do la "mot san pham dang gia" khong? Thuong la khong, vi no khong giai quyet van de that, khong tao gia tri that.
|
||||
|
||||
Vibe Coding lam cho viec bien y tuong thanh san pham nhanh hon. Chinh vi nhanh, ta can biet <strong>chuyen gi dang lam</strong>.
|
||||
|
||||
:::
|
||||
|
||||
### Tieu chuan danh gia y tuong (ban nen ghi ra)
|
||||
|
||||
Mot y tuong "dang lam" thuong can dat toi thieu 4 tieu chuan:
|
||||
|
||||
1. **Co nguoi gap van de thuong xuyen**: khong phai mot tinh huong hiem.
|
||||
2. **Van de co gia tri**: tiet kiem thoi gian, tien bac, rui ro, hoac giam dau dau.
|
||||
3. **Nguoi dung co dong luc hanh dong**: ho san sang thay doi hanh vi de giai quyet.
|
||||
4. **Ban co cach tiep can**: ban biet tim nguoi dung o dau va co the lay phan hoi.
|
||||
|
||||
Neu y tuong chi "nghe hay" nhung khong ro ai can, can nhu the nao, va vi sao ho tra tien, thi rat de lam xong roi... khong ai dung.
|
||||
|
||||
## Mo dau: cau chuyen cua Minh
|
||||
|
||||
Minh la mot lap trinh vien da di lam 3 nam. Mot ngay, Minh nghi: "Hay lam mot app the hinh giup nguoi dung len ke hoach tap va ghi lai du lieu tap luyen." Minh rat hao hung vi cam thay minh tim duoc mot du an lon.
|
||||
|
||||
Mot nam tiep theo, Minh danh het thoi gian ranh de lam app: khoa hoc, check-in, cong dong, phan tich du lieu... giao dien cung dep (theo Minh thay).
|
||||
|
||||
Ngay ra mat, Minh chi tien quang ba. Thang dau co 50.000 luot tai. Nghe co ve tot.
|
||||
|
||||
Nhung van de den nhanh:
|
||||
|
||||
- Nguoi dung tai ve dung 1 lan roi go.
|
||||
- Ty le quay lai sau 7 ngay rat thap.
|
||||
- Tinh nang tra phi gan nhu khong ai mua.
|
||||
- Thi truong da co san pham truong thanh voi noi dung va he sinh thai manh.
|
||||
|
||||
Minh lo nang va tu hoi: "Minh lam cung on ma, sao khong ai dung?"
|
||||
|
||||
Van de khong phai Minh thieu ky thuat. Van de nam o **diem xuat phat**: Minh chua lam ro cau hoi can ban nhat: <strong>nguoi dung co that su can them mot app nay khong, va vi sao ho se tra tien?</strong>
|
||||
|
||||
Tu do, ta rut ra bai hoc: <strong>huong di sai thi cang di sau cang sai</strong>.
|
||||
|
||||
::: tip Chuong nay ban se lam gi?
|
||||
|
||||
Ban se di qua 3 man:
|
||||
|
||||
1. Tim nhu cau that: nhu cau nao co gia tri va co the tra tien.
|
||||
2. Dao ra y tuong tot: tu noi dau hang ngay tao thanh co hoi san pham.
|
||||
3. Mai dua bang AI: dung AI de bien y tuong thanh phuong an co the trien khai va kiem chung.
|
||||
|
||||
:::
|
||||
|
||||
## Step 2: Khai pha noi dau hang ngay
|
||||
|
||||
Nguon y tuong on dinh nhat thuong den tu "noi dau hang ngay". Cach lam don gian:
|
||||
|
||||
1. Viet ra 20 viec/boi canh ban (hoac nguoi xung quanh) lap lai hang tuan.
|
||||
2. Danh dau nhung cho "mat thoi gian", "de sai", "de quen", "de tre han", "de bi phat".
|
||||
3. Moi muc, ghi them: ai dang bi dau dau? khi nao? tai sao? hau qua la gi?
|
||||
|
||||
Vi du noi dau:
|
||||
|
||||
- Lam bao cao hang tuan mat nhieu thoi gian.
|
||||
- Chat voi khach hang qua nhieu kenh, bi sot tin.
|
||||
- Sap xep tai lieu/anh/video rui tung, moi lan tim rat lau.
|
||||
- Duyet hop dong dai, de bo sot rui ro.
|
||||
|
||||
Quan trong: dung dung o "van de" chung chung. Hay dich no thanh hanh vi va boi canh cu the.
|
||||
|
||||
## Step 3: Phan nhom nguoi dung theo chieu ngang
|
||||
|
||||
Mot y tuong co the dung voi nhieu nhom nguoi, nhung moi nhom co "gia tri" va "kha nang tra tien" khac nhau.
|
||||
|
||||
Hay phan nhom theo:
|
||||
|
||||
- Nghe nghiep/vi tri: van hanh, ke toan, HR, sales, giao vien, sinh vien...
|
||||
- Quy mo: ca nhan, nhom nho, doanh nghiep.
|
||||
- Tan suat: dung hang ngay hay thinh thoang?
|
||||
- Chi phi cua van de: mat 10 phut hay mat 5 gio?
|
||||
|
||||
Muc tieu cua buoc nay: chon ra 1-2 nhom ma ban co the tiep can de phong van va kiem chung.
|
||||
|
||||
## Step 4: Dao sau boi canh theo chieu doc
|
||||
|
||||
De mo ta ro nhu cau, ban can biet:
|
||||
|
||||
1. Nguoi dung bat dau tu dau? (dau vao)
|
||||
2. Ho thuong lam gi tiep theo? (cac buoc)
|
||||
3. Cho nao hay bi ket? (nut that)
|
||||
4. Sai sot thuong xay ra o dau? (rui ro)
|
||||
5. Sau khi xong, ho can dau ra gi? (ket qua)
|
||||
|
||||
De lam nhanh, hay ve 1 "luong cong viec" gom 5-7 buoc. AI rat hop de giup ban sap xep va lam ro luong nay.
|
||||
|
||||
## Step 5: Kiem chung nhu cau that/gia
|
||||
|
||||
Nhieu y tuong nghe co ve hop ly nhung thuc ra la "nhu cau gia". Cach kiem chung:
|
||||
|
||||
- **Hoi ve hanh vi qua khu** thay vi y kien chung chung.
|
||||
- **Hoi chi tiet chi phi**: mat bao lau, mat bao nhieu tien, bi anh huong ra sao.
|
||||
- **Hoi giai phap hien tai**: ho dang dung gi de giai quyet? co phai ho da tu lam cach khac?
|
||||
- **Hoi nguong tra tien**: trong tinh huong nao ho san sang tra?
|
||||
|
||||
Goi y cau hoi phong van:
|
||||
|
||||
1. Lan gan nhat ban gap van de nay la khi nao? Ban dang lam gi?
|
||||
2. Ban da thu giai phap nao? Vi sao khong on?
|
||||
3. Neu giai quyet duoc, ban duoc loi gi? (thoi gian, tien, rui ro, tinh than)
|
||||
4. Neu co cong cu giai quyet, ban muon no lam gi truoc? Cai gi la "bat buoc"?
|
||||
|
||||
## Step 6: Mai dua khai niem san pham
|
||||
|
||||
Den day, ban co 3 thanh phan:
|
||||
|
||||
1. Mot nhom nguoi dung ro rang.
|
||||
2. Mot boi canh ro rang.
|
||||
3. Mot noi dau ro rang va co chi phi.
|
||||
|
||||
Gio hay viet 1 cau "dinh nghia san pham" theo mau:
|
||||
|
||||
> Doi voi [nhom nguoi dung], trong boi canh [tinh huong cu the], san pham nay giup ho [muc tieu] bang cach [cach lam], de giam [chi phi] va dat duoc [ket qua].
|
||||
|
||||
Vi du:
|
||||
|
||||
> Doi voi nhan vien van hanh TMĐT, khi can tao nhanh noi dung cho nhieu san pham, cong cu nay giup tao ban nhap anh va copy theo mau, de giam thoi gian lam thu cong va tang toc do len hang.
|
||||
|
||||
### Dung AI de mai dua (prompt mau)
|
||||
|
||||
Ban co the dua y tuong cho AI de:
|
||||
|
||||
- viet lai mo ta cho ro rang hon,
|
||||
- de xuat 3 phien ban "dinh vi san pham" khac nhau,
|
||||
- de xuat 10 cau hoi phong van,
|
||||
- de xuat 3 gia thuyet nguoi dung va cach test.
|
||||
|
||||
Prompt goi y:
|
||||
|
||||
```txt
|
||||
Toi co y tuong san pham sau:
|
||||
[dan noi dung o day]
|
||||
|
||||
Hay giup toi:
|
||||
1. Viet lai thanh 1 cau mo ta ro rang (1-2 cau).
|
||||
2. Liet ke 5 tinh huong nguoi dung that su gap van de.
|
||||
3. Viet 10 cau hoi phong van de kiem chung.
|
||||
4. De xuat 3 phien ban dinh vi san pham khac nhau.
|
||||
```
|
||||
|
||||
## Bai tap
|
||||
|
||||
1. Viet ra 10 noi dau hang ngay ban gap (hoac nguoi than ban be gap).
|
||||
2. Chon 2 noi dau co chi phi ro rang va co nguoi co the phong van ngay.
|
||||
3. Viet 1 cau "dinh nghia san pham" theo mau o tren.
|
||||
4. Viet 10 cau hoi phong van va phong van it nhat 1 nguoi that.
|
||||
|
||||
Khi ban co 3 phan: nguoi dung + boi canh + noi dau, viec dung AI IDE de tao prototype se de hon rat nhieu.
|
||||
@@ -0,0 +1,808 @@
|
||||
---
|
||||
title: 'Thêm năng lực AI cho nguyên mẫu - Kết nối API văn bản và hình ảnh'
|
||||
description: 'Kết nối năng lực AI thật vào nguyên mẫu Web hiện có: hiểu khái niệm cốt lõi của API, học cách tìm API Key và ví dụ chính thức; thực hành tích hợp mô hình văn bản DeepSeek cùng nhiều dịch vụ tạo ảnh như SiliconFlow Qwen-Image, Recraft, Seedream, đồng thời nắm được phương pháp chọn mô hình thường dùng.'
|
||||
---
|
||||
|
||||
<script setup>
|
||||
import { relatedArticlesMap } from '@theme/data/relatedArticles'
|
||||
|
||||
const duration = 'khoảng <strong>1 ngày</strong>'
|
||||
const relatedArticles =
|
||||
relatedArticlesMap['vi-vn/stage-1/integrating-ai-capabilities'] ?? []
|
||||
</script>
|
||||
|
||||
# Sơ cấp 4: Đưa năng lực AI vào nguyên mẫu
|
||||
|
||||
## Dẫn nhập chương
|
||||
|
||||
<ChapterIntroduction :duration="duration" :tags="['API', 'Mô hình văn bản', 'Tạo ảnh từ văn bản', 'Tích hợp nguyên mẫu']" coreOutput="Nguyên mẫu kết nối 1 mô hình văn bản + 1 mô hình hình ảnh tùy chọn" expectedOutput="Nguyên mẫu AI có thể gọi API thật">
|
||||
|
||||
Trong các chương trước, chúng ta đã hoàn thành toàn bộ quy trình từ <strong>tìm ý tưởng tốt</strong> đến <strong>làm ra nguyên mẫu sản phẩm</strong>. Nhưng nguyên mẫu hiện tại vẫn chỉ là một "lớp vỏ": bấm nút không thật sự tạo nội dung, dữ liệu trên trang đều được viết cố định.
|
||||
|
||||
Còn nhớ điều chúng ta nhấn mạnh ở chương đầu không? <strong>Chúng ta muốn làm "sản phẩm có người sẵn sàng trả tiền", chứ không phải "nguyên mẫu nhìn có vẻ ổn".</strong> Giá trị thật đến từ việc sản phẩm có thể <strong>giải quyết vấn đề thật</strong>, và để làm được điều đó, nguyên mẫu phải <strong>thật sự chạy được</strong>.
|
||||
|
||||
Chương này sẽ khiến nguyên mẫu <strong>"sống" dậy</strong>: chúng ta sẽ kết nối <strong>năng lực AI thật</strong>, bắt đầu từ việc lấy API Key, đọc hiểu tài liệu chính thức, rồi để AI IDE giúp bạn tích hợp giao diện vào code. Bạn sẽ dùng <strong>mô hình văn bản DeepSeek</strong> làm ví dụ để học cách khiến ứng dụng <strong>thật sự gọi mô hình lớn để tạo nội dung</strong>; nếu hứng thú, bạn cũng có thể <strong>làm thêm phần kết nối tạo hình ảnh</strong>.
|
||||
|
||||
Học xong chương này, nguyên mẫu của bạn sẽ <strong>không còn là bản demo tĩnh</strong>, mà là <strong>một ứng dụng có thể gọi năng lực AI thật và giải quyết vấn đề thật</strong>.
|
||||
|
||||
</ChapterIntroduction>
|
||||
|
||||
<div style="margin: 50px 0;">
|
||||
<ClientOnly>
|
||||
<StepBar :active="0" :items="[
|
||||
{ title: 'Nền tảng API', description: 'Hiểu khái niệm cốt lõi và quy tắc an toàn' },
|
||||
{ title: 'Kết nối văn bản', description: 'Thực hành tạo văn bản với DeepSeek' },
|
||||
{ title: 'Kết nối hình ảnh', description: 'Hiểu và tạo hình ảnh bằng VLM' }
|
||||
]" />
|
||||
</ClientOnly>
|
||||
</div>
|
||||
|
||||
# 1. Khái niệm cơ bản về API
|
||||
|
||||
Như đã nói ở trên, mục tiêu của chúng ta là "kết nối năng lực AI vào", để nguyên mẫu không còn là bản demo tĩnh mà trở thành công cụ có thể gọi dịch vụ AI thật. Chìa khóa để làm điều đó là hiểu và sử dụng API.
|
||||
|
||||
API là một khái niệm trừu tượng quan trọng trong lĩnh vực máy tính. Có thể hiểu đơn giản là: **bạn "gửi một câu hỏi" theo định dạng đối phương yêu cầu, đối phương sẽ "trả một kết quả" theo định dạng tương ứng**.
|
||||
|
||||
- **Nội dung bạn gửi đi**: thường gồm "khóa (API Key)" và "bạn muốn tạo gì"
|
||||
- **Nội dung đối phương trả về**: thành công thì trả kết quả; thất bại sẽ cho biết nguyên nhân, ví dụ "khóa sai", "không đủ số dư", "tham số viết sai"
|
||||
|
||||
Cụ thể, bạn cần nắm các yếu tố cốt lõi sau:
|
||||
|
||||
1. **API Key**: "thẻ thông hành" của bạn, cũng là "chìa khóa ví tiền". Nếu người khác có được nó, họ có thể gọi API thay bạn và phát sinh chi phí.
|
||||
2. **Endpoint (đường dẫn giao diện)**: đường dẫn cụ thể của yêu cầu API, cho máy chủ biết bạn muốn truy cập chức năng nào. Địa chỉ yêu cầu đầy đủ thường được tạo bởi "URL cơ sở + endpoint". Ví dụ:
|
||||
- Tạo văn bản: URL cơ sở (`https://api.service.com`) + Endpoint (`/v1/chat/completions`) = URL đầy đủ `https://api.service.com/v1/chat/completions`
|
||||
- Tạo hình ảnh: URL cơ sở (`https://api.service.com`) + Endpoint (`/v1/images/generations`) = URL đầy đủ `https://api.service.com/v1/images/generations`
|
||||
3. **Gọi/yêu cầu**: quá trình gửi nhiệm vụ tới dịch vụ AI và nhận kết quả.
|
||||
4. **Nội dung yêu cầu**: nội dung cụ thể bạn gửi cho AI, ví dụ chủ đề bài viết bạn muốn AI viết hoặc mô tả hình ảnh muốn tạo.
|
||||
5. **Kết quả phản hồi**: nội dung AI trả về sau khi xử lý, ví dụ bài viết hoặc hình ảnh được tạo.
|
||||
6. **Xử lý lỗi**: khi có vấn đề như API Key sai hoặc yêu cầu quá thường xuyên, biết cách kiểm tra và giải quyết.
|
||||
|
||||
::: info ℹ️ API là gì
|
||||
Để hiểu sâu hơn về API, hãy xem phụ lục: [Nhập môn API](/vi-vn/appendix/4-server-and-backend/api-intro).
|
||||
|
||||
::: warning 🔐 **Lưu ý an toàn API**
|
||||
API Key là "thẻ thông hành" để bạn yêu cầu dịch vụ AI. Nó là một chuỗi mật khẩu dùng cho xác thực danh tính và tính phí.
|
||||
|
||||
Vì API Key liên quan trực tiếp đến tài khoản và chi phí, hãy đặc biệt chú ý:
|
||||
|
||||
- Tuyệt đối **không chia sẻ trong nhóm chat, không upload ảnh chụp lên mạng** hoặc đăng trên diễn đàn công khai
|
||||
- **Không hardcode vào code** rồi commit lên kho Git, đặc biệt là kho công khai
|
||||
- Nếu nghi ngờ Key đã bị lộ, **hãy đổi Key mới ngay lập tức**
|
||||
|
||||
Trong phần bên dưới, chúng ta sẽ **trực tiếp dán API KEY vào AI IDE để thao tác**. **Trong dự án chính thức đừng làm như vậy!!** Ở đây chỉ làm vì là bài luyện tập. Khi thành thạo hơn, bạn có thể để AI tạo một file cấu hình và chỉ cần đặt API KEY vào file cấu hình đó.
|
||||
:::
|
||||
|
||||
<div style="margin: 50px 0;">
|
||||
<ClientOnly>
|
||||
<StepBar :active="1" :items="[
|
||||
{ title: 'Nền tảng API', description: 'Hiểu khái niệm cốt lõi và quy tắc an toàn' },
|
||||
{ title: 'Kết nối văn bản', description: 'Thực hành tạo văn bản với DeepSeek' },
|
||||
{ title: 'Kết nối hình ảnh', description: 'Hiểu và tạo hình ảnh bằng VLM' }
|
||||
]" />
|
||||
</ClientOnly>
|
||||
</div>
|
||||
|
||||
# 2. Kết nối API tạo văn bản: DeepSeek
|
||||
|
||||
Mặc dù API liên quan đến các khái niệm kỹ thuật này, ở giai đoạn phát triển nguyên mẫu, thao tác thực tế có thể rất đơn giản và hiệu quả. Ý tưởng cốt lõi là:
|
||||
|
||||
> **Tìm ví dụ chính thức, lấy API Key, rồi để AI IDE giúp bạn kết nối nó vào nút bấm.**
|
||||
|
||||
Sau khi nắm được các khái niệm này, bạn sẽ thấy dù kết nối mô hình văn bản hay mô hình hình ảnh, quy trình bản chất đều giống nhau: khi người dùng bấm nút, frontend sắp xếp input và gửi yêu cầu; sau khi API trả kết quả, kết quả được hiển thị lên trang. Tiếp theo, chúng ta sẽ kiểm chứng điều này bằng thao tác thực tế.
|
||||
|
||||
Trong `1.2 Tự tay làm ra nguyên mẫu`, bạn đã tạo được một nguyên mẫu có thể tương tác. Tiếp theo, việc cần làm là biến những chức năng "trông giống AI" trong nguyên mẫu thành năng lực thật sự dùng được: **khi người dùng bấm nút, nguyên mẫu sẽ gửi yêu cầu tới dịch vụ AI bên ngoài và hiển thị văn bản trả về.**
|
||||
|
||||
::: info ℹ️ Mở rộng nguyên lý
|
||||
Nếu muốn hiểu thêm nội dung liên quan đến nguyên lý, hãy xem phụ lục: [Nhập môn mô hình ngôn ngữ lớn (LLM)](/vi-vn/appendix/8-artificial-intelligence/llm-principles).
|
||||
::: details Tìm hiểu thêm: DeepSeek là gì?
|
||||
|
||||
**Hangzhou DeepSeek Artificial Intelligence Basic Technology Research Co., Ltd.**, hoạt động dưới thương hiệu DeepSeek, là một **công ty trí tuệ nhân tạo Trung Quốc phát triển mô hình ngôn ngữ lớn (LLMs)**. DeepSeek đặt trụ sở tại Hàng Châu, Chiết Giang, thuộc sở hữu và được tài trợ bởi quỹ định lượng Trung Quốc High-Flyer. DeepSeek được thành lập vào tháng 7 năm 2023 bởi Liang Wenfeng, đồng sáng lập High-Flyer, người đồng thời là CEO của cả hai công ty. Tháng 1 năm 2025, công ty ra mắt chatbot cùng tên và mô hình DeepSeek-R1.
|
||||
|
||||
Hãy xem DeepSeek so sánh với các mô hình hàng đầu khác trong bảng xếp hạng benchmark GPQA. Điều đáng chú ý là DeepSeek là mô hình open source, tức mọi người đều có thể tải mô hình từ internet, trong khi các mô hình phổ biến khác như Grok, Google Gemini và ChatGPT đều là mô hình đóng. Như có thể thấy, DeepSeek đã tiến rất gần tới nhóm mô hình hàng đầu.
|
||||
|
||||
|
||||
|
||||
GPQA là viết tắt của "Graduate-Level Google-Proof Q&A Benchmark", một benchmark cấp sau đại học cho nhiệm vụ hỏi đáp khoa học. Dưới đây là giới thiệu chi tiết.
|
||||
|
||||
GPQA gồm 448 câu hỏi trắc nghiệm, bao phủ các phân ngành sinh học, vật lý và hóa học như cơ học lượng tử, hóa hữu cơ, sinh học phân tử, v.v. Các câu hỏi này do 61 chuyên gia có bằng tiến sĩ hoặc đang học tiến sĩ biên soạn và đã trải qua quy trình xác minh nghiêm ngặt.
|
||||
:::
|
||||
|
||||
Làm theo 3 bước sau là có thể nhanh chóng tích hợp API tạo nội dung của mô hình lớn:
|
||||
|
||||
1. **Tạo một API Key trên nền tảng DeepSeek**
|
||||
2. **Tìm ví dụ tạo văn bản trong tài liệu DeepSeek** (thường có code sẵn có thể copy trực tiếp)
|
||||
3. **Mở AI IDE, dán API Key + ví dụ chính thức vào**, rồi nói với AI cần thực hiện chức năng gì:
|
||||
> Giúp tôi kết nối API của mô hình lớn này để hỗ trợ nhiệm vụ tạo copy trong ứng dụng này
|
||||
|
||||
Tiếp theo chúng ta sẽ demo. Bạn có thể làm theo toàn bộ quy trình. Trước hết, đăng ký tài khoản [DeepSeek](https://platform.deepseek.com/usage), tạo một API Key và nạp một khoản nhỏ để kiểm thử.
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
Bấm "API KEYS" và tìm "create new API key" ở phía dưới màn hình. Cuối cùng bạn sẽ nhận được một API key có dạng như `sk-8573341c39fc44315aadc071c53rh7d2`.
|
||||
|
||||
|
||||
|
||||
Khi đã có khóa, bạn đã có quyền gọi mô hình.
|
||||
|
||||
Lúc này, bạn có thể đọc trực tiếp tài liệu [API](https://api-docs.deepseek.com/). Tài liệu thường cung cấp ví dụ gọi bằng curl hoặc Python.
|
||||
|
||||
|
||||
|
||||
Sau khi tìm được ví dụ, bạn có thể copy toàn bộ nội dung trong tài liệu cùng với khóa vào hộp thoại của AI IDE, yêu cầu nó giúp bạn tích hợp mô hình ngôn ngữ lớn vào nguyên mẫu đã phát triển trước đó.
|
||||
|
||||
|
||||
|
||||
Bạn có thể tham khảo prompt sau:
|
||||
|
||||
```
|
||||
Hãy tham khảo phương thức gọi này và giúp tôi hỗ trợ chức năng tạo copy. Có thể dựa trên thông tin sản phẩm, sau khi bấm sẽ tạo copy thương mại điện tử Douyin/TikTok tương ứng với nhiều phong cách.
|
||||
|
||||
Tài liệu tham khảo:
|
||||
api key：sk-8573341c39aefa1efe
|
||||
Tham khảo yêu cầu API:
|
||||
curl \
|
||||
-H "Content-Type: application/json" \
|
||||
-H "Authorization: Bearer ${DEEPSEEK_API_KEY}" \
|
||||
-d '{
|
||||
"model": "deepseek-chat",
|
||||
"messages": [
|
||||
{"role": "system", "content": "You are a helpful assistant."},
|
||||
{"role": "user", "content": "Hello!"}
|
||||
],
|
||||
"stream": false
|
||||
}'
|
||||
```
|
||||
|
||||
Sau một thời gian để AI tạo code, chúng ta thường dễ dàng có được nút tạo copy tương ứng để kiểm thử. Nếu không tìm thấy lối vào, bạn có thể yêu cầu AI IDE cho biết có thể bấm tới trang đó từ trang nào; nếu vẫn không tìm thấy, có thể yêu cầu AI IDE trực tiếp refactor và cải tiến theo ý tưởng của bạn để có kết quả tạo copy cuối cùng.
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
Tất nhiên, ở đây bạn có thể hỏi: làm sao biết nó thật sự gọi mô hình lớn chứ không chỉ tích hợp sẵn một phản hồi cố định? Bạn có thể nhập copy tùy chỉnh, để mô hình lớn tạo nội dung tương ứng theo phân tích tùy chỉnh bạn vừa chỉ định.
|
||||
|
||||
Nếu thấy mỗi lần kết quả khác nhau và hợp logic, bạn có thể yên tâm rằng API đã được gọi bình thường để tạo nội dung. Bạn cũng có thể xem trên [nền tảng quản lý sử dụng API](https://platform.deepseek.com/usage) xem cuộc gọi có thành công không, dù có thể phải chờ vài phút mới thấy.
|
||||
|
||||
## Thêm lựa chọn mô hình tạo văn bản
|
||||
|
||||
Ngoài DeepSeek, bạn cũng có thể thử các mô hình ngôn ngữ lớn khác. Vì phần lớn mô hình đều cung cấp **giao diện tương thích OpenAI**, việc chuyển đổi rất đơn giản: chỉ cần thay API Key, URL cơ sở và tên mô hình.
|
||||
|
||||
### Tích hợp MiniMax
|
||||
|
||||
::: details Tìm hiểu thêm: MiniMax là gì?
|
||||
|
||||
**MiniMax** là một công ty trí tuệ nhân tạo Trung Quốc, tập trung vào nghiên cứu và phát triển công nghệ trí tuệ nhân tạo tổng quát. MiniMax đã ra mắt dòng mô hình ngôn ngữ lớn tự phát triển MiniMax-M2.7, thể hiện tốt trên nhiều benchmark và có tỷ lệ hiệu năng/chi phí rất cao.
|
||||
|
||||
**Đặc điểm chính của dòng MiniMax-M2.7:**
|
||||
|
||||
- **Ngữ cảnh siêu dài**: hỗ trợ cửa sổ ngữ cảnh 204,800 tokens, phù hợp xử lý tài liệu dài và hội thoại nhiều lượt
|
||||
- **Hiệu năng/chi phí cao**: giá rất cạnh tranh
|
||||
- **Giao diện tương thích OpenAI**: có thể gọi trực tiếp bằng OpenAI SDK, không cần học thêm định dạng API mới
|
||||
- **Hai mô hình khả dụng**:
|
||||
- `MiniMax-M2.7`: mô hình flagship, phù hợp nhiệm vụ phức tạp
|
||||
- `MiniMax-M2.7-highspeed`: phiên bản tốc độ cao, giữ cùng hiệu năng nhưng nhanh hơn
|
||||
:::
|
||||
|
||||
Cách kết nối giống DeepSeek, chỉ cần ba bước:
|
||||
|
||||
1. Tới [nền tảng mở MiniMax](https://platform.minimax.io/) để đăng ký tài khoản và tạo API Key
|
||||
2. Tìm ví dụ gọi trong tài liệu MiniMax
|
||||
3. Dán API Key + ví dụ vào AI IDE
|
||||
|
||||
Vì MiniMax cung cấp giao diện tương thích OpenAI, bạn có thể copy trực tiếp ví dụ curl dưới đây cùng API Key của mình và gửi cho AI IDE để tích hợp:
|
||||
|
||||
```bash
|
||||
curl https://api.minimax.io/v1/chat/completions \
|
||||
-H "Content-Type: application/json" \
|
||||
-H "Authorization: Bearer ${MINIMAX_API_KEY}" \
|
||||
-d '{
|
||||
"model": "MiniMax-M2.7",
|
||||
"messages": [
|
||||
{"role": "system", "content": "You are a helpful assistant."},
|
||||
{"role": "user", "content": "Hello!"}
|
||||
],
|
||||
"stream": false
|
||||
}'
|
||||
```
|
||||
|
||||
::: tip ✅ Gợi ý
|
||||
Định dạng API của MiniMax gần như giống hệt DeepSeek, đều là định dạng tương thích OpenAI. Vì vậy nếu bạn đã kết nối DeepSeek thành công, chuyển sang MiniMax chỉ cần sửa ba chỗ:
|
||||
1. **URL cơ sở**: đổi thành `https://api.minimax.io/v1`
|
||||
2. **API Key**: dùng API Key của MiniMax
|
||||
3. **Tên mô hình**: đổi thành `MiniMax-M2.7` hoặc `MiniMax-M2.7-highspeed`
|
||||
|
||||
Thông tin thêm xem [tài liệu giao diện tương thích OpenAI của MiniMax](https://platform.minimax.io/docs/api-reference/text-openai-api).
|
||||
:::
|
||||
|
||||
# 3. Tich hop API chuyen hinh anh thanh van ban: Qwen3 VL
|
||||
|
||||
::: info ℹ️ Mo rong nguyen ly
|
||||
Neu ban muon tim hieu them ve nguyen ly lien quan, hay xem phu luc: [Nhap mon mo hinh thi giac-ngon ngu (VLM)](/vi-vn/appendix/8-artificial-intelligence/multimodal-models).
|
||||
|
||||
::: details Tim hieu them: Qwen3 VL la gi?
|
||||
|
||||
**Qwen3 VL** la phien ban moi nhat trong dong mo hinh da phuong thuc thi giac-ngon ngu do doi Tongyi Qianwen cua Alibaba Cloud ra mat. VL la viet tat cua "Vision-Language", tuc mo hinh thi giac-ngon ngu. No co the hieu noi dung hinh anh, tao mo ta bang van ban tu hinh anh, tra loi cau hoi ve hinh anh va trich xuat thong tin trong hinh anh.
|
||||
|
||||
|
||||
|
||||
|
||||
**Cac nang luc chinh cua Qwen3 VL gom:**
|
||||
|
||||
- **Hieu hinh anh**: nhan dien vat the, boi canh, con nguoi, chu viet va cac noi dung khac trong anh.
|
||||
- **Hoi dap thi giac**: tra loi chinh xac cac cau hoi cua nguoi dung ve hinh anh.
|
||||
- **Mo ta hinh anh**: tao mo ta bang van ban chi tiet hoac ngan gon.
|
||||
- **Hieu nhieu hinh anh**: ho tro xu ly dong thoi nhieu hinh anh de so sanh va phan tich.
|
||||
- **Trich xuat van ban**: trich xuat chu tu hinh anh, tuc nang luc OCR.
|
||||
|
||||
**Vi sao chon Qwen3 VL?**
|
||||
|
||||
So voi the he truoc, Qwen3 VL cai thien ro ret do chinh xac khi hieu hinh anh va ho tro cac tac vu phan tich hinh anh dai hon, phuc tap hon. No co hieu nang tot voi tieng Trung, chi phi goi API tuong doi thap va ti le chi phi-hieu qua tot. Ngoai ra, cua so ngu canh lon hon giup no xu ly cac tac vu suy luan thi giac phuc tap hon.
|
||||
|
||||
**Tinh huong ung dung dien hinh:**
|
||||
|
||||
- Thuong mai dien tu: tu dong tao tieu de, mo ta va diem ban hang tu anh san pham.
|
||||
- Sang tao noi dung: tao copy hoac goi y hinh anh tu anh tu lieu.
|
||||
- Van phong: trich xuat noi dung trong anh, tu dong nhan dien bao cao.
|
||||
- Giao duc: tu dong phan tich bai tap dang anh va trich xuat diem kien thuc.
|
||||
|
||||
:::
|
||||
|
||||
Trong phan truoc, chung ta da giai thich cach tich hop API tao van ban. Nhung voi cac tinh huong ung dung o tren, ta se thay mot van de: thu chung ta tai len la mot hinh anh. Neu chi dung mo hinh ngon ngu lon, no khong the hieu tot noi dung trong anh, nen ket qua sinh ra co the sai khac kha nhieu.
|
||||
|
||||
Chung ta can mot mo hinh co the giup bien hinh anh thanh mo ta bang van ban. Day la luc can den mo hinh thi giac-ngon ngu (VLM). Trong vi du nay, chung ta se dung VLM de tao mo ta diem ban hang cua san pham, tu do cai thien trai nghiem nguoi dung.
|
||||
|
||||
De thuan tien, chung ta se dung API do [nen tang dam may SiliconFlow](https://cloud.siliconflow.cn/me) cung cap de tich hop API chuyen hinh anh thanh van ban.
|
||||
|
||||
::: details Tim hieu them: SiliconFlow la gi?
|
||||
**SiliconFlow** la mot nen tang tong hop mo hinh AI pho bien tai Trung Quoc, cung cap dich vu API cho nhieu mo hinh ngon ngu lon va mo hinh thi giac-ngon ngu chu dao.
|
||||
|
||||
**Dac diem nen tang:**
|
||||
|
||||
- **Ho tro nhieu mo hinh**: tich hop nhieu mo hinh AI chu dao, gom cac mo hinh ma nguon mo nhu DeepSeek, Qwen va dong Llama.
|
||||
- **Toi uu ky thuat**: toi uu suy luan cho mo hinh ma nguon mo, cung cap dich vu API do tre thap va kha nang dong thoi cao.
|
||||
- **Tuong thich giao dien**: cung cap API tuong thich dinh dang OpenAI, thuan tien de tich hop vao ung dung hien co.
|
||||
- **Tra theo nhu cau**: ho tro tinh phi theo so lan goi.
|
||||
|
||||
SiliconFlow kha truong thanh ve dich vu suy luan cho cac mo hinh lon ma nguon mo, va la mot lua chon thuong gap khi su dung cac mo hinh AI ma nguon mo trong he sinh thai Trung Quoc.
|
||||
:::
|
||||
|
||||
Khi vao trang chu cua SiliconFlow, ban se thay co rat nhieu mo hinh de lua chon. Tim bo loc o goc tren ben trai, bam mo bo loc va chon nhan thi giac. Ban se thay nhieu mo hinh chuyen hinh anh thanh van ban, vi du GLM-4.6V cua Zhipu hoac Qwen3-VL.
|
||||
|
||||
|
||||
|
||||
Ban co the chon bat ky mo hinh nao de thu. O day chung ta lay `Qwen/Qwen3-VL-8B-Instruct` lam vi du.
|
||||
|
||||
|
||||
|
||||
Vao [nen tang SiliconFlow](https://cloud.siliconflow.cn/me/account/ak), trong phan API key bam "Create API Key" de tao mot API Key moi.
|
||||
|
||||
Ban co the dung truc tiep doan ma duoi day lam ma tham khao, roi gui cung API Key vua tao cho AI IDE de tich hop tinh nang.
|
||||
|
||||
::: details Ma tham khao chuyen hinh anh thanh van ban
|
||||
|
||||
```python
|
||||
from openai import OpenAI
|
||||
from typing import Dict, Any, List
|
||||
import base64
|
||||
import os
|
||||
SILICONFLOW_API_KEY: str = ""
|
||||
SILICONFLOW_BASE_URL: str = "https://api.siliconflow.cn/v1/"
|
||||
MODEL_NAME: str = "Qwen/Qwen3-VL-8B-Instruct"
|
||||
|
||||
def encode_image(image_path: str) -> str:
|
||||
with open(image_path, "rb") as image_file:
|
||||
return base64.b64encode(image_file.read()).decode('utf-8')
|
||||
|
||||
def get_vlm_completion(client: OpenAI, messages: List[Dict[str, Any]]) -> str:
|
||||
response = client.chat.completions.create(
|
||||
model=MODEL_NAME,
|
||||
messages=messages,
|
||||
max_tokens=512,
|
||||
temperature=0.7,
|
||||
top_p=0.7,
|
||||
frequency_penalty=0.5,
|
||||
stream=False,
|
||||
n=1
|
||||
)
|
||||
return response.choices[0].message.content
|
||||
|
||||
def caption_image(image_path: str) -> str:
|
||||
base64_image = encode_image(image_path)
|
||||
messages = [
|
||||
{
|
||||
"role": "user",
|
||||
"content": [
|
||||
{
|
||||
"type": "text",
|
||||
"text": "Please describe this image in detail."
|
||||
},
|
||||
{
|
||||
"type": "image_url",
|
||||
"image_url": {
|
||||
"url": f"data:image/jpeg;base64,{base64_image}"
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
|
||||
client = OpenAI(
|
||||
api_key=SILICONFLOW_API_KEY,
|
||||
base_url=SILICONFLOW_BASE_URL
|
||||
)
|
||||
|
||||
return get_vlm_completion(client, messages)
|
||||
|
||||
image_path = "images.jpg"
|
||||
caption = caption_image(image_path)
|
||||
```
|
||||
|
||||
:::
|
||||
|
||||
Trong tinh huong nay, chung ta thu yeu cau AI IDE giup hien thuc tinh nang tu dong tao van ban diem ban hang thuong mai dien tu va tu khoa tu hinh anh duoc tai len, nhu sau:
|
||||
|
||||
```
|
||||
Du tren API chuyen hinh anh thanh van ban ben duoi, hay giup chung toi hien thuc tinh nang tu dong tao van ban diem ban hang thuong mai dien tu va tu khoa tu hinh anh duoc tai len.
|
||||
|
||||
<Ma duoc luoc bo o day; ban can tu dan key va ma tham khao vao>
|
||||
```
|
||||
|
||||
Cuoi cung, ket qua tao ra nhu sau:
|
||||
|
||||
|
||||
|
||||
|
||||
<div style="margin: 50px 0;">
|
||||
<ClientOnly>
|
||||
<StepBar :active="2" :items="[
|
||||
{ title: 'Nen tang API', description: 'Hieu khai niem cot loi va quy tac bao mat' },
|
||||
{ title: 'Tich hop van ban', description: 'Thuc hanh tao van ban voi DeepSeek' },
|
||||
{ title: 'Tich hop hinh anh', description: 'Hieu va tao hinh anh bang VLM' }
|
||||
]" />
|
||||
</ClientOnly>
|
||||
</div>
|
||||
|
||||
# 4. Tich hop API tao hinh anh: Seedream
|
||||
|
||||
Trong cac phan truoc, chung ta chu yeu lam viec voi tac vu lien quan den van ban. Tiep theo, chung ta se thu tich hop tinh nang tao hinh anh, ho tro tao hinh tu mo ta bang van ban hoac chinh sua hinh anh co san.
|
||||
|
||||
::: info ℹ️ Mo rong nguyen ly
|
||||
Neu ban muon tim hieu them ve nguyen ly lien quan, hay xem phu luc: [Nhap mon tao hinh anh](/vi-vn/appendix/8-artificial-intelligence/image-generation).
|
||||
|
||||
::: details Tim hieu them: [Seedream](https://seed.bytedance.com/en/seedream4_5) la gi?
|
||||
|
||||
|
||||
|
||||
> Co the ban da biet Nano Banana do Google phat trien, nhung Seedream cung rat dang chu y. Seedream 4.5 la the he mo hinh sang tao hinh anh moi do ByteDance xay dung. No tich hop nang luc tao hinh anh va chinh sua hinh anh vao mot kien truc thong nhat, giup xu ly linh hoat cac tac vu da phuong thuc phuc tap nhu tao noi dung dua tren tri thuc, suy luan phuc tap va giu tinh nhat quan voi anh tham chieu. Ngoai ra, toc do suy luan cua no nhanh hon nhieu so voi the he truoc va co the tao anh do phan giai cao an tuong len den 4K.
|
||||
>
|
||||
> 
|
||||
> 
|
||||
|
||||
**Nang luc chinh:**
|
||||
|
||||
- **Van ban thanh hinh anh**: tao hinh anh tu mo ta bang van ban, ho tro nhieu phong cach nhu hien thuc, hoat hinh, thuy mac, cyberpunk.
|
||||
- **Chuyen phong cach**: chuyen mot hinh anh sang phong cach nghe thuat duoc chi dinh.
|
||||
- **Bien the hinh anh**: tao hinh moi co phong cach tuong tu dua tren anh tham chieu.
|
||||
- **Nang do phan giai**: tang do ro va chi tiet cua hinh anh.
|
||||
- **Chinh sua hinh anh**: chinh sua va thay doi hinh anh co san bang chi dan ngon ngu tu nhien.
|
||||
|
||||
**Vi sao chon Seedream?**
|
||||
|
||||
- **Mang noi dia on dinh**: truy cap nhanh va do tre thap tai Trung Quoc.
|
||||
- **Ket qua tot**: on dinh va dang tin trong cac tinh huong thuong mai dien tu va tu lieu hinh anh.
|
||||
- **Toi uu cho tieng Trung**: hieu prompt tieng Trung chinh xac hon, phu hop voi nguoi dung noi dia.
|
||||
- **Toc do nhanh**: hieu suat tao cao, thoi gian phan hoi ngan.
|
||||
- **Chat luong on dinh**: tao hinh anh HD do phan giai toi da 4K.
|
||||
|
||||
**Tinh huong ung dung dien hinh:**
|
||||
|
||||
- Thuong mai dien tu: tao anh chinh, anh trang chi tiet va poster khuyen mai.
|
||||
- Mang xa hoi: tao avatar, sticker va hinh minh hoa.
|
||||
- Thiet ke: nhanh chong tao concept, tu lieu va hinh nen.
|
||||
- Marketing: tao anh quang cao, banner su kien va poster ngay le.
|
||||
|
||||
**Ket hop voi Qwen3 VL:**
|
||||
|
||||
Hai API nay co the dung noi tiep: truoc tien dung Qwen3 VL de phan tich anh tham chieu va hieu noi dung khung hinh; sau do dung Seedream de tao hinh anh moi dua tren prompt duoc rut ra tu phan tich do.
|
||||
:::
|
||||
|
||||
Nhieu "poster AI / anh chinh AI / hinh nhan vat AI" ma ban thay tren Douyin, Bilibili hoac YouTube ve ban chat deu dung cac ky thuat trong phan nay. Viec ban can lam rat don gian: sap xep dau vao cua nguoi dung thanh mot cau, goi API hinh anh, roi hien thi hinh anh tra ve. Mo hinh duoc dung luc nay goi la mo hinh tao hinh anh / chinh sua hinh anh.
|
||||
|
||||
Chung ta se tung buoc minh hoa cach tich hop Seedream API vao du an cua ban, voi su ho tro cua AI IDE.
|
||||
|
||||
Sau khi [truy cap trang chu](https://www.volcengine.com/experience/ark?launch=seedream), bam dang nhap.
|
||||
|
||||
|
||||
|
||||
Sau khi dang nhap, tim tuy chon nap tien o goc tren ben phai.
|
||||
|
||||
|
||||
|
||||
Nap tien can xac minh danh tinh that.
|
||||
|
||||
|
||||
|
||||
Sau khi xac minh thanh cong, ban co the [nap 1 yuan de thu nghiem](https://console.volcengine.com/finance/fund/recharge).
|
||||
|
||||
Quay lai [man hinh ban dau](https://www.volcengine.com/experience/ark?launch=seedream) va bam truy cap API.
|
||||
|
||||
|
||||
|
||||
Truoc tien, tao mot API key, sau do bam tuy chon chon.
|
||||
|
||||
|
||||
|
||||
Thao tac nay se dua ban den buoc 2. Tai day, ban can xac nhan dich vu duoc goi la Seedream 4.5 va sao chep vi du goi duoc cung cap. Anh chup nay kha cu, nen phien ban mo hinh trong anh van hien la 4.0.
|
||||
|
||||
|
||||
|
||||
Sau khi chuan bi API Key va vi du goi, ban co the dan truc tiep chung vao AI IDE de no tao demo tuong tac frontend hoac tich hop nang luc nay vao prototype hien co. Luu y trong giao dien co the chon giua tao hinh tu van ban va tao mot hinh tu nhieu hinh; ban can chon ma tham khao theo nhu cau hien tai.
|
||||
|
||||
::: warning ⚠️ Luu y quan trong
|
||||
Vi du mac dinh o day tuong doi phuc tap. Hay nho tat **"them watermark"** va **"phan hoi streaming"** de dam bao khong tao watermark va tranh loi yeu cau.
|
||||
:::
|
||||
|
||||
Vi sau do chung ta dung che do tao hinh tu anh tham chieu, truoc tien hay vao tinh nang tao mot hinh tu nhieu hinh. Ma tham khao sao chep nhu sau:
|
||||
|
||||
```
|
||||
curl -X POST https://ark.cn-beijing.volces.com/api/v3/images/generations \
|
||||
-H "Content-Type: application/json" \
|
||||
-H "Authorization: Bearer xxxxxxx" \
|
||||
-d '{
|
||||
"model": "doubao-seedream-4-5-251128",
|
||||
"prompt": "Thay trang phuc trong hinh 1 bang trang phuc trong hinh 2",
|
||||
"image": ["https://ark-project.tos-cn-beijing.volces.com/doc_image/seedream4_imagesToimage_1.png", "https://ark-project.tos-cn-beijing.volces.com/doc_image/seedream4_imagesToimage_2.png"],
|
||||
"sequential_image_generation": "disabled",
|
||||
"response_format": "url",
|
||||
"size": "2K",
|
||||
"stream": false,
|
||||
"watermark": true
|
||||
}'
|
||||
```
|
||||
|
||||
Sau khi co ma tham khao ve hinh anh, chung ta yeu cau AI IDE ho tro cac tac vu hinh anh thuong gap trong thuong mai dien tu:
|
||||
|
||||
```
|
||||
Hay dua tren API ben duoi de giup toi hien thuc cac tinh nang thuong gap trong nghiep vu thuong mai dien tu cua du an nay, vi du tao poster, tao anh dau tien cho thuong mai dien tu tren Douyin/TikTok, v.v.
|
||||
|
||||
<Dan API KEY va ma chinh sua hinh anh tai day>
|
||||
```
|
||||
|
||||
Hieu qua hien thuc nhu sau:
|
||||
|
||||
|
||||
|
||||
Can luu y rang tao hinh anh doi khi gap cac loi kho doan. Ban nen yeu cau AI IDE hien thi day du thong bao loi de tien sao chep va sua; neu khong, no co the lien tuc hien "tao hinh that bai" ma khong noi ro ly do. Vi du, ban co the noi:
|
||||
|
||||
```
|
||||
Dung chi hien thi "tao hinh anh that bai"; moi lan hay hien thi day du ly do that bai, vi du hinh anh khong khop, loi yeu cau, timeout, v.v.
|
||||
```
|
||||
|
||||
Do khi sau khi sua, thay doi khong duoc ap dung vao trang web. Neu ban thay trang van bao loi lap di lap lai sau nhieu lan sua, cung co the thu noi truc tiep voi AI IDE: hay khoi dong lai du an nay.
|
||||
|
||||
Trong nghiep vu thuong mai dien tu, co the chung ta muon tu dong mac quan ao nguoi dung tai len len nguoi mau, hoac tu dong tao anh ban hang va poster hap dan cho san pham. O day chung ta thu mot prompt yeu cau no tao poster thuong mai dien tu:
|
||||
|
||||
|
||||
|
||||
Ban co the dung API van ban thanh hinh anh hoac hinh anh thanh hinh anh de hien thuc cac tinh nang khac nhau theo kich ban kinh doanh ma ban hinh dung.
|
||||
|
||||
## Them cac lua chon dich vu hinh anh khac
|
||||
|
||||
Duoi day la mot so lua chon khac. Ban nen chay thong ket qua tao hinh bang Qwen truoc, sau do dua tren ket qua va chi phi de thay bang cac dich vu ben duoi, tuy theo trai nghiem thuc te.
|
||||
|
||||
### Tich hop Recraft
|
||||
|
||||
Neu prototype cua ban nghieng ve "san xuat thiet ke", vi du tao minh hoa theo phong cach thuong hieu, poster marketing hoac tu lieu vector, Recraft thuong se thuan tay hon. Cach tich hop hoan toan giong phan truoc: **lay Key + tim vi du chinh thuc + yeu cau AI IDE dua vi du vao nut/trang cua ban**.
|
||||
|
||||
::: details Tim hieu them: Recraft la gi?
|
||||
|
||||
> Recraft la mot cong cu AI danh cho nha thiet ke, hoa si minh hoa va nhan su marketing. Cong ty duoc thanh lap tai My nam 2022 va co tru so tai London. No giup tao va lap lai hieu ung thi giac nhu hinh anh, vector art va do hoa 3D, voi cac uu diem nhu dau ra chat luong cao, dat vi tri thanh phan chinh xac va thiet ke nhat quan voi thuong hieu. Recraft duoc hon 3 trieu nguoi dung tai 200 quoc gia va vung lanh tho tin dung, bao gom Ogilvy va Netflix, va da tao hon 350 trieu hinh anh. Doi ngu cua ho huong toi bien Recraft thanh cong cu thiet yeu cho nha thiet ke, giup nha sang tao kiem soat workflow duoc AI ho tro.
|
||||
>
|
||||
> 
|
||||
> 
|
||||
|
||||
Truoc tien, chung ta van can tim [cong API](https://www.recraft.ai/profile/api) de lay API Key.
|
||||
|
||||
Vi o day khong co han muc mien phi, chung ta can tu nap 1,000 credits. Trang nay ho tro Alipay va WeChat Pay, nen lay 1,000 credits kha de. Luu y: dung nap qua so tien can thiet.
|
||||
|
||||
|
||||
|
||||
Sau do, chung ta van lam theo cung mot cach: vao tai lieu chinh thuc va tim vi du yeu cau tuong ung:
|
||||
|
||||
- <https://www.recraft.ai/docs/api-reference/getting-started>
|
||||
- <https://www.recraft.ai/docs/api-reference/usage>
|
||||
- <https://www.recraft.ai/docs/api-reference/guides>
|
||||
|
||||
:::
|
||||
|
||||
### Tich hop Qwen Image / Qwen Image Edit
|
||||
|
||||
Neu ban muon tich hop dich vu tao hinh anh theo cach don gian hon, co the can nhac Qwen Image. Tu duy van khong doi: xem no nhu mot "API tao hinh anh" va noi vao nut trong prototype cua ban.
|
||||
|
||||
::: details Tim hieu them: Qwen Image / Qwen Image Edit la gi?
|
||||
|
||||
**Qwen Image** la dong mo hinh tao hinh anh do doi Tongyi cua Alibaba Cloud ra mat, chu yeu gom hai mo hinh:
|
||||
|
||||
**1. Qwen Image: mo hinh van ban thanh hinh anh (Text-to-Image)**
|
||||
|
||||
Tao hinh anh hoan toan moi dua tren mo ta bang van ban. Ban nhap mot prompt, mo hinh se hieu y dinh cua ban va tao hinh anh phu hop voi mo ta.
|
||||
|
||||
|
||||
|
||||
**Nang luc chinh:**
|
||||
|
||||
- **Van ban thanh hinh anh**: tao hinh anh tu mo ta bang van ban, ho tro nhieu phong cach nhu hien thuc, hoat hinh, thuy mac, cyberpunk.
|
||||
- **Chuyen phong cach**: chuyen mot hinh anh sang phong cach nghe thuat duoc chi dinh.
|
||||
- **Bien the hinh anh**: tao hinh moi co phong cach tuong tu dua tren anh tham chieu.
|
||||
- **Nang do phan giai**: tang do ro va chi tiet cua hinh anh.
|
||||
|
||||
**2. Qwen Image Edit: mo hinh hinh anh thanh hinh anh (Image-to-Image)**
|
||||
|
||||
Chinh sua va thay doi hinh anh co san. Thong qua chi dan ngon ngu tu nhien, mo hinh hieu y dinh chinh sua cua ban va tao ket qua.
|
||||
|
||||
**Nang luc chinh:**
|
||||
|
||||
- **Thay the cuc bo**: thay mot vat the hoac nhan vat trong anh, vi du "doi nen thanh bai bien".
|
||||
- **Loai bo phan tu**: xoa cac phan tu khong can thiet trong anh.
|
||||
- **Chuyen doi phong cach**: them bo loc hoac hieu ung nghe thuat cho anh.
|
||||
- **Mo rong hinh anh**: mo rong bien anh va tao noi dung moi.
|
||||
- **Chinh anh thong minh**: tu dong lam dep, dieu chinh anh sang bong do va sua loi.
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
**Vi sao chon dong Qwen Image?**
|
||||
|
||||
- **Toi uu cho tieng Trung**: hieu prompt tieng Trung chinh xac hon, phu hop voi nguoi dung noi dia.
|
||||
- **Chi phi thap**: re hon so voi nhieu doi thu quoc te.
|
||||
- **Toc do nhanh**: hieu suat tao cao, thoi gian phan hoi ngan.
|
||||
- **Chat luong on dinh**: hoat dong dang tin trong thuong mai dien tu va cac tinh huong tu lieu hinh anh.
|
||||
- **Da dang phong cach**: ho tro nhieu phong cach nghe thuat va hieu ung sang tao.
|
||||
|
||||
**Tinh huong ung dung dien hinh:**
|
||||
|
||||
- Thuong mai dien tu: tao anh chinh, anh trang chi tiet va poster khuyen mai.
|
||||
- Mang xa hoi: tao avatar, sticker va hinh minh hoa.
|
||||
- Thiet ke: nhanh chong tao concept, tu lieu va hinh nen.
|
||||
- Marketing: tao anh quang cao, banner su kien va poster ngay le.
|
||||
:::
|
||||
|
||||
Hay xem trang chinh thuc cua [SiliconFlow](https://siliconflow.cn/). Ben trai co phan "Playground", noi ban co the thu cac mo hinh khac nhau ma khong can goi API. O dau trang co nut "Filters"; bam vao do de loc danh sach mo hinh ben phai.
|
||||
|
||||
Neu ban chon "Image", ban se chi thay cac mo hinh van ban thanh hinh anh hien duoc ho tro. Trong truong hop nay, chung ta se dung Qwen/Qwen-Image.
|
||||
|
||||
|
||||
|
||||
Sau khi cau hinh xong, chung ta can tham khao tai lieu API tao hinh anh tuong ung. Tren trang tai lieu chinh thuc, ban co the tim phan duoc danh dau "API Reference". Bam vao do, sau do di den [phan API tao hinh anh](https://docs.siliconflow.cn/cn/api-reference/images/images-generations) va tim vi du yeu cau lien quan.
|
||||
|
||||
Ban co the gui vi du yeu cau duoi day cung API KEY cho AI IDE de hien thuc tinh nang tao hinh anh.
|
||||
|
||||
```bash
|
||||
curl --request POST \
|
||||
--url https://api.siliconflow.cn/v1/images/generations \
|
||||
--header 'Authorization: Bearer <token>' \
|
||||
--header 'Content-Type: application/json' \
|
||||
--data '
|
||||
{
|
||||
"model": "Qwen/Qwen-Image-Edit-2509",
|
||||
"prompt": "an island near sea, with seagulls, moon shining over the sea, light house, boats int he background, fish flying over the sea"
|
||||
}
|
||||
'
|
||||
```
|
||||
|
||||
Mo hinh o day co the dung Qwen/Qwen-Image hoac Qwen/Qwen-Image-Edit-2509.
|
||||
|
||||
::: details Ma tham khao chinh sua hinh anh
|
||||
|
||||
Sao chep doan ma va key duoi day, roi gui chung cho AI IDE:
|
||||
|
||||
```python
|
||||
import requests
|
||||
import os
|
||||
from typing import Dict, Any, Optional
|
||||
|
||||
SILICONFLOW_API_KEY: str = ""
|
||||
SILICONFLOW_BASE_URL: str = "https://api.siliconflow.cn/v1/images/generations"
|
||||
QWEN_IMAGE_EDIT_MODEL: str = "Qwen/Qwen-Image-Edit-2509"
|
||||
|
||||
def generate_image_edit(
|
||||
prompt: str,
|
||||
image: Optional[str] = None,
|
||||
image2: Optional[str] = None,
|
||||
image3: Optional[str] = None,
|
||||
negative_prompt: Optional[str] = None,
|
||||
cfg: Optional[float] = 4.0,
|
||||
seed: Optional[int] = None
|
||||
) -> Optional[Dict[str, Any]]:
|
||||
payload: Dict[str, Any] = {
|
||||
"model": QWEN_IMAGE_EDIT_MODEL,
|
||||
"prompt": prompt,
|
||||
}
|
||||
if image:
|
||||
payload["image"] = image
|
||||
if image2:
|
||||
payload["image2"] = image2
|
||||
if image3:
|
||||
payload["image3"] = image3
|
||||
if negative_prompt:
|
||||
payload["negative_prompt"] = negative_prompt
|
||||
if cfg is not None:
|
||||
payload["cfg"] = cfg
|
||||
if seed is not None:
|
||||
payload["seed"] = seed
|
||||
|
||||
headers: Dict[str, str] = {
|
||||
"Authorization": f"Bearer {SILICONFLOW_API_KEY}",
|
||||
"Content-Type": "application/json"
|
||||
}
|
||||
|
||||
try:
|
||||
response = requests.post(SILICONFLOW_BASE_URL, json=payload, headers=headers)
|
||||
response.raise_for_status()
|
||||
return response.json()
|
||||
except requests.exceptions.RequestException as e:
|
||||
print(f"Error generating image: {e}")
|
||||
return None
|
||||
|
||||
def save_image_from_url(image_url: str, output_path: str = "image.png") -> bool:
|
||||
try:
|
||||
response = requests.get(image_url)
|
||||
response.raise_for_status()
|
||||
os.makedirs(os.path.dirname(output_path) if os.path.dirname(output_path) else ".", exist_ok=True)
|
||||
with open(output_path, "wb") as f:
|
||||
f.write(response.content)
|
||||
print(f"Image saved successfully to: {output_path}")
|
||||
return True
|
||||
except requests.exceptions.RequestException as e:
|
||||
print(f"Error downloading image: {e}")
|
||||
return False
|
||||
except Exception as e:
|
||||
print(f"Error saving image: {e}")
|
||||
return False
|
||||
|
||||
prompt: str = "Bien bau troi thanh canh chieu toi, co mat trang va cac vi sao, phong cach mong ao"
|
||||
negative_prompt: str = "mo, chat luong thap, bien dang"
|
||||
image_url: str = "https://inews.gtimg.com/om_bt/Os3eJ8u3SgB3Kd-zrRRhgfR5hUvdwcVPKUTNO6O7sZfUwAA/641"
|
||||
image2_url: Optional[str] = None
|
||||
image3_url: Optional[str] = None
|
||||
|
||||
cfg: float = 4.0
|
||||
seed: int = 12345
|
||||
output_path: str = "edited_image.png"
|
||||
|
||||
print(f"Generating edited image with prompt: {prompt}")
|
||||
print(f"Input image: {image_url}")
|
||||
print(f"CFG: {cfg}, Seed: {seed}")
|
||||
print("-" * 50)
|
||||
|
||||
result = generate_image_edit(
|
||||
prompt=prompt,
|
||||
image=image_url,
|
||||
image2=image2_url,
|
||||
image3=image3_url,
|
||||
negative_prompt=negative_prompt,
|
||||
cfg=cfg,
|
||||
seed=seed
|
||||
)
|
||||
|
||||
if result and "images" in result:
|
||||
images = result["images"]
|
||||
if images and len(images) > 0:
|
||||
image_url_result = images[0]["url"]
|
||||
print(f"Image edit generated successfully. URL: {image_url_result}")
|
||||
success = save_image_from_url(image_url_result, output_path)
|
||||
if success:
|
||||
print(f"Image saved to: {output_path}")
|
||||
else:
|
||||
print("Failed to save image to local file")
|
||||
else:
|
||||
print("No images found in response")
|
||||
else:
|
||||
print("Image generation failed")
|
||||
if result:
|
||||
print(f"Response: {result}")
|
||||
```
|
||||
|
||||
:::
|
||||
|
||||
# Phu luc: cach tim mo hinh AI "manh hon hien tai"
|
||||
|
||||
Mo hinh van ban, thuong duoc goi la "mo hinh ngon ngu lon", phat trien rat nhanh. Chung ta luon can dam bao minh dang dung mot trong nhung mo hinh co hieu nang tot hon. Thong qua hai trang web duoi day, ban co the de dang xem mo hinh nao hien duoc nhieu nguoi dung va danh gia tot.
|
||||
|
||||
Noi chung, ban co the hieu loai trang nay nhu **"dau truong mo hinh"**: no dat dau ra cua hai mo hinh canh nhau, roi ban bo phieu cho cai ban thich hon. Mo hinh co nhieu phieu hon thuong co nghia la nhieu nguoi thay no "de dung hon".
|
||||
|
||||
Ngoai ra, doi khi ban co the thay cac mo hinh an danh bi an, nhu "Unknown Model", trong cac dau truong mo hinh lon nay. Dieu do thuong co nghia la ai do da am tham dua "mo hinh thu nghiem noi bo" vao de thu nghiem mu, va ban co the co co hoi trai nghiem nang luc manh hon som hon.
|
||||
|
||||
## LMArena
|
||||
|
||||
Trang web: <https://lmarena.ai/>
|
||||
|
||||
LMArena phu hop hon de danh gia "phan tra loi cua mo hinh nao duoc da so nguoi thich hon". Cang nhieu phieu va diem cang cao, no thuong cang on dinh trong tinh huong su dung thuc te.
|
||||
|
||||
Mot cach dung don gian la:
|
||||
|
||||
1. Xem truc tiep bang xep hang (Leaderboard)
|
||||
2. Chon truoc huong ban can lam, vi du hoi thoai tong quat / lap trinh / thi giac
|
||||
3. Chon mot mo hinh trong Top 3 ma ban co the dung, tuc co the truy cap, gia chap nhan duoc va do tre chap nhan duoc
|
||||
|
||||
|
||||
|
||||
## Artificial Analysis
|
||||
|
||||
Trang web: <https://artificialanalysis.ai/>
|
||||
|
||||
Artificial Analysis phu hop hon de so sanh "chat luong / gia / toc do" trong cung mot bang. Ban co the xem no nhu bang tham so de chon mo hinh.
|
||||
|
||||
Cach dung thuong gap la:
|
||||
|
||||
1. Tim danh muc mo hinh ban quan tam, vi du van ban / tao hinh anh
|
||||
2. Xem chi so chat luong (Quality) + gia (Price) + do tre/thong luong (Latency/Throughput)
|
||||
3. Chon mo hinh co "ti le chi phi-hieu qua tong the" phu hop nhat voi san pham cua ban
|
||||
|
||||
::: tip ✅ Goi y
|
||||
Dung tranh luan "mo hinh nao manh hon" chi bang cam tinh. Cach dang tin hon la dung cung mot tap dau vao de thu 2-3 mo hinh, sau do ket hop bang xep hang va gia de quyet dinh.
|
||||
:::
|
||||
|
||||
## Tong ket
|
||||
|
||||
Khi tich hop cac loai dich vu AI, khong can hinh dung API qua phuc tap. Neu nam duoc vai khai niem cot loi duoi day, ban co the xu ly phan lon tinh huong:
|
||||
|
||||
**Ban chat cua API la cau noi giao tiep**. No lam mot viec rat don gian: gui yeu cau cua ban ra ngoai, roi mang phan hoi cua mo hinh ve. Ban khong can quan tam dieu gi xay ra phia sau, chi can to chuc dung dinh dang yeu cau.
|
||||
|
||||
**SDK la lop dong goi tren API**. Neu API la giao dien raw, thi SDK la mot hop cong cu co san. No xu ly san cac chi tiet phien phuc nhu ky yeu cau, xu ly loi va kiem tra tham so. Trong phat trien hang ngay, uu tien dung SDK thay vi goi API truc tiep se tiet kiem nhieu rac roi.
|
||||
|
||||
**Khi doc tai lieu, chi can nhin ky ba thu**: dia chi dich vu (endpoint), thong tin xac thuc (API key) va cach dien tham so goi. Lam ro ba diem nay thi viec chay thong chi con la van de thoi gian.
|
||||
|
||||
Phan viec con lai, IDE va cac cong cu phat trien hien dai se ho tro ban hoan thanh. Hay tap trung vao logic nghiep vu cua minh, con viec goi tang thap thi giao cho cac SDK va toolchain truong thanh nay.
|
||||
|
||||
# 5. 📚 Bai tap: tich hop nang luc AI dau tien cua ban
|
||||
|
||||
<el-card shadow="hover" style="margin: 20px 0; border-radius: 12px;">
|
||||
<template #header>
|
||||
<div style="font-weight: bold; font-size: 16px;">🚀 Thu thach: tich hop nang luc AI vao workspace cua ban</div>
|
||||
</template>
|
||||
|
||||
<p>
|
||||
Tham khao prompt va noi dung cua bai nay, hoan thanh mot vong khep kin:
|
||||
</p>
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<strong>Thuc hanh vong khep kin day du</strong>
|
||||
<ul>
|
||||
<li>Chon va tich hop mot dich vu AI (LLM / van ban thanh hinh anh / hinh anh thanh hinh anh) → hien thuc tuong tac frontend-backend → tich hop vao prototype cua ban</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<strong>Chia se ket qua</strong>
|
||||
<ul>
|
||||
<li>Chup man hinh trang tinh nang cua ban va chia se voi moi nguoi</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<strong>Cau hoi suy nghi</strong>
|
||||
<ul>
|
||||
<li>Chuan bi cho phan tiep theo "thuc hanh du an hoan chinh": hay nghi truoc ban se ket hop cac nang luc AI nay nhu the nao va muon tao tinh nang thu vi gi.</li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</el-card>
|
||||
|
||||
## Buoc tiep theo
|
||||
|
||||
Trong phan tiep theo, chung ta se noi cac nang luc AI rieng le nay lai voi nhau va ket hop voi mot tinh huong kinh doanh thuc te de xay dung mot san pham hoan chinh:
|
||||
|
||||
- Noi cac buoc nhu lap ke hoach noi dung, dang san pham va phan tich du lieu thanh mot quy trinh kinh doanh hoan chinh
|
||||
- Nhung cac nang luc AI hoc trong bai nay, nhu tao copy bang LLM, van ban thanh hinh anh va chinh sua hinh anh, vao cac nut nghiep vu thuc te
|
||||
- Hien thuc mot "workspace AI cho thuong mai dien tu" that su dung duoc, thay vi mot demo rieng le
|
||||
|
||||
<RelatedArticlesSection
|
||||
title="Bai viet lien quan"
|
||||
description="Lo trinh hoc de xuat tu nang luc AI don diem den quy trinh san pham hoan chinh."
|
||||
:items="relatedArticles"
|
||||
/>
|
||||
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,275 @@
|
||||
---
|
||||
title: 'Từ ý tưởng đến sản phẩm AI - Lộ trình học tập Easy-Vibe'
|
||||
description: 'Lộ trình học tập lập trình AI hoàn chỉnh: từ người mới bắt đầu đến phát triển full-stack. Làm chủ Vibe Coding, Claude Code, Cursor và các công cụ AI IDE, học tư duy sản phẩm, phát triển full-stack và tích hợp năng lực AI.'
|
||||
---
|
||||
|
||||
<script setup>
|
||||
import { relatedArticlesMap } from '@theme/data/relatedArticles'
|
||||
|
||||
const relatedArticles = relatedArticlesMap['vi-vn/stage-1/learning-map'] ?? []
|
||||
</script>
|
||||
|
||||
# Từ ý tưởng đến sản phẩm AI
|
||||
|
||||
::: info Lời cảm ơn đặc biệt
|
||||
Đặc biệt cảm ơn các bạn sinh viên đến từ **Viện Nghiên cứu Sinh viên Quốc tế Đại học Thanh Hoa, Thâm Quyến** đã thử nghiệm, phản hồi và ủng hộ khóa học này! Những ý kiến và đóng góp của các bạn đã giúp khóa học trở nên tốt hơn. [👉 Xem danh sách người đóng góp đầy đủ](https://github.com/datawhalechina/easy-vibe#-contributing--contributors)
|
||||
:::
|
||||
|
||||
Trước đây, làm phần mềm có rào cản rất cao: bạn phải biết lập trình, biết thuật toán, và phải có kinh nghiệm dự án nhiều năm.
|
||||
Bây giờ thì khác. Chỉ cần bạn có ý tưởng, AI có thể giúp bạn viết code.
|
||||
|
||||
Đây là một sự thay đổi lớn: **Ngôn ngữ lập trình đang trở thành ngôn ngữ tự nhiên**.
|
||||
|
||||
Sự xuất hiện của mô hình ngôn ngữ lớn (LLM) khiến phát triển không còn là "đặc quyền của chuyên gia kỹ thuật", mà trở thành công cụ mà ai cũng có thể sử dụng. Điều khó nhất trước đây là "cách viết code", bây giờ điều khó nhất là "**Bạn muốn làm gì**".
|
||||
|
||||
> **Vibe Coding là gì?**
|
||||
> Nói đơn giản, đó là "lập trình bằng cách nói chuyện". Vibe coding có nghĩa là bạn có thể dựa vào việc chỉ đối thoại với AI, thay vì viết code trực tiếp, để hoàn thành dự án lập trình.
|
||||
|
||||
Tất nhiên, để AI viết ra code chỉ là bước đầu tiên. Để tạo ra một sản phẩm thực sự sử dụng được, bạn sẽ gặp những vấn đề này:
|
||||
- Làm sao để AI viết code sạch, có thể bảo trì?
|
||||
- Làm sao để ghép các đoạn code rời rạc thành một ứng dụng chạy được?
|
||||
- Làm sao để ứng dụng thực sự trực tuyến, được người khác sử dụng?
|
||||
- Làm sao để đưa các năng lực AI như tạo văn bản, nhận dạng hình ảnh vào sản phẩm của bạn?
|
||||
|
||||
Những câu hỏi này sẽ tìm thấy câu trả lời trong khóa học này.
|
||||
|
||||
Dù bạn là học sinh, giáo viên, bác sĩ, công nhân, hay bất kỳ ai không biết gì về kỹ thuật -- không cần học lập trình vài năm, chỉ hai tuần đã có thể tạo ra nguyên mẫu sản phẩm chạy được, demo được.
|
||||
|
||||
| Vai trò của bạn | Khóa học này giúp bạn |
|
||||
|---------|-------------|
|
||||
| Học sinh | Bài tập, thi đấu, khởi nghiệp, tự tay làm dự án, không cần cầu cứu ai |
|
||||
| Người đi làm | Tự động hóa công việc lặp đi lặp lại, nâng cao hiệu suất, thậm chí phát triển nghề tay trái |
|
||||
| Quản lý sản phẩm / Nhà thiết kế | Ý tưởng không còn dừng lại trên giấy, có thể nhanh chóng tạo Demo cho sếp/khách hàng xem |
|
||||
| Doanh nhân / Chủ doanh nghiệp nhỏ | Xác minh ý tưởng với chi phí thấp, không cần chi hàng vạn tệ thuê outsource mà vẫn tạo được MVP |
|
||||
| Giáo viên / Nhà giáo dục | Tạo công cụ giảng dạy, bài giảng, tự động hóa việc ra đề, nâng cao hiệu quả giảng dạy |
|
||||
| Bác sĩ / Luật sư / Chuyên gia | Tự động hóa quy trình chuyên môn, tạo công cụ hiệu suất của riêng mình |
|
||||
| Bất kỳ ai | Dùng AI giải quyết các vấn đề cụ thể trong cuộc sống/công việc, biến điều không thể thành có thể |
|
||||
|
||||
Trong kỷ nguyên AI, năng lực thực thi và ý tưởng luôn quan trọng hơn kỹ thuật.
|
||||
|
||||
## Lộ trình phát triển: Từ "biết dùng AI" đến "biết làm sản phẩm AI"
|
||||
|
||||
<div class="stage-intro">
|
||||
<div class="stage-card">
|
||||
<div class="stage-icon">🎮</div>
|
||||
<h3>Người mới bắt đầu</h3>
|
||||
<p class="stage-role">Trải nghiệm lập trình AI</p>
|
||||
<div class="stage-tags">
|
||||
<span>Trò chơi rắn săn mồi nhỏ</span>
|
||||
<span>Bắt đầu từ con số 0</span>
|
||||
<span>Trải nghiệm Vibecoding lần đầu</span>
|
||||
<span>Tạo trong vài phút</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="stage-grid">
|
||||
<div class="stage-card">
|
||||
<div class="stage-icon">🛠️</div>
|
||||
<h3>Giai đoạn một</h3>
|
||||
<p class="stage-role">Quản lý sản phẩm / Vận hành</p>
|
||||
<div class="stage-tags">
|
||||
<span>AI IDE (Cursor/Claude)</span>
|
||||
<span>Phân tách nhu cầu & Nguyên mẫu</span>
|
||||
<span>Tích hợp năng lực AI</span>
|
||||
<span>Phát triển Demo hoàn chỉnh</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="stage-card">
|
||||
<div class="stage-icon">💻</div>
|
||||
<h3>Giai đoạn hai</h3>
|
||||
<p class="stage-role">Phát triển trung cấp / Nhà phát triển độc lập</p>
|
||||
<div class="stage-tags">
|
||||
<span>Từ Figma đến code</span>
|
||||
<span>Cơ sở dữ liệu Supabase</span>
|
||||
<span>Tích hợp thanh toán Stripe</span>
|
||||
<span>Cơ sở tri thức Dify</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="stage-card">
|
||||
<div class="stage-icon">🚀</div>
|
||||
<h3>Giai đoạn ba</h3>
|
||||
<p class="stage-role">Phát triển cấp cao / Kiến trúc sư</p>
|
||||
<div class="stage-tags">
|
||||
<span>Web/Mini program/Đa nền tảng</span>
|
||||
<span>Công cụ MCP nâng cao</span>
|
||||
<span>RAG & LangGraph</span>
|
||||
<span>Tư duy kỹ sư cao cấp</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.stage-intro {
|
||||
margin: 20px auto;
|
||||
max-width: 400px;
|
||||
}
|
||||
|
||||
.stage-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
|
||||
gap: 12px;
|
||||
margin: 16px 0;
|
||||
}
|
||||
|
||||
.stage-card {
|
||||
border: 1px solid var(--vp-c-divider);
|
||||
border-radius: 10px;
|
||||
padding: 12px;
|
||||
background-color: var(--vp-c-bg-soft);
|
||||
transition: all 0.3s ease;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.stage-card:hover {
|
||||
transform: translateY(-2px);
|
||||
background-color: var(--vp-c-bg-mute);
|
||||
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.05);
|
||||
border-color: var(--vp-c-brand);
|
||||
}
|
||||
|
||||
.stage-icon {
|
||||
font-size: 2rem;
|
||||
margin-bottom: 8px;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.stage-card h3 {
|
||||
margin: 0 0 4px 0 !important;
|
||||
font-size: 1rem;
|
||||
font-weight: 600;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
.stage-role {
|
||||
margin: 0 0 8px 0 !important;
|
||||
font-size: 0.8rem;
|
||||
color: var(--vp-c-text-2);
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.stage-tags {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
gap: 4px;
|
||||
}
|
||||
|
||||
.stage-tags span {
|
||||
font-size: 0.7rem;
|
||||
padding: 1px 6px;
|
||||
border-radius: 3px;
|
||||
background-color: var(--vp-c-bg-alt);
|
||||
color: var(--vp-c-text-2);
|
||||
border: 1px solid var(--vp-c-divider);
|
||||
}
|
||||
|
||||
.stage-card:hover .stage-tags span {
|
||||
background-color: var(--vp-c-bg);
|
||||
border-color: var(--vp-c-brand-dimm);
|
||||
color: var(--vp-c-brand-dark);
|
||||
}
|
||||
</style>
|
||||
|
||||
Thông qua lộ trình học tập hoàn chỉnh này, bạn sẽ đạt được:
|
||||
|
||||
- **Năng lực phát triển Vibe Coding:** Sử dụng thành thạo tư duy vibecoding và công cụ lập trình AI, nâng cao hiệu suất phát triển gấp nhiều lần. Không cần học thuộc cú pháp, mà học cách dẫn dắt AI tạo code chất lượng cao.
|
||||
- **Kỹ năng phát triển full-stack:** Từ thiết kế UI đến thực hiện front-end, từ thiết kế cơ sở dữ liệu đến phát triển API, từ phát triển cục bộ đến triển khai đám mây, làm chủ ngăn xếp công nghệ hoàn chỉnh của ứng dụng Web hiện đại.
|
||||
- **Tích hợp năng lực AI:** Học cách gọi các loại API AI đa phương thức, tích hợp mượt mà các năng lực AI như văn bản, hình ảnh, giọng nói vào ứng dụng của bạn, và xây dựng sản phẩm thông minh thông qua các công nghệ như RAG.
|
||||
- **Tư duy sản phẩm và năng lực vận hành:** Từ nghiên cứu người dùng đến phân tách nhu cầu, từ thiết kế MVP đến lặp lại sản phẩm, từ tích hợp thanh toán đến quản lý người dùng, hình thành vòng lặp hoàn chỉnh phát triển và vận hành sản phẩm.
|
||||
|
||||
# Học xong có thể làm gì?
|
||||
|
||||
## Giai đoạn một: Tạo nguyên mẫu sản phẩm đầu tiên của bạn
|
||||
|
||||
Giai đoạn này phù hợp với những bạn hoàn toàn không có nền tảng lập trình, hoặc chỉ biết một chút nhưng không tự tin lắm. Bạn không cần học trước một đống lý thuyết, mà trực tiếp làm theo, trong quá trình làm học cách dùng công cụ AI để viết code.
|
||||
|
||||
**Sau khi học xong bạn có thể**:
|
||||
- Dùng công cụ lập trình AI độc lập hoàn thành một ứng dụng web
|
||||
- Biến ý tưởng sản phẩm thành nguyên mẫu có thể click, có thể tương tác
|
||||
- Thêm chức năng AI cho nguyên mẫu (như tạo ảnh từ văn bản, trò chuyện thông minh)
|
||||
- Khi gặp lỗi biết cách khắc phục và giải quyết
|
||||
|
||||
Nói đơn giản, là có thể tạo ra một thứ "chạy được, demo cho người khác xem được".
|
||||
|
||||
Chúng ta có thể trước tiên trải nghiệm lập trình AI thông qua trò chơi nhỏ, sau đó học cách dùng công cụ lập trình AI giúp bạn viết code, sửa lỗi. Tiếp theo bắt đầu từ trang đơn giản, từng bước tạo ứng dụng đa trang có thể tương tác, rồi thêm các chức năng AI như tạo ảnh từ văn bản, trò chuyện thông minh. Cuối cùng độc lập hoàn thành một dự án hoàn chỉnh, để ý tưởng sáng tạo của bạn thực sự có khả năng thực hiện.
|
||||
|
||||
# Tại sao phải dùng phương pháp dự án để đào tạo?
|
||||
|
||||
> **Thử thách trong thế giới thực**
|
||||
>
|
||||
> Lý do thực ra rất đơn giản: theo tình trạng hiện tại của đa số các bạn, nếu trực tiếp bước vào nơi làm việc, rất có thể sẽ gặp khó khăn dưới sự "đòn roi xã hội" từ dự án thực tế và sếp / khách hàng. Kịch bản phổ biến hơn trong thế giới thực là:
|
||||
|
||||
> Cố vấn / Sếp của bạn: Chúng ta cần làm một xxx, mục tiêu là đạt được hiệu quả yyy.
|
||||
>
|
||||
> Tài liệu? Framework sẵn có? Mô tả nhu cầu chi tiết? Rất nhiều khi không tồn tại.
|
||||
|
||||
Nhiều nhiệm vụ trong công việc thực tế, bản chất là giải quyết những vấn đề chưa từng gặp trong môi trường có độ không chắc chắn cao: nhu cầu mơ hồ, ranh giới thay đổi, không ai cho bạn đáp án chuẩn, bạn cần tự tra cứu tài liệu, làm thử nghiệm, xây nguyên mẫu, liên tục lặp lại, cuối cùng đưa ra giải pháp "chạy được, dùng được, có thể trực tuyến".
|
||||
|
||||
Khóa học này muốn làm chính là trong một môi trường tương đối an toàn, trước mắt cho bạn một "mô phỏng đòn roi xã hội":
|
||||
|
||||
- Thông qua các nhiệm vụ dự án có vẻ hơi khó, buộc bạn luyện tập phân tách vấn đề, thiết kế phương án, tự tìm tài liệu
|
||||
- Thông qua scaffold và code không quá "dễ dãi", giúp bạn học cách đọc, hiểu và cải tạo một code base cỡ lớn-trung bình
|
||||
- Thông qua vòng lặp hoàn chỉnh từ ý tưởng đến trực tuyến, giúp bạn trải nghiệm toàn bộ quá trình từ 0 đến 1 của sản phẩm thực tế
|
||||
|
||||
Ngắn hạn mà nói, loại đào tạo này quả thực khá tra tấn; nhưng về dài hạn, nó sẽ cực kỳ nâng cao năng lực cạnh tranh của bạn trong tìm việc và phát triển nghề nghiệp: bạn sẽ chịu đựng áp lực tốt hơn, dễ tìm ra đột phá trong môi trường không chắc chắn hơn, và có năng lực biến AI thành sản phẩm thực sự triển khai, thay vì dừng lại ở mức "chơi Demo".
|
||||
|
||||
# Nghệ thuật đặt câu hỏi: Kỹ năng tất yếu trong kỷ nguyên AI
|
||||
|
||||
Trong kỷ nguyên AI, đặt câu hỏi cũng là một "năng lực cơ bản". Cùng một đoạn code, cùng một lỗi, **cách bạn đặt câu hỏi, gần như quyết định loại câu trả lời AI có thể đưa ra**: là nói chung chung, hay từng bước đưa ra cách sửa khả thi.
|
||||
|
||||
**Hãy tạo thói quen tốt**: Coi "hỏi AI" là một phần của quy trình phát triển hàng ngày: khi gặp vấn đề không hiểu, bị kẹt thì lập tức hỏi.
|
||||
|
||||
## Tại sao đây là kỹ năng tất yếu?
|
||||
|
||||
- **Thực tế hiếm khi có tài liệu hoàn chỉnh**: Phần nhiều lúc bạn đối mặt với nhu cầu không rõ ràng, code bán thành phẩm, thông tin lỗi rời rạc
|
||||
- **AI là cố vấn + đồng nghiệp bên cạnh bạn**: Người biết đặt câu hỏi, có thể biến nó thành "lập trình cặp chất lượng cao"
|
||||
- **Giới hạn năng lực do giao tiếp quyết định**: Bạn càng cung cấp thông tin quan trọng, càng ràng buộc định dạng đầu ra, câu trả lời càng sử dụng được
|
||||
|
||||
**Hiểu lầm phổ biến**: Chỉ hỏi một câu "tại sao báo lỗi?" thường chỉ nhận được một loạt phỏng đoán. Bổ sung đầy đủ ngữ cảnh, mới nhận được phương án khả thi.
|
||||
|
||||
## Cách đưa thông tin cho AI: Chụp màn hình hay sao chép dán
|
||||
|
||||
Cả hai cách đều được, nhưng mục đích khác nhau:
|
||||
|
||||
| Cách | Kịch bản phù hợp | Yêu cầu chính |
|
||||
| ------------ | ----------------------------------------- | ----------------------------------------- |
|
||||
| **Sao chép dán** | Stack lỗi, log, code, cấu hình, API trả về | Càng đầy đủ càng tốt, đừng chỉ cắt một dòng từ khóa |
|
||||
| **Chụp màn hình** | Vấn đề bố cục UI, tương tác bất thường, không tìm thấy nút trên giao diện công cụ | Chụp toàn màn hình + đánh dấu vùng trọng điểm, tốt nhất kèm một câu giải thích bằng chữ |
|
||||
|
||||
::: danger ⚠️ Điều kiện tiên quyết quan trọng
|
||||
**Không phải AI nào cũng hỗ trợ đầu vào hình ảnh.** Giao tiếp bằng chụp màn hình cần AI có năng lực đa phương thức (tức là có thể hiểu và phân tích hình ảnh). Hiện tại các AI hỗ trợ đầu vào hình ảnh bao gồm: Claude (Anthropic), GPT-4V/GPT-4o (OpenAI), Gemini (Google), và một số mô hình lớn trong nước như Tongyi Qianwen, Wenxin Yiyan, v.v.
|
||||
|
||||
**Nếu AI bạn sử dụng không hỗ trợ đầu vào hình ảnh**, chụp màn hình sẽ không được nhận dạng, lúc này xin hãy dùng cách sao chép dán văn bản để giao tiếp.
|
||||
:::
|
||||
|
||||
## Mẹo prompt khiến AI "giải thích rất tốt"
|
||||
|
||||
Nếu bạn không chỉ muốn câu trả lời, mà muốn "học được" câu trả lời. Sử dụng chỉ dẫn tương tự như dưới đây có thể nâng cao chất lượng giải thích đáng kể:
|
||||
|
||||
> **Ví dụ câu hỏi kiểu học tập**
|
||||
>
|
||||
> - "Xin hãy dùng 5 câu nói rõ khái niệm này, sau đó đưa vài câu hỏi kiểm tra tôi đã hiểu đúng chưa."
|
||||
> - "Xin hãy giải thích chi tiết thông tin lỗi này, tôi không hiểu tại sao lại báo lỗi."
|
||||
|
||||
# Kiên trì lâu rồi vẫn không xong, tôi muốn bỏ cuộc
|
||||
|
||||
Có thể là phương pháp kiên trì của bạn không đúng. Đừng một mình cố gắng trong bóng tối, có thể đến trò chuyện với tác giả và trợ giảng: thành thật nói ra những phương pháp bạn đã thử, điểm kẹt cụ thể bạn gặp phải, và trạng thái tâm lý hiện tại của bạn. Rất nhiều lúc, chỉ cần hơi điều chỉnh hướng đi, bổ sung một kiến thức trọng điểm, bạn lại có thể tiếp tục tiến lên phía trước.
|
||||
|
||||
# Tôi thấy thiết kế của giáo trình có chỗ không hợp lý
|
||||
|
||||
Hoan nghênh bất cứ lúc nào liên hệ tác giả, nộp issue, hoặc phản hồi trực tiếp trong nhóm / lớp học. Chúng tôi rất mong cùng bạn mài giũa bộ giáo trình này ngày càng tốt hơn: chỗ nào không rõ ràng, chỗ nào trải nghiệm không tốt, chỗ nào khiến bạn lãng phí công sức, đều có thể thẳng thắn chỉ ra. Phản hồi càng chân thực, càng cụ thể, càng giúp những người sau ít vấp ngáp hơn.
|
||||
|
||||
# Tài liệu tham khảo
|
||||
|
||||
- [Khoa Khoa học Máy tính và Công nghệ, Đại học Nam Kinh - Thí nghiệm cơ sở hệ thống máy tính](https://nju-projectn.github.io/ics-pa-gitbook/ics2025/)
|
||||
|
||||
<RelatedArticlesSection
|
||||
title="Tiếp theo có thể học gì"
|
||||
description="Theo lộ trình 'từ biết dùng AI đến biết làm sản phẩm', tiếp tục tiến lên phía trước."
|
||||
:items="relatedArticles"
|
||||
/>
|
||||
Reference in New Issue
Block a user