Search the Community

Showing results for tags '2d'.

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 217 results

  1. Hello, We are XuanLongCG Studio,a team dedicated to art. We specialize in the game art, including 2D, 3D Art and Animation, Next Generation Game Art, VFX, UI Design, Post Production, etc. Experience Our core staff, who are experienced with an average working time of seven years or more, excel at game art programs. We have worked in dozens of projects and cooperated with many first-class companies such as Tencent, Net Ease, Net Dragon and Seasun. Principles We emphasize on building long-term cooperation with clients. With high efficiency and art passion , we will offer you high-quality service on time and on budget. With professional staff and great passion, we will offer you the best game art service. Feel free to contact us! Contact details: E-mail: Skype: XuanLongCG
  2. Hi, My name is Nikky. I'm a 31 year old 2D graphic designer (vector) with years of experience, available full time for freelance work. I also had experience on making my own games for 2 years. I can do characters, items, animations, backgrounds, re-skinning, UI design, game cover, icons, logos, and any other kind of 2D art assets. My rate at the moment is $14 per hour, I can also work with a fixed price (with an asset list and a request art style). Well, I usually make deal on a fixed price after estimating the cost to the clients. Or maybe if you have some kind of budget for the art work, we can start negotiate from that. You can see some of my 2D art works for all kinds of games in I work fast, understand deadline, work on weekends and holidays, understand time zone deference, I don't sleep to much anyway, prefer Paypal for safe payments, not interested in profit sharing, or free works. I'm full-time freelance so my focus is on this. I can do most Graphic Art style (vector base). I usually do a test run of one or two of the clients request assets (usually clients also has a request type of style) to make sure the style, design, coolness, cuteness, etc fits them, no need to pay if the test run result doesn't fit you. But if it does, then lets do more actions! Feel free for asking me the estimate of the cost, it maybe cheaper then you think it is. You can email me at Here are some of my works :
  3. Hey guys, My name is Mike and I'm from Korea. Me and 14 other guys are making a HTML5 MMORPG called "Mad World". Here's its trailer. And here's rain animation The game has all the familiar features of MMORPGs but the combat is more face-paced. It has hand-drawn artstyle like you see here. I will be posting some updates here from now on, and maybe some development tips we learn along the way. We want to be a pioneer in the area HTML5 in Korea which is still very new in the country. We want to make it available worldwide by the end of 2018, so we still have a long way to go. Any feedback is welcome by the way. Thanks and let me know what you think of the game! For more information on the game, you can visit our website: or follow us on Facebook Twitter Youtube Here's the latest update Made a video showcasing the technologies we use to develop our HTML5 MMORPG. Here's a wip customization system,. Oh, and we recently opened a forum. Come by and say hello if you're interested. =)
  4. Hey! My name is Andrey! I'm a professional freelance 2D game artist and animator. Primarily working on games with small studios and indie developers in the role of the creator of various types of game assets: from simple inventory item to animated characters. I prefer to create cartoon-styled colorful bright saturated art. In my work I mostly work in Flash, Animate and Spine. You can see my works in portfolio. Some of my new works you can find on my instagram and twitter. Sometimes I load assets to my gumroad. Now I'm opened for commissions and looking for a freelance task, outsource work and contract. My email: My skype: murlyka.
  5. Sprite jitters if camera moves with it

    Hello! I'm developing a simple 2D platformer with low res pixel art (canvas of size 144x81 pixels), and I noticed that when I move the sprite horizontally but enough to make the camera follow it, there's some jittering ocurring with the sprite. Here's the link (just pass the "main screen" clicking on START): Could a kind soul give some assistance? I pay with internets. Thanks a lot!
  6. This is my newest project with Phaser, 2D platformer which aims to bring the best from the present and the past in one game. Curentlly it is still WIP but you can see how the development progress is moving on. Some of you may have seen it on twitter but for those who didn't here are a few gifs: As far as tools and frameworks are concerned I'm using: Phaser - for coding Aseprite - for pixel art Tiled -for level design I'm alone working on this game, graphics, programming and design, so if you see any flaws please do not hesitate to criticize me. Cool part about being solo dev beside not having anyone to mess with my ideas is that when I get bored doing programming, I draw assets for my games, when I run out of inspirations for drawing I design levels, when get tired with that I move back to programming and so on! I hope that playable demo will be available by the end of the month. Thanks everyone for taking a look. Cheers!
  7. Handle diagonal car ramp

    Greetings from a newbie in Phaser. In a 2d car game, how do you imagine a car ramp? Is there any way to draw a diagonal object and when the car object hits that start decreasing the angle and increasing the position.y? Progress! I started with Phaser.Physics.P2JS ( had to quit using Phaser.Physics.ARCADE ) Then make an sprite and assigned a Polygon: preload(){ this.load.physics('physicsData', '/app/dist/sprites.json'); } create(){ game.physics.startSystem(Phaser.Physics.P2JS); game.physics.p2.gravity.y = 50; game.physics.p2.defaultRestitution = 0.01; ramp = game.add.sprite(100, 100, 200, 100, "block"); game.physics.p2.enable(ramp); ramp.body.clearShapes(); ramp.body.loadPolygon('physicsData', 'ramp'); } My sprites.json is: { "ramp": [ { "density": 2, "friction": 0, "bounce": 0, "filter": { "categoryBits": 1, "maskBits": 65535 }, "shape": [ 200, 0 , 200, 100 , 0, 100 ] } ] } I think I got it. Any advice is good
  8. New Playniax Asset Pack Available Now!

    Greetings all,We just released CrashTest Art pack V1.2! Get it at here or see all our stuff here
  9. Hey, I have a problem with the function Project function inside the Vector3 class. This is my code: var screenXY = BABYLON.Vector3.Project( new BABYLON.Vector3(10, 10, 10), BABYLON.Matrix.Identity(), scene.getTransformMatrix(), camera.viewport.toGlobal(engine.getRenderWidth(true), engine.getRenderHeight(true)) ); What I want to do is get the 2d screen x/y position from a 3d vector. And this is what gets returned from the function: Vector3 {x: NaN, y: NaN, z: NaN} How can I fix this?
  10. Hello Everybody, My name is Heru and currently available for your project as an artist. You can view my portfolio at: For more information about rates and any question, please send me an email to: heru.purwanda[at]gmail[dot]com. Thank you very much for your time Some samples: Thanks you
  11. Displacement filter scale issue.

    Hi, I've long wanted to implement a neat looking invisibility effect for my game, tried using DisplacementFilter, but stumbled upon an issue with scale property. While it works correctly to displace areas under the displacement sprite I created, it also displaces entire container on which the filter is applied. I presume its from non existent knowledge about the subject and how those filters work, but I'm still hoping for either a fix or a reasonable explanation if anyone can help me with this please. Everything in my code follows DisplacementMap example on (one with the grass and magnifying glass). What is different is my stage tree. I have 3 containers for each layer and inside those there are separate containers for chunks that hold the map data, since it comes from the server. const playerSprite = new PIXI.Sprite(new PIXI.Texture(PIXI.utils.TextureCache['player.eyes'])); const displacementSprite = new PIXI.Sprite( new PIXI.Texture(PIXI.utils.TextureCache['player.normal']) ); let displacementFilter = new PIXI.filters.DisplacementFilter(displacementSprite); playerSprite.position.set(16 / globalScale * fs, (8 - globalScale) / globalScale * fs); playerSprite.scale.set(globalScale, globalScale) this.scene.addChild(playerSprite); this.scene.addChild(displacementSprite); displacementFilter.scale.x = 20; displacementFilter.scale.y = 20; displacementFilter.enabled = true; displacementSprite.position.set(16 / globalScale * fs, (8 - globalScale) / globalScale * fs); displacementSprite.scale.set(globalScale, globalScale) return { scene: this.scene, filter: displacementFilter }; the return value from this block is added to the main stage container, and filters are applied to bottom 2 layers. Should i perhaps look into filterArea? Here is the undesired effect on the edges. You can also see the slanted top layer on the trees. so 2 layers are moved by the filters scale property.
  12. Hello, I have just finished the third level for my html5 game, Adventure of Ryan Hunter. Please check it out and let me know what do you think. Thank you, Priyo Hutomo
  13. Player and Colliding Objects

    Hi, I need some help with my code, I am trying to create a fenced in area for my character to go in, but he cannot fit through because of the objects that he collides with. How do I change the area that the character collides with? can I reduce the size of the collidable area? The hole in the fence seems quite large enough, but he just won't go through. My game.js // variables for items, walls, etc. var walls; var house; var game = new Phaser.Game(550, 540, Phaser.CANVAS, 'phaser-example', { preload: preload, create: create, update: update, render: render }); //add house to game function addHouse(image) { house = game.add.physicsGroup(); house.create(-250, -240, 'greenhouse'); house.setAll('body.immovable', true); } // add fences/walls to the game function addWalls(image) { walls = game.add.physicsGroup(); // fences up top walls.create(-90, -200, 'fencefront'); walls.create(5, -200, 'fencefront'); walls.create(100, -200, 'fencefront'); walls.create(195, -200, 'fencefront'); // fences to right walls.create(288, -200, 'fenceright'); walls.create(288, -135, 'fenceright'); walls.create(288, -70, 'fenceright'); walls.create(288, -5, 'fenceright'); // fences at bottom walls.create(-90, 59, 'fencefront'); walls.create(5, 59, 'fencefront'); walls.create(100, 59, 'fencefront'); walls.create(195, 59, 'fencefront'); // fences to left walls.create(-91, -200, 'fenceright'); walls.create(-91, -135, 'fenceright'); walls.create(-91, -70, 'fenceright'); // set the walls to be static walls.setAll('body.immovable', true); } // preload items, walls, players, etc. function preload() { // preload player game.load.spritesheet('player', 'hero.png', 64, 64); // preload houses game.load.image('greenhouse', 'greenhouse.png'); // preload fences game.load.image('fencefront', 'fencefront.png'); game.load.image('fenceleft', 'fenceleft.png'); game.load.image('fenceright', 'fenceright.png'); } // variables for character var cursors; var player; var left; var right; var up; var down; // add what will be in game function create() {, -250, 550, 550); // set background color game.stage.backgroundColor = ('#3c6f42'); // add player image and place in screen player = game.add.sprite(-232, -100, 'player', 1); player.smoothed = false; player.scale.set(1); // player will "collide" with certain images like walls and houses player.collideWorldBounds = true; // ANIMATION FOR PLAYER CONTROLS down = player.animations.add('down', [0,1,2,3], 10, true); left = player.animations.add('left', [4,5,6,7], 10, true); right = player.animations.add('right', [8,9,10,11], 10, true); up = player.animations.add('up', [12,13,14,15], 10, true); // enable physics in the game (can't go through walls, gravity, etc.) game.physics.enable(player, Phaser.Physics.ARCADE); game.physics.startSystem(Phaser.Physics.P2JS); game.physics.p2.enable(player); // make sure to add this code to add items/walls/buildings addHouse(); addWalls(); // enable keyboard arrows for controls cursors = game.input.keyboard.createCursorKeys(); // camera will follow the character; } // what happens when player does something function update() { // player will now collide with these images rather than pass over them game.physics.arcade.collide(player, house); game.physics.arcade.collide(player, walls); // PLAYER CONTROLS player.body.velocity.set(0); // player presses left key if (cursors.left.isDown) { player.body.velocity.x = -100;'left'); } // player presses right key else if (cursors.right.isDown) { player.body.velocity.x = 100;'right'); } // player presses up key else if (cursors.up.isDown) { player.body.velocity.y = -100;'up'); } // player presses down key else if (cursors.down.isDown) { player.body.velocity.y = 100;'down'); } // player does not press anything else { player.animations.stop(); } } function render() { } The HTML <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>Simple Canvas Game</title> <link href="" rel="stylesheet"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <style> html { background: black } canvas { margin: auto; } h1 { font-family: 'Syncopate', sans-serif; color: rgb(194, 68, 91); text-align: center; margin: 0 auto; font-size: 25px; } </style> </head> <body> <header> <h1>Crafty Heroes</h1> </header> <script src="phaser.js"></script> <script src="game.js"></script> </body> </html>
  14. Hello, I have just finished the second level for my html5 game, Adventure of Ryan Hunter. Please check it out and let me know what do you think. Thank you, Priyo Hutomo
  15. [Legacy] Infinite Gears

    Hi guys, I want to share my game project that I have created in 2013. It was developed for 2 months but unable to finish it due to some unavoidable circumstances. Introducing Infinite Gears! Infinite Gears is an open-world, survival, 2D space-shooting, bullet-hell game (Whew!). As a Player, you can select a spaceship and start wandering through planets and destroy enemy motherships who are taking over those planets, while also fighting against some small enemies along the way. Each spaceship has its own power. One that focuses on pure power, one that focuses on single-target, and one that can protect itself from enemy attacks. As the Player saved a planet, Player can start buying upgrades so the ship gets stronger. The upgrade cost scraps you got from defeating an enemy. The scraps are then converted into GEARS to buy upgrades from the shop. There is an Overdrive (O.D.) bar that is generated by killing enemies. If this is triggered, it will grant you maximum power of that spaceship for a limited time. The enemies also get stronger as you go further away from where you start. This is indicated by the map on bottom right. There are sectors that are determined as levels to indicate that there will be more enemies and stronger enemy motherships. You must eliminate them as much as you can, and see how far you can go! The game should work on desktop browser at least IE9, Chrome, Firefox, and Opera. How to Play Clone or download this project, extract, and go to the project folder. Inside the ./bin folder, run the index.html. Use ASWD to move the spaceship. Use LMB (Left Mouse Button) to shoot. Use Space bar to throw off the bomb. Attack target is based on the mouse cursor. Last Note The game project was developed by Annobox (me and the illustrator) around June - July 2013 (2 months) for a competition and was still in development, but is no longer continued since then. This project is open to use for everyone, but for more detailed on the copyright notice, please visit the link and read the file. The development is discontinued until now, so there won't be any fix. JavaScript has changed so long since this project and I have my latest code been changed a lot since then, especially after ES6 gets global. So I hope you enjoy the game and the source code! Source Code
  16. Demo Error

    Good afternoon, I was following the example of canvas 2d and I'm stuck with some demos that have problems (with the Babylon.js) and I came to report it. Section All demos have the same fault, for example: The simplest starting point would be created a ScreenSpace Canvas2D with a "Hello World!" text, here we go: See it live in this playground - Uncaught TypeError: e.Tools.getClassName is not a function at o.get [as modelKey] (babylon.canvas2d.min.js:4) at o.n._createModelRenderCache (babylon.canvas2d.min.js:7) at o.n._prepareRenderPre (babylon.canvas2d.min.js:6) at o.r._prepareRender (babylon.canvas2d.min.js:5) at n._prepareGroupRender (babylon.canvas2d.min.js:7) at n._updateCanvasState (babylon.canvas2d.min.js:11) at n._render (babylon.canvas2d.min.js:11) at e.callback (babylon.canvas2d.min.js:10) at e.notifyObservers (babylon.js:2) at r.render (babylon.js:10)
  17. 2D Artist for Hire

    Hello, I'm Emily and I'm a freelance artist looking for paid projects, small or part-time. I'm currently booked up on revenue share projects, so I'm only available for gigs that pay as I work. I specialize in 2D game graphics, including: - UI - backgrounds - 2D animations - illustrations/concept art I'm also open to doing anything else 2D animated or fully illustrated (cover art, comics...) For samples of my portfolio, please visit: If you feel my style of art would be suitable for your project, please contact me at: Otherwise, please feel free to check out/play some games I've worked on: Thank you for your time and consideration. I hope you enjoy my work
  18. My last game, Faraon, created live, about 35 hours of video.Playable from any browser, smartphones, iphones, mac, pc, tablets etc...Rescue your friend through the dangerous rooms hidden in the pyramid of Pharaoh.Test your skill in this fun platform game, Are you a hero? Prove it.Funny and fast platform game.- 55 levels.- 3 different finishes.- Easy to play, one-touch control.- Many traps and enemies await you in the pyramid.- Great and original soundtrack.- Adapted for keyboard and touch screen.- Playable from any device.- Pixelated graphics. Faraon trailerPlay on Itch.IO: Faraon Itch.ioPlay on my Web: Faraon
  19. Would babylon be suitable for a game with a 3D world, but with 2D sprites, like Don't Starve? Or a game like bastion/transistor with isometric 2d views but 3d characters? Thanks!
  20. Modify time scale in 2D physics engine

    Hi, I would like to modify time scale in a 2D physics engine. I searched about it, and matter.js seems to permit timescale modification. In addition, i would like to set 'different timescales' for different bodies (as example: 2 object fall, one will be set to timescale:1 and the other timescale:0.5. So this last one will fall 2x slowly) It sound nonsense, but is there a trick to do it? I thouth about saving positions on last step, and compare them to the new one, then replacing them with a homothety value relative to the timescale. But there is a lot of cases that this can't handle Any sugestions? Thanks
  21. Description: "Spaceroids" is addictive arcade game which depends on Timing, Anticipation, and Luck. Use your hand to launch the space rocket to explore the solar system and travel between planets on the "Endless" mode, or control your spaceship and test your skill on the challenging set of levels! Details: App Name: Spaceroids Price: Free Developer: Qalamar Release Date: 8 July 2017 Platforms: Android, Web (HTML5) Press/Business Contact: contact@qalamar.comIcon:Screenshots: Features: • Addictive Gameplay & Simple Controls • Unique Levels & Endless Mode • Neat Theme & Breathtaking Visual Effects • Achievements & Leaderboards • Player States & Dynamic UI • 3 Supported Languages: English,Arabic and French Links:Google Play: Website: Trailer:
  22. I’m investigating possibilities of porting the graphical part of an OpenGL desktop application to BABYLON.JS. The basic displaying went easy but (for me) the difficult part to create meshes that are 2D forms in a 3D space (please have a look into this 10 seconds video: Basically, the rectangles are always facing the camera, but in the same time are rotating and resizing with the entire scene. What would be the right (and hopefully the easiest) way to make that working? Additionally, I would like to display “tool tips” (mesh names) on selected meshes (and when the mouse pointer hovers over a mesh). That part I could easily program myself (except for hovering), but only by using the 3.0 pre-release (see playground I’ve copied that solution from the GUI playground and it works just fine. Am I using this functionality properly?
  23. Descensus 2

    This is version 2 of my game Descensus from several years ago. It's a simple but difficult 2D physics game in which you have to guide the ball to the ground by swiping bars on screen, bouncing it around spinning saws and off moving terrain objects. There's a time limit to reach each 100m stage, and you can use terrain objects to your advantage as well. It was written using the physics library p2.js and the rendering library Pixi.js. I wrote in in TypeScript, bundled with Webpack, developed using Visual Studio Code. The Android version was packaged using the cloud build system Monaca, bundling the Crosswalk webview (hence the relatively large APK size). It doesn't use any PhoneGap APIs - the sound is all HTML5 Audio. I did most of the testing on desktop so I know that it works nicely with both mouse and touch. I have put an online version (with sound disabled) at Play Store link: Video:
  24. I have a graphics issue that I cannot pinpoint. My sprite appears more blurry at some positions of the map. Does anyone have an idea what this kind of problem can depend on? Both of these pictures shows the sprite when idle on different positions - so no animation is playing - and at the first picture the sprite looks more clear than it does on the second one. I don't know what more information I can give on this that is relevant.