Vibe Skills

Ṣawari awọn ọgọọgọrun awọn ọgbọn ti a ti ṣetan tẹlẹ fun Claude, Cursor, ati diẹ sii.

Awọn Agbara AI Ti O Dara Julọ Fun Awọn Ẹsẹ Akikanju 3D: Kini Idi Ti 2026 Jẹ Ọdun Ti Yoo Gbe Lọ Si Gbogbo Eniyan

Awọn agbara AI ti o dara julọ fun awọn ẹ̀sẹ̀ akikanju 3D ni 2026 n ṣẹda oju-iwe Three.js kan ti o ṣe afihan awọn ohun-ini ami iyasọtọ rẹ ni akoko gidi, awọn ọkọ oju omi ni labẹ wakati 2, ati rọpo iṣẹ ọfẹ alagbata $5,000 - $20,000. Ẹsẹ ojúewé ìdarí 3D kan ti a lo lati jẹ iṣẹ-ẹrọ mẹẹdogun kan. O jẹ bayi Ọjọ Jimọ irọlẹ.

Linear, Stripe, Vercel, Arc, Rive, Liveblocks, ati Cursor gbogbo wọn gbe awọn oju-iwe ìdarí wọn si 3D ti o ni ajọṣepọ laarin 2023 ati 2026. Awọn ẹgbẹ iyipada ni Stripe ati Vercel royin ilosoke meji-nọmba ni ijinlẹ yiyi ati oṣuwọn iforukọsilẹ lẹhin atunṣe naa. Awoṣe naa jẹ bayi aiyipada fun SaaS ti Ere, ati ẹ̀sẹ̀ pẹtẹlẹ kan ni bayi nka bii aṣa ti lọ kuro.

Itọsọna yii ni wiwa awọn agbara ẹ̀sẹ̀ akikanju 3D ti o ni ajọṣepọ marun-un ti a ṣeduro lori Vibe Skills ni 2026, ohun ti ọkọọkan wọn n gbe, ati bii o ṣe le fi ẹ̀sẹ̀ akikanju 3D gidi kan si aaye rẹ ni ọsẹ yii.

Vibe Skills

Ṣawari awọn ọgọọgọrun awọn ọgbọn ti a ti ṣetan tẹlẹ fun Claude, Cursor, ati diẹ sii.

Ṣawari Awọn Ọgbọn

Bẹrẹ Ọfẹ Bayi

Kini Idi Ti Awọn Akikanju 3D Bayi N àlà "Ere" Nipa Aiyipada

Ẹsẹ akikanju 3D ni ifihan tuntun ti "a jẹ ile-iṣẹ pataki." Ọdun marun ti o ti kọja ifihan yẹn jẹ aworan iyaworan ti ara ẹni. Ọdun mẹta ti o ti kọja o jẹ iṣipopada Lottie. Ni 2026 o jẹ oju-iwe 3D ti o ni ajọṣepọ ti olukọwe le yi, ṣan, tabi fa pẹlu yiyi.

Iyipada naa waye nitori idiyele ti WebGL ṣubu. react-three-fiber ṣe Three.js rilara bi kikọ React. drei ṣe apoti iṣẹlẹ 90% (awọn iṣakoso orbit, awọn maapu ayika, awọn ẹru GLTF, awọn aṣoju ti a fi sii) sinu awọn paati laini kan. Spline jẹ ki awọn apẹẹrẹ kọ awọn oju-iwe laisi koodu. Ifiweranṣẹ naa lọ lati "ṣe a yẹ ki o ni 3D" si "kilode ti a ko ni 3D".

Diẹ ninu awọn aaye itọkasi lati agbegbe lọwọlọwọ:

Linear nlo aworan iṣoro 3D kan ti o dahun si iṣipopada kọsọ lori ẹ̀sẹ̀ ojú-ìwé rẹ̀
Stripe n gbe okun parametric 3D kan ti o nṣiṣẹ fun ipin-ipin bi o ti yiyi
Vercel n ṣiṣẹ aaye patikulu ti a fi sii ti o dahun si lilọ kiri
Arc ṣe agbekalẹ agbegbe ayanwo 3D gbogbo bii ẹ̀sẹ̀
Rive ṣe afihan awọn faili ọja gidi ti n yipo ni WebGL loke ilẹ ti o fẹ

