Porychwch gannoedd o sgiliau parod ar gyfer Claude, Cursor, a mwy.
Mae Rhyngwyneb Gemau'r Creawdwr Indie Gorau (ac nid yw neb yn sôn amdano)
Mae'r rhan fwyaf o grewyr indie yn lansio prototeip gêm weithredol mewn pythefnos. Yna, maent yn treulio'r tri mis nesaf yn sownd ar y rhyngwyneb defnyddiwr. Botymau sy'n edrych fel celf y rhaglennydd. Gorchuddion HUD sy'n ymladd â'r camera. Gridiau rhestr eiddo a adeiladwyd gyda position: absolute a gweddïau. Mae galluoedd deallusrwydd artiffisial ar gyfer rhyngwyneb gemau ar Vibe Skills yn cynhyrchu systemau dewislen, HUDs, a gorchuddion cydlynol ar gyfer gemau porwr mewn un sesiwn - felly gallwch lansio'r gêm, nid y sgrin gosodiadau.
Mae'r canllaw hwn yn mynd drwyddo pam mae'r rhyngwyneb defnyddiwr yn penderfynu cadw defnyddwyr, y chwe gorchudd rhyngwyneb defnyddiwr y mae pob gêm ei angen, y galluoedd rhyngwyneb gemau deallusrwydd artiffisial sydd ar gael ar Vibe Skills, a gweithrediad penwythnos i lansio pecyn rhyngwyneb defnyddiwr cyflawn.
Porychwch gannoedd o sgiliau parod ar gyfer Claude, Cursor, a mwy.
Pam Mae Rhyngwyneb Gemau'r Creawdwr Indie Gorau
Mae chwaraewyr yn beirniadu eich gêm yn y 90 eiliad gyntaf, ac mae'r rhan fwyaf o'r eiliadau hynny'n cael eu treulio o fewn y rhyngwyneb defnyddiwr. Dewislen bennaf, gosodiadau, awgrymiadau rheoli, yr HUD cyntaf y maent yn ei weld pan fydd y gêm yn dechrau. Os yw'r rhyngwyneb defnyddiwr yn teimlo'n anwastad, ni fydd y chwarae yn cael cyfle erioed.
Ychydig o rifau y dylid eu cofio:
- Mae 38% o chwaraewyr yn rhoi'r gorau i gêm borwr yn y sesiwn gyntaf os yw'r ddewislen bennaf yn teimlo'n ddiffygiol neu heb ei steilio (data prawf chwarae itch.io, 2025).
- Mae prif ddewislen Hollow Knight yn 4 botwm, wedi'i luniadu â llaw, ac yn rhedeg ar 60fps - ac mae'n un o'r rhesymau mwyaf a grybwyllir dros i chwaraewyr aros drwy'r 30 munud cyntaf bras.
- Mae sgrin saib Celeste yn defnyddio 3 maint teip a 2 liw. Dyna'r system ryngwyneb defnyddiwr gyfan. Mae cynildeb yn darllen fel ansawdd.
- Mae gemau â chyllidebau mawr yn treulio 15-20% o'u cyllideb cynhyrchu gyfan ar UI/UX. Mae grewyr indie fel arfer yn treulio 0%.
Mae'r bwlch hwnnw'n union beth mae galluoedd deallusrwydd artiffisial wedi'u hadeiladu i'w gau.
Porychwch gannoedd o sgiliau parod ar gyfer Claude, Cursor, a mwy.
Y Chwe Gorchudd Rhyngwyneb Defnyddiwr Y Mae Pob Gêm Ei Angen
Cyn i chi gynhyrchu dim byd, gwybod beth rydych chi'n ei gynhyrchu. Mae angen yr un chwe gorchudd rhyngwyneb defnyddiwr ar bob gêm borwr - platfformwr 2D, saethwr 3D, cliciwr segur, cerdded-sim. Mae gallu deallusrwydd artiffisial da yn cyflenwi pob un ohonynt mewn un system steil cydlynol.
| Gorchudd | Pwrpas | Camgymeriadau cyffredin | Beth mae "da" yn edrych fel |
|---|---|---|---|
| Dewislen bennaf | Y cyntaf argraff. Mae'n gosod cyfeiriad y celfyddydau. | Ffontiau porwr rhagosodedig, testun wedi'i ganoli, dim cyflwr hofran | 3-5 botwm uchafswm, tipograffiaeth arferol, micro-animeiddiad hofran, cylch gefn |
| Gorchudd HUD | Gwybodaeth yn ystod y gêm: iechyd, sgôr, ammo, amserydd | Rhifau yn arnofio mewn corneli ar hap, dim grwpio, ymladd â camera | Wedi'i angori i gorneli, lled-dryloyw, wedi'i grwpio yn ôl math data, yn pylu pan yn segur |
| Rhestr eiddo / llwytho | Sgrin rheoli eitemau | Grid 16 colofn, dim printeiddrwydd eitem, awgrymiadau sy'n blocio'r sgrin | Grid 4-8 colofn, printeiddrwydd lliw-cod, awgrym ar yr ochr, llusgo-a-gollwng neu glicio |
| Gosodiadau / opsiynau | Sain, rheolaethau, graffeg | Un rhestr enfawr y gellir sgrolio ohono o toglo | Tabiau (Sain / Fideo / Rheolaethau), llithryddion yn lle toglo, "Gwneud cais" + "Ailosod i ddiofyn" |
| Dewislen saib | Torri ar draws y gêm ganol | Modd sy'n cuddio'r gêm gyfan | Gorchudd ar 60% opasiti, 4-5 opsiwn, "Ailgychwyn" wedi'i ganoli'n awtomatig ar gyfer bysellfwrdd |
| Sgrin derfynol | Ennill, colli, neu grynodeb o'r rhediad | "Game Over" mewn Arial coch, dim botwm ailchwarae | Crynodeb o ystadegau, CTA mawr "Chwarae eto", "Dewislen bennaf" eilradd |
Mae gêm gyda 6 gorchudd rhyngwyneb defnyddiwr wedi'i mireinio yn teimlo'n orffenedig. Mae gêm gyda 6 gorchudd heb ei steilio yn teimlo fel prosiect ysgol, ni waeth pa mor dda yw'r chwarae.
Y peth anoddaf yw cadw pob un o'r 6 yn gydlynol - yr un teulu ffontiau, yr un radiws botwm, yr un ymddygiad hofran, yr un palet lliwiau. Dyna lle mae galluoedd deallusrwydd artiffisial yn ennill eu cadw.
5 Gallu Rhyngwyneb Gemau Deallusrwydd Artiffisial ar Vibe Skills
Mae'r gategori Gemau 3D ar Vibe Skills yn cynnwys 30+ gallu sy'n ymdrin â gemau chwaraeadwy llawn a'r systemau rhyngwyneb defnyddiwr sy'n eu cludo. Dyma'r pum gallu sydd wedi'u gosod fwyaf sy'n canolbwyntio ar ryngwyneb defnyddiwr.
| Gallu | Gorau ar gyfer | Peiriannau | Allbwn |
|---|---|---|---|
| Generadur Pecyn Rhyngwyneb Gemau Porwr | Rhyngwyneb cyflawn 6 gorchudd mewn un steil cydlynol | Three.js, Phaser, JS dilys | System orchudd HTML/CSS + dalennau sprite |
| System Gorchudd HUD | HUD yn unig yn ystod y gêm (iechyd, sgôr, minimap, amserydd) | Three.js, Phaser, Unity WebGL, Godot HTML5 | Gorchudd wedi'i osod gan CSS neu sprites cynfas |
| Pecyn Sgrin Saib + Gosodiadau | Saib, gosodiadau, ail-fapio rheolaethau | Unrhyw injan gêm sy'n seiliedig ar y we | Cydrannau modwl React/HTML |
| System Awgrym Rhestr Eiddo + Clob | Gridiau eitem, llusgo-a-gollwng, lliwiau printeiddrwydd, awgrymiadau | Three.js, Phaser, Unity WebGL | Llyfrgell gydran + templedi cerdyn eitem |
| Combo Dewislen Bennaf + Sgrin Derfynol | Y cyntaf ac olaf argraffiadau | Unrhyw | Dewislen animeiddiedig gyda Lottie + sgrin ystadegau diwedd gêm |
Mae'r 5 gallu i gyd yn cyflenwi gyda ffile token dylunio rhannadwy (lliwiau, ffontiau, bylchau, llyfnu) felly mae'r gorchuddion yn edrych fel eu bod wedi dod gan yr un dylunydd. Mae'r rhan fwyaf o becynnau UI indie yn methu'r prawf hwn - mae'r ddewislen yn defnyddio un ffont, mae'r HUD yn defnyddio un arall, ac mae chwaraewyr yn sylwi ar unwaith.
Pori galluoedd Gemau 3D ar Vibe Skills →
Adeiladu Pecyn Rhyngwyneb Gemau Cyflawn mewn Penwythnos
Dyma'r weithrediad gwirioneddol a ddefnyddir gan grewyr indie sy'n lansio gemau porwr ar itch.io a Newgrounds. Amser cyflawn: ~12 awr waith dros benwythnos.
Cam 1: Dewiswch allu UI ar Vibe Skills
Agorwch y gategori Gemau 3D a gosodwch allu'r Generadur Pecyn Rhyngwyneb Gemau Porwr. Dyma'r unig un sy'n cyflenwi'r 6 gorchudd i gyd mewn un system token cydlynol. Os oes gan eich gêm ddewislen weithredol eisoes ac mai dim ond HUD y mae ei angen arnoch, gosodwch yr allu HUD Overlay annibynnol yn lle hynny.
Cam 2: Diffiniwch "fibe" eich gêm mewn 3 gair
Cyn cynhyrchu, ysgrifennwch 3 gair sy'n disgrifio tôn eich gêm. Enghreifftiau: "neon, bras, cyflym" (saethwr synthwave), "meddal, dŵrlyd, araf" (gêm bysgota), "ciwbig, retro, picsel" (metroidvania). Mae'r gallu yn defnyddio'r rhain fel mewnbwn ar gyfer y palet lliwiau, dewis tipograffiaeth, a llyfnu animeiddio. Peidiwch â hepgor hyn - mae mewnbwn generig yn cynhyrchu UI generig.
Cam 3: Cynhyrchu'r tocynnau dylunio yn gyntaf
Mae'r gallu yn allbwn ffeil tokens.css neu gynllun Tailwind gyda'ch palet, pentwr ffontiau, radiws botwm, graddfa bylchu, ac amseriad animeiddio. Adolygwch hyn cyn cynhyrchu unrhyw UI gwirioneddol. Os yw'r tocynnau'n edrych yn anghywir yma, bydd pob gorchudd yn edrych yn anghywir. Addaswch nes i chi ei garu.
Cam 4: Cynhyrchu'r 6 gorchudd i gyd mewn un swp
Gyda thocynnau wedi'u cymeradwyo, rhedegwch y cynhyrchiad llawn o 6 gorchudd. Yr allbwn yw ffolder o ffeiliau HTML/CSS (neu gydrannau React, yn dibynnu ar eich peiriant) ynghyd â dalen sprite SVG ar gyfer eiconau. Ar gyfer Three.js neu Phaser, defnyddiwch yr opsiwn gorchudd HTML (DOM wedi'i osod uwchben y cynfas gyda pointer-events: none ar y trawsfuddiwr). Ar gyfer Unity WebGL neu Godot HTML5, defnyddiwch yr amrywiad sy'n seiliedig ar gynfas y mae'r gallu'n ei gyflenwi.
Cam 5: Ei wifro i mewn i'ch cylch gêm
Cysylltwch yr HUD â chyflwr eich gêm (gwerth iechyd, sgôr, amserydd). Mae'r rhan fwyaf o alluoedd yn cynnwys addasydd bach GameUIState sy'n datgelu API fel setHealth(0.7) fel nad oes rhaid i chi gyffwrdd â newidynnau CSS â llaw. Gwifrau saib, gosodiadau, a digwyddiadau sgrin derfynol i'ch trinwr mewnbwn presennol.
Cam 6: Profi gyda 3 dieithryn ac adolygu
Bydd ffrindiau'n dweud wrthych fod yr UI yn wych. Bydd dieithriaid yn dweud yr am wir. Postiwch adeilad i itch.io, gofynnwch i 3 o bobl ar hap chwarae am 5 munud, a gwyliwch y recordiad. Bydd y bygiau UI sy'n bwysig yn ymddangos yn y 60 eiliad gyntaf. Trwsiwch y rhain, ail-gynhyrchu'r gorchudd yr effeithiwyd arno, lansio.
Amser cyflawn: Cam 1-3 (~1 awr) + Cam 4 (~30 munud) + Cam 5 (~6-8 awr o integreiddio) + Cam 6 (~3 awr o gylchoedd prawf chwarae) = penwythnos.
Byddai dylunydd UI llawryf yn codi $3,000-$8,000 am yr un cwmpas ac yn cymryd 4-6 wythnos. Mae tanysgrifiad ar Vibe Skills yn dechrau ar $39/mis ac yn rhoi cenhedlaethau anghyfyngedig i chi - felly gallwch chi ddatblygu gymaint o weithiau ag y dymunwch nes bod yr UI yn teimlo'n iawn.
Gosod allu UI gêm ar Vibe Skills →
Cwestiynau aml eu gofyn
A ddylwn i adeiladu UI fy ngêm fel gorchudd HTML/CSS neu'n uniongyrchol ar y cynfas?
Ar gyfer y rhan fwyaf o gemau porwr, mae gorchudd HTML/CSS uwchben cynfas Three.js neu Phaser yn gyflymach i'w adeiladu, yn haws i'w wneud yn hygyrch, ac yn cynhyrchu testun yn glir ar unrhyw benderfyniad. Defnyddiwch UI sy'n seiliedig ar gynfas dim ond pan fydd angen cydraniad artistig perffaith (gêm celf picsel llym) neu pan fydd digwyddiadau DOM yn ymyrryd â mewnbwn. Mae'r galluoedd ar Vibe Skills yn cyflenwi'r ddau amrywiad.
A fydd yr UI yn gweithio ar symudol, neu a oes angen adeilad symudol ar wahân arnaf?
Mae'r Pecyn Rhyngwyneb Gemau Porwr ar Vibe Skills yn cynhyrchu cynlluniau ymatebol sy'n gweithio ar ddyfeisiau cyffwrdd allan o'r bocs - targedau tap mwy, gorchuddion rheoli symudol sy'n newid i mewn (D-pad a botymau gweithredu), a dewislen saib sy'n ganolog i symudol. Nid oes angen adeilad ar wahân arnoch, ond mae angen i chi brofi ar ffôn go iawn. Mae offer datblygwr porwr yn celwydd am berfformiad cyffwrdd.
Pa mor hygyrch all UI gemau fod yn realistig?
Gall gemau porwr gyrraedd WCAG AA yn hawdd ar gyfer dewislenni, gosodiadau, a HUDs - llywio bysellfwrdd, cylchoedd ffocws, cyferbyniad lliw 4.5:1, a labeli darllenydd sgrin ar gyfer sgôr ac iechyd. Mae'r dull gorchudd HTML yn gwneud hyn oll bron yn rhad ac am ddim. Mae'r galluoedd ar Vibe Skills yn cynhyrchu marcio hygyrch yn ddiofyn. Mae'r chwarae gwirioneddol yn fwy anodd i'w wneud yn hygyrch, ond ni ddylai'r UI fod y rhwystr.
A yw'r un pecyn UI yn gweithio ar gyfer adeiladau Unity WebGL a Godot HTML5?
Yn bennaf ie. Mae Unity WebGL a Godot HTML5 ill dau yn cynhyrchu i gynfas, a gallwch osod gorchudd DOM uwchben. Mae'r galluoedd yn cynnwys addaswyr ar gyfer y ddau beiriant fel bod yr UI yn siarad â chyflwr eich gêm. Mae angen pont denau ar nodweddion penodol i Unity (fel y system ddigwyddiadau adeiledig) - mae'r gallu'n cyflenwi cod sampl ar gyfer y bont honno.
Sut ydw i'n cadw'r ddewislen, yr HUD, a'r rhestr eiddo yn gyson yn weledol?
Dyma'r rheswm rhif 1 pam fod UI gemau indie yn edrych yn amatur - 6 gorchudd wedi'u dylunio ar wahân. Yr ateb yw tocynnau dylunio rhannadwy: un ffeil sy'n diffinio lliwiau, ffontiau, bylchau, a llyfnu. Mae pob gorchudd yn mewnforio o'r ffeil honno. Mae'r galluoedd ar Vibe Skills yn gwneud hyn yn awtomatig - cynhyrchu tocynnau unwaith, cynhyrchu'r 6 gorchudd i gyd o'r tocynnau hynny, wedi'i wneud.
A allaf addasu'r UI a gynhyrchir heb dorri'r gallu?
Oes. Mae'r galluoedd yn allbwn HTML, CSS, a (opsiynol) gydrannau React y gellir eu golygu. Mae'r ffeiliau'n eiddo i chi. Mae'r rhan fwyaf o grewyr yn addasu lliwiau, yn newid logo, yn disodli eiconau, ac yn newid un neu ddau o siâp botwm - dyna ni. Os oes angen newid steil mawr arnoch, ail-gynhyrchu o docynnau wedi'u diweddaru yn lle ysgrifennu'r gorchuddion â llaw.
Beth os oes gan fy ngêm eisoes UI hanner-adeiladedig - a ddylwn i ei daflu allan?
Na. Gosodwch allu HUD Overlay neu becyn annibynnol Sgrin Saib + Gosodiadau a disodli un gorchudd ar y tro. Mae'r rhan fwyaf o grewyr indie yn uwchraddio'r ddewislen bennaf yn gyntaf (y mwyaf gweladwy), yna'r HUD (y mwyaf a ddefnyddir), yna gosodiadau a saib (y lleiaf a ddefnyddir ond y mwyaf diffygiol). Byddwch yn teimlo'r neidio ansawdd ar ôl i'r gorchudd cyntaf gael ei lansio.
Lansio'r UI, Yna Lansio'r Gêm
Mae UI gemau yn lladd tawel prosiectau indie. Gall y chwarae fod yn ddisglair, ond os yw'r ddewislen yn edrych fel thema WordPress ddiofyn, mae chwaraewyr yn neidio mewn 90 eiliad. Mae UI wedi'i mireinio - tocynnau cydlynol, HUD wedi'i angori, gosodiadau glân, sgrin derfynol fodlon - yw'r hyn sy'n gwneud i lawrlwythiad 4 awr o itch.io deimlo fel cynnyrch go iawn.
Neidio'r ail-ddyluniad UI 4 wythnos. Cynhyrchu pecyn llawn o 6 gorchudd mewn penwythnos, ei wifro, ac ewch yn ôl i wneud y gêm yn hwyl.
Pori galluoedd UI gemau ar Vibe Skills →
Peidiwch ag adeiladu UI gemau o'r dechrau. Gosod allu pecyn UI ar Vibe Skills a lansio'r ddewislen, HUD, rhestr eiddo, gosodiadau, saib, a sgrin derfynol mewn un sesiwn.