Hvernig á að senda 3D leik á Vercel um helgina (með gervigreindarþekkingu)

Vibe Skills

Skoðaðu hundruðir tilbúinna hæfni fyrir Claude, Cursor og fleira.

Skoða hæfni

Byrja ókeypis núna

Hafið 3D Leik á Vercel fyrir Sunnudagskvöld: 48 Klukkustunda Útflutningshandbókin

Þú getur farið úr tómri föstudagskvöldi í þinn-leik.vercel.app hlekk fyrir sunnudagsmatinn. Stöflunni er Three.js, Cursor, hæfileiki sem byggir á gervigreind frá Vibe Skills, og ókeypis þrep Vercel. Heildarkostnaður um helgina: $0. Heildarinnviðir sem þú þarft að hafa eftirlit með: líka núll.

Þetta er ekki "smíðaðu frumgerð á fartölvunni þinni og kallaðu hana fullbúna". Þetta er opinber URL sem hver sem er í heiminum getur opnað í vafra, með HTTPS, skjávarpa skyndiminni og sérsniðnu léni ef þú vilt. Gervigreindarþjónustan útvegar Three.js grunninn og virkan vercel.json. Cursor sér um endurtekningarlotu. Vercel sér um útfærsluna. Þú sérð um hönnunina.

Þessi leiðbeining er fyrir sjálfstæða þróunaraðila, vibe kóðara, þátttakendur í tölvuleikakeppnum og alla sem eru þreyttir á hálfkláruðum localhost:5173 flipum. Við förum yfir hvers vegna þessi stöflun virkar, líffærafræði 48 klukkustunda útfærslu, fimm 3D leikjahæfileika sem eru smíðaðir fyrir vinnuflæðið, og skref-fyrir-skref frá föstudegi til sunnudags.

Vibe Skills

Skoðaðu hundruðir tilbúinna hæfni fyrir Claude, Cursor og fleira.

Skoða hæfni

Byrja ókeypis núna

Hvers vegna Vercel + Three.js + Gervigreindarhæfileikar eru Staflan fyrir Einstaka Þróunaraðila

Vercel er latausti mögulegt útfærslustaður fyrir Three.js leik. Ýttu á GitHub, Vercel tekur eftir, byggir verkefnið og gefur þér URL innan 60 sekúndna. Enginn netþjónn til að útvega, engin Docker skrá, engin NGINX stilling, engin SSL uppsetning. Three.js pakkinn er bara kyrrstæð HTML, JS og WebGL efni, sem er nákvæmlega það sem Vercel netkerfi var smíðað til að þjóna.

Ókeypis þrepið nær yfir helgarútgáfu þægilega:

• 100 GB bandbreidd á mánuði. 5 MB Three.js bygging með 10.000 spilunum er 50 GB. Þú klárast um helgina áður en þú klárast af bandbreidd.
• Ótakmarkaðar kyrrstæðar útfærslur með HTTPS og *.vercel.app undirléni.
• Styðja sérsniðið lén á ókeypis þrepi - komdu með þitt eigið nafn-leik.com ef þú átt slíkt, annars er ókeypis vercel.app URL deilanlegt á öllum félagsmiðlum.
• Útfærslur á forskoðun fyrir hverja ákömun - hver ýting fær sitt eigið URL, svo þú getur deilt smíð með vini og haldið áfram að endurtaka án þess að eyðileggja það.

Bættu við gervigreindarhæfileika frá Vibe Skills og yfirborðskóðinn hverfur líka. Three.js senuuppsetning, leikstýring, byggingarferli og Vercel-tilbúið vercel.json eru búin til með einni skipun. Þá gerir Cursor restina af helginni að spjalli þar sem þú lýsir spiluninni sem þú vilt og lagar útkomuna. Það er full staflun: markaðshæfileiki fyrir grunninn, gervigreindaritstjóri til að endurtaka, og Vercel til útfærslunnar. Einstakt, ókeypis og hratt.

Vibe Skills

Skoðaðu hundruðir tilbúinna hæfni fyrir Claude, Cursor og fleira.

Skoða hæfni

Byrja ókeypis núna

48 Klukkustunda Líffærafræði: Föstudags Hugmynd til Sunnudags Útfærslu

Hver helgarútgáfa sem raunverulega fer í loftið fylgir sömu skrefum. Lykillinn er að skipuleggja útfærsluna á föstudegi, ekki sunnudags síðdegis, svo síðustu sex klukkustundir fari í að gera fínt í stað þess að berjast við villu í smíðinni.