Awọn olukọwe ko nigbagbogbo ṣe akiyesi 3D ni mimọ. Wọn ṣe akiyesi pe oju-iwe naa ni rilara gbowolori. Iro yẹn ni ohun ti o n pa adehun iforukọsilẹ naa.

Awọn data iyipada n ṣe atilẹyin eyi. Ẹgbẹ SaaS pupọ ti o paarọ aworan alapin fun ẹ̀sẹ̀ 3D pẹlu poly kekere royin 5 - 14% ilosoke ninu akoko-lori-oju-iwe ati 2 - 6% ilosoke ninu idanwo iforukọsilẹ. Ilosoke kii ṣe idan. O jẹ mekanika kanna bii ifihan ohun ti o lẹwa: oju-iwe naa nka bii ẹni ti o nkawe ti o bikita, nitorina ọja naa nka ni ọna kanna.

Imudani ti a lo lati jẹ idiyele. Ẹsẹ Three.js ti ara ẹni lati ọdọ alamọja ọfẹ kan n ṣiṣẹ $5,000 - $20,000 ati gba 3 - 6 ọsẹ. Awọn agbara AI fa iṣubu yẹn si 2 wakati ati ṣiṣanwọle kan.

Vibe Skills

Ṣawari awọn ọgọọgọrun awọn ọgbọn ti a ti ṣetan tẹlẹ fun Claude, Cursor, ati diẹ sii.

Ṣawari Awọn Ọgbọn

Bẹrẹ Ọfẹ Bayi

Awọn Egbe Ti Ẹsẹ Ìdarí Ojúewé 3D Nla Kan

Ẹsẹ akikanju 3D kii ṣe "awoṣe ninu apoti" nikan. Ẹsẹ akikanju ti o n yipada ni awọn ipele marun-un, ati agbara AI nilo lati gbe gbogbo marun-un fun awọn esi lati dabi iṣẹ Linear-grade gaan.

Ipele	Ohun ti o ṣe	Kilode ti o ṣe pataki	Aṣiṣe ti o wọpọ
Awoṣe	Ohun 3D lori iboju (aami, ọja, apẹrẹ abstrakti)	Hook naa. Ohun akọkọ ti olukọwe rii.	Lilo awoṣe iṣura ti o dabi gbogbogbo
Imọlẹ	Awọn maapu ayika + awọn imọlẹ bọtini/kun	Ta dada ohun elo gidi naa	Imọlẹ ayika alapin ti o pa ijinle
Iṣipopada	Yiyi, iṣipopada ti o ni asopọ yiyi, ifesi ifojúwòye	Ṣe oju-iwe naa dabi alãye dipo aimi	Awọn iyipo ada-yiyi ti o dabi ẹrọ aabo iboju
Ajọṣepọ	Parallax kọsọ, awọn faaji titẹ, ṣan yiyi	Fa olukọwe sinu oju-iwe naa	Ko si ajọṣepọ, nitorinaa o n ka bi fidio
Imuduro alagbeka	Aworan aimi tabi ẹda poly kekere lori awọn ẹrọ ifọwọkan	60% ti ijabọ jẹ alagbeka - WebGL n fa batiri	Gbigbe oju-iwe ni kikun lori alagbeka ati fifi LCP silẹ

Agbara ẹ̀sẹ̀ akikanju 3D gidi kan n gbe gbogbo awọn ipele marun-un. Ọkan buburu kan n gbe awoṣe kan ati pe o pe ni ṣe.

Imuduro alagbeka ni aṣiṣe ti o tobi julọ. Three.js lori foonu Android ti ipele-idaraya le ju Dimegraphego LCP lati 1.2s si 4.8s silẹ, eyiti Google samisi bi "oṣiṣẹ". Atunṣe jẹ ọkan ninu awọn awoṣe mẹta:

Posta aimi: ṣe aworan oju-iwe naa si JPG/WEBP didara giga, gbe e bi ẹ̀sẹ̀ akikanju alagbeka, paarọ sinu oju-iwe laaye lori pointer:fine nikan
Iyipada poly kekere:gbe ẹda 200-tri ti awoṣe laisi maapu ayika lori alagbeka
Gbigbe afẹfẹ:fi Kanfasi sii nikan lẹhin ti olumulo yiyi kọja ẹ̀sẹ̀ akikanju, nitorinaa kikun kikun jẹ posta aimi

Gbogbo agbara ẹ̀sẹ̀ akikanju 3D Vibe Skills pẹlu imuduro alagbeka gẹgẹbi aiyipada, kii ṣe ero lẹhin.

5 Agbara AI Fun Awọn Ẹsẹ Akikanju 3D Lori Vibe Skills

Eyi ni awọn agbara ẹ̀sẹ̀ akikanju 3D ti o ni ajọṣepọ marun-un ti a ṣeduro ni 2026. Gbogbo wọn wa ninu Ẹka 3D ti o ni ajọṣepọ lori Vibe Skills ati gbe bi awọn paati react-three-fiber ti o ṣetan lati ṣubu sinu iṣẹ akanṣe Next.js, Remix, tabi Astro kan.

1. Ẹsẹ Ohun Alafoforun Iru-Linear

Awoṣe "ohun akikanju kan ti o n lofofo loke ilẹ ti o fẹ" kan. Kọja aami tabi ami ọja, agbara naa n ṣatunṣe rẹ bi GLTF, n lo ohun elo irin ti a fiwe tabi gilasi, ṣeto imọlẹ eti, ati ṣafikun parallax kọsọ ti o n fi ohun naa si awọn iwọn 6 kuro ni ipo Asin.

Ti o dara julọ fun: Awọn oju-iwe ile SaaS, awọn irinṣẹ dev, fintech, ohunkohun ti o fẹ lati ni rilara bi Linear tabi Arc. Esi: <Hero3D /> React component, GLTF model, 1 mobile poster JPG. Akoko lati gbe: 90 iṣẹju lati titẹ si ti a fi si ipo.

2. Okun Parametric Iru-Stripe

Okun ti nṣiṣẹ / igbi / ṣiṣan ti o n ta iṣipopada ṣaaju ọja. Agbara naa n ṣẹda mesh parametric (noise sine/curl ti n ṣakoso), n lo ohun elo gradient ni awọn awọ ami iyasọtọ rẹ, ati sopọ ipele iṣipopada si ipo yiyi ki okun naa n yipada bi olukọwe ṣe n lọ si isalẹ oju-iwe naa.

Ti o dara julọ fun: Awọn sisanwo, amayederun, awọn ọja API, eyikeyi ifihan nibiti "iṣipopada" jẹ apakan ti aworan atọna naa. Esi: <RibbonHero /> component pẹlu awọn aṣọ-ikunsinu ti o ni asopọ yiyi, imuduro alagbeka jẹ fireemu gradient ti o dakẹ.

3. Ẹsẹ Oju-idẹ Patikulu

Aaye patikulu / awoṣe awoṣe ti a fi sii ti o dahun si kọsọ tabi yiyi. Agbara naa n gbe awọn meshes ti a fi sii 5,000 - 50,000 (ti o ni opin nipasẹ ipele ẹrọ), n ṣakoso wọn pẹlu aaye ariwo, ati ṣafikun olufẹ kọsọ ki awọn patikulu naa yapa ni ayika itọka.

Ti o dara julọ fun: Awọn ọja AI, awọn irinṣẹ data, awọn ami iyasọtọ amayederun, ohunkohun nibiti "iwọn" tabi "imọye" ni ifiranṣẹ naa. Esi: <ParticleHero /> pẹlu ada-didara ada-ada ada-ipele (n dinku nọmba patikulu lori awọn GPU ti o lagbara lati mu 60fps mu).

4. Ẹsẹ Yiyi Ọja 3D

Awoṣe "yi ọja gidi rẹ pada ni 3D loke ilẹ ti o fẹ" kan. Agbara naa gba GLTF ti o pese (tabi ṣẹda ẹda poly kekere kan lati aworan ọja kan nipasẹ aworan-si-3D), n lo imọlẹ ile-iṣere, ati jẹ ki olukọwe fa lati yi pada tabi yipo ada-ada ni idle.

