Build một AI language tutor nói chuyện được, trong 6 bước

Sáu bước Peter Yang build Tabi, app dạy tiếng Nhật qua cuộc gọi live với Gemini: brainstorm, spec có thiết kế, build, lặp với AI, làm bài học, deploy.

Đã duyệt độc lập · cập nhật 23/10/2026 · 18 min

1. Giọng nói và Tabi, một app dạy tiếng Nhật qua cuộc gọi

Video được Google tài trợ, theo mô tả video đăng ngày 05/10/2026.

Peter Yang mở đầu bằng một nhận định của anh (video đăng ngày 05/10/2026): giọng nói sẽ sớm trở thành cách mặc định để tất cả chúng ta tương tác với máy tính. Trong video này anh chỉ cách build một AI language coach, một "huấn luyện viên ngôn ngữ" dạy bạn tiếng Nhật qua một cuộc hội thoại trực tiếp bằng giọng nói. App tên là Tabi, và video mở bằng một đoạn giới thiệu ngắn cho thấy app hoạt động ra sao: trang chào "Speak Japanese on your trip", chọn một tình huống ("Pick a moment", mười phrase cho một tình huống thật, từ ga tàu tới quán ramen), gọi cho Yuki, rồi "sống" trong cảnh đó.

Màn hình nhập vai của Tabi: lồng đèn đỏ, bubble của nhân viên báo giá 4.200 yên, bubble của người học nói cảm ơn bữa ăn
Đoạn giới thiệu "Then you live the scene." trong video đăng ngày 05/10/2026: một cảnh quán ăn với lồng đèn đỏ. Nhân viên (Staff) nói "四千二百円です。" (Yonsen nihyaku-en desu, "That's 4,200 yen."), tới lượt người học nói "ごちそうさまでした。" (Gochisōsama deshita, "Thank you for the meal."). Góc trên ghi "9/10 nailed" và một con dấu "NAILED", thanh dưới là cuộc gọi đang chạy với Yuki.

Sau đoạn giới thiệu (video đăng ngày 05/10/2026), Peter nói hy vọng nó đã làm người xem hào hứng, và anh sẽ chỉ chính xác cách build app này trong sáu bước: khám phá ý tưởng với AI, viết spec và thiết kế, build bản đầu tiên, cải thiện app, cải thiện các bài học, và cuối cùng là launch.

Bộ công cụ của video (video đăng ngày 05/10/2026): app dùng live API của Gemini cho phần hội thoại, Nano Banana để vẽ hình, còn Antigravity và Claude Code để build app. Theo Peter, live API của Gemini về cơ bản thuộc hàng đầu cho hội thoại và nói trực tiếp, và anh dẫn một biểu đồ cho nhận định đó; đây là nhận định của anh trong video đăng ngày 05/10/2026.

2. Một vòng quanh app: màn hình chính và cuộc gọi với Yuki

Trước khi build, Peter cho xem nhanh app sẽ làm ra (bản demo trong video đăng ngày 05/10/2026). Màn hình chính có 10 bài học, mỗi bài mở ra được và có một bức hình diorama mà anh gọi là "really awesome" cho từng bài. Rồi anh gọi cho Yuki, language coach của app, cho bài số một.

Màn hình chính của Tabi: Your Japan trip, 15 trên 100 phrase, bài 1 Everyday phrases có hình diorama và nút Call Yuki
Màn hình chính "Your Japan trip" chạy ở localhost trong video đăng ngày 05/10/2026: thanh tiến độ "15 of 100 phrases nailed", bài 1 "Everyday phrases" đang mở với hình diorama một cửa hàng góc phố Nhật, "9/10 nailed" và nút "Call Yuki · Practice again". Bên dưới là các bài 2 "Asking for help", 3 "Numbers and prices", 4 "Asking for what you want".

Cuộc gọi bắt đầu (bản demo trong video đăng ngày 05/10/2026), và giọng của app (Yuki) nói: chào bạn, ta bắt đầu với cách nói "chào buổi sáng" trong tiếng Nhật. Đây là một câu chào cố định, và ta thêm "gozaimasu" để nó lịch sự. Nghe kỹ nhé: "Ohayou gozaimasu". Giờ bạn thử đi. Peter nói theo "Ohayou gozaimasu", và app khen "Perfect!", rồi nhắc thêm: mọi nguyên âm trong tiếng Nhật luôn được đọc giống nhau.

Tiếp theo (vẫn trong cuộc gọi demo của video đăng ngày 05/10/2026), app dạy cách đơn giản nhất để nói "có": chỉ một âm tiết, "Hai". App bảo "Go ahead", Peter nói "Hai", app đáp "Nice work". Sau đó app chuyển sang phần nhập vai: giờ ta sẽ sống một ngày ở Tokyo, tôi sẽ đóng vai mọi người bạn gặp. App nói "Ohayou gozaimasu" trong vai nhân viên khách sạn, giải thích rằng nhân viên khách sạn vừa chào buổi sáng, và bảo Peter chào lại. Peter chào lại "Ohayou gozaimasu". App ra tình huống kế: có người đang chắn vỉa hè, hãy lịch sự nói "xin lỗi".