Ástæðan fyrir því að þetta virkar er föstudagsýtingin á Vercel. Þegar URL er til, eru allar ákömun á laugardegi og sunnudegi sjálfkrafa útfærðar. Það er engin "sunnudagskvöld útfærslu panik" vegna þess að útfærslan gerðist þegar á föstudegi og hefur verið í sjálfvirkri gangi alla helgina.

Hvernig "Vibe Kóðun" 3D Leiks á Vercel Lítur Út

Vibe kóðun þýðir að lýsa því sem þú vilt á einföldu ensku og láta gervigreindaritstjóra skrifa kóðann, og síðan endurtaka á útkomunni. Fyrir Three.js leik á Vercel er lykkjan óvenju hrein: hver breyting í Cursor er pnpm dev í burtu frá staðbundinni endurgjöf, síðan git push í burtu frá lifandi forskoðunar URL, síðan sjálfkrafa útfært í framleiðslu á main.

Helgarútgáfa á Vercel sem er "vibe-kóðuð" lítur svona út:

1. Opnaðu byrjunar möppuna í Cursor.
2. Lýstu eiginleika í spjalli: "tvöföld stökk ef bil er ýtt á tvisvar innan 200ms".
3. Cursor breytir stýrimöppunni. Vista. pnpm dev hleður aftur. Þú finnur stökkið í vafranum.
4. Ef það líður rétt, git push. Vercel býr til forskoðunar URL. Sendu það til vinar.
5. Sameinaðu á main þegar tilfinningin er læst. Framleiðslu URL uppfærast innan 60 sekúndna.

Gervigreindin gerir ritunina. Vercel sér um útfærsluna. Þú sérð um tilfinninguna og hönnunina.

5 Gervigreindar 3D Leikjahæfileikar Sem Gera Þetta Mögulegt á Vibe Skills

Þessir hæfileikar eru smíðaðir fyrir Vercel + Three.js + Cursor helgarvinnuflæði. Hver og einn útvegar Vite-baserað Three.js verkefni, virkan vercel.json, pnpm build sem býr til kyrrstæðan pakka sem Vercel getur þjónað frá útlægum svæðum, og prófaða útfærsluleið. Allir eru í 3D Leikja flokknum á Vibe Skills.

1. Three.js + Vercel Leikja Byrjandi

Sjálfgefin val. Býr til Three.js senu með leikstýringu, þriðju persónu myndavél, ljósabúnaði, himinhvolfi og grunnflöt með árekstrum. Útvegar vercel.json sem stillir rétta skyndiminni yfirskriftir fyrir Three.js efnis pakka. pnpm dev keyrir staðbundið; einn smellur í Vercel mælaborðinu tengir GitHub geymsluna og þú ert kominn með lifandi URL.

Best fyrir: hvaða tegund sem er nema algjörlega 2D. Notaðu þetta ef þú veist ekki ennþá hvað þú ert að smíða.

2. Fyrstu Persónu Vercel Göngumaður

Fíngerð fyrstu persónu stýring (WASD + músarbendill læsing + þyngdarkraftur + skokk + stökk) með skrefahalla, höfuðglímu og vercel.json sem sér um CSP yfirskriftir fyrir bendill læsingu rétt. Þessi ruglar marga einstaka þróunaraðila í framleiðslu. Hæfileikinn leysir það fyrir þig.

Best fyrir: gönguherbergi, hryllings frumgerðir, sögulega leiki, listasafnssýningar.

3. Vafra Vallasalver Byssuútbúnaður

Vallasalur frá toppi (tvískipt stýring, bylgjukompur, grunn gervigreind óvina, skotkerfi, stigaskjár) með Vercel-stilltri smíð sem þjappar saman efni, skiptir gervigreind í kóða og hleður tónlist seint. Fjölspilunarbúnaður innifalinn; helgin útvegar eins spilara.

Best fyrir: spilakassabyssu leiki, bylgjuhelvíti, hlaupafærslur sem þurfa að hlaðast hratt á farsíma.

4. Vercel Puzzle Pallur

Þriðju persónu pallur (breytilegt stökk, skotgluggi tími, árekstragreining) með viðkomustöðum, þremur stubborðum sem hægt er að breyta í Blender eða í kóða, og endurlífgunar lykkja. vercel.json er stillt fyrir samstundis útlæga skyndiminni endurhleðslu borða, svo leikprófanir líða hratt á síma.

Best fyrir: puzzle pallur leiki, parkour frumgerðir, tilraunir í borðhönnun.

5. Vercel Aksturs Sandbox

