Vibe Coding sa Google AI Studio: Pagbuo ng Mga App mula sa Mga Natural Language Prompt
May-akda: Boxu Li
Panimula
Ang bagong vibe coding interface ng Google AI Studio ay nagpapahintulot sa mga gumagamit na bumuo ng functional na apps sa pamamagitan lamang ng paglalarawan ng kanilang nais, sa halip na magsulat ng code ng linya kada linya. Ang terminong vibe coding (na likha ni AI researcher Andrej Karpathy noong 2025) ay tumutukoy sa isang workflow kung saan ang papel ng developer ay nagbabago mula sa manual na pag-coding patungo sa paggabay sa isang AI assistant sa isang conversational at iterative na proseso[1]. Sa pagsasama ng pamamaraang ito sa AI Studio, layunin ng Google na gawing accesible ang pagbuo ng AI app para sa lahat – mula sa mga bihasang coder hanggang sa mga ganap na baguhan. Sa katunayan, nagtakda ang Google ng ambisyosong layunin na magkaroon ng isang milyong AI apps na naitayo sa AI Studio bago matapos ang taon, na ginagawang engine ang vibe coding para sa sukat na ito[2]. Ang paglulunsad na ito ay isang malaking hakbang sa estratehiya ng Google upang gawing “kasing mainstream ng paggawa ng website”[3] ang paggawa ng AI-powered applications, binabawasan ang mga hadlang para sa mga estudyante, negosyante, at hindi coder.
Paano Gumagana ang Vibe Coding sa AI Studio
Sa Build mode ng AI Studio, ang paggawa ng aplikasyon ay nagiging isang interaktibong pag-uusap kasama ang AI. Magsisimula ka sa pamamagitan ng paglarawan, gamit ang natural na wika, ng app na nais mong gawin – halimbawa, “Gumawa ng garden planning assistant na nagpapahintulot sa akin na mag-sketch ng layout at pagkatapos ay nagmumungkahi ng mga halaman para sa bawat lugar”. Ang AI (na gumagamit ng modelong Gemini ng Google bilang default) ay nag-iinterpret ng mataas na antas na kahilingang ito at awtomatikong bumubuo ng unang bersyon ng app, kasama ang user interface, kinakailangang code (frontend at backend), at kahit ang istruktura ng project file[5]. Mula doon, maaari mong paulit-ulit na pinuhin ang aplikasyon sa pamamagitan ng diyalogo o direktang pag-edit. Kung mayroong hindi gumagana ayon sa inaasahan o kailangan ng pagpapabuti, sabihin mo lang sa AI kung ano ang babaguhin (o lumipat sa code editor upang mano-manong i-tweak ito), at ia-update ng AI ang code nang naaayon[6]. Ang prompt-generate-refine loop na ito ay nagpapatuloy hanggang sa ikaw ay masiyahan sa resulta. Importante, sinusuportahan ng AI Studio ang parehong coding at no-coding na pamamaraan nang sabay – ang mga hindi teknikal na gumagamit ay maaaring umasa lamang sa mga tagubilin sa natural na wika, habang ang mga developer ay maaaring siyasatin at i-fine-tune ang generated na React/TypeScript o Python code kung kinakailangan[7][8]. Kapag maganda na ang hitsura ng app, ang deployment ay isang click na lang ang layo: isinasama ng AI Studio ang one-click publishing sa Google Cloud Run, agad na nagho-host ng iyong app sa isang live URL para sa testing o pagbabahagi[9][10]. Sa kabuuan, ang vibe coding workflow sa AI Studio ay maaaring tingnan sa ilang malawak na hakbang:
- Ideation (Pagbuo ng Ideya): Ilarawan ang layunin at mga tampok ng buong aplikasyon sa isang mataas na antas na prompt. Halimbawa: “Gumawa ng isang personal na app para sa pagsubaybay sa badyet na may tsart ng mga gastusin ayon sa kategorya at isang AI chatbot na nagbibigay ng tipid na payo.”[11][12]
- Generation: Ang backend ng AI Studio (Gemini 2.5 Pro at mga kaugnay na API) ay bumubuo ng paunang bersyon ng app – bumubuo ng layout ng UI, sumusulat ng frontend logic (hal. isang React component), nagse-set up ng anumang kinakailangang backend routes o API calls, at nag-aayos ng mga file ng proyekto[13][5]. Karaniwang nangyayari ito sa loob ng ilang minuto para sa mga simpleng app, madalas na ilang segundo lang.
- Testing & Preview: Ang app ay naglo-load sa isang interactive na Preview pane direkta sa iyong browser. Maaari mo itong makipag-ugnayan kaagad upang makita kung paano ito gumagana. (Sa ilalim ng hood, ang app ay tumatakbo sa isang sandboxed na kapaligiran – walang kinakailangang manual setup o servers para sa preview na ito[14].)
- Refinement: Sa pamamagitan ng pag-uusap o direktang pag-edit ng code, pinapahusay mo ang app. Maaari mong sabihin, “Ngayon magdagdag ng login page” o “Gawing iba’t ibang kulay ang tsart,” at ilalapat ng AI ang mga pagbabagong iyon sa pamamagitan ng pagbabago ng code[15][7]. Kaya rin ng assistant ng AI Studio na i-debug ang mga isyu o magdagdag ng mga bagong tampok kapag hiniling. Ang iterative loop na ito ay nagpapahintulot sa iyo na unti-unting pahusayin ang functionality ng app at ayusin ang mga problema sa natural na paraan.
- Deployment: Kapag nasiyahan ka na, maaari mong i-deploy ang aplikasyong live sa pamamagitan ng huling prompt o isang click lamang. Ang AI Studio ang bahala sa pag-package at pag-deploy ng code sa isang scalable platform (Google Cloud Run) sa likod ng mga eksena[16][9]. Ang resulta ay isang live na web app URL na maaari mong ibahagi o ipagpatuloy na paunlarin pa.
Sa buong prosesong ito, ikaw ang may kontrol: palagi mong maaring suriin ang nabubuong code, subukan ang pag-uugali ng app, at tiyakin na ito'y angkop bago i-deploy. Ang kombinasyong ito ng mataas na antas ng kadalian at mababang antas ng transparency ang nagpapalakas sa vibe coding sa AI Studio para sa parehong baguhan at mga bihasang developer. Inihahalintulad ito ng Google sa pagkakaroon ng isang AI na kaparehang programmer o co-pilot na humahawak sa boilerplate at mabigat na gawain habang nakatuon ka sa pag-gabay sa “vibe” ng app – ang ideya at karanasan ng gumagamit na naiisip mo[17][18].
Mga Pangunahing Tampok ng Vibe Coding na Interface
Ang kapaligiran sa pag-code ng Google AI Studio ay may iba't ibang mga tampok at elemento ng UI na nagpapadali at nagpapasimple sa paglalakbay mula sa prompt patungo sa app. Kabilang sa mga pangunahing kakayahan ang:
- Model & Feature Selector: Bago mag-prompt, pinapayagan ka ng tab na Build na i-configure kung aling mga modelo at serbisyo ng AI ang gagamitin ng iyong app. Sa default, pinipili nito ang Gemini 2.5 Pro (isang general-purpose LLM), ngunit maaari mong ihalo ang mga espesyal na module sa isang click – halimbawa, Imagen para sa pagbuo ng larawan, Veo para sa pag-unawa sa video, mas maliliit na modelo tulad ng Nano Banana para sa mga tiyak na gawain, o kahit na paganahin ang Google Search integration[19][20]. Ang mga modular na “AI superpowers” na ito ay ipinapakita bilang mga toggle kaya madali mong masabi, isama ang pagkilala sa larawan o gamitin ang web search data, at isasama ng sistema ang mga kakayahang iyon sa code ng binuong app. Kinikilala ng Gemini ang mga bahaging ito at pinagsasama-sama ang mga ito sa panahon ng pagbuo ng app[20][21]. Nangangahulugan ito na kahit na ang mga kumplikadong multi-modal na app (halimbawa, isang voice chatbot na maaari ring magpakita ng mga larawan o mapa) ay madaling maisagawa.
- Natural Language Prompt Input: Ang pangunahing bahagi ng vibe coding ay ang prompt box – simpleng itype mo lang kung ano ang gusto mong gawin ng app sa plain English (o anumang suportadong wika). Halimbawa: “Gumawa ng interactive quiz game na nagtatanong sa akin ng mga tanong sa math at nagbibigay ng feedback gamit ang isang AI tutor”. Maaari ring magbigay ang sistema ng mga halimbawa ng prompt o template para gabayan ka (tulad ng “Recipe generator using Gemini” starter prompt)[22]. Hindi mo kailangang tukuyin ang mga teknikal na detalye tulad ng frameworks o syntax – awtomatikong tinutukoy ng AI ang kinakailangang tech stack (madalas na React + TypeScript para sa web UIs, pati na rin ang anumang backend logic) batay sa iyong paglalarawan[12]. Pinapababa nito ang hadlang para kahit na ang mga hindi programa ay makapagsimula ng pagbuo ng app sa pamamagitan ng paglalarawan ng kanilang ideya.
- Dual Chat + Code Interface: Kapag nabuo na ang isang app, hinahati ng AI Studio ang view sa isang dalawang-pane editor. Sa kaliwang bahagi, mayroon kang conversational chat interface kasama ang AI assistant (Gemini). Dito maaari kang magtanong tungkol sa code, humiling ng mga pagbabago o bagong feature, at makakuha ng mga paliwanag. Sa kanang bahagi, makikita mo ang buong project code editor na may mga file tab (para sa front-end, backend, config files, atbp.)[23]. Ang bawat file ay may kasamang tooltips o maikling paglalarawan ng layunin nito (kapaki-pakinabang para sa mga baguhan na natututo kung ano ang mga bagay tulad ng App.tsx o constants.ts)[24]. Maaari mong direktang i-edit ang code sa pane na ito – halimbawa, maaaring ayusin ng isang developer ang styling sa isang CSS file o i-adjust ang isang hard-coded na halaga. Agad na masusubukan ang lahat ng pagbabago sa live preview. Ang split interface na ito ay nagsisilbi sa parehong mga audience: ang mga hindi coder ay maaaring manatili sa chat “vibe” para gabayan ang mga pagbabago, habang ang mga coder ay maaaring mag-dive sa aktwal na codebase kapag kinakailangan[7].
- Context-Aware Suggestions: Hindi lang naghihintay ang AI Studio ng iyong mga utos – aktibong nagbibigay ito ng smart suggestions para sa mga pagpapabuti. Sinusuri ng modelo ng Gemini ang kasalukuyang app at maaaring magrekomenda ng mga kaugnay na pagpapahusay sa pamamagitan ng Flashlight feature[25][26]. Halimbawa, kung nakagawa ka ng isang image gallery app, maaari itong magmungkahi ng “Magdagdag ng tampok para ipakita ang kasaysayan ng mga kamakailang tiningnang larawan”[25]. Ang mga mungkahing ito ay lumalabas sa interface upang gabayan ka sa susunod na susubukan, halos parang isang AI product manager na nag-aalok ng mga ideya. Maaari mong tanggapin ang mungkahi sa isang click upang hayaan ang AI na ipatupad ito, o balewalain ito. Nakakatulong ito sa mga user na matuklasan ang mga functionality na maaaring hindi nila naisip, at ipinapakita ang kakayahan ng AI na unti-unting pinapaganda ang proyekto.
- “I’m Feeling Lucky” Prompt Generator: Upang magbigay ng inspirasyon sa pagkamalikhain o tulungan kapag hindi ka sigurado kung ano ang gagawin, nagdagdag ang Google ng isang masayang I’m Feeling Lucky button[27]. Bawat pindot ng button na ito ay bumubuo ng isang random na konsepto ng app na kumpleto sa isang prompt at isang pre-configured na seleksyon ng mga feature ng AI. Maaaring magmungkahi ito ng isang bagay na ligaw o niche – halimbawa, “Isang dream garden designer na gumagamit ng image generation upang mailarawan ang iyong likod-bahay” o “Isang trivia game na may AI host na nagbibiro sa iyo”[28]. Ang mga ito ay ganap na gumaganang mga panimulang punto; talagang i-assemble ng sistema ang iminungkahing app kung magpapatuloy ka. Ipinaliwanag ni Logan Kilpatrick, product lead ng Google AI Studio, na ang tampok na ito ay naghihikayat ng paggalugad: “Makakakuha ka ng mga talagang, talagang cool, iba’t ibang karanasan” na maaaring hindi mo nabuo kung hindi man[29]. Isa itong isang-click na paraan upang makita ang sining ng posible at marahil ay makahanap ng iyong susunod na malaking ideya ng app.
- Secret Variables & API Keys: Maraming kapaki-pakinabang na app ang nangangailangan ng pagtawag sa mga panlabas na API o serbisyo (halimbawa, ang isang weather app ay maaaring tumawag sa isang weather API). Ngayon ay mayroong secret variables vault ang AI Studio upang ligtas na iimbak ang mga API key o iba pang sensitibong kredensyal sa loob ng iyong proyekto[30][31]. Nangangahulugan ito na maaari mong i-prompt ang AI na isama ang isang panlabas na serbisyo (sabihin, “kunin ang live stock prices mula sa AlphaVantage API”) nang hindi nilo-hardcode ang secret key sa code. Idagdag mo ang API key sa Secrets UI, at alam ng AI na i-refer ito nang ligtas. Ang tampok na ito ay mahalaga para gawing production-ready ang mga prototype na app, dahil sinusuportahan nito ang magagandang kasanayan sa seguridad kahit na sa AI-generated code.
- Granular UI Editing Tools: Habang palagi mong maaring ilarawan ang mga pagbabago sa UI sa text (halimbawa, “gawing asul ang button”), pinapayagan ka rin ng AI Studio na makipag-ugnayan nang mas direktang sa preview. Maaari mong i-click ang isang UI element sa preview at i-annotate ito ng isang instruction para kay Gemini[32]. Halimbawa, maaari mong piliin ang isang header at sabihin “palakihin ang titulong ito at i-center ito.” Makikilala ng AI ang elemento at aayusin ang kaukulang code (HTML/CSS) upang ipatupad ang pagbabago[33]. Isa itong makapangyarihang tampok na nag-uugnay ng WYSIWYG editing at AI coding – parang mahika na makipag-usap sa iyong interface upang i-customize ito. Binabawasan nito ang pangangailangan na maghanap sa code para sa mga pag-tweak ng styling o layout; sa halip, ituro mo lang sa screen at sabihin sa AI kung ano ang gusto mo roon.
- One-Click Deployment: Kapag handa na ang iyong app, napakasimple ng pag-deploy nito. Ang AI Studio ay nagsasama sa Google Cloud Run upang magbigay ng one-click deployment sa cloud[10]. Sa isang solong pagkilos sa loob ng Studio, ang iyong aplikasyon (front-end at backend) ay na-co-containerize at inilulunsad sa imprastraktura ng Google, at makakakuha ka ng live URL kung saan maaaring ma-access ito ng iba. Inaalis nito ang tradisyonal na kumplikadong mga hakbang ng pag-set up ng mga server o pagho-host. Sa demo ng Google, ang isang ganap na functional na AI chatbot app ay na-deploy sa ilalim ng limang minuto mula simula hanggang matapos gamit lamang ang Studio interface at mga prompt[34]. Para sa mga lightweight na app o prototype, hindi mo rin kailangan ng credit card sa file – pinapayagan ka ng libreng tier ng AI Studio na bumuo at sumubok nang malaya, nangangailangan lamang ng bayad na plano kung inaanyayahan mo ang ilang mga advanced na modelo (tulad ng pinakamalaking video model) o kung nais mong mag-scale up sa produksyon[35][36]. Ang pilosopiya dito ay “bumuo nang libre, magbayad kapag lumago”, kaya maaaring mag-eksperimento ang mga tagalikha nang walang hadlang ngunit may landas pa rin sa enterprise-scale hosting kapag kinakailangan[37].
- Export and Collaboration: Bukod sa pag-deploy sa Cloud Run, nagbibigay ang AI Studio ng maraming pagpipilian upang pamahalaan o ibahagi ang iyong proyekto. Maaari mong i-save ang buong code sa iyong GitHub repository sa ilang click, i-download ang proyekto bilang isang zip, o kahit i-fork ang app sa loob ng AI Studio’s gallery para sa remixing[38]. Nangangahulugan ito na hindi ka nakakandado – ang code ay sa iyo upang suriin at gamitin sa labas ng platform. Ipinapahiwatig din nito ang mga hinaharap na tampok ng komunidad: isang App Gallery na nagpapakita ng mga halimbawa ng app at mga template (kasalukuyang mula sa Google at ang iyong mga nakaraang likha, na may mga plano na isama ang mga user-shared na app sa hinaharap)[39]. Maaaring umunlad ang gallery na ito sa isang uri ng app store o community hub kung saan maaari matuklasan ng mga tao ang mga AI Studio app, matuto mula sa mga ito, at bumuo batay sa gawa ng iba, higit pang nagpapabilis ng pag-unlad sa pamamagitan ng pagbabahagi.
Vibe Coding sa Aksyon: Mula Prompt hanggang Prototype
Walang mas nagpapatunay sa kakayahan ng AI Studio kaysa makita ang isang vibe coding session na aktwal na gumagana. Ang koponan ng Google at mga unang gumagamit ay nagbahagi ng ilang mga demo na nagpapakita kung gaano kabilis ang ideya na maging isang gumaganang aplikasyon. Halimbawa, ang isang Googler ay nagpakita ng app na “garden planning assistant” na nabuo sa ilang mga pag-click lamang: ipinasok niya ang prompt na iyon at ang sistema ay bumuo ng kumpletong app na may visual layout tool at isang conversational plant recommender, lahat sa loob ng ilang sandali[40][41]. Sa isa pang opisyal na demo, isang ganap na gumaganang chatbot (na may pasadyang knowledge base) ang naitayo at na-deploy ng live sa loob ng mas mababa sa 5 minuto – lahat sa pamamagitan ng mga natural na wika na tagubilin at feature toggles, walang manual coding[34]. Ang mabilis na mga resulta na ito ay nagpapakita ng produktibidad ng vibe coding: ang dati ay tumatagal ng ilang araw ng programming ay ngayon magagawa na habang nagkakape.
Bilang isang praktikal na pagsubok, sinubukan ng isang reporter mula sa VentureBeat ang AI Studio sa pamamagitan ng paghingi ng simpleng laro. Ibinigay niya kay Gemini ang isang paglalarawan: “Isang web application para sa pag-roll ng dice kung saan maaaring pumili ang user ng iba't ibang dice (d6, d20, atbp.), makita ang isang animated roll, at pumili ng kulay ng dice.” Sa loob lang ng 65 segundo, nakagawa ang AI Studio ng gumaganang web app na pumasa sa mga specs[42][43]. Ang ginawang app ay may malinis na UI (ginawa gamit ang React, TypeScript, at Tailwind CSS) kung saan maaari kang pumili ng 6-sided, 10-sided, o 20-sided na dice, i-customize ang kulay nito, at i-click ang isang button para i-roll ito. Ang dice ay iikot na may animation at magpapakita ng random na resulta sa bawat pagkakataon – eksaktong tulad ng hiniling. Hindi lang isang code file ang nalikha ng platform; lumikha ito ng isang istrukturadong proyekto na may kasamang maraming components (tulad ng App.tsx para sa pangunahing interface, constants.ts para sa dice data, at magkakahiwalay na modules para sa rolling logic at controls)[44]. Ipinapakita ng modular na output na hindi basta-basta naglalatag ng isang payat na script ang AI, kundi talagang ina-architect ang app sa isang malinis at maayos na paraan na parang isang human developer. Pagkatapos ay nagpasya ang reporter na pagandahin ang app sa pamamagitan ng pagdaragdag ng sound effects sa tuwing mag-roll ang dice. Sinabi lang niya ang kanyang ideya sa AI, at sa isang follow-up prompt, isinulat ng assistant ang karagdagang code para magpatugtog ng tunog sa bawat roll – na isinama ito nang walang putol sa umiiral na codebase[44]. Lahat ng ito ay nangyari sa loob ng isang tab ng web browser, nang hindi manu-manong nagsusulat ng anumang code ang tao. Ang mga ganitong halimbawa ay nagha-highlight kung gaano kabilis at iterative ang proseso ng pag-develop sa vibe coding: inilalarawan mo ang ideya, makakakuha ka ng magagamit na prototype halos kaagad, saka ito pinapino sa pakikipag-usap sa AI.
Mahalagang tandaan na kahit kamangha-mangha ang mga demo na ito, may mahalagang papel pa ring ginagampanan ang human developer sa pagrerepaso at paggabay sa kinalabasan. Maaaring kailanganin ng mga app na ginawa ng AI Studio ang ilang pag-aayos para sa mga edge case o performance, lalo na sa mas sopistikadong mga proyekto. Ang pilosopiya ng vibe coding ay naghihikayat ng human-in-the-loop na pamamaraan para sa propesyonal na paggamit – hayaan mong ang AI ang pumasan ng mabigat na gawain sa simula, pagkatapos ikaw ang mag-verify ng functionality, ayusin ang anumang detalye, at tiyakin na ang panghuling produkto ay nakakatugon sa pamantayan ng kalidad at seguridad[45][16]. Sa praktika, iniulat ng mga unang gumagamit na ang kombinasyon ng AI suggestions at direktang access sa code ng interface ay ginagawang medyo intuitive ang prosesong ito ng pagrerepaso[46]. Ang bottom line: maaaring makapaghatid ang AI Studio ng gumaganang app sa loob ng ilang minuto, at sa kaunting gabay at pag-polish mula sa user, ang prototype na iyon ay maaaring mabilis na umunlad sa isang production-grade na application.
Mga Halimbawa ng Apps na Puwede Mong Ibuo (gamit ang Prompts)
Para magbigay ng inspirasyon, narito ang limang halimbawa ng hindi masyadong kumplikado ngunit kapaki-pakinabang na mga aplikasyon na maaari mong buuin gamit ang vibe coding ng Google AI Studio. Para sa bawat isa, nagbigay kami ng halimbawa ng prompt na maaari mong ipasok sa AI para likhain ang app:
- Personal na Listahan ng Gagawin na may Matalinong Suhestiyon – Isang simpleng web app para sa pagsubaybay ng gawain, pinahusay ng AI. Halimbawa, maaaring suriin ng app ang iyong mga gawain at magmungkahi ng mga paalala o maliliit na gawain.
- Utos: “Gumawa ng web-based na aplikasyon ng listahan ng gagawin. Dapat itong pahintulutan akong magdagdag, mag-edit, at mag-check ng mga gawain. Isama ang isang AI assistant na nagmumungkahi ng mga deadline o naghahati ng mga gawain sa mas maliit na hakbang. Dapat malinis at mobile-friendly ang interface.”
- Dito, gagawa si Gemini ng UI para sa pamamahala ng gawain at gagamitin ang kanyang pangangatwiran para magbigay ng mga tip – halimbawa, kung idagdag mo ang “Planuhin ang bakasyon”, maaaring magmungkahi ang AI ng maliliit na gawain tulad ng “Mag-book ng flights”.
- Output: https://ai.studio/apps/drive/1_ow-8TYDMWxms56bzQ-QKHsNWCA_F0fr
- Planner at Gabay sa Mapa – Isang mobile-friendly na tagaplano ng itineraryo sa paglalakbay na nagsasama ng datos sa mapa. Maaaring gamitin nito ang Google Maps at real-time na impormasyon.
- Paglalakbay
- Utos: “Gumawa ng app ng tagaplano ng paglalakbay para sa city trip. Ipasok ng user ang isang lungsod at bubuo ang app ng 3-araw na itineraryo na may mga atraksyon, kainan, at hotel sa bawat araw. Isama ang isang interactive na mapa na minamarkahan ang bawat inirerekomendang lugar, at pahintulutan ang user na mag-click sa isang lugar upang makakuha ng mga detalye (gamit ang live na data o search). Gawing responsive ang disenyo para magamit sa telepono.”
- Sa senaryong ito, maaaring gamitin ng AI ang kombinasyon ng Google Search tool at Maps API grounding (sa pamamagitan ng ibinigay na mga kredensyal) upang makuha ang mga sikat na lugar, at pagkatapos ay ipakita ang mga ito sa isang bahagi ng mapa. Ang suporta ng vibe coding interface para sa mga external API key (sa pamamagitan ng mga secret variable) ay nagpapahintulot sa paggamit ng isang bagay tulad ng Google Places API nang ligtas[31]. Ang resulta ay isang app na parang isang personalized na tour guide, na nilikha sa pamamagitan lamang ng paglalarawan ng ideya.
- Output: https://ai.studio/apps/drive/1QO0OnH8vjUZuX3e1IqtQ4-1pqSZYAJLO
- Interactive na Data Dashboard – Isang analytics dashboard na ginagawang mga chart at insight ang datos. Halimbawa, maaaring gustuhin ng isang maliit na negosyo na i-visualize ang mga numero ng benta.
- Utos: “Gumawa ng web app na data dashboard para sa analytics ng benta. Dapat itong may file upload para sa CSV ng datos ng benta. Kapag na-upload na ang datos, ipinapakita ng app ang isang buod (kabuuang benta, average na halaga ng order) at bumubuo ng dalawang chart: isang line chart ng buwanang benta sa paglipas ng panahon, at isang pie chart ng benta ayon sa kategorya ng produkto. Isama ang isang AI summary sa ibaba ng mga chart na nagha-highlight ng anumang trend o anomalya sa simpleng wika.”
- Gamit ang utos na ito, malamang na makabuo ang AI Studio ng isang multi-panel dashboard. Maaaring isama nito ang isang charting library tulad ng Chart.js o D3 upang i-render ang mga graph, at gamitin ang pangangatwiran ni Gemini upang lumikha ng text summary (halimbawa, “Tumalon ang benta noong Hulyo dahil sa summer promotion”). Ipinapakita nito kung paano maaring pangasiwaan ng vibe coding ang interactive na data visualization sa pamamagitan ng pagsasama ng pag-code para sa mga elemento ng UI (file input, canvas para sa mga chart) kasama ang AI analysis ng datos. Ang mga ganitong dashboard ay maaaring buuin at i-tweak nang hindi kasing hirap ng mga tradisyonal na BI tools – at nang hindi isinusulat ng user ang chart-drawing code mismo.
- Output: https://ai.studio/apps/drive/1qW2V3lfyEF0QDDXQxuYCF0O90QdL3_uB
- AI-Powered Study Flashcards – Isang mini learning game para sa mga estudyante. Maaaring mag-quiz ang app sa user at umangkop sa kanilang performance.
- Utos: “Gumawa ng flashcard quiz web app para sa pag-aaral ng wika. Ang app ay dapat mag-quiz sa user tungkol sa mga salitang bokabularyo sa Espanyol. Bawat flashcard ay nagpapakita ng salitang Ingles, at kailangan ng user na i-type ang pagsasaling Espanyol. Dapat sabihin ng app kung tama sila o hindi, at itala ang score. Magdagdag ng AI tutor mode: kung mali ang user, magbigay ng hint o maikling paliwanag ang AI. Gumamit ng simpleng, makulay na disenyo at tiyaking gumagana ito sa mobile.”
- Sa senaryong ito, ang nabuo na app ay maaaring magsama ng isang set ng mga paunang natukoy na Q&A pairs (na maaari mong pinuhin o palawakin), isang input box para sa mga sagot, at logic para sa pag-check ng tamang sagot. Ang kawili-wiling bahagi ay ang AI tutor: maaaring i-prompt si Gemini (sa likod ng mga eksena) upang makabuo ng kapaki-pakinabang na hint o mnemonic kapag nagkamali ang user, ginagawa ang karanasan sa pag-aaral na mas nakaka-engganyo. Ang halimbawang ito ay naglalarawan ng isang mini-game/educational tool – isang kategorya kung saan maaaring magningning ang mga vibe-coded app sa pamamagitan ng pagsasama ng dynamic na AI feedback na wala sa mga tradisyunal na flashcard apps.
- Output: https://ai.studio/apps/drive/1rpxIsuwLz7cqypH9oYjGCwSIh5PBKXxL
- Recipe Finder na may AI Chef – Isang cooking assistant na nagmumungkahi ng mga recipe batay sa magagamit na mga sangkap.
- Utos: “Gumawa ng recipe finder app. Ang user ay maaaring mag-input o pumili ng mga sangkap na mayroon sila (tulad ng ‘manok, kamatis, basil’), at hahanapin ng app ang mga recipe na gumagamit ng mga sangkap na iyon. Dapat magpakita ito ng listahan ng mga mungkahing recipe na may mga pamagat, larawan, at maikling paglalarawan. Isama ang isang AI chat chef na maaaring tanungin ng user para sa mga tip sa pagluluto o mga pamalit (halimbawa, ‘Wala akong mantikilya, ano ang maaari kong gamitin bilang kapalit?’). Dapat magkaroon ang app ng nakakaakit, foodie na disenyo.”
- Ang ideya ng app na ito ay nagsasama ng ilang elemento: isang interface para sa pagpili ng sangkap, posibleng mga tawag sa isang recipe API (para sa pagkuha ng mga totoong recipe – maaari mong gamitin ang API key mula sa isang serbisyo tulad ng Spoonacular, pinamamahalaan sa pamamagitan ng mga secret variable), at isang pinagsamang chatbot persona (“AI Chef”) gamit ang Gemini model upang sagutin ang mga tanong sa pagluluto. Ang multimodal na kakayahan ng AI Studio ay nangangahulugang maaari mo ring paganahin ang Imagen upang makabuo ng larawan para sa bawat mungkahing putahe kung ang URL ng larawan ay hindi magagamit, tunay na pinaghalo ang pagkamalikhain sa utility. Mula sa perspektibo ng vibe coding, ipinapakita ng halimbawang ito kung paano mo maaring utusan ang AI na pagsama-samahin ang pagkuha ng datos, pagbuo ng larawan, at conversational Q&A sa isang app – lahat sa pamamagitan ng isang solong utos at kasunod na pinuhin.
Ang bawat isa sa mga halimbawang nabanggit ay maaaring gawin sa AI Studio gamit lamang ang ilang mga prompt at pagpipilian, pagkatapos ay paulit-ulit na pinapahusay. Ipinapakita ng mga ito ang saklaw ng mga aplikasyon na kayang hawakan ng vibe coding – mula sa simpleng web utilities hanggang sa mga interaktibong pang-edukasyonal na laro at mga AI-enhanced creative tools. Ang karaniwang tema ay ikaw, bilang tagalikha, ay nakatuon sa ideya ng produkto at karanasan ng gumagamit, habang ang AI ang bahala sa pagsasalin ng bisyon na iyon sa gumaganang code.
Panghuling Kaisipan
Ang vibe coding interface ng Google AI Studio ay kumakatawan sa isang makabuluhang pagbabago sa kung paano maaaring mabuo ang software. Sa pamamagitan ng pag-convert ng mga natural na paglalarawan ng wika sa mga tumatakbong aplikasyon, binibigyang kapangyarihan nito ang mas malawak na madla na lumikha ng mga solusyon sa teknolohiya nang walang malalim na kadalubhasaan sa coding. Para sa isang pinuno ng produkto o developer, ito ay nagbubukas ng bagong, mas mabilis na prototyping loop – maaari mong agad na subukan ang mga ideya sa pamamagitan ng literal na paggawa ng minimum viable na produkto sa loob ng ilang minuto. Mula sa mga web apps at mga tool na madaling gamitin sa mobile hanggang sa mga dashboard ng data at mini-games, ang saklaw ng kung ano ang posible ay patuloy na lumalawak habang isinasama ng Google ang higit pa sa kanilang AI toolkit (at habang lumilitaw ang mas malalaking modelo tulad ng Gemini 3 sa platform). Habang ang tradisyunal na pag-unlad ay hindi mawawala, ang vibe coding ay pinapalakas ito ng isang AI-first approach: isinusulong mo ang bisyon at "ginagabayan" ang AI, at kapalit nito ay nakakakuha ka ng isang functional na app na maaari mong pagandahin at palakihin. Ang sinerhiya na ito sa pagitan ng pagkamalikhain ng tao at kakayahan ng AI ay nasa puso ng Google AI Studio. Ang platform ay patuloy na umuunlad (na may higit pang mga tampok na ipinapangako sa susunod na ilang buwan[47][48]), ngunit malinaw na na ang vibe coding ay may potensyal na pabilisin ang inobasyon at babaan ang hadlang sa pagdadala ng mga bagong ideya ng app sa buhay[49][50]. Sa isang mundo kung saan ang bilis at accessibility ang susi, ang pagtaya ng Google sa vibe coding – na nagpapahintulot sa mga tao na bumuo sa pamamagitan ng pakikipag-usap – ay maaaring maging isang game-changer sa pag-unlad ng software.
Mga Pinagmulan: Dokumentasyon ng Google Cloud & AI Studio[51][52]; News9live (Okt 2025)[53][10]; VentureBeat (Okt 2025)[54][43]; SiliconANGLE (Okt 2025)[49][55]; TestingCatalog (Okt 2025)[4][56]; Learn Prompting Blog (Set 2025)[5][6].
[1] [11] [13] [15] [16] [17] [18] [45] [51] [52] Ipinaliwanag ang Vibe Coding: Mga Kasangkapan at Gabay | Google Cloud
https://cloud.google.com/discover/what-is-vibe-coding
[2] [3] [7] [10] [12] [20] [26] [31] [34] [47] [53] Idinagdag ng Google ang vibe coding sa AI Studio: Gumawa ng mga app sa pamamagitan ng pakikipag-chat sa AI | Balita sa Artipisyal na Intelihensiya - News9live
https://www.news9live.com/technology/artificial-intelligence/google-vibe-coding-explained-build-apps-fast-2898950
[4] [21] [32] [39] [48] [56] Binago ng Google ang AI Studio na may mga bagong tampok para sa vibe coding
https://www.testingcatalog.com/google-revamps-ai-studio-with-new-features-for-vibe-coding/
[5] [6] [8] [22] I-Vibe Code ang Iyong Susunod na AI-powered App sa Google AI Studio
https://learnprompting.org/blog/ai-studio-build-mode?srsltid=AfmBOor93SD7PWwyeR5_MHEhpwSCEEtZA6HWD1KEmC4nWxIJEFMxkMSr
[9] [30] [33] [49] [50] [55] Ang Google ay yumayakap sa vibe coding gamit ang pinakabagong bersyon ng AI Studio app development platform - SiliconANGLE
https://siliconangle.com/2025/10/21/google-embraces-vibe-coding-latest-version-ai-studio-app-development-platform/
[14] Libreng Online Vibe Coding gamit ang Google AI Studio: Kahit sino ay pwedeng gumawa ng Apps! | ni Abish Pius | Pagsusulat sa Mundo ng Artificial Intelligence | Sep, 2025 | Medium
https://medium.com/chat-gpt-now-writes-all-my-articles/free-online-vibe-coding-with-google-ai-studio-anyone-can-build-apps-a303e7a1c664
[19] [23] [24] [25] [27] [28] [29] [35] [36] [37] [38] [40] [41] [42] [43] [44] [46] [54] Ang bagong vibe coding AI Studio experience ng Google ay nagbibigay-daan sa sinuman na bumuo at mag-deploy ng mga app nang live sa ilang minuto | VentureBeat
https://venturebeat.com/ai/googles-new-vibe-coding-ai-studio-experience-lets-anyone-build-deploy-apps