Peter dừng đoạn demo (video đăng ngày 05/10/2026) ở đó và nói anh không chắc về cách phát âm tiếng Nhật của mình, nhưng hy vọng đoạn này cho người xem hình dung về app sẽ build.

3. Mỗi bài học có hai bước: học phrase rồi nhập vai

Peter giải thích cách anh thiết kế bài học trong bản app của video đăng ngày 05/10/2026: có hai bước. Bước một, app dạy bạn đủ 10 phrase của bài. Bước hai, app dẫn bạn qua một cuộc hội thoại thật, nơi bạn trao đổi qua lại và luyện lại 10 phrase đó một lần nữa.

Một bài học trong Tabi (thiết kế của Peter) 1. Coach Yuki dạy lần lượt 10 phrase 2. Role-play hội thoại thật, luyện lại 10 phrase cùng 10 phrase, luyện hai lần
Hình 3.1Cấu trúc mỗi bài học Peter mô tả (video đăng ngày 05/10/2026): phần coach dạy 10 phrase trước, rồi phần nhập vai dùng lại đúng 10 phrase đó trong một cuộc hội thoại qua lại.

Đó là phần giới thiệu nhanh. Peter thêm rằng (video đăng ngày 05/10/2026), như bạn có thể hình dung, app này dùng lại được cho bất kỳ ngôn ngữ nào khác mà bạn muốn học. Rồi anh vào phần chính: cách build app, bắt đầu với bước một là khám phá ý tưởng với AI.

4. Bước 1: khám phá ý tưởng với AI, chưa build gì cả

Theo Peter (video đăng ngày 05/10/2026), khi bắt đầu một project mới thì luôn nên brainstorm với AI trước, để chốt được vấn đề của người dùng mà bạn đang cố giải quyết và giải pháp trông như thế nào. Anh cho xem prompt anh dùng để bắt đầu, gõ trong một project tên language-app.

Nội dung prompt: anh sắp đi Nhật và muốn build một web app thân thiện với điện thoại, dạy anh 100 phrase mà một người đi du lịch thật sự dùng. App nên có 10 bài, mỗi bài 10 phrase. Trước đó anh đã build một app khác tên Tastemaker để chọn phim và show truyền hình theo gu của anh, và anh rất thích phong cách và thẩm mỹ của app đó. Nên trong prompt, anh bảo AI đi xem app kia và làm theo look and feel của nó. Rồi cùng xác định các màn hình chính: một màn hình journey hay path cho thấy tiến độ qua 10 bài, và một màn hình bài học có các text bubble cùng một nút gọi để bật live voice. Anh cũng nói muốn build bằng Gemini, dùng Nano Banana cho hình các cảnh, và các model giọng nói, âm thanh tốt nhất mà Gemini có (yêu cầu của anh trong prompt, video đăng ngày 05/10/2026).

Và điều rất quan trọng ở bước một, theo Peter (video đăng ngày 05/10/2026): anh dặn AI đừng build gì cả. Hãy research trước, rồi hỏi anh ba câu để làm rõ. Prompt đầy đủ trên màn hình:

I'm going to Japan and want to build a phone-friendly web app that teaches me the 100 phrases a traveler actually uses.

1. It should have 10 lessons with 10 phrases each. Each lesson is a real situation, like ordering at a ramen shop, grouped into clear categories like Common phrases and Food.
2. Open https://tastemaker-xi.vercel.app/ and follow its look and feel. The key screens are a journey or path screen showing my progress through the 10 lessons, and a lesson screen. The lesson screen shows a nice image to set the scene, then text message bubbles, and a call button to turn on live voice. Basically the idea is through live voice I'll learn the phrases live.
3. I want to build this with Gemini, including Nano Banana for the scene images and the best voice and audio models. Google launched several new ones in September, so research what's available now.

Don't build anything yet. Do some research and ask me up to 3 questions.
Prompt bước một trong project language-app, bên dưới là thẻ tastemaker-xi.vercel.app đã mở trong browser
Prompt khám phá ý tưởng trong project language-app, ô chọn model ghi Opus 5.5, Medium (video đăng ngày 05/10/2026). Bên dưới prompt là thẻ "tastemaker-xi.vercel.app · Opened in Browser" và dòng "Ran a command, browsed the web, fetched 6 pages": AI đã mở app Tastemaker để xem phong cách.

5. AI research gì và ba câu hỏi nó hỏi lại

Kết quả (trong video đăng ngày 05/10/2026): AI đã research và tìm ra look and feel của app Tastemaker để làm theo. Nó cũng research các model Gemini và thấy Google vừa launch một model live voice mới có thể dùng. Ngoài ra còn một model khác cho việc chạm vào từng speech bubble để nghe câu đó, và tất nhiên là Nano Banana cho phần hình.