Spilakassa aksturs tilfinning (hraðakúrfu, drif eðlisfræði, myndavélar tregðu, grunn landslag) með lág-pólý bíl, brautarmát, og útfærslu stillta fyrir stóra landslagsnet. Forsettar HTTP yfirskriftir fá WebGL tengingu til að byrja hraðar á Safari, sögulega hægasta vafranum fyrir Three.js.

Best fyrir: spilakassa kappakstur, utanvega akstur, bílatilfinningar kynningar fyrir eignaskrá.

Skoðaðu alla 3D leikjahæfileika á Vibe Skills →

Föstudagur til Sunnudags Skref fyrir Skref

Þetta er nákvæma tímaáætlun. Stilltu byrjunartímann, en haltu röðinni. Lykiláfangi er föstudagskvölds útfærslan á Vercel. Allt eftir það er endurtekning.

Föstudagur 6pm - 8pm: Veldu Hæfileika, Ýttu á GitHub, Tengdu Vercel

Skref 1: Veldu 3D leikjahæfileika á Vibe Skills. Skoðaðu 3D Leikja flokkinn, veldu þann sem passar við tegund þína, og settu upp byrjandann í nýja möppu. Opnaðu hann í Cursor. Þú ættir að sjá Three.js senu með hreyfanlegum leikara klukkan 7.

Skref 2: Búðu til GitHub geymslu og ýttu. git init, git remote add, git push. Notaðu slugs af leiknum þínum sem geymsluheiti (crystal-runner, lunar-fishing, hvað sem er). Geymsluheitið verður oft URL þitt.

Skref 3: Tengdu geymsluna við Vercel. Skráðu þig inn á Vercel með GitHub (ókeypis), smelltu á "Add New Project", veldu geymsluna. Vercel greinir sjálfkrafa Vite og stillir smíðina. Smelltu á Deploy. Innan 60 sekúndna færðu crystal-runner.vercel.app URL. Opnaðu það á símanum þínum. Deildu með einum vini. Útfærslustikunni er nú núll fyrir restina af helginni.

Föstudagur 8pm - 10pm: Skrifaðu Hönnunarskjal

Skref 4: Svaraðu fimm spurningum á einföldu ensku. Opnaðu Notion síðu eða markdown skrá innan geymslunnar og svaraðu:

• Hvað er leikmaðurinn að gera á 5 sekúndna fresti? (kjarna lykkjan)
• Hver er vinningurskilyrði og tapsskilyrði?
• Hversu lengi er ein keyrsla eða eitt borð?
• Hver er sjónræni krókurinn? (litapalletta, lýsing, stílviðmiðun)
• Hver er sá eiginleiki sem gerir þetta minnisvert á 30 sekúndum?

Skref 5: Vistaðu hönnunarskjal. Ýttu því á geymsluna. Vercel mun útfæra aftur. Aginn við að ýta á hverja þýðingarmikla breytingu heldur lifandi URL heiðvirku.

Laugardagur 9am - 1pm: Smíðaðu Kjarna Vélbúnaðinn

Skref 6: Skiptu út staðgengils vélbúnaðinum með einum eiginleika þínum. Þetta er eini eiginleikinn sem skiptir máli. Notaðu Cursor spjall til að lýsa honum ("þegar leikmaðurinn tekur upp kristal, frystu nærliggjandi óvini í 2 sekúndur og spilaðu hljóm"). Endurtaktu staðbundið með pnpm dev. Þegar það líður rétt, ýttu.

Skref 7: Tengdu vinning/tap stöðuna. 60 sekúndna smíð með raunverulegum endi líður eins og leikur. 60 mínútna smíð án enda líður eins og tæknikynning. Tengdu alltaf vinningsskjáinn fyrst, síðan allt annað.

Laugardagur 1pm - 8pm: Bættu við Einu Borði

Skref 8: Smíðaðu eitt fíngerða borð. Ekki þrjú hálf-bakuð. Notaðu staðgengilskubba fyrir rúmfræði. Notaðu grunnkarakter hæfileikans. Stilltu tilfinninguna - stökkhæð, myndavél tregðu, agna styrkleiki.

Skref 9: Bættu við kennslu glugga. Tveggja setninga "WASD til að hreyfa, smelltu til að skjóta" sprettigluggi við fyrstu hleðslu bjargar útútgáfu þinni frá rugluðum leikurum sem gefast upp á 8 sekúndum. Cursor getur búið til React (eða venjulegt DOM) glugga á 30 sekúndum.

Skref 10: Ýttu á hverri klukkustund. Hver ýting fær Vercel forskoðunar URL. Sendu hverja þeirra til vinar. Endurgjöfarlykkjan er leyndarvopn þessarar staflunar.

Sunnudagur 10am - 4pm: Fíngerð