Ti o dara julọ fun: Awọn ami iyasọtọ ohun elo, awọn ọja ti ara, iṣowo e-commerce, asiko, awọn awotẹlẹ irinṣẹ apẹrẹ. Esi: <ProductHero /> pẹlu <OrbitControls /> ti a ṣeto fun pipaarọ iwọn 60, atilẹyin iṣipopada alagbeka ni kikun.

5. Ẹsẹ Oju-iwe Ti Ṣiṣẹ Yiyi

Ẹsẹ akikanju julọ ninu marun-un. Oju-iwe 3D ti ipele pupọ nibiti ipo yiyi kọọkan n paarọ igun kamẹra, imọlẹ, ati ohun ti n ṣiṣẹ lọwọ. Ti a lo nipasẹ awọn oju-iwe ọja Apple, oju-iwe Vercel Edge Functions, ati oju-iwe Liveblocks Yjs.

Ti o dara julọ fun: Awọn ifilọlẹ ọja, awọn ijinle ẹya, ohunkohun ti o sọ itan ipele-mẹta loke ilẹ ti o fẹ. Esi: <ScrollScene /> component ti a ṣe lori react-three-fiber + @react-three/drei + Lenis didan yiyi, pẹlu awọn aaye kamẹra ti orukọ ti o le ṣatunṣe ni JSON.

Ṣawari gbogbo awọn agbara 3D ti o ni ajọṣepọ lori Vibe Skills

Bawo ni Lati Gbe Ẹsẹ Akikanju 3D Kan Ni Labẹ Wakati 2

Gbogbo iṣan-iṣẹ lati "a fẹ ẹ̀sẹ̀ akikanju 3D" si "o wa laaye lori iṣelọpọ." Igbesẹ 1 jẹ nigbagbogbo yiyan agbara ti o tọ lori Vibe Skills - maṣe bẹrẹ nipa kikọ boilerplate Three.js.

Igbesẹ 1: Yan agbara ti o tọ lori Vibe Skills

Lọ si Ẹka 3D ti o ni ajọṣepọ lori Vibe Skills ati ki o ba awoṣe pẹlu ọja rẹ. Ọja dasibọọdu SaaS yan Ẹsẹ Ohun Alafoforun Iru-Linear. Ọja API/infra yan Okun Parametric Iru-Stripe. Ọja ohun elo yan Yiyi Ọja. Ọja AI yan Ẹsẹ Oju-idẹ. Ifilọlẹ itan yan Ẹsẹ Oju-iwe Ti Ṣiṣẹ Yiyi.

Ti o ko ba ni idaniloju, agbara Ẹsẹ Ohun Alafoforun Iru-Linear ni aiyipada ti o ni eewu ti o kere julọ. O ṣiṣẹ fun 70% ti awọn oju-iwe ìdarí SaaS.

Igbesẹ 2: Pese awọn titẹ sii

Gbogbo agbara ẹ̀sẹ̀ akikanju 3D lori Vibe Skills beere fun awọn titẹ sii mẹfa kanna:

Awọn awọ ami iyasọtọ (akọkọ + 1 ifojú, awọn koodu hex)
Aami tabi ami akikanju (SVG ti o fẹ, PNG ti a gba)
Ohun-ini ọja (GLTF, OBJ, tabi JPG ti a ya ọja ti ko ba si faili 3D)
Itọkasi iṣesi (1 - 3 URLs ti awọn aaye ti 3D wọn ṣe rilara bi o ṣe fẹ)
Ipele imọ-ẹrọ (Next.js, Remix, Astro, Vite lasan, bbl)
Ilana alagbeka (posta aimi, poly kekere, tabi gbigbe afẹfẹ)

Ti o ko ba ni GLTF, agbara naa n ṣẹda ẹda poly kekere kan lati aworan ọja kan. Ti o ko ba ni ọja kan, o nlo aami rẹ.

Igbesẹ 3: Ṣẹda ati ṣe ayẹwo

Agbara naa n ṣiṣẹ ati ṣe iṣelọpọ:

Paati react-three-fiber (<Hero3D /> tabi iru rẹ)
Faili awoṣe GLTF
JPG/WEBP posta alagbeka
A next.config.js patch fun mimu ẹru GLTF ti o tọ
README kan pẹlu pipaṣẹ fifi sori ẹrọ