Bảng Gemini models (as of Sep 26, 2026) với ba việc: live voice call, tap-to-hear và scene images
Bảng AI tổng hợp, tiêu đề "Gemini models (as of Sep 26, 2026)", tức các thông tin dưới đây đúng tính đến 26/09/2026 theo chính bảng này. Live voice call: gemini-3.8-live (GA ngày 15/09), độ trễ thấp, có thể ngắt lời giữa câu; bảng ghi bản "Extended Thinking" suy luận nhiều hơn nên trả lời chậm hơn và không giúp luyện phrase; giá $0.005/phút cho audio của bạn và $0.018/phút cho audio của model, nên một bài 20 phút khoảng $0.50. Tap-to-hear: gemini-3.8-flash-tts (GA ngày 22/09), hơn 2.000 giọng, tạo 100 clip một lần rồi lưu lại. Scene images: Nano Banana 2 (gemini-3.1-flash-image), mười hình tạo một lần, tốn vài xu. Bên dưới, bảng còn lưu ý docs chưa ghi rõ tiếng Nhật cho model Live, và API key phải nằm ngoài điện thoại, dùng ephemeral token.

Ở cuối, AI hỏi anh ba câu (video đăng ngày 05/10/2026). Câu một: một cuộc gọi live nên có cảm giác thế nào? Peter trả lời: trước tiên coach anh 10 phrase, rồi nhập vai qua lại để luyện. Câu hai: mỗi phrase bubble nên viết thế nào? Anh chọn cả hai: tiếng Nhật, Romaji và tiếng Anh. Câu ba: ai sẽ dùng app này?

Với câu ba, Peter giải thích: vì app dùng Gemini API, mà dùng thứ này thì tốn tiền, và anh không định kiếm tiền từ app, nên lúc đầu anh chỉ định build cho bản thân và vài người bạn. Theo anh, đây chính là điểm chung của app ngày nay: bạn có thể build những app cá nhân như thế này, và chúng rất hữu ích để giải quyết vấn đề của chính bạn (nhận định của Peter trong video đăng ngày 05/10/2026). Trên màn hình, AI tóm lại các lựa chọn "coach then roleplay, Japanese + romaji + English on each bubble, and a personal app just for you" và đưa một bản nháp 10 bài chia theo nhóm: Common phrases, Getting around, Food, Stay and shop, Just in case.

Về cơ bản đó là bước một: khám phá vấn đề. Peter nói (video đăng ngày 05/10/2026) anh có thể trao đổi qua lại thêm, nhưng giờ chuyển sang bước hai.

6. Bước 2: viết spec kèm thiết kế màn hình bằng spec skill

Bước hai là viết spec và thiết kế. Peter dùng spec skill của anh (video đăng ngày 05/10/2026) để soạn cả phần chữ của spec lẫn hai, ba màn hình chính giúp app "sống" lên. Anh kể spec skill của mình trước đây chỉ tạo ra một tài liệu yêu cầu sản phẩm (product requirements document), loại mà một product manager điển hình hay làm. Nhưng sau đó anh cập nhật nó để tạo thêm vài bản thiết kế, vì anh không có designer. Anh muốn skill làm vài bản mockup để anh dễ phản hồi và thấy app trông ra sao.

Lệnh anh gõ trên màn hình (video đăng ngày 05/10/2026):

/spec Draft a spec for this with 2 key screen designs. Also draft a lesson.md file for lesson 1.

Trên màn hình (video đăng ngày 05/10/2026), AI trả lời rằng phần research và các câu trả lời đã đủ để viết spec, nó build spec.html thành một file local để build agent đọc thẳng từ project, kèm file nội dung bài 1. Nó báo các màn hình render tốt nhưng cột Product dài quá 900px nên nó cắt bớt chữ, rồi kiểm lại layout ở bề rộng desktop và điện thoại, cả hai theme. Cuối cùng spec và file lessons/01-airport/lesson.md sẵn sàng, file bài 1 chứa 10 phrase, kịch bản chat, prompt cho hình, hướng dẫn coach cho Yuki, chỉ đạo giọng nói và ghi chú văn hoá.

Rồi Peter mở spec ra. Đây là thứ spec skill tạo ra trong video đăng ngày 05/10/2026: vài màn hình tiêu biểu cho thấy app trông thế nào trên điện thoại, và bên cạnh là phần yêu cầu sản phẩm, tech stack sẽ dùng, các API sẽ gọi, và vân vân.

File spec.html của Tabi: ba màn hình điện thoại Onboarding, Path, Lesson in a call và cột Product bên phải
Spec "tabi · 100 Japanese phrases for your trip, learned by talking" ở chế độ Phone (video đăng ngày 05/10/2026): ba màn hình Onboarding ("Speak Japanese on your trip", ô passcode, nút Start learning), Path ("Your Japan trip", 6 trên 100 phrase) và Lesson in a call (bubble tiếng Nhật, Romaji, tiếng Anh, thanh gọi Yuki). Cột phải là tab Product: Problem, Solution, Goal, các yêu cầu R1 tới R13 và mục Open decisions.

