Leaderboard


Popular Content

Showing content with the highest reputation since 10/22/19 in all areas

  1. 4 points
    supertommy

    Phaser 3 Examples in TypeScript

    Here’s a work-in-progress of Phaser 3 examples in TypeScript: https://examples.ourcade.co/phaser3-typescript You can make changes in the editor with code complete, static analysis, and more and then test it immediately in the browser. Right now, I am taking the official Phaser 3 examples and turning them into TypeScript with a more modern format. You can also get the examples as a Github repository without the website frontend: https://github.com/ourcade/phaser3-typescript-examples Hope this helps make it easier for people comfortable with webdev or any other dev but new to gamedev 🤗
  2. 4 points
    enpu

    Video plugin

    Play MP4 videos in your games. Download: https://www.panda2.io/plugins/video
  3. 4 points
    vornay

    Google GameSnacks

    https://www.gamesnacks.com "Bite-sized HTML5 games, accessible to everyone." https://www.gamasutra.com/view/news/358551/Google_wants_to_bring_HTML5_titles_to_lowend_devices_with_GameSnacks.php "Google has announced a new HTML5 platform called GameSnacks that's designed to help devs bring quick, casual games to any device."
  4. 4 points
    Hey. Some info from us. Please note this is an info for a full catalog of our games (88 titles in total, 5 new games added in 2019). Browser Html5 games - we (team of 5) make a living out of it. Some licenses, some b2b deals, some ads. Facebook Instant Games - was super nice in 2018. In 2019 our reveue from games (old and new) is rather small. Still makes a little sense to publish new games there. Mobile games - zero. null. nada. Not a single dollar.
  5. 4 points
    Stephan

    Is Panda 2 Dead?

    Hi all, I just wanted to let you know that Panda is still my primary game engine and I have no plans to abandon Panda. The absence of @enpu is unfortunate but don't forget that Panda is open source so most of the time, it is possible to fix minor issues yourself by having a look in the source code. Currently I have two large commercial projects powered by Panda and it is expected that these project will be running for at least several years. Don't forget that Panda by itself is a great engine and that it has a couple of features that not all other engines currently are supporting. Take hires support and the custom Panda GUI for example, these are just great! I will continue to read this forum on a regular basis. If there are questions that I can answer quickly, you can count on my support. Stephan
  6. 3 points
    Hello! I have been working on a 3D rendering library built on top of PixiJS, and just want to find out if anyone would be interested to try it and give feedback. Pixi3D is a JavaScript library which makes it easy to render 3D graphics on the web. It works for both desktop and mobile web browsers and includes several components which makes it easy to create nice looking 3D scenes out-of-the-box: Load models from file or create procedural generated meshes Supports physically-based rendering (PBR) and image-based lighting (IBL) Transformation, morphing and skeletal animations Customized materials and shaders Built on top of the widely used PixiJS library which makes it simple to combine 2D and 3D You can go to https://pixi3d.org/demo/drone/ to view a real-time demo or visit https://github.com/jnsmalm/pixi3d to download and read more about it.
  7. 3 points
    enpu

    Download free game source codes

    Three full game source codes now available for download: https://www.panda2.io/sources These are totally free, if you have Panda 2 license.
  8. 3 points
    jeroen

    Pixi.js Showcase

    I just finished my coloring app! Browser / iOS / Android It took a while with some years inbetween. Aaaalll the way back in 2017 I was trying to get some basic drawing going and got it working with the help of Ivan. Thanks @ivan.popelyshev ! Looking back at this example, it's pretty much the same as in the app. Thanks for the amazing library and all the support on these forums! it's been really helpful
  9. 3 points
    britzl

    Discoverability & Monetization

    Like @end3r we (the Defold Foundation) were also awarded a grant from Grant for the Web to explore the use of Web Monetization in games. The Defold Foundation will use the grant to integrate, promote and support the use of Web Monetization in web games created using Defold. The Defold Foundation will integrate Web Monetization through its plugin system, promote it through examples and tutorials and host a game jam focused on Web Monetization. We have a first version the engine and editor integration ready for testing (more info). Next up is to create the sample game and start planning for the game jam.
  10. 3 points
    sanojian

    Fake 3D models in Phaser 2

    I got tired of looking for animated sprites for every game, so I decided to make a little fake 3D engine for pixel graphics. Now I can code my own procedural animations I am hoping to use this is in a variety of games I am working on, including a little fantasy mmo.
  11. 3 points
    coder2012

    Hangman - Pixijs and Effector

    Hi, I wanted to share a small game I made to try out Effector the state manager with Pixijs. hangman demo I wrote an article about it also Read more
  12. 3 points
    wincent95

    Pixi.js Showcase

    I built this website that was projected on to a transparent touchscreen for an exhibition at Museum of Science and Technology in Stockholm, Sweden. It might be hard to see in the video but visitors are challenged with a range of ethical questions about technical and medical development at three of these stations. I mainly used Pixi for all the great filters like Pixelate and CRT. It really worked out great! The whole project took 1 month from the first line of code till the premiere. Just when the exhibition launched, the museum closed due to covid-19. Fortunately it’s going to be around for 3-5 years hyperhuman.mp4
  13. 3 points
    serhiic

    Pixi.js Showcase

    Hello guys, I hope everyone is okay in these challenging times. Currently, I'm working on a (kinda) PIXI layout editor focused on the spine plugin pixi-spine.web.app and would love to get some feedback on it as replies to this post or through this form Thanks
  14. 3 points
    Concept Artist for Hire Specialising in Environments and Keyframes I am an experienced concept artist in the Game and Film/TV industry. I specialise in environments, keyframes, architecture, creature design and characters. I am currently looking for long-term freelance projects but happy to do short ones too. Alternatively, I am happy to just do some black and white sketches or some colour grading/storyboarding/etc - just get in touch!I have included my work below and my website, please feel free to email me, message me on ArtStation or on Discord to discuss the project and rates.Website: http://www.elliejcooper.co.uk/ArtStation: https://www.artstation.com/elliejcooperEmail: enquiries@elliejcooper.co.ukDiscord: Ellie#8157Portfolio: (Please look at either my website or ArtStation for more, or for better quality).
  15. 3 points
    Luke@Cocos

    The future of web games

    HTML5 is growing wildly in China as many games were placed on hold during the new regulations last year. More and more developers started to build games using the WeChat environment which we helped build that works off the HTML5 library. So many developers were building and continue to build games for that and now other phone companies like Oppo, Samsung, vivo, Huawei, Xiaomi, and others are building mini app marketplaces that work perfectly with HTML5. With 5G also coming, speeds are at a point in some countries that downloading a game will be as fast as opening a native app. I think we are on the edge of something great. So don't be worried for the future.
  16. 3 points
    https://valhallaepisodes.com/ This is the first game I've ever made and released to the public. Made in Phaser 3, using React for UI elements. Full list of all technologies are available in game. It's an adventure puzzle game adapted from an old Amiga game of the same name; You must guide the Prince through the castle in order to Reach the Lord of Infinity and take your rightful place on the throne. You must think both logically and laterally to complete your objectives. Hi. This is my very first game created, and I'm happy to take any constructive criticism you guys can throw at me
  17. 3 points
    8Observer8

    Javascript Courses!

    I like to learn by practice with writing simple games. Start here: 2D breakout game using pure JavaScript
  18. 3 points
    plicatibu

    Javascript Courses!

    I recommend you give a try here: https://javascript.info
  19. 2 points
    Dr Popet

    Arch Archer - Archery game

    Like all my games for c1ic.mx, this is a one button little archery game, trying too keep the look of the original TINY ARCADE games made in flash PLAY HERE ARCH ARCHER
  20. 2 points
    Dr Popet

    The future of online browser games

    What about Ruffle? the plug in for your site so you can still running flash, no need for the player to download a plug in because the site has the plug in installed for the players to watch the content, also seems to fix some flash plug in issues. Newgrounds is using it.
  21. 2 points
    Here you go: https://codepen.io/ivanpopelyshev/pen/jOWLjKd Serious problems: 1. I converted uniforms to pixi format 2. cant just specify 'uvs' if you use default pixi vertex shader, according to source it needs aVertexPosition and aTextureCoord. 3. its better to use aTextureCoord in frag shader instead of gl_FragCoord and resolution Sugar 1. use pixi interaction instead of document mousemove. works when mouse is above mesh. In case you move mesh I added getLocalPosition (aka toLocal). If you want it to work even not above mesh, subscribe on "renderer.plugins.interaction" , not mesh. You can subscribe on stage , but stage might have not all screen. If you have background - stage will work of course 2. width/height specified in start of doc What I didnt do: 1. this demo needs margin:0 padding:0 overflow:none for body css, as always for fullscreen rendering apps For tasks like this its better if you clone pixi repo , open it in separate IDE window and search for classes that you use (i hope you know shortcut) . Its close to webgl calls and you should see how things are stored and then converted to webgl operations.
  22. 2 points
    it's 'Loader' with first capital letter and you need to change it for resources as well var loader = PIXI.Loader.shared; var resources = PIXI.Loader.shared.resources;
  23. 2 points
    ivan.popelyshev

    Pixi Projection 3D Surface

    For surface, you need your own Mesh3d because there's no such class in pixi-projection. This is an experimental project, and people who use it should look in sources, understand code, and write their own extensions. It should be much easier than doing your 3d from scratch or trying to port other 3d engines to pixi core. Yes, Im planning on porting whole threejs to pixi later In general, the problem of joining 2d and 3d objects in the same scene is big. Every time someone tries that - easy 2d API gets ruined by heavy 3D, or 3D becomes a mess. It took huge amount of my hours to make that architecture on pixi that doesnt require big changes in core and introduces billboards without ruining API. @jonforum helped a lot with his tests. As far as i know, one of best solutions of 2d/3d are AwayJS and I'll definitely port something from them too.
  24. 2 points
    List of few alternatives (that are used by PacpGames) is at https://www.pacogames.com/blog/pacogames-and-games-distribution-services
  25. 2 points
    Never mind, this can be handled by @expo/browser-polyfill
  26. 2 points
    supertommy

    Graphically debugging physics

    You'll want to set debug to true in your game config for arcade physics: const config = { type: Phaser.AUTO, physics: { default: 'arcade', arcade: { debug: true } } // other settings... }
  27. 2 points
    You can also use an external 2d canvas for a bit more of drawing api. You could even use p5js to draw that, then use that canvas as a source for basetexture.
  28. 2 points
    I make a Kaiju Strategy game called Kaiju Krashers. Please let me know what you think of it, I'm open to all criticisms. I'll be complete soon and available for licensing.Controls-Arrows- MoveZ- Move BackX- Atomic BlastR- Restarthttps://retrobolt.github.io/KaijuKrashers-V1.0/
  29. 2 points
    Easiest way for this would be to use some tweening library. For example tween.js (https://createjs.com/tweenjs), gsap (https://greensock.com/3) or some other from multiple possibilites. The examples below are done with tween.js. You could have in your click-handler code like: function moveTo(character, newX,newY) { var time = 500; createjs.Tween.get(character.position).to({x:newX, y:newY}, time); } and it would move the character with given amount of time to given position. If you do not wish to use tweening libraries, then you can also calculate the animation yourself and update the position in the mainloop. Below is one way how to do that (pseudocode, might have errors) const app = new PIXI.Application(...); const container = new PIXI.Container(); const characterSprite = PIXI.Sprite.from(...); const bg = PIXI.Sprite.from(...); container.addChild(bg); container.addChild(characterSprite); let targetPoint = characterSprite.position; let moveStart = characterSprite.position; let moveTime = 0; let timeCount = 0; bg.interactive = true; bg.addListener("click", function(e){ var to = /*Determine the coordinates where to move*/ targetPoint = to; moveStart = characterSprite.position; //Calculate the distance between points to determine how long should move last const dx = to.x - moveStart.x; const dy = to.y - moveStart.y; moveTime = Math.sqrt(dx*dx + dy*dy); }); app.ticker.add( function(delta){ if(moveTime > 0) { timeCount+=delta; if(timeCount >= moveTime) { //End has been reached. moveTime = 0; characterSprite.position = targetPoint; } else { const dx = targetPoint.x - moveStart.x; const dy = targetPoint.y - moveStart.y; characterSprite.x = moveStart.x + dx * timeCount/moveTime; characterSprite.y = moveStart.y + dy * timeCount/moveTime; } } }); Basically what happens there is you move the character between it's current point and target point by linearly interpolating the position based on time.
  30. 2 points
    Every time I check FBIG I see many of our games. Thousands of plays, hundreds of thousands of ad-impressions. Cool ... right?! However, we never posted them there? They are ALL Intellectual Property and Licensing infringements. We receive $0. So we submit a takedown notice, on a per-app basis, and in fairness to FB the game usually goes soon after. It's a slow and tedious process, designed to "check-the-box". I expect the perpetrator receives no income from their dodgy deed, and they are likely inconvenienced with a suspended account? But, next day, same deal - new user, new thumbnail, new game name, new app id - still our same IP being violated. There is no apparent progress by FB to improve the situation, refine the review process, take responsibility and clear up their publishing mistakes? This might be defensible if Facebook wasn't making money from these circumstances, or if the same content wasn't being re-published and "takedown"ed on multiple occasions. Derivative and plagiaristic heuristics exist (as is seen if a video with non-licensed music is posted to Facebook) - it would be trivial to run a source code pattern match against previously submitted takedowns, and flag those in need of scrutiny. Such a routine might even improve the signal-to-noise-ratio on the plaform (and improve user-experience and eCPM for legit games)? For anyone else impacted by similar issues the direct reporting link is: https://www.facebook.com/help/contact/634636770043106?helpref=faq_content You'll need to be a member of Facebook to report Facebook's "violation or infringement of your rights".
  31. 2 points
    Junkybyte

    Pixi.js Showcase

    Ivan, I want to share with you how much I appreciate your work, Pixi is an incredible library, I never wrote anything on the forum but I used it extensively these last months and your suggestions / answers have been a huge help. Thank you for the kind words, I really appreciate, if you ever actually refer it do it with a bit of salt, I'm pretty sure my usage of Pixi can be improved, when I started writing the library I had no prior experience with it and I learned on the road. Nevertheless I'm quite honoured have a lovely day
  32. 2 points
    ivan.popelyshev

    Shader performances

    Welcome to the forums! You are lucky, because right now in v5 we have exact solution for the problem. Yes, pixi gives you ability to make your geometries and even re-use them (like you did), but still, count of drawcalls can be a problem! If you capture one frame with SpectorJS you'll see a problem ( I didnt do it but probably there are too many drawcalls). So, PixiJS actually exposes its batchrenderer! It fills up one geometry for many objects every frame. Demo is here: https://www.pixiplayground.com/#/edit/CMKvgOt-bvlCG4QHdswIP . We didnt add it to examples yet, but we really should do it because of people like you who need it. The idea is to specify "pluginName" for Sprite, Graphics or mesh material. Sprites are always batchable, but in case of Graphics and Meshes you have to make sure isBatchable gets set to "true" so instead of shader pixi pushes data to batcher in `renderBatched` function. Something like that. In your particular case, Sprites are enough, so you dont have to think about what I said in previous line The downside - you have to to tint and other stuff in attributes instead of uniforms. Tint is already handled in demo, so in your case you need extra attribute field for "ratio".
  33. 2 points
    Check this example:
  34. 2 points
    Use this when you obtain temp webgl context. Unfortunately pixi webgl test context is hidden in js scope, so you have to create your own. gl.getParameter(gl.MAX_TEXTURE_SIZE)
  35. 2 points
    Fabletale

    Tiles in Between

    Tiles in Between is a 2D puzzle platformer where you have to rearrange the tiles and make a path to the princess. The game is made in Unity for WebGL, and currently is posted on Kongregate. Play it here: https://www.kongregate.com/games/soetsutakiwasa/tiles-in-between
  36. 2 points
    Hello everyone, a few important comments here: 1. Bestgames is gamemonetize, I will not address their accusations as they add nothing to this thread and is just trying to defamate our image. 2. The report dashboard shown is probably a bug, you should contact us directly and we will fix whatever is needed. 3. Revenue drop: It is natural to see less revenues than nov-dec. I will explain why: this industry monetizes games with advertising. Advertising depends on demand (advertisers) and seasonality (periods people spend money). The beginning of the year you will always see less: impressions, ecpms, hence revenue. This is not our fault, but how the advertising industry works for decades now. If you are working with other partners, you will also see the same behavior. 4. Again on the transparence of our company: We recently aquired Spil games, top 1 player on web games for decades now, you can see the news here and in dozens of other sources: https://www.gamesindustry.biz/articles/2020-02-12-azerion-acquires-remainder-of-spil-games Working with Game Distribution has become even better now that we have the power of Spil games portals to provide your games more visibility. Please bear in mind that not all games will make money and work out, this is the same on every platform, not just the web. Quality over quantity is very important. We respect your decisions to discuss, expose and decide whether to work with us or not as long as we are having a healthy conversation around the gaming industry. We work with literally hundreds of game developers who are quite happy with us and I am proud to say our service has improved a lot since last year, and will still keep improving. Any questions or topics, you know where to find me. Iuri
  37. 2 points
    yulijun

    Pixi.js Showcase

    How to make pixi.js game with webpack step by step. The tutorial is focus on how to build development environment from initizlize the project to publish the project. the tutorial is here https://github.com/proudcat/pixi-webpack-demo , welcome to star.
  38. 2 points
    mapacarta

    [Phaser 3] Rookie Bowman

    Game Link: https://www.kongregate.com/games/mapacarta/rookie-bowman Hi, I published my game on Kongregate yesterday. I hardly get feedbacks on there, so any feedback is appreciated. It is a platformer game with boss fights, collectible items, secret rooms etc...
  39. 2 points
    b10b

    complex games with html5

    Unity exports to a WebAssembly and WebGL output, no "plugin" needed. But that's not to say it's ideal for web, especially not mobile web (search up Unity "Tiny" instead) Possible yes ... but consider this first ... Motion Twins' "Dead Cells" is authored with Heaps, a Haxe based game framework (which has Javascript WebGL output options). Also Motion Twins' catalog before this title was predominantly web games so they clearly have web capabilities. Therefore ... it's reasonable to conclude there's no all-blocking "technical" reason why there isn't a browser version, but there are likely many commercial or user-experience reasons why such a game isn't being published on web (yet). Same issues would likely apply / hinder any other similarly scoped game intended for web, irrespective of authoring tools? Conclusion, as always, is ** understand the audience ** ... on what platform do they want their game (big, complex, small, tiny) to be on. Or ... make web games that absolutely require, embrace and leverage the "web".
  40. 2 points
    @Bonomi Got it. Have you read the documentation? https://developers.facebook.com/docs/games/instant-games/guides/play-friends 1- But then, how do we handle the accept request on player B (slave) flow? Once player B enters that context (see the documentation I shared above) it means the challenge is accepted, it is that simple. Then you can handle it on your server side. When player B has played his turn, you could send a custom update: https://developers.facebook.com/docs/games/instant-games/guides/game-update 2- How is player A notified that his friend accepted the challenge and is ready to play? See answer 1. 3- Same questions about when one player is waiting for his opponent to play, I believe I need to use "switchAsync" function but am a bit blurry here as well. Not sure what you mean, but I feel my answer to 1 answers this as well.
  41. 2 points
    Hi @Reborned, I asked the policy team to look into it. Let me get back to you when I have more information.
  42. 2 points
    > ~100k Nodes/Edges Its not easy to join the club of 100k bunnies - you need your own high-level algorithms to work with pixi low-level smoothly. As an example - I'm working on complete implementation of Adobe Flash using PixiJS and mozilla shumway. My scope is ~500 vector elements with filters that can be cached and ~10000 animations played on GPU. `renderAdvanced` in PixiJS Container takes 50 lines, and its relatively sparse. Mine version of element renderer is about 2000 lines if I count all extra components I added for it. Its covered with hundreds of tests. Cache that tracks whether particular subtree wasnt changed is like React,except it can work on 60FPS and doesn't allocate memory like crazy. I implemented it based on all experience of Mozilla Shumway that was coded by~ ten people by 3 years and failed. Super-fast scene tree that doesn't iterate through all elements each frame to check if matrices has to be computed and which elements belong to which layer (z-indexing) - that's a huge problem. I made it using my algorithm expertise, which i trained in programming competitions. z-culling is another thing that is difficult architecturally, you can just take random gpu optimization and put it inside a scene tree. I don't know any other projects besides mine that use z-culling in 2d which seriously helps on old graphics cards like Intel HD 3000. There's also antialiasing for graphics - it doesn't exist in WebGL on RenderTextures, it exists only on WebGL2 and requires serious architectural changes to avoid huge memory consumption. I solved it due to undocumented feature that suddenly exists in all browsers, and I also implemented all that architectural nightmare on top of other optimizations - caches, filters, e.t.c. PixiJS version https://github.com/gameofbombs/pixi-blit/ will be released in a month or so, I focused on my private fork, cant share it yet. Interaction optimizations are based on bounds which based on super-fast scene tree. One step sideways and you'll have so many bugs that'll take year to debug. PixiJS bounds bugs exist after 8 years of coding. They are usual problem. I know how to make effective pixel-perfect interaction based on injection of mouse coords in shaders, but i dont know how to add something better like quad-tree without affecting code style badly, which, again, leads to big number of bugs. Now, you want 100k Graphics on scene with all those features, where Adobe Flash dealt with 10000. I think, with the scope you are asking, your project costs 1M$ Most of my work will be open-source, it will open doors for projects like you asking for, but right now you need to hire a team and spent more than a million $ on 2 or so years to get the product. > I guess what I am asking is, what are the communities recommendations when they need to show a large number of potentially interactive objects (Sprites/Graphics) on the screen at once? Write your own stage tree, its not that hard to just copy @pixi/display , @pixi/sprite , @pixi/graphics and pixi5-svg and go on. > but scaling to ~1M+ later on is not out of the question In your dreams. Ask https://phase.com/ how is their project going
  43. 2 points
    nice editor dude ! very nice !
  44. 2 points
    Hey ivan (thanks for your help) I thought i'd throw an update to this. I've sorted out a majority of the issues just some polish left. I've linked to a video to see the result of what i've been working on. Any thoughts? Suggestions? If anyone else has run into this issue, reply to this topic and i'll setup code examples. https://nyrion.ca/Cyndar.mp4
  45. 2 points
    I don't have much experience, I started 1 and a half months ago to get involved in the web videogames market. At the moment I found 3 that tried and give profits, but I have few games myself. -Gamedistribution -Gamemonetize -Gamearter They could be called "alternatives" work the same way I think. Nice to help you, regards
  46. 2 points
    ivan.popelyshev

    bitwise operator not supported?

    Its a known issue, we have a preprocessor that adds "precision float " in the beginning , so please make sure you specify that line at the first symbol and not after "\n" That wont work: const frag = ` #version ... `; that'll work: const frag = `#version 300 es ... `; The place in source code: https://github.com/pixijs/pixi.js/blob/dev/packages/core/src/shader/Program.js#L53 Yes, we cant decide what to do with that thing for several months already.
  47. 2 points
    captainHook

    How to change background color

    That is what I was looking for. Thanks. myScene.cameras.main.setBackgroundColor('#000000') https://rexrainbow.github.io/phaser3-rex-notes/docs/site/camera/
  48. 2 points
    Colbydude

    Pixel Perfect Fonts?

    Hey all, So I'm wanting using a web font in my Phaser project, but I'm noticing that when using the font in-game, it's automatically applying some sort of smoothing? When rendering straight onto the page outside of the game, the font comes out perfectly crisp when using "-webkit-font-smoothing: none;" See the attachment. I took a look into the Text game object and I'm seeing a "resolution" member, though doing "textObject.resolution = <number>;" doesn't seem to have any effect. Not sure if I need to run an update once I do that though. Do have other options available? Secondly, how do I go about setting the global/default font so that every text object will use the font I specify?