Skref 11: Bættu við þremur hljóðum. Skrefahljóð lykkja, umhverfis hljómsveit, vinningur hljóð. Jafnvel þrjú hljóð lyfta helgar frumgerð verulega. Ókeypis heimildir: freesound.org, opengameart.org.

Skref 12: Bættu við safa. Aknar á högg, skjá titringur við árekstur, fjöldi sprettur á stigum. Safi er það sem gerir 48 klukkustunda smíð líta út eins og 6 mánaða í GIF. Biðja Cursor að bæta við "skjá titringur á styrkleika 0.3 í 150ms þegar leikmaður tekur skaða" - það mun skrifa myndavélar titringshalla á fimm sekúndum.

Skref 13: Keyrðu Lighthouse skoðun. Opnaðu Vercel URL á síma og keyrðu Chrome DevTools Lighthouse. Three.js pakkarnir eru yfirleitt um 400 KB til 1.5 MB. Ef þú ert yfir 3 MB, biðja Cursor að virkja kóða skiptingu á þungu einingunum. Vercel's gzip og brotli mun sjá um restina.

Skref 14: Villuleit. Spilaðu lifandi URL þitt fimm sinnum í röð. lagaðu allt sem brotnar tvisvar. Hunsa allt sem brotnar einu sinni.

Sunnudagur 4pm - 8pm: Útgefum

Skref 15: (Valfrjálst) Settu upp sérsniðið lén. Ef þú keyptir nafn-leik.com fyrirfram, bættu því við í Vercel verkefnastillingum. SSL er sjálfvirkt. Annars er *.vercel.app URL fínt - það hefur HTTPS, það er hægt að deila því og það hleðst alls staðar.

Skref 16: Taktu upp 15 sekúndna GIF af besta augnablikinu. Notaðu lifandi URL, ekki localhost. GIF er það sem smellt er á á Twitter, Bluesky og Reddit.

Skref 17: Búðu til itch.io síðu (valfrjálst en mikilvægt). Titill, eins setningar slagorð, þrjár skjámyndir, GIF-ið, stýringar, lán og innbygging á *.vercel.app iframe þínum (itch.io styður iframe innbyggingar fyrir HTML5 leiki). Nú ertu með tvö URL - eitt fyrir frjálslegar deilingar og eitt fyrir leikjafólkið.

Skref 18: Settu út hlekkinn. Twitter, Bluesky, þitt þróunar samfélags Discord, r/IndieDev, r/threejs, r/WebGames. Leiðið alltaf með GIF-inu. Innifalið alltaf URL-ið. Ef þú notaðir Vibe Skills hæfileika, minnst á það í þróunardagbókarfærslunni - aðrir þróunaraðilar sem lesa munu vilja sama byrjanda.

Hvernig á að Forðast þrjár algengustu Vercel Útfærslu BILANIR

Þrjú atriði brjóta næstum alla einstaka Three.js + Vercel helgi. Allir þrír eru 5 mínútna lagfæringar ef þú finnur þá á föstudagskvöldi, og 5 klukkustunda kanínu holur ef þú uppgötvar þá á sunnudegi klukkan 7.

• Rangur útfærsluskráar möppu. Vite sjálfgefið er dist/. Vercel greinir sjálfkrafa Vite og notar dist/. Ef þú hefur sérsniðið útfærsluna, stilltu outputDirectory í vercel.json eða verkefnastillingum eða útfærslan þín verður 404.
• Slóðir á efni sem virka staðbundið en eru 404 í framleiðslu. Notaðu hlutfallslegar slóðir eða Vite import.meta.env.BASE_URL hjálparinn fyrir öll runtime-hlaðin GLB, áferð eða hljóðskrár. Harðkóðaðar /assets/... slóðir virka yfirleitt, en afritaðar og límdar Windows slóðir gera það algjörlega ekki.
• CSP yfirskriftir sem loka bendil læsingu eða hljóð samhengi. Fyrstu persónu leikir þurfa bendil læsingu. Hljóð þarf virkjun með notandatilboði. Hver hæfileiki frá 3D Leikja flokknum útvegar rétta headers blokkina í vercel.json til að meðhöndla þetta. Ef þú skrifaðir þinn eigin frá grunni, afritaðu stillinguna frá hæfileikans geymslu.

Útfærslan virkar á föstudegi, svo þegar þessir hlutir brotna á sunnudegi er það alltaf vegna nýlegrar breytingar. git bisect er vinur þinn. Jafnvel betra: haltu áfram að ýta á hverja 30 mínútur svo brotna ákömun sé lítil.

Algengar Spurningar