7. Thiết kế desktop, màn hình onboarding và vì sao spec có hình

Trong video đăng ngày 05/10/2026, Peter cũng đã góp ý để AI làm cả bản thiết kế cho điện thoại lẫn desktop. Anh chuyển sang tab Desktop để xem bản desktop của ba màn hình: onboarding, path và lesson. Anh thấy thế này khá tuyệt.

Theo ý anh, đây là một bản spec tốt hơn nhiều so với một đống yêu cầu đơn thuần: được nhìn thấy thiết kế giúp anh hiểu ngay lập tức app sẽ là gì. Quay lại cuộc trò chuyện với AI, anh cho thấy các góp ý anh đã gửi: thêm bản thiết kế desktop, thêm một màn hình onboarding. Trên màn hình (video đăng ngày 05/10/2026), tin của anh ghi "Can you also add to spec: 1. Desktop designs for the same screens 2. Onboarding screen for desktop and mobile", kèm câu "Let's call the app Tabi or some similar name." AI trả lời các màn hình desktop và onboarding đã được thêm và nó đang kiểm cách chúng render. Tin kế của anh nhờ thêm ba milestone vào phần tech để build đủ app.

Ở tab Tech của spec (trên màn hình, video đăng ngày 05/10/2026), tech stack ghi: app Next.js trên Vercel giống Tastemaker, live voice bằng gemini-3.8-live nối thẳng từ điện thoại tới Google, khoảng $0.50 cho một cuộc gọi 20 phút; một Vercel function kiểm passcode rồi cấp token ngắn hạn để API key không bao giờ tới điện thoại; audio cho bubble bằng gemini-3.8-flash-tts; hình cảnh bằng Nano Banana 2; và các milestone bắt đầu từ "Voice proof".

8. Human review: sửa thẳng và góp ý trên spec

Tiếp theo Peter chạy human review skill của anh. Với skill này (theo video đăng ngày 05/10/2026), anh có thể sửa trực tiếp và góp ý thẳng trên spec. Anh gõ /human-review cho file spec.html.

Human review mở spec ra, kèm một panel Feedback ở bên phải (bản demo trong video đăng ngày 05/10/2026). Ở đây anh có thể sửa thẳng phần chữ. Ví dụ anh sửa mô tả vấn đề thành: Peter cần luyện nói to 100 phrase du lịch cho chuyến đi, gói thành 10 bài, mỗi bài 10 phrase.

Anh cũng có thể góp ý thẳng trên thiết kế và sửa thiết kế trực tiếp (bản demo trong video đăng ngày 05/10/2026). Ví dụ anh đổi tiêu đề màn hình path thành "100 phrases for Japan". Anh cũng có thể chọn một đoạn chữ hay một khung nào đó rồi ghi: cập nhật bài này để nói về đồ ăn thay vì nội dung cũ.

Spec mở trong human review: tiêu đề màn hình Path đang được sửa thành 100 phr, panel Feedback bên phải có nút Send 1 to agent
Spec mở trong human review (video đăng ngày 05/10/2026): tiêu đề màn hình Path đang được gõ lại thành "100 phr…", mô tả Problem đã có thêm câu "Package it into 10 lessons with 10 phrases each." Panel bên phải ghi "Your edits 1 · Everyday phrases" và nút "Send 1 to agent".

Theo Peter (video đăng ngày 05/10/2026), về cơ bản đây là một giao diện kiểu Google Docs: anh có thể sửa trực tiếp, hoặc góp ý cho AI bằng cách thêm comment, rồi gửi feedback để AI agent bắt đầu làm.

9. Tự làm một spec skill đơn giản

Peter gợi ý (video đăng ngày 05/10/2026): nếu bạn muốn tự làm spec skill của riêng mình, chỉ cần bảo AI làm hai, ba màn hình chính, rồi viết product requirements và tech stack ở cột bên phải. Theo anh, kết quả có thể không tinh tế bằng skill anh đang dùng, nhưng đó là một khởi đầu rất tốt.

Spec tự làm: màn hình bên trái, yêu cầu bên phải Màn hình 1 Màn hình 2 Màn hình 3 Product requirements Tech stack
Hình 9.1Bố cục spec theo gợi ý của Peter (video đăng ngày 05/10/2026): hai hoặc ba màn hình chính để nhìn thấy app, cột bên phải chứa yêu cầu sản phẩm và tech stack.

10. Bước 3: build bản đầu trong Google Antigravity

Bước ba là build bản đầu của app. Khi đã có spec gồm cả mockup lẫn yêu cầu, anh chỉ cần bảo AI đi build app. Lần này Peter chuyển sang Google Antigravity, vì theo anh (video đăng ngày 05/10/2026) Antigravity hiểu các API của Google tốt nhất.

Prompt anh đưa (video đăng ngày 05/10/2026) chỉ là: xem spec và thử build ra một app đầy đủ, rồi cứ làm đi. Trên màn hình, câu anh gõ là:

