Phaser - Un framework di gioco open source HTML5 veloce, divertente e gratuito

di 500~20000

80

Ji Zhong porta il male. È meglio andare avanti La buona fortuna porta al male

2

67.207.94.57

Phaser-Afast,funandfreeopensourceHTML5gameframework@mediascreenand(max-width:640px){.tools{padding:var(--spacing-outer);position:relative;display:flex;flex-direction:column;gap:var(--spacing-outer);}.tools-header{align-self:flex-start;display:flex;flex-direction:column;gap:0;}.tools-header.subtitle{font-size:var(--font-size-m);line-height:1.3;}.tools-header-text{flex:1085%;}.tools-header-illustration{width:auto;height:30svh;margin:0auto1emauto;}.tools-header-illustrationimg{width:100%;height:100%;object-fit:contain;}.tools-header-illustration:after{content:"";position:absolute;top:0;left:0;width:100%;height:30svh;background-ime:radial-gradient(closest-side,var(--color-accent-dark)0%,var(--color-black-zero)100%);z-index:-1;}.tools-content-section{margin-bottom:2em;}.tools-content-sectionh3{margin:.5em0;}.tools-content-section-icon{width:9vw;}}@mediascreenand(min-width:640.1px){.tools{padding:var(--spacing-outer);position:relative;}.tools-header{width:calc(60%-var(--spacing-outer));position:sticky;top:calc(1*var(--n-height));}.tools-header-text-title{position:relative;}.tools-header-text-title:after{content:"";position:absolute;top:calc(100%+0.5*var(--spacing-s));left:0;width:6vw;height:2px;background:var(--color-accent);}.tools-header-text-subtitle{font-size:var(--font-size-m);line-height:1.3;max-width:23em;}.tools-header-illustration{width:50%;height:auto;position:relative;left:calc(-.75*var(--spacing-outer));pointer-events:none;margin-bottom:-1em;}.tools-header-illustrationimg{width:133.333%;height:auto;}.tools-header-illustration:after{content:"";position:absolute;top:-33.333vh;left:-27.5vw;width:55vw;height:100vh;background-ime:radial-gradient(closest-side,var(--color-accent-dark)0%,var(--color-black-zero)100%);z-index:-1;}.tools-content{width:40%;margin-left:60%;}.tools-content-section{margin-bottom:2em;}.tools-content-sectionh3{margin:.5em0;}.tools-content-section-icon{width:3vw;}}@mediascreenand(max-width:640px){.phaser_logo{width:calc(7.6*var(--font-size-base));height:calc(1.6*var(--font-size-base));}.phaser_logo--lightpath{stroke:var(--color-black,#000);}.phaser_logo--lightrect{fill:var(--color-black,#000);}}@mediascreenand(min-width:640.1px){.phaser_logo{width:10.13vw;height:2.1vw;}.phaser_logo--lightpath{stroke:var(--color-black,#000);}.phaser_logo--lightrect{fill:var(--color-black,#000);}}.home{transition:all.5sease-out;}#space{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:;}.home{margin:auto;padding:0;max-width:100%;color:var(--color-white);}.toast{padding:.5em1em;color:white;display:flex;justify-content:space-between;align-items:center;max-width:600px;margin:4emauto1em;position:absolute;z-index:100;right:0;background:linear-gradient(-135deg,var(--color-accent-dark)0%,var(--color-black)100%);color:var(--color-accent-lighter);box-shadow:0036px6pxrgba(161,193,255,0.25);}.toastbutton{font-size:var(--font-size-l);color:white;background-color:transparent;border:none;cursor:pointer;padding-bottom:.25em;}.toast.toast-hidden{display:none;}.toast.toast-closed{animation:allert-slide-up.3sease-out;}@keyframesallert-slide-up{from{transform:translateX(0);opacity:1;}to{transform:translateX(120%);opacity:0;}}window.dataLayer=window.dataLayer||[];functiongt(){dataLayer.push(arguments);}gt('js',newDate());gt('config','G-7NC8GZ639E');WhyPhaserNewsPricingGamesResourcesExamplesGettingStartedMakingyourfirstGameDocumentationTutorialsCommunityLoginSignupTheJascriptGameFrameworkThousandsofgamesMillionsofplayersBillionsofsessionsDownloadPhaserGetPhaserEditorCreateimmersive,physics-rich2DworPhaser - Un framework di gioco open source HTML5 veloce, divertente e gratuitolds.PhaserBox2DAhigh-performance,industry-standard2DphysicsenginebuiltonBox2Dv3,deliveringincrediblyrealisticandengingwebgameexperiences.LearnmoreWhyusePhaser?Foroveradecade,Phaserhasenableddevelopersofallskilllevelstocreategamesfortheweb.Useitifyoucareaboutanyofthefollowing:Super-fast2DgamesWithaconstantlyimprovinghardwarerenderer,itdoesn'tmatterifyou'recreatingthenextbullet-hellhitonSteam-Phasercanhandleit.FriendlyAPIWecareaboutthedeveloperexperiencedeeplyandyou'llseethisreflectedinouruser-friendlyAPIthatisfullydocumentedandeasytoextend.First-classwebcitizenPhaserisbuiltonandaroundwebstandardsandputsthebrowserfirst.Webexportisn'tanafterthoughtorcheckboxonafeaturelist;it'sourhome.Open-sourcePhaserisfullyopensourceandyou'veunrestrictedaccesstoeverylastlineofcodeinthecorelibrary.CompactbuildsDon'tforceyourplayerstowaitforchunkyWASMfiles.Phaserwilleasilyfitintosub-200KBbuilds(min+gz).That'sa0.08seconddownloadon4G.IntegrateswithReact,Vue,SveltePhaserhasmoreready-madetemplatesthananyothergameframework,andagreatCLItool.DistributeanywhereYou'dbeamazedwhereyoucanfindwebgames.DiscordActivities,YouTubePlayables,FacebookInstantMessenger,AppStore,GooglePlay,Steamandmanymore.Webgamesareeverywhere.TrustedbyhundredsofglobalbrandsGamesmadewithPhaserhebeenusedasthecornerstoneformarketingcampaignsforyears.They'vebeendeployedeverywhereincludPhaser - Un framework di gioco open source HTML5 veloce, divertente e gratuitoingasprominentfeaturesonsitesformajorHollywoodfilmblockbusters,massivebrandpromotionalcampaigns,educationalcontent,interactiveexperiences,TVshows,newsreports,charityfund-raisingbroadcasts,liveeventsmarketing,andsomanymore.IfyoucreateaPhasergameforyournextcampaign,yPhaser - Un framework di gioco open source HTML5 veloce, divertente e gratuitoou'llbeinthecompanyofbrandssuchas:GamesbuiltwithPhaserDangleDropOrchestratingthePerfectChainReaction:ASymphonyofFallingDotsPlayGameEggHuntManiaScramblingforsuccessinthisfast-pacedegg-catchingchallengePlayGameArenaSurvivorsAbullethellgameinwhichyouvisitinterestingplacesanddestroyeverythinginsight.PlayGameTheCrazyHyper-DungeonChroniclesAfreshtakeonroguelitecrawlerswhereproceduraldungeonsmeetwittychaos.PlayGameCurveliciousAFast-PacedMultiplayerTwistonClassicSnakeGamesPlayGameIfyoubuildittheywillcomePhaserEditorPhaserEditoroffersacomprehensivesuiteoftoolsthatallowsyoutovisuallylayoutyourgames.DranddropobjectsintoplacewithoutcodeQuicklybuildupcomplexscenesorgamelayoutsfromyourownartassets.Rotate,scale,applyeffects,hookupbehiors,andeditobjectpropertiesinrealtime.Whenyou'refinishedwiththelayout,PhaserEditorgeneratessourcecodethatyoucaneasilyeditinyourforiteIDE,suchasVSCode.Yourbrowserdoesnotsupportthevideot.ExploreFeaturesGetPhaserEditorFrameworkFriendlyNeedtointegrateagameintoasitecreatedwithamodernframeworksuchasReact,Vue,NextJS,orSvelte?Phaserhasgotyoucovered.We'vemoreintegrationtemplatesailablethananyothergameframework,andnewonesarebeingaddedfrequently.Soifyou'renotsureifitshouldbeuseEffectoruseSideEffect,letourtemplatestaketheworryawayandseyouprecioustimeintheprocess.Wehetemplatesailableforallofthefollowing:(AndmostareailableinbothJaScriptandTypeScriptversions)ReactVueNextJSSvelteRemixSolidJSBunViteWebpackESBuildRollupParcelAreyoumoreofaCLIfiend?Prefertoreachfortheterminalratherthanyourmouse?Ustoo!That'swhywebuiltthecreate-phaser-gameCLIapp.Simplyinvokethecommandandwalkthroughourinteractiveinstaller.Pickfromanyoftheframeworkorbundlertemplatesonoffer,orinstallsomesampledemogamesalllocalandreadytogo.npmcreate@phaserjs/game@latestCopynpx@phaserjs/create-game@latestCopyyarncreate@phaserjs/gameCopypnpmcreate@phaserjs/game@latestCopybuncreate@phaserjs/game@latestCopySupportforIndustry-leadingtoolsPhasersupportsthefollowingpopularassetworkflowtoolsoutofthebox:TexturePackerTheleadingsoftwareforfastcreationoftextureatlasesandspritesheets.Essentialforoptimizingrenderingperformanceandloadtimes.TexturePackerhasnativesupportforPhaser.SpineFluidbone-basedanimationsupportviaacustommadeSpinepluginthatismaintainedinparallelwithreleasesoftheSpineeditor.UnityPhasercanloadandparseUnityatlasfiles,allowingyoutoexchangeassetsfromyourUnityprojectswithPhaser.TiledApopularopen-sourcetilemapeditingsoftware.PhasercanimportanduseTiledmapdata.AsepriteForthosewholovetocreatepixelart,PhasercanimportAsepriteanimationandframedatadirectly.SpriteIlluminatorCreatenormalmapsfromyourtexturesandthenusethemdirectlyinPhaserviaitslightingsystem.AliasWefrontPhaseralsoincludessupportforloadingOBJfiles,whichitsMeshGameObjectcantakeadvanteof.AlthoughPhaserisnota3Dengine,itcandisplaysimple3Dobjectsin-game.IndustriesthatusePhaserWeb3CasinoPlayablesPortalsEducationalBrandIndieGamesDiscordActivitiesMMOsWherecanPhasergamesbeplayed?SteamAppStoreGooglePlayBrowserYouTubeDiscordInstantMessengersTheleadingopen-sourceframeworkforfastandeasyHTML5gamedevelopment.DownloadPhaserStartFreeTrialofPhaserEditor©2024PhaserStudioInc.Allrightsreserved.Privacy&CookiePolicyv3.87.0PhaserEditorDocumentationForumsTwitterRedditDiscordconstcliCommands=document.querySelectorAll('.framework-friendly-cli-command')cliCommands.forEach((command)=>{constcode=command.querySelector('code')if(!code)returnconstbutton=command.querySelector('button')button?.addEventListener('click',(e)=>{e.preventDefault();nigator.clipboard?.writeText(code.innerText)constcopiedMesse=document.createElement('span')copiedMesse.innerText=nigator.clipboard?.writeText?'Copiedtoclipboard!':'Copynotsupported'copiedMesse.classList.add('copied-messe')code.appendChild(copiedMesse)setTimeout(()=>{copiedMesse.remove()},3000)})})consttoastCloseButtons=document.querySelectorAll('.toastbutton.toast-close');toastCloseButtons.forEach(button=>{button.addEventListener('click',()=>{button.closest('.toast').classList.add('toast-closed');setTimeout(()=>{button.closest('.toast').classList.add('toast-hidden');},300);});});gsap.registerPlugin(ScrollTrigger);window.onload=()=>{letwindowCenter={x:window.innerWidth/2,y:window.innerHeight/2};gsap.to(document.documentElement,{'--scroll-y':window.scrollY.toString(),duration:0.3})window.addEventListener('resize',()=>{gsap.to(windowCenter,{x:window.innerWidth/2,y:window.innerHeight/2,duration:0.5});},{passive:true});constobserver=ScrollTrigger.observe({type:'pointer',onMove:(e)=>{if(!e.x||!e.y)return//constmouseX=e.x/window.innerWidth;//constmouseY=e.y/window.innerHeight;constmouseXDelta=(e.x-windowCenter.x)/windowCenter.x;constmouseYDelta=(e.y-windowCenter.y)/windowCenter.y;//letxTo=gsap.quickTo(document.documentElement,"--mousex",{duration:0.3});//letyTo=gsap.quickTo(document.documentElement,"--mousey",{duration:0.3});letxDeltaTo=gsap.quickTo(document.documentElement,"--mousex-delta",{duration:0.3});letyDeltaTo=gsap.quickTo(document.documentElement,"--mousey-delta",{duration:0.3});//xTo(mouseX);//yTo(mouseY);xDeltaTo(mouseXDelta);yDeltaTo(mouseYDelta);}});constelsScrollIn=document.querySelectorAll('[data-scroll-delta-in]')constelsScrollOut=document.querySelectorAll('[data-scroll-delta-out]')constelsScrollOutTop=document.querySelectorAll('[data-scroll-delta-out-top]')constelsScrollInOut=document.querySelectorAll('[data-scroll-delta-inout]')if(elsScrollInOut){elsScrollInOut.forEach(el=>{gsap.fromTo(el,{'--scroll-delta':-1},{'--scroll-delta':1,scrollTrigger:{trigger:el,start:"075%",end:"100%25%",scrub:1}})})}if(elsScrollIn){elsScrollIn.forEach(el=>{gsap.fromTo(el,{'--scroll-delta':-1},{'--scroll-delta':0,scrollTrigger:{trigger:el,start:"075%",end:"50%55%",scrub:true}})})}if(elsScrollOut){elsScrollOut.forEach(el=>{gsap.fromTo(el,{'--scroll-delta':0},{'--scroll-delta':1,scrollTrigger:{trigger:el,start:"50%45%",end:"100%25%",scrub:true}})})}if(elsScrollOutTop){elsScrollOutTop.forEach(el=>{gsap.fromTo(el,{'--scroll-delta':0},{'--scroll-delta':1,ease:'linear',scrollTrigger:{trigger:el,start:"0%0%",end:"100%0%",scrub:true}})el.classList.add('scrollTrigger_inititated');})}}