Mun ókeypis þrepið á Vercel virkilega standast ef leikurinn minn fær umferð?

Já fyrir helgarútgáfu og fyrstu vikurnar. Ókeypis þrepið gefur þér 100 GB bandbreidd á mánuði, sem er um það bil 20.000 spilanir af 5 MB Three.js smíð. Ef þú nærð þessu takmörkum, er Pro áætlunin $20/mánuði og hækkar þig í 1 TB. Fyrir helgarútgáfu er ókeypis meira en nóg. Hæfileikar á Vibe Skills útvega smíðastillingar sem lágmarka pakkastærð, sem lengir ókeypis þrepið frekar.

Get ég notað sérsniðið lén á ókeypis Vercel þrepinu?

Já. Ókeypis þrepið styður sérsniðin lén með sjálfvirkri HTTPS. Kauptu lén (Namecheap, Cloudflare Registrar, Porkbun), beindu því að Vercel, og Vercel sér um SSL vottorðið. Uppsetningin tekur um 10 mínútur. Ef þú átt ekki lén, er nafn-leik.vercel.app URL nógu stutt til að deila á hvaða vettvang sem er.

Er þessi staflun í lagi fyrir innsendingu leikjahlaups?

Já, og það er ein af bestu staflunum fyrir hlaupa innsendingar. Flestir hlaupar (Ludum Dare, GMTK, js13k, GitHub Game Off) samþykkja hvaða vefspilanlega URL sem er. *.vercel.app hlekkur virkar nákvæmlega eins og itch.io URL fyrir dómara. Margir hlaupa sigurvegarar senda á báða staði - itch.io fyrir leikjafólkið, Vercel sem hraðasta kanoníska URL-ið.

Þarf ég að kunna Three.js áður en ég byrja?

Þú þarft nóg af JavaScript til að lesa hvað Cursor skrifar og stilla gildi. Þú þarft ekki að skrifa Three.js frá grunni. Hæfileikar á Vibe Skills búa til vél uppsetningu, myndavél, stýringu og smíðastillingu. Cursor sér um leikjakóðann frá þínum lýsingum.

Hvað gerist ef Vercel smíðin mín mistekst á sunnudegi klukkan 7?

Algengasta orsökin er TypeScript villa eða vantar umhverfisbreytu. Vercel sýnir smíðalogginn með villulínunni auðkenndri. Einn smellur í mælaborðinu veltir aftur til síðustu virku útfærslunnar og hækkar hana í framleiðslu. Vegna þess að hver ýting er forskoðunar útfærsla, ertu aldrei meira en ein ákömun frá virkri smíð. Þess vegna skiptir máli að ýta á hverja 30 mínútur á laugardegi og sunnudegi.

Má ég selja eða breyta kóðanum frá Vibe Skills 3D leikjahæfileika?

Já. Hæfileikar á Vibe Skills útvega viðskiptavænan leyfi sem leyfir þér að gefa út kóðann í þínum eigin leik á Vercel, itch.io, Steam, eða hvar sem er annars staðar. Skaparar halda IP-rétti hæfileikans, þú heldur IP-rétti leiksins sem er smíðaður ofan á.

Hvað ef ég vil ekki nota Cursor?

Hver sem gervigreindaritstjóri sem getur breytt verkefnisskrám virkar. Claude Code, Cursor, Windsurf, GitHub Copilot Chat, Cline - hvaða sem er af þeim getur endurtaka á Three.js grunninum frá Vibe Skills hæfileika. Hæfileikinn sjálfur er óháður ritstjóra.

Hafði Hann í Viku

Ástæðan fyrir því að flestir einstakir þróunaraðilar flytja aldrei út 3D leik er ekki vélin, tegundin eða hæfnisþak. Það er föstudagskvöldið þegar þeir "rannsaka bara aðeins meira" og byrja aldrei. Næstu fríu helgi sem þú hefur, fylgdu fjórfasa planinu: settu upp Vibe Skills 3D leikjahæfileika, ýttu á GitHub, tengdu Vercel, útfærðu fyrir föstudag 8pm, og eyði síðan laugardegi og sunnudegi í að endurtaka á lifandi URL.

Eignaskrá þín með tíu helgarútgefnum leikjum á Vercel er meira virði en draumaverkefni þitt um sex mánaða vél. Sá sem var gefinn út vinnur alltaf. Ókeypis Vercel URL er sönnunin.

Skoðaðu 3D leikjahæfileika á Vibe Skills →

Slepptu Three.js yfirborðshlaupinu. Settu upp 3D leikjahæfileika á Vibe Skills, ýttu á Vercel, og fáðu lifandi URL fyrir sunnudagskvöld.