Look at the spec in the repo and see if you build out the full app, starting with milestone 1.

Antigravity bắt đầu build. Trên màn hình (video đăng ngày 05/10/2026), nó tạo trước một implementation plan cho Milestone 1: Voice Proof, nêu những điểm cần chú ý: Milestone 1 cần GEMINI_API_KEY và APP_PASSCODE trong file .env.local, và model đích có thể cấu hình qua GEMINI_LIVE_MODEL. Peter bấm Proceed với plan đó.

11. Gemini API key: lấy ở AI Studio, dán vào file env

Một điểm rất quan trọng của app này: vì dùng voice API của Google, ta phải đưa Gemini API key vào thì app mới chạy được. Cách làm Peter chỉ (video đăng ngày 05/10/2026): vào Google AI Studio (aistudio.google.com), mở mục API keys, tạo một API key mới, rồi copy key đó. Nhưng đừng dán nó vào công cụ AI; hãy dán tạm vào một notepad trên máy.

Rồi quay lại Antigravity, bảo nó mở file env (cách làm trong video đăng ngày 05/10/2026) để thêm API key. Nó sẽ mở file env của bạn, tức file chứa mọi API key bí mật, và bạn dán API key thẳng vào file đó.

Antigravity mở file .env.local theo yêu cầu, hướng dẫn thêm key ở dòng 2
Trong Antigravity (video đăng ngày 05/10/2026), sau phần walkthrough của Milestone 1 (23 file thay đổi), Peter gõ "open env for me to add the api key". Antigravity trả lời đã mở .env.local, bảo thêm key ở dòng 2 với dòng mẫu GEMINI_API_KEY=your_gemini_api_key_here, và hỏi có muốn chạy dev server hay thử một cuộc gọi live không.

Peter nhấn mạnh (video đăng ngày 05/10/2026): bạn không muốn dán API key thẳng vào khung chat, vì ai biết được, có thể nó sẽ bị dùng để train hoặc bị lộ ở đâu đó. Hãy dán thẳng vào file env để an toàn. Rất quan trọng. Và vì anh đã để lộ API key trong video này, anh xoá luôn key đó vì không muốn nó bị lộ.

Anh dán API key vào, và theo lời anh, Antigravity về cơ bản đã build bản đầu của app trong một lần chạy (one shot), trong bản demo của video đăng ngày 05/10/2026.

12. Bước 4: quay về Claude Code để sửa lỗi micro

Bước bốn là lặp lại với AI để cải thiện chính app. Để làm việc này, Peter chuyển lại sang Claude Code, vì theo anh (video đăng ngày 05/10/2026) nó có browser và computer use, nên nó tự test được app.

Vấn đề đầu tiên (trong bản build của video đăng ngày 05/10/2026): app không nhận giọng của anh, tức là có gì đó sai với micro. Hoá ra lỗi là app đang nghe micro của MacBook, trong khi anh có một micro riêng mà app lẽ ra phải chuyển sang. Claude Code đi sửa lỗi đó. Peter lưu ý rằng trong lúc sửa, nó thật sự tự đi qua app, nghe giọng nói và kiểm xem mọi thứ có chạy không.

Claude Code báo hai bug trong code cuộc gọi và các thay đổi khác về model và bảo mật
Báo cáo của Claude Code trên màn hình (video đăng ngày 05/10/2026): browser pane chặn micro nên nó cấp cho app một micro giả để test phần còn lại. Bug 1: app vứt bỏ mọi phản hồi từ Google vì Google gửi dữ liệu nhị phân, code trong live-session.ts bỏ qua nên cuộc gọi kẹt ở "Connecting". Bug 2: gemini-3.8-live không nhận audio gửi theo định dạng cũ (mediaChunks), app chuyển sang định dạng audio mới. Ngoài ra app đang dùng gemini-2.5-flash-native-audio-latest thay vì model trong spec nên được đổi lại, và một lỗi bảo mật (lỡ gửi API key thật ra browser khi lấy token ngắn hạn thất bại) đã được sửa.

Nhưng tất nhiên sẽ còn nhiều feedback nữa. Theo Peter (video đăng ngày 05/10/2026), đây là giai đoạn dài nhất, nếu bạn quan tâm tới craft và chất lượng.

13. Feedback về chat bubble và tốc độ phản hồi

Thêm vài góp ý Peter đưa ra về bản build trong video đăng ngày 05/10/2026: ở phần dạy, tại sao các chat bubble không cập nhật khi anh học phrase mới? App đang hiện tất cả chat bubble cùng lúc thay vì hiện từng cái một, và như thế gây rối. Rồi tốc độ phản hồi có vẻ chậm, và vân vân. Trên màn hình, tin feedback của anh có ba ý:

Feedback:
1. in the teaching phase: why aren't the chat bubbles updating as i learn new phrases? i think the chat bubbles should only highlight the actual phrases 1-10. Also saying "phase 1" and "phase 2" over and over again is redundant and not conversational
2. in the conversation phase: the prompts aren't great "step into a corner shop" I have no idea what to say, you need to give hints in the chat bubbles.
3. The response rate seems to slow down in the conversation phase

Trên màn hình (video đăng ngày 05/10/2026), Claude Code trả lời đã lần ra cả ba bug: phần tô sáng bubble chỉ dựa vào dấu "nailed" của phần nhập vai nên không cập nhật ở phần dạy, lời của Yuki không báo phrase nào đang được học, và phản hồi chậm vì Yuki dừng chờ sau mỗi tín hiệu "nailed". Nó đề xuất cho Yuki phát tín hiệu đổi phrase mà không dừng lại, rồi tự đo độ trễ sau các lần gọi tool. Rồi nó đi sửa hết các bug này.

14. Ảnh diorama bằng Nano Banana và chân dung Yuki

Một thứ khác Peter muốn sửa trong bản build của video đăng ngày 05/10/2026: app đang dùng những hình xấu (anh gọi là "crappy images") thay vì thật sự tạo hình bằng model Nano Banana của Gemini. Nên anh chuyển lại sang Antigravity và bảo nó dùng Nano Banana để thay hình bằng ảnh thật, và nói anh rất thích phong cách diorama. Anh cho xem một ví dụ: một mô hình thu nhỏ trông như thứ bạn có thể đặt trên bàn làm việc, rất dễ thương.

Anh xem lại và bảo hình này trông rất ổn, giờ hãy làm hình diorama tương tự cho cả 10 bài. Trên màn hình (video đăng ngày 05/10/2026), Antigravity lập một bảng "The 10 Lesson Dioramas": bài 1 là một cửa hàng góc phố Tokyo với mái gỗ, rèm noren đỏ, lồng đèn và máy bán nước tự động; bài 2 là góc phố gần ga; bài 3 là quầy thanh toán konbini; bài 5 là sân ga tàu; bài 6 là quầy lễ tân khách sạn. Kết quả cuối thấy được trong app: mỗi cảnh có một bức diorama dễ thương.

Peter cũng bảo Antigravity tạo một hình diorama cho Yuki. Lần đầu (video đăng ngày 05/10/2026) nó làm ra một nắm cơm cho Yuki, trông không ổn lắm. Nên anh bảo nó làm thành một cô gái, vì Yuki có giọng nữ. Câu anh gõ trên màn hình:

Don't really like it. Yuki has a female voice. Can you make a female japanese teacher or something? But in the diorama style. Also need her profile pic in diorama style too
Chân dung Yuki kiểu diorama: cô gái tóc nâu đeo headset hồng, áo len kem
Chân dung Yuki mà Antigravity tạo theo yêu cầu trên (video đăng ngày 05/10/2026): một cô gái kiểu đất nặn tóc ngắn màu nâu, đeo headset màu hồng, mặc áo len màu kem, nằm trong khung tròn để dùng làm ảnh đại diện.

Anh thấy hình này rất ổn, và Antigravity về cơ bản đã đặt Yuki vào ảnh đại diện ở chỗ gọi cho cô. Theo Peter, sau tất cả các vòng lặp đó, mất chừng 30 phút lặp, app trông rất tốt và mọi thứ có vẻ đều chạy (con số thời gian anh kể trong video đăng ngày 05/10/2026).

15. Bước 5: làm lại nội dung mười bài học

Theo Peter (video đăng ngày 05/10/2026), với một app học ngôn ngữ, điều thật sự quan trọng là chính các bài học và chất lượng của chúng. Nên bước năm là cải thiện nội dung của app. Anh nói lẽ ra anh nên làm bước này trước khi cải thiện chính app.

Về cơ bản anh hỏi AI (video đăng ngày 05/10/2026): hãy nghĩ thế này, nếu bạn được dạy tôi 10 bài về các phrase hội thoại tiếng Nhật để chuẩn bị cho chuyến đi, đó sẽ là những bài nào? Hãy cùng bàn về các bài học. Trên màn hình, câu anh gõ mở đầu bằng "Yes write it all in a single md file for me to review. Think about it like this - if you could teach me 10 lessons on conversational japanese phrases to get ready for my trip what would they be? let's talk about the lessons first".

AI trả lời (video đăng ngày 05/10/2026): đây là cách nó sẽ dạy và sắp xếp mọi thứ, bắt đầu từ các phrase hằng ngày và kết thúc bằng hiệu thuốc và các tình huống khẩn cấp khi bạn bị ốm, và vân vân. Peter góp ý: gộp bài sáu và bảy, và vân vân. Anh cũng không muốn kết thúc bằng một bài về lúc mọi chuyện trục trặc, vì như thế khá chán; anh không muốn kết thúc bằng một bài tiêu cực. Nên anh bảo AI xáo lại thứ tự một chút.