Ṣe ayẹwo lori sandbox laaye ti Vibe Skills. Ṣe iyipada awọ kan, paarọ ohun èlò kan, wo abajade.

Igbesẹ 4: Fi sinu iṣẹ akanṣe rẹ

pnpm add three @react-three/fiber @react-three/drei

Daakọ paati naa sinu folda components/ rẹ, daakọ GLTF sinu public/3d/, ati ki o si gbe paati naa wọle sinu ẹ̀sẹ̀ akikanju rẹ. Agbara naa n gbe awọn iru TypeScript ati pe o le fọ koodu.

Igbesẹ 5: Ṣe ayẹwo iṣẹ ṣiṣe

Ṣe Lighthouse lori kọnputa ati alagbeka. Imuduro alagbeka agbara yẹ ki o jẹ ki LCP wa ni isalẹ 2.5s. Ti o ba rii atẹlẹsẹ kan, paarọ ilana alagbeka lati "gbigbe afẹfẹ" si "posta aimi".

Igbesẹ 6: Gbe

Iye akoko lapapọ lati Igbesẹ 1 si ti a fi si ipo: 90 - 120 iṣẹju fun olumulo akoko-akọkọ. 30 - 45 iṣẹju ti o ba ti gbe ọkan tẹlẹ.

Awọn ibeere ti a Nbeere Nigbagbogbo

Ṣe ẹ̀sẹ̀ akikanju 3D buru fun iṣẹ ṣiṣe?

Bẹẹkọ ti o ba jẹ pe o ti kọ ni deede. Awọn agbara lori Vibe Skills n gbe pẹlu imuduro posta alagbeka ati gbigbe afẹfẹ Kanfasi, nitorinaa ẹ̀sẹ̀ akikanju naa ko da kikun akọkọ duro. Awọn Dimegraphego Lighthouse gidi lẹhin fifi ẹ̀sẹ̀ akikanju 3D ti o kọ daradara kan ṣiṣẹ lori 90+ lori kọnputa ati 80+ lori alagbeka, pẹlu LCP labẹ 2.5s.

Bawo ni iwuwo JS bundle fun Three.js?

Three.js + react-three-fiber + drei ṣafikun ni ayika 120 - 180 KB ti a fọpọ mọ si bundle rẹ. Eyi jẹ afiwe si iṣipopada Lottie ti o tobi ati kekere ju awọn SDK iṣiro julọ lọ. Fọ koodu rẹ lẹhin paati ẹ̀sẹ̀ akikanju ki o le ṣajọ nikan nigbati olukọwe ba de oju-iwe ti o lo 3D gaan.

Ṣe Mo nilo faili awoṣe 3D tabi ṣe agbara AI ṣe ọkan?

Mejeeji n ṣiṣẹ. Ti o ba ni faili GLTF, OBJ, tabi FBX, agbara naa lo taara. Ti o ko ba ni aworan ọja tabi aami rẹ, agbara naa n ṣẹda GLTF poly kekere kan fun ọ ni lilo aworan-si-3D (ni deede 200 - 2,000 awọn onigun mẹta, ti a ṣe iṣapeye fun wẹẹbu). Ṣawari awọn agbara 3D ti o ni ajọṣepọ lati rii eyiti awọn agbara pẹlu aworan-si-3D.

Bawo ni nipa alagbeka? Kò ha ni 3D jẹ ki batiri naa gbẹ?

Awọn agbara lori Vibe Skills n ṣakoso eyi. Iṣẹ ada-ada lori awọn ẹrọ ifọwọkan jẹ posta aimi didara giga, pẹlu oju-iwe 3D laaye ti o n ṣajọ nikan lori ifojúwòye (eyiti ko ni tapa lori ifọwọkan) tabi lẹhin ti olumulo ba yiyi kọja ilẹ ti o fẹ. O tun le yan fun iyipada poly kekere kan ti o ṣiṣẹ lori alagbeka ni 30fps pẹlu idiyele batiri ti ko ṣe pataki.

Ṣe Mo le lo awọn oju-iwe Spline dipo kikọ Three.js?

