Search the Community

Showing results for tags 'webgl'.

More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


  • HTML5 Game Coding
    • News
    • Game Showcase
    • Coding and Game Design
  • Frameworks
    • Phaser
    • Pixi.js
    • Babylon.js
    • Panda.js
    • melonJS
    • Haxe JS
    • Kiwi.js
  • General
    • General Talk
  • Business
    • Collaborations (un-paid)
    • Jobs (Hiring and Freelance)
    • Services Offered

Found 340 results

  1. Hi, I could answer this question by reading babylonJS code so pardon me for my lazyness. I would rather ask here because it looks like some of the devs of BabylonJS sometimes come here and I'm short on time. Is BabylonJS written to use WebGL natively or is it using some library to convert DirectX calls to WebGL (Angle or Anglers?? I read that somewhere I can't find)? Is that behavior different depending on the browser it runs in? (MS Edge vs others) If there's some converting going on, do we have a measurement of the overhead cost (flippin' matrices, normals, transpiling shaders, etc). On the plus side... if it is using DirectX somehow, does it mean I can use DDS on all browsers? Thanks! BabylonJS looks great, I'm still trying to figure out if I should go lower-level WebGL-only Three.JS or use a higher-level "game engine" like BabylonJS.
  2. Hi guys, We developed a game last year with phaser 2.3.0 and webgl, it worked fine on computer browsers and mobile devices. But since the last update of chrome for android (v53.0.2785.97), the screen is flickering until it becomes totally black, without any error or warning. The issue is present on mobile only, it worked on chrome for android v52, but not v53. We tried to upgrade to phaser 2.6.2, same issue on chrome for android v53. If we use Phaser.CANVAS instead of webgl, it works fine, but we prefer using webgl for performances. Does anyone encounter the same problem? Thanks for your help. Joe K.
  3. Hi, I am making my first mobile HTML5 game using Phaser. Its a very simple tap game where you have to keep your character balanced. I have noticed something that is kind of strange to me. I have tested the game on: -iphone 5c, IOS 10.2.1, safari browser. -iphone 5s, IOS 10.2.1, safari browser. -Samsung Galaxy S4, android 4.4.2. I have tested the game using CANVAS mode and WEBGL mode for comparison. I observed the following: CANVAS mode: Iphone 5c < Iphone5s ---> 30fps vs 60fps avg. -----> expected this.... S4: 60fps. WEBGL mode: Iphone 5c > Iphone5s ---> 60fps vs 30fps avg. -----> did not expect this.... S4: 60fps (same). My expectation was that the 5s would play at 60fps in WEBGL mode, but it is the opposite case. On the samsung s4 it performs the same for both. In CANVAS mode, I have 15-17 draw calls . In WEBGL mode this reduces to 9 draw calls (Most of my objects are on a single atlas). I still have to add audio to the game. I can imagine that it is hard to tell what might be going on, but I can't really find a reasonable explanation for this result and its kind of dissapointing. It seems to me that I can't get a reliable result using WEBGL.... I'm thinking of sticking to CANVAS mode and optimize as much as I can. Would this be the right way to proceed?
  4. ---edit--- link no longer works, there is a download on the homepage now as I could not handle all browser issues ---edit--- controls: WASD for movement, mouse to target and shoot, E/right click releases a large rocket at the target Q/middle mouse button to place turrets aim of the game: don't die and kill those pesky spiders that are eating the hexas. if you die, or all the hexas are gone, you lose. the game was created for a small fun contest with the theme "mining and herds", this was my take on it. I'm still missing a start/end screen with a highscore list. not quite sure if I should try to use facebook api for this.
  5. SKATE HOOLIGANS Cowabunga! Little hooligans are on the way! Choose your hero and arrange an amazing disorder Collect coins, upgrade bonuses, buy cool skateboards, avoid dangerous obstacles and get scores as much as you can. LINK: Caution: It’s a WebGL-based game, please ensure that you have latest browser version. Game is WebGL based written with custom game engine. We've refused three.js because of Google Closure Complier And now all gzipped code is only 110Kb! Also we won't license it and the game is free for embedding on any website <iframe src="" name="Skate Hooligans" width="800" height="600" frameborder="0" scrolling="no" allowfullscreen="true"><p>Your browser does not support iframes.</p></iframe> We use CPMStar banners and video preroll for monetization. Please contact me at if you have any questions, suggestions, etc.
  6. Hello! My game does not render in chrome when I use the AUTO mode. I have the same problem with the Phaser examples that are in AUTO mode. Everything goes well when I test my game on Safari or on mobile browsers. Here is my configuration : macOS Sierra 10.12 chrome 56.0.2924.87 (64-bit) Does anyone has had the same issue? Any solution (other than configuring the game in CANVAS mode)? Thank you. Regis.
  7. Anyone seeing a strange white rectangle drawn in the Phaser game canvas in Google Chrome (Version 56.0.2924.87 (64-bit)) WebGL mode on OSX Sierra (10.12.3)? I thought that it was just me having the problem. I am not using WebGL / auto as a temporary work around. Other Phaser examples I have seen are working fine.
  8. Hi there. Thanks a lot for stopping by. We are working on the online football management game and looking for a game developer who could help us to develop the live match simulation with babylonjs or threejs or any other similar 3d game engine with WebGL support. You will be working closely with the back-end developer on live match simulation based on the generated data you will get from the database (player skills, team skills, weather and other factors). We offer you a revenue share. If you are interested in the project, you can read the overview here: Get in touch with me if you are interested or have any questions. Thanks in advance!
  9. I have been running a shader on mac and pc using splatmaps... But for some reason on iOS the console reports these errors... Is there something kind of compatibility layer i need to do something special for iOS in shaders??? Does anybody have a clue has to what the error could be coming from when run on iOS ... works fine on regular computer. If anyone needs to take a look at my actual shader code: Terrain_Splatmap.vertex.fx Terrain_Splatmap.fragment.fx Note this is only an issue on iOS mobile so far and ONLY after trying to use forth splat texture 'albedoSampler4' ... Weird ... Is there a MAX texture limit on IOS... Works great on pc, mac, android and xbox... just craps after forth splat on iOS @Deltakosh , @Sebavan or @RaananW got any ideas
  10. Hello everyone. here is my game made on defold. (hope webgl is ok for this section) I've made this game on game jam about 6 month ago. and right now want to polish (add proper tutorial + metagame) and release somewhere. Unfortunately defold has some limitations, i don't have access to javascript so i can't make proper integration to the portals. so i think to release it on the Facebook. and if retention will be ok - make proper release on android and iOS. I'm new in html games, I come here from unity3d, so I'll be very happy for your advices. online version: Screenshots: Gameplay:
  11. Hello BJS devs, What are BabylonJS's plans for WebGL 2 support? Namely, how do you guys envision supporting webgl 2 and backwards compatibility? I'm not super experienced with game development but I've been playing around with a toy project and I need to use binary 3D textures. I've made some changes to BJS to support 3D textures but I'm not familiar enough with the codebase to think this is the correct way of doing this. Any feedback is much appreciated and I would be happy to make changes / open a PR if this seems like the correct approach. Also, if there is already a branch that supports this correctly, that would be even better Thanks!
  12. This is scene is arranged into separate blocks, each block is a SolidParticleSystem. (Like this, and like this.) Each particle is touching right on the edge (see attached image), or click here. There are some black pixels that flicker in and out on these edges. These are z-fighting artifacts on the edges (I think ). I tried just increasing the scale of the particles slightly so they overlap with each other but this doesn't fix it. What can I do to remove these artifacts? Is there a simple way without adding more geometry to every particle? I'm not afraid to modify shaders if I have to.
  13. cloth

    Hi, i trying to emulate a cloth animation follow this: I am trying to apply cloth to a garment (obj. file / shorts), and then do a collision with a manikin, but when i apply it, it's look like this, i dont know why:
  14. Hi everyone, I have a strange issue with the webgl and tilesprite behavior which seems for me to not follow the Phaser documentation. My background is contained inside a sprite atlas described by a json file. All the sprites have dimension equal to a power of 2 (height and width) and the png file too. I have followed the tutorial It works great with this example and the octopus dimensions used are "w":62,"h":94 But, when I change one of this parameters to a power of 2, for example: "w":64,"h":94, the tilesprite has a strange behavior: the entire image is displayed from x:0 y:0 No problem with canvas. I suppose it is a newbee issue... any help? Thanks!
  15. Hey I am currently polishing off my Breakout or Brick-Breaker game (whichever you prefer to call it). I am trying to add music to the game when the start button is pressed and then sound effects every time a brick is destroyed. Unfortunately Phaser keeps saying Key "Sample" is not found in cache. I have tried using Phasers examples and basing the music off that but to no avail. I am new to programming with Phaser and would really appreciate the help. When the game is finished i will post a link. Thanks in Advance Pheaset here is my code var game = new Phaser.Game(480, 320, Phaser.AUTO, null, { preload: preload, create: create, update: update }); var firework;; var music = Phaser.Sound; var lives = 1; var livesText; var lifeLostText; var ball; var paddle; var bricks; var newBrick; var brickInfo; var scoreText; var score = 0; var playing = false; var startButton; function preload() { game.scale.scaleMode = Phaser.ScaleManager.SHOW_ALL; game.scale.pageAlignHorizontally = true; game.scale.pageAlignVertically = true; game.stage.backgroundColor = '#eee'; game.load.image('ball', 'ball.png'); game.load.image('paddle','paddle.png'); game.load.image('brick', 'img/brick.png') game.load.spritesheet('ball', 'img/wobble.png', 20, 20); game.load.spritesheet('button','button.png', 120, 40);'Good-Riddance', 'Good-Riddance.mp3'); } function create() { game.physics.startSystem(Phaser.Physics.ARCADE); startButton = game.add.button(*0.5,*0.5, 'button', startGame, this, 1, 0, 2); startButton.anchor.set(0.5); music ='Good-Riddance') ="Good-Riddance")["Good-Riddance"]); if(playing === true) { }else{ music.mute = false; }
  16. html5

    Hi everyone, Famobi has been around for more than two years already, but somehow we haven’t actively taken part in this wonderful forum during this period. Many of you know us already and have published their wonderful games in our network. So first of all we want to say THANK YOU! Thank you for the fantastic games you create, thanks for making the HTML5 games industry the next big thing and thanks for just being really great people. After all you and your games are our daily business. And we have lots of fun with them. But even more important, our clients love them. We have spread your games to many portals, companies and brands and gave them the attention they deserve. Since your games have been the foundation of our company and its ongoing success, it’s only fair that we share with you our current state and upcoming projects. Of course we continue and steadily improve our daily work as a distributor of your games. We place them on all the biggest and most known portals around the globe. And new portals, big and small, are registering for an account at Famobi every day. Another focus right now is Facebook Instant Games. Shortly we will begin placing games in the Facebook messenger. So if you have amazing high score games with a quick and easy gameplay, let us know anytime. One can never have enough of those And in general, please continue to send us your games. There are no restrictions to genre or age. However we have a few requirements based on the needs of our clients and partners, that have proven to be crucial for maximum success. The games must be: Full responsive. Games must work in portrait and landscape mode. Without text. No texts means anyone will understand your game regardless of language. Small. Preferrably the file size should not exceed 3 MB. Smooth performance. Even on lower-end devices. We test our games from iPhone 4S and Samsung Galaxy S4 mini upwards. These are a few examples of games that fulfill these requirements and that we really love: Solitaire Classic Street Race Fury 4 in a Row Classic Bottle Flip Challenge Mandala Coloring Book Backgammon Classic Kids Color Book 2 But before our post reaches the dimensions of a novel, let’s come to an end for now. For all those who didn’t know or contact us yet, you can reach us anytime under these addresses: Game submission: Please use our submit form right here: General questions: Purchase of games: Thanks so much and let’s continue to shape the industry! Cheers from the whole team!
  17. Made anything cool with pixi.js? Post it up here and share it with the world! Whether it's a cool game demo, a fully fledged website or some tripped-out crazy experiment, we would all LOVE to see it! To get the ball rolling, here are some pixi.js projects that exist out on the internets: games: experiments:
  18. Just new model (now no coding only updated new model)
  19. Hello friends! I'm seeking for 2D artist to draw multiply sprites for top-view space game. What about the game? I have a concept of survival 2.5D space game, where every one can manage his own space sector, build space stations, harvest resources, make products and secure from extraneous aliens. You will take a role as a business owner of your faction with minimal amount at your account. Your goal to make successful business, to grow and set relations with other factions, survive in unknown galaxy where you are not alone. Main feature of the game Play from mobile / tablet / desktop, there are no restrictions to popular platforms. Fly on your own spacecraft by using of WASD + mouse or touch control. Think how to make your business work, trade with other players, explore your sector and find a way to other sectors, fight with your enemies to reach your goals. All spacecrafts & space stations consists from parts, each one has their own appointment & feature. Invite friends to your faction. 2.5D game, where each 2D graphic looks like 3D by using power of OSE game engine (lightning + shadows). What is already done Own game engine as a fundament of a game. Inertia physics, spaceship control, lightning. Camera, object's transformations, multiply platforms support. I have very ambitious plans, but resources are limited. I have a very reduced plan of features that I would like to implement. For early stage of development I want to find an artist, that can spend some time to work with graphics of a game. I will pay for graphics if it will be really cool. Contact with me to get details. Skype: andytyurin Thanks!
  20. I'm using the latest bjs alpha, a few old errors disappeared (fixed I guess), and new ones appeared. These are internal bjs errors that are not related to my code as far as I can tell. 1) I don't know what this is related to. 2) This error is logged for each .babylon file I'm loading. Why am I getting an XML parsing error on a .babylon file written in JSON format?
  21. I have a scene with two individual meshes. It looks like this: this.loadFiles("gras", (gras) => { var particleMaterial = new THREE.MeshPhongMaterial(); = THREE.ImageUtils.loadTexture("models/planets/gras.jpg"); particleMaterial.side = THREE.DoubleSide; this.mesh = new THREE.Mesh(gras,particleMaterial); this.loadFiles("rocks", (rocks) => { var particleMaterial = new THREE.MeshPhongMaterial(); = THREE.ImageUtils.loadTexture("models/planets/rocks.jpg"); particleMaterial.side = THREE.DoubleSide; = new THREE.Mesh(rocks,particleMaterial); callback(this); }); }); Now I want to merge the meshes together. But how can i combine the textures? this.loadFiles("gras", (gras) => { this.loadFiles("rocks", (rocks) => { var geometry = new THREE.Geometry; THREE.GeometryUtils.merge(geometry,gras); THREE.GeometryUtils.merge(geometry,rocks); var particleMaterial = new THREE.MeshPhongMaterial(); = THREE.ImageUtils.loadTexture("models/planets/gras.jpg"); particleMaterial.side = THREE.DoubleSide; this.mesh = new THREE.Mesh(geometry,particleMaterial); callback(this); }); });
  22. Hi there folks! It's been a while since I posted something in here, glad to be back! I have a fair amount of experience in game development using JS Canvas, but recently I decided I had move on - so I went with Pixi. I figured out the basics of how to add sprites, do filters and such, but I just can't seem to figure out how to do simple lines and then manipulate them afterwards. What I mean is something like this: I noticed that PIXI.Graphics has an object attached to it called "graphicsData" in which I can find the points that make up the line - great - but when changing the value of these variables, nothing happens to the appearance of my line. I'd appreciate any help, as I'm quite new to Pixi Thank you!
  23. Hello! I have an issue that I didn't understand too much. I'm trying to build a tiled-isometric-map loader for Phaser, where I have many issues about perfomance. So I will investigate different techniques to make them more lightweight for CPU/GPU trying to use some techniques like render the map layers in cropped RenderTextures (just draw the visible area of the map at once), using sprite-populated SpriteBatches/Groups as source (I tested with both). In simple words, the logical behind this is the following: Populate the SpriteBatch/Group with tile-based sprites from a cache-array (to prevent creating/destroying each time). Render that SpriteBatch/Group into the RenderTexture, clearing it before that. Cleaning the SpriteBatch/Group, putting the tile-based sprites back to the array and removing from the SpriteBatch/Group (without destroying them, off course). Create a Phaser.Image that show the RenderTexture in the screen. (Or create once, the texture are updated anyways). I tested that with one RenderTexture and works fine. The issue comes if I write more many of them (Assuming that 1 RenderTexture is equivalent at 1 Layer of the scenario), the screen starts showing y-inverted versions of the RenderTexture at random times. A important fact that this just occurs in WebGL mode (in Canvas the behaivour is the correct). I'm using Phaser CE 2.7.3. I coded a short example of the issue (each column is a different RenderTexture with correspondent Sprites), you're free to see and debug them : Canvas: WebGL: Some idea of what's going on there? Thanks in advance
  24. According to more than 90% of all devices now support WebGL! Does that mean that it's (finally) time to make 3D games? Has someone had an experience in selling/distributing webgl based games? And what do you guys think about 3d web games in general?
  25. Job posting: Studio FOW Position: Senior Game Software Developer We are looking for a game senior game software developer who can deliver web based, HTML5 game applications. The role includes overseeing the full development life cycle including identifying the correct technology, architecting the application, security, testing and deploying. This is not a project management role, you will be solely responsible for implementation. The candidate must have a proven track record in developing web based game applications using WebGL and JavaScript. We expect the developer to be able to deliver a modular, scalable and testable application. You will also be working to integrate existing pre-rendered video content into the game which forms an integral part of the player experience. Experience in enterprise grade applications would be necessary so the design could address high availability requirements (i.e. load balancing and clustering). Experience in WebSockets and relational databases such as MySQL, PostgreSQL or MS SQL are required. Experience in ECMAScript, NodeJS and node-webkit would be a plus. Knowledge of other programming languages (Python, C++) is also a plus. Please note that this game will be of the adult (18+) variety and therefore anyone uncomfortable with such content need not apply. A portfolio and references will be required during the interview process.