Bảng 10 bài học cuối cùng với cột Lesson và Scene for the role-play
Thứ tự cuối cùng AI đưa ra (video đăng ngày 05/10/2026): 1 Everyday phrases (done), 2 Asking for help, 3 Numbers and prices, 4 Asking for what you want, 5 Getting around, 6 Checking in, 7 When things go wrong (Pharmacy and police box, đã chuyển vào giữa), 8 Sightseeing, 9 Eating out, 10 Small talk and listening (trò chuyện với bartender sau bữa tối). Ghi chú bên dưới: hai bài cuối diễn ra trong một buổi tối, và bài 10 là phần kết vì cuộc trò chuyện tự nhiên kéo lại số đếm, gọi món và "ngon" từ các bài trước.

16. Một thread riêng cho nội dung và file lessons

Peter cũng muốn xem app đang dạy anh những gì. Nên anh bảo AI (video đăng ngày 05/10/2026) mở một content thread riêng. Trong project học ngôn ngữ của anh giờ có một thread riêng cho nội dung, ở đầu thread là chỉ dẫn được chuyển từ thread kia sang. AI hỏi anh vài câu, rồi đề xuất một số thay đổi cho chính các bài học, và hai bên trao đổi qua lại.

Anh hỏi: tôi muốn mọi người nhận được giá trị từ app này càng sớm càng tốt. Học đọc tiếng Nhật có phải là nền tảng quan trọng để nói và hội thoại được không? Và AI trả lời (video đăng ngày 05/10/2026) là không, bạn không cần đọc được tiếng Nhật mới nói được.

Thread Content: câu hỏi về việc học đọc tiếng Nhật và câu trả lời No của AI
Thread "Content" (video đăng ngày 05/10/2026): câu hỏi của Peter và câu trả lời của AI, mở đầu "No. You don't need to read Japanese to speak it." AI viết trẻ em nói nhiều năm trước khi đọc, và đề xuất bỏ phần đọc khỏi các bài chính. Mục "What reading does help with" kể phát âm, các khoảnh khắc trong chuyến đi (thực đơn, biển báo) và tiến bộ dài hạn; mục "What gets people speaking fastest" bắt đầu với "Recall in the scene" và "Breakdowns and swap drills".

Rồi hai bên lặp thêm vài vòng. Peter mở (video đăng ngày 05/10/2026) file markdown chứa toàn bộ các bài học (lessons-draft.md), cuộn lên đầu: đây là các bài học thật, đây là cách một bài vận hành, đây là kịch bản cho coach. Anh để ý phần này hơi lỗi thời, nó vẫn nghĩ Yuki là một nắm cơm onigiri thay vì một cô gái. Bên dưới là các bài học và đúng những phrase app sẽ dạy bạn. Trên màn hình, mỗi phrase là một dòng bảng với các cột tiếng Nhật, Romaji, tiếng Anh, "Say it like", "Use it when" và "How it's built".

Và tất nhiên, theo Peter (video đăng ngày 05/10/2026), cách tốt nhất để lặp với những thứ này là tự mình học các bài đó. Anh đang học tiếng Nhật cùng lúc với việc cải thiện app. Anh nhắc lại: thứ phân biệt một app vibe-coded kiểu "slop" với một thứ thật sự có chất lượng chính là bạn dành bao nhiêu công sức và sự chú ý để cải thiện bài học và chính app, cứ lặp với AI để làm nó tốt dần lên, tự test, và có thể mời vài người bạn test cùng.

17. Bước 6: deploy lên Vercel

Peter nói lại (video đăng ngày 05/10/2026): mục đích của app này là thật sự dạy anh tiếng Nhật, không chỉ vibe code một app cho vui. Sau tất cả các vòng lặp, anh thấy app trông khá ổn và phần lớn đã chạy. Rồi anh chỉ bước sáu: launch app.

Theo Peter (video đăng ngày 05/10/2026), có rất nhiều cách để host app, kể cả Google AI Studio cũng đã có tính năng website. Nhưng mọi project của anh đều đang nằm trên Vercel, nên anh deploy app này lên Vercel luôn. Anh quay lại cửa sổ chat và chỉ gõ "deploy the app to vercel".

Vậy là xong, vì anh đã nối sẵn Vercel với AI. Nếu bạn chưa nối, theo Peter (video đăng ngày 05/10/2026), bạn luôn có thể vào Vercel đăng ký một tài khoản, và vài website đầu tiên bạn publish là miễn phí, nên bạn không cần trả đồng nào để host app này.

Anh muốn cho xem quá trình suy nghĩ của AI. Đầu tiên nó gặp lỗi vì vài thư viện đã lỗi thời, và nó tự sửa. Trên màn hình (video đăng ngày 05/10/2026), lệnh vercel deploy --prod --yes trả về lỗi "Vulnerable version of Next.js detected, please update immediately.", AI giải thích Vercel từ chối deploy vì Next.js 15.1.7 có lỗ hổng bảo mật đã biết, rồi nâng Next.js và React lên bản vá trong cùng major release, build sạch trên Next.js 15.5.26 và React 19.3.0 rồi deploy lại. Sau đó nó sửa thêm vài thứ khác.