Bẹẹni. Meji ninu awọn agbara 3D ti o ni ajọṣepọ lori Vibe Skills n gbejade si ọna kika Spline ti o ba fẹ oluṣakoso ti ko ni koodu. Iyipada naa jẹ iwọn bundle - akoko ṣiṣe Spline jẹ 300 - 500 KB ti a fọpọ mọ vs Three.js + r3f ni 120 - 180 KB. Fun oju-iwe titaja kan ti o n gbe ni kiakia, Three.js aise bori. Fun ilana atunṣe ti apẹẹrẹ-dari, Spline bori.

Ṣe ẹ̀sẹ̀ akikanju 3D ti a ṣẹda nipasẹ AI yoo dabi gbogbo eniyan?

Rara - awọn agbara lori Vibe Skills ni a ṣe nipasẹ awọn apẹẹrẹ išipopada ti o ti gbe awọn ẹ̀sẹ̀ akikanju 3D fun awọn aaye SaaS iṣelọpọ. AI n fi awọn ohun-ini ami iyasọtọ rẹ kun, awọn awọ, ati akoonu lakoko ti eto wiwo, eto imọlẹ, ati awọn kọnkọn iṣipopada wa ni ọwọ-ṣe. Ṣawari ẹka 3D ti o ni ajọṣepọ lati ṣe ayẹwo esi gidi ṣaaju ki o ra.

Bawo ni eyi ṣe ṣe afiwe si yiyalo onibara Three.js kan?

Oniṣẹ alamọja Three.js alagbata kan n ṣiṣẹ $80 - $200/wakati ati ẹ̀sẹ̀ akikanju ni deede n gba 30 - 80 wakati pẹlu awọn atunṣe. Iyẹn ni $2,400 - $16,000 fun ẹ̀sẹ̀ akikanju kan, pẹlu iyipo 3 - 6 ọsẹ kan. Ṣiṣanwọle Vibe Skills bẹrẹ ni $39/oṣu ati awọn ọkọ oju omi kan ẹ̀sẹ̀ akikanju ni 90 iṣẹju. Agbara naa sanwo pada lori ẹ̀sẹ̀ akikanju akọkọ ati tẹsiwaju lati sanwo pada kọja gbogbo oju-iwe ọja, gbogbo oju-iwe ipolongo, ati gbogbo aaye kekere ti o gbe.

Ṣe Mo le satunṣe paati ti a ṣẹda lẹhin fifi sori ẹrọ?

Bẹẹni. Ẹsẹ naa jẹ TypeScript lasan + react-three-fiber. Iwọ ni faili naa. Ṣe iyipada awọn awọ, paarọ awọn ohun elo, tun awọn kọnkọn iṣipopada ṣe, yi pada FOV kamẹra. Agbara naa n gbe koodu mimọ, ti a ṣalaye, kii ṣe apoti dudu.

CTA Yiyara: Duro Ni Ṣiṣẹ Awọn Ẹsẹ Akikanju 3D Lati Ipilẹ

Ẹsẹ akikanju 3D ni bayi ni aiyipada fun SaaS ti Ere ni 2026, ni ọna kanna ti iṣipopada Lottie jẹ aiyipada ni 2022. Awọn ẹgbẹ ti n gbe awọn ẹ̀sẹ̀ akikanju 3D kii ṣe gbogbo wọn n ya awọn amọja Three.js - wọn n fi awọn agbara AI sii ti o n gbe gbogbo ipele (awoṣe, imọlẹ, iṣipopada, ajọṣepọ, imuduro alagbeka) ni labẹ wakati 2.

Ti o ba ti n fi ẹ̀sẹ̀ akikanju 3D silẹ nitori idiyele ọfẹ jẹ $8k tabi nitori tikẹti ẹrọ-ṣiṣe ti wa ninu ẹhin lati Q3, o le gbe e ni irọlẹ oni.

Ṣawari awọn agbara ẹ̀sẹ̀ akikanju 3D lori Vibe Skills →

Fojufo idiyele ọfẹ $8,000 ati akoko 6-ọsẹ. Fi agbara ẹ̀sẹ̀ akikanju 3D kan sii lori Vibe Skills.