Và Tabi đã live ở một đường link. Mở ra, Peter đọc lời chào của Yuki trên trang: "hey everyone, I'm Yuki. Let's get you ready for Japan." Peter chỉ ra rằng AI thậm chí còn thêm một passcode: vì app dùng Gemini API và mỗi lần gọi API tốn một ít tiền, nó đủ khôn để tự thêm passcode mà anh không cần yêu cầu (theo Peter, trong bản build của video đăng ngày 05/10/2026).

Tabi đã live trên tabi-bice.vercel.app: trang Speak Japanese on your trip với hình diorama, ảnh Yuki và ô passcode
Tabi chạy trên tabi-bice.vercel.app (video đăng ngày 05/10/2026): hình diorama cửa hàng góc phố ở trên, ảnh Yuki với lời chào "こんにちは! I'm Yuki. Let's get you ready for Japan.", ba dòng "10 lessons, 10 phrases each", "Practice out loud with Yuki on a live call", "Nail all 100 before you fly", và ô Passcode trước nút Start learning.

Thế là app đã live trên một website thật, và luôn có thể cải thiện tiếp. Peter kể vài hướng (video đăng ngày 05/10/2026): thêm logging, làm thêm bài học, thêm các tính cách coach khác nhau, hoặc sửa cho ngôn ngữ khác. Ví dụ nếu anh đi Ý thay vì Nhật, app có thể dạy anh tiếng Ý và vẫn dùng Gemini, Nano Banana để tạo những hình khác.

18. Tóm lại sáu bước và lời kết

Để kết, Peter nhắc lại sáu bước (video đăng ngày 05/10/2026). Một, khám phá ý tưởng với AI: trao đổi qua lại, để nó phác ra giải pháp, research, và hỏi lại bạn. Hai, viết spec và thiết kế: dùng spec skill của anh nếu bạn có, và dùng human review để tự sửa spec. Khi đã có spec và thiết kế, chỉ cần bảo AI build bản đầu, đó là bước ba.

Nhưng theo Peter, bước bốn mới là nơi công việc thật sự diễn ra: lặp với AI để cải thiện app, và bước năm, lặp với AI để cải thiện nội dung. Chính quá trình lặp này phân biệt một thứ "slop" với một thứ thật sự có craft và đúng thứ bạn muốn. Anh ước chừng mất khoảng ba tiếng để build app này, và hai trong ba tiếng đó về cơ bản là lặp với AI để làm nó tốt lên và tự test (con số anh kể trong video đăng ngày 05/10/2026). Bước cuối là launch: theo Peter (video đăng ngày 05/10/2026), bạn có thể launch trên Google AI Studio, trên Vercel, hoặc bất kỳ nhà cung cấp hosting nào bạn muốn.

Sáu bước Peter dùng để build Tabi 1. Explorebrainstorm, hỏi lại 2. Specspec + thiết kế 3. Buildbản đầu 4. Improve applặp với AI 5. Lessonslặp nội dung 6. Launchdeploy khoảng 2 trong 3 tiếng là lặp (theo Peter)
Hình 18.1Sáu bước Peter tóm lại cuối video. Theo ước tính anh nêu trong video đăng ngày 05/10/2026, phần lớn thời gian build nằm ở bước bốn và năm, khi lặp với AI để cải thiện app và nội dung.

Peter kết lại: anh thật sự nghĩ giọng nói sẽ trở thành cách mặc định để tất cả chúng ta tương tác với AI trong tương lai gần. Nếu muốn tìm hiểu thêm về live API của Gemini, hãy tìm "Gemini 3.8 Live" và bạn sẽ thấy bài viết giới thiệu, và có thể tạo API key để thử trong Google AI Studio (theo video đăng ngày 05/10/2026).

Anh hy vọng video sẽ thúc đẩy người xem build app học ngôn ngữ của riêng mình, dù là tiếng Nhật, tiếng Trung, tiếng Ý, tiếng Tây Ban Nha hay bất kỳ ngôn ngữ nào của nước bạn sắp tới. Anh mời bấm like và subscribe nếu thích những tutorial thực hành từng bước như thế này.

Nguồn và liên kết 8 nguồn

  1. Tên gốc: Build an AI Language Tutor You Can Talk To (6 Steps)
  2. Sự kiện: YouTube
  3. Video gốc: https://www.youtube.com/watch?v=GiaDdNvsadA youtube.com
  4. Kênh YouTube Peter Yang (Peter Yang): youtube.com/channel/UCnpBg7yqNauHtlNSpOl5-cg youtube.com
  5. Bài blog của Google "Introducing Gemini 3.8 Live and 3.8 Live Extended Thinking", đăng ngày 15/09/2026 (đọc ngày 23/10/2026): blog.google blog.google
  6. Google AI Studio, nơi tạo Gemini API key (đọc ngày 23/10/2026): aistudio.google.com aistudio.google.com
  7. Google Antigravity (đọc ngày 23/10/2026): antigravity.google antigravity.google
  8. Vercel (đọc ngày 23/10/2026): vercel.com vercel.com