Search the Community

Showing results for tags 'mobile'.



More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

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

Find results in...

Find results that contain...


Date Created

  • Start

    End


Last Updated

  • Start

    End


Filter by number of...

Joined

  • Start

    End


Group


Website URL


Twitter


Skype


Location


Interests

Found 401 results

  1. Hunt prehistoric creatures with your friends online. Build your own base, craft tools, and weapons to survive in a large-scale true cross-platform open world game. This game is an application of the engine I’ve built, to prove a statement: It is POSSIBLE to build a 3D version of the Internet, where instead of browsing through websites, we could jump from one 3D space to the next. I “invite” everyone to make this happen. I want you guys to build your own 3D spaces implementing your own ideas what the web should look like in the future. We could just link them all together and make this Interconnected Virtual Space happen - yeah, the Metaverse, for the Snow Crash fans out there Tech Details that I hope provokes further questions: Loading Assets on Demand is even more important in the Browser than on PC or Console. Internet speed is only a fraction of the speed of the hard drive. It is essential to only load whats visible if you want to provide an open world environment for users visiting your world the first time. LOD - Level of Details allows Web Browsers to show something immediately for the users just like an ordinary website. It may look poor and users can see the object improving as they are loaded, still, I think its a good trade-off. Users get a good enough view of their environment instantly and can start interacting with it immediately. Terrain and the Grid System I’ve created the terrain in Blender, then I split it up like a chessboard automatically using Javascript. It is easy/cheap to determine that which cell contains the given coordinate and every single cell in the Grid has a reference to its neighbors. This is the basis of server layers of optimization when it comes to rendering, AI, and collision detection, etc. A recursive search is very easy to do, using those links to neighboring cells. Lighting I've implanted basic Directional and Ambient Lighting to support Day & Night Cycles and Point Lighting for individual light sources like a campfire, torch etc. To my surprise, the difficult part was to get good looking flames, thanks to the lack of Alpha Sorting in WebGL, what I had to implement in Javascript instead. Animation I animate my models in Blender, export them to “.dae". The file format comes with a serious limitation, you can’t define multiple animations and it only maintains a list of keyframes as references. So I maintain a JSON file per “.dae” to define multiple animations by having sets of keyframes. E.g.: “{running: [0, 4], jump: [5,7], ..}”. But I kept it simple and didn’t take it to the realm of animations per body part. Physics In short, I was stupid enough to write my own ..on the other hand, I have a fine level of control over how much I allow it to run. Again, on mobile, it is crucial to have that level of control to navigate 200+ creatures in real-time. I have two different type of Collision Detection. Collision with the Terrain and collision with other model surfaces. Terrain collision is very cheap, this allows me to move so many NPC at once. Collision with other models is heavier though, but that allows me to climb random looking rocks. I optimized it enough to make it feasible to run on mobile devices. I use a low poly version of the models to determine the collision and I only run it for the models near the Player, utilizing the Grid System I mentioned above. AI NPCs can navigate a random terrain, avoid obstacles and “see” and “hear” other NPCs if behind them. At the moment, they move rather robotically, but this allows me to calculate, where they can move next without hitting any obstacles and how long it will take to get there. I only run the AI right before they get to the target location. Basically, 200+ NPCs make only 40-100 AI calls per second. ..I certainly have room for improvement here Multithreading in the browser is difficult but necessary to achieve good Frame Rate. Nothing but the rendering should be on the main thread ideally - Good luck to achieve it though I’ve managed to push most of the heavy logic into a speared thread, but AI is still running on the main one. In a thread you have very limited access to important functionalities of the browser, therefore, there is only so much you can do. Also, specific objects can only be passed by reference between threads, everything else has to be serialized on one end and deserialized on the other. You want to be careful how often you do it. Audio I use the Web Audio API that works as expected. On top of that, I implemented Audio Sprites: I compile all related sounds to a single mp3 file and that comes with a JSON object to define where certain audio snippets can be found. It's a fast, accurate and reliable solution unlike using Audio HTML Tag, but that one has its own use cases as well, e.g.: streaming an mp3 file comes for free, like streaming an internet radio station. Multiplayer - I use WebRTC and not WebSockets - I know, I know, hear me out. The idea was that COOP is a very likely scenario and players may only prefer the company of their friends. I that case, they don’t have to purchase access to a private server, as long as they are happy to let their world go dormant between gaming sessions. Plus, all the logic is implemented for single player mode on the client-side, which logic has to be duplicated on the servers, if I went down the WebSockets rout - just think about where the AI logic should be, server- or client side. I expect this one to be a controversial decision, ..sometimes even I'm not sure whether this was the “right" decision There is a whole lot more to this though. Resources could be distributed between players when it comes to AI to ease the load on the Host - I know it is a potential security issue, but there is a use case for it, like AI for distant NPCs in COOP as long as you have no hacker friends ..this could be crucial on mobile devices. Controller Support The Gamepad API provides you with raw access to every button and joystick. You certainly have to implement your own layer on top of that. Events for pressing/holding down buttons don't come out of the box. Implementation of the dead zone of joysticks is missing and it is inconsistent how you can access different types of controllers through the API, even the same controller but on different devices. In the end, you will have to provide a controller mapping implementation as well in your settings. But its totally doable and works like a charm. Touchscreen Support It's a tricky one. As I mentioned above, on iPhones its completely useless till Apple decides to comply with Web Standards. Even on Android, it is a bit tricky: For the UI you probably want to use HTML. It makes sense because it comes with all the neat features that make our lives easier until you realize that you can’t switch between weapons while running - wait, what? You see, while you are holding down the left side of the screen to maintain speed and try to click on a button, or any HTML element to switch weapons, the click event won’t fire. No click event will be fired while doing multi-touching. As a result, HTML and any fancy framework for that matter are no longer good enough solution own their own. UI When it comes to games we expect a whole lot more from the UI than on a website. Multi-touch support - as discussed above and even controller support is not as straightforward as you might think. You have raw access to the controller, so when a button is selected and the user pushes the joystick diagonally upward, you have no idea what is in that direction, therefore what should be selected next. You have to implement the navigation of your UI with a controller for yourself. And you need controller support because that's the only way to move around in VR and on consoles. Speaking of VR, you want to render your UI twice in VR - once for the right eye and once for the left eye - and only once when not in VR, just something to keep in mind Also, rendering the UI could be heavy. This might be a surprise but if you think about it, on a website you don’t do anything but the UI, so you have a lot mere leeway to work with, whereas in a game you don’t want the UI to impact the Frame Rate, so it has to be very lightweight and probably you want Scheduling to have a final say on what gets refreshed. Taking all this into account, I really don’t see how any framework could be a good option - they were simply designed with different requirements in mind and there is more downside to using any of them than upside. Precomputed Scene Occlusion Culling using a Grid System Most of the optimization is happening real-time or triggered on a regular basis while running the game with one exception: I render every cell in the Grid System from the point of view of every single other Cell. E.g.: Cell A can see cell B and C but not D. I literally diff two images with javascript to determine whether the given cube can be seen or not. Then I record the results in a JSON file, which is used for rendering. This reduces the number of cubes to be rendered significantly, but it takes about 40 hours to run this optimization for the whole terrain. Running the game on Mobile Devices iPhone runs WebGL significantly better than top-end Android devices but practically useless because Apple ignores important web standards. E.g.: Pinch zoom can’t be blocked, therefore when you use your left thumb to move around and right thumb to look around, instead of doing so you end up zooming back and forth the screen. It also doesn't support fullscreen mode - video does, but not the canvas element. Another interesting limitation on iPhone is that you can only have 25 elements in an array in GLSL, which translates to having only 25 bones in an animated model. This doesn't make animation impossible, but you can’t use most animated models that you buy in the stores, you have to do it again with only 25 bones. Profiling “What gets measured, gets managed”. The built-in profiler in Chrome certainly has its use-case, but not good enough for what we want, so probably you will have to build your own at some point with specific features. You want to know how long a certain section of your game runs per frame, e.g.: Rendering, AI, Physics, etc. and probably these sections won’t run sequentially, but they are interrupted by other processes that you don’t want to include into the specific measurement. One thing is for sure, you cant do optimization without identifying the source of the lags. - I've certainly wasted enough time trying Scheduling As long as you are pushing the limits of the devices it is always a battle for a smooth frame rate. Therefore, you have to implement a scheduling system to manage what is allowed to run and for how long. E.g.: whatever is loaded and processed in the background will have an effect on the frame rate even if it is running on a different thread, you want to throttle that. You don’t want to set variables through WebGL API unnecessarily. AI always varies how much calculations it has to do depending on the number of unique encounters of 200+ NPCs in a random environment. Basically, you will have to limit what runs and how long, manage what is a nice to have calculation and a game-breaking one and try to make it seamless for the user. Probably every single topic above deserves a dedicated post, so please feel free to ask anything - there is no stupid question - then I would like to use those questions to write an in-depth post on every single topic that helps fellow devs to overcome similar obstacles - no doubt I will learn a thing or two in the process Live Tech Demo is available on https://plainsofvr.com
  2. mohammad_aqajani

    mobile keyboard enter event on text input

    hello, Phaser 3: I use this code for a simple text input to get the value of it on ENTER press event: enterE = this.input.keyboard.addKey(Phaser.Input.Keyboard.KeyCodes.ENTER); but as chrome and some other mobile browsers user "go" instead of "enter", the above event does not trigger! is there any keyCode other than ENTER for that ?? or should use jquery??
  3. Hello Devs, I finally launched my first html5 mobile game for android Honeycombs is a classical match-3 game with a hexagonal field. Make as many points as possible in a given time. You can find it here: https://play.google.com/store/apps/details?id=net.kuboid.honeycombs and this is how it looks like: I created it using plain Javascript and Pixi.js wrapped into a cocoon.js app. Cocoon.js is a cloud compiler that gives your game a huge performance boost and supports plugins like Ads and Google Play Highscores. You can read more about it here: https://cocoon.io/ Depending on Feedback I plan to add some more content. Because it is all html5 it of course it also runs nicely in the browser so I want to put it online somewhere later. Cheers
  4. Doug

    Hi Rich.  @rgk mentioned that you might be able to please add a "patron" badge to my forum profile?  Thanks very much!

  5. Tymski

    Cordova + Pixi = ♥?

    Hello everyone. It was probably a year since I posted anything. Good to be back here. I had a looong break with hardcore html5 game development. Can you suggest a good way to start a cordova + pixi project for android? Can you recommend any tuts and share some of your experiences with developing mobile apps with pixi I look forward to reading about your experiences!
  6. We are looking for developers who can create our single-page web-based mini-games. We prefer to finalize the hiring in freelancer websites like Upwork to ensure proper delivery and payment. We have several in the pipeline and it has become a bit challenging to find Pixi developers in Upwork so we are trying our chance to find developers here.
  7. Shex

    Image is pixelated

    Hi I'm trying to run my game on a mobile device with the Phaser 3 framework and sprites are rendered as very pixelated images. I'm running the game through the Facebook web player. I'm using a Samsung Galaxy S6 device which the resolution is 1440x2560 with a device pixel ratio of 4. I have setup the same configuration on my PC through the Chrome mobile debug view (1440/2560 with pixel ratio of 4) and the images look way better. I have attached two screenshot of the PC (good) and mobile (bad) devices to show the difference. The game is rendered as CANVAS and I'm using the window.innerWidth and window.innerHeight to define the sizes. Does anyone have any insight about what's going on?
  8. It was mentioned about 2 weeks ago that multi-touch would likely be part of the next release, but I didn't see it in the changelog of 3.3.0. Will it be part of 3.4.0? I mostly want it for pinch to zoom. Hoping to make an RTS-lite game, where you can drag the camera around and also zoom in and out with pinch to zoom (two fingers). Phaser 3 is awesome, by the way. I've really been enjoying it.
  9. The skybox textures are not correctly displayed if I view it on my android phone. For reference: my phone is a One Plus 5T with Android 8 and Chrome 65.0.3325.109. I noticed it while trying to view my current little project on mobile (noxwings.github.io) I can confirm this happens with "3.2.0-beta.1" and "3.2.0-alpha7" and whatever the "default" version is autoselected on the playground. You can use the "tutorial" skybox playground to check it. I'm uploading an example image of what I mean. The side images are all switched. http://www.babylonjs-playground.com/#UU7RQ#1
  10. AdamRyanGameDev

    Feedback on Mobile Performance

    After seeing this recent post I just wanted to ask how others are fairing with mobile browser performance. Also wondered if Phaser3DevTeam would benefit from hearing good and bad news from a variety of devices/browsers/OS's, because it is particularly difficult to test on multiple scenarios....
  11. Dear all: I'm here again with several FRAMEBUFFER errors I thought has been solved migrating to BJS 3.1. (please take a look to closed topic http://www.html5gamedevs.com/topic/35352-strange-problem-when-using-highlight-layers/) On dektop (Win10 64bit), FF Developer Edition (59.0b13 - 64-bit) shows these kind of WebGL console warnings (excerpt): Error: WebGL warning: clear: Framebuffer not complete. (status: 0x8cd6) COLOR_ATTACHMENT0 has no width or height babylon.3.1.custom.min.js:5:4633 Error: WebGL warning: clear: Framebuffer must be complete. babylon.3.1.custom.min.js:5:4633 Error: WebGL warning: drawElements: Framebuffer not complete. (status: 0x8cd6) COLOR_ATTACHMENT0 has no width or height babylon.3.1.custom.min.js:5:19516 Error: WebGL warning: drawElements: Framebuffer must be complete. babylon.3.1.custom.min.js:5:19516 Error: WebGL warning: drawElements: Active texture 0 for target 0x0de1 is 'incomplete', and will be rendered as RGBA(0,0,0,1), as per the GLES 2.0.24 $3.8.2: The dimensions of `level_base` are not all positive. Also on Win10, my Chrome browser (64.0.3282.186 - 64 bit) shows awful lines like these (excerpt again) : .Offscreen-For-WebGL-00000233101348E0]GL ERROR :GL_INVALID_FRAMEBUFFER_OPERATION : glClear: framebuffer incomplete .Offscreen-For-WebGL-00000233101348E0]GL ERROR :GL_INVALID_FRAMEBUFFER_OPERATION : glDrawElements: framebuffer incomplete .Offscreen-For-WebGL-00000233101348E0]RENDER WARNING: texture bound to texture unit 0 is not renderable. It maybe non-power-of-2 and have incompatible texture filtering Running Safari browser on macOSX (High Sierra) works OK. Tomorrow I'll look console outputs for WebGL warnings. Well I get all these warnings but, at least, the 3D contents are all (Win10 and High Sierra) shown as intended. The real problem comes when I load the code on Android Chrome (64.0.3282.137), as it renders black all my PBR textures, while showing the following lines through DevTools>Remote devices>Console (that is I'm debugging here mobile Chrome from desktop Chrome): [.Offscreen-For-WebGL-0xb917a020]RENDER WARNING: texture bound to texture unit 2 is not renderable. It maybe non-power-of-2 and have incompatible texture filtering. 85[.Offscreen-For-WebGL-0xb917a020]RENDER WARNING: texture bound to texture unit 3 is not renderable. It maybe non-power-of-2 and have incompatible texture filtering. 43[.Offscreen-For-WebGL-0xb917a020]RENDER WARNING: texture bound to texture unit 1 is not renderable. It maybe non-power-of-2 and have incompatible texture filtering. 42[.Offscreen-For-WebGL-0xb917a020]RENDER WARNING: texture bound to texture unit 4 is not renderable. It maybe non-power-of-2 and have incompatible texture filtering. 21[.Offscreen-For-WebGL-0xb917a020]RENDER WARNING: texture bound to texture unit 5 is not renderable. It maybe non-power-of-2 and have incompatible texture filtering. main.html#page-mixer:1 WebGL: too many errors, no more errors will be reported to the console for this context. Under Safari for iOS I get my models rendered as is expected. Tomorrow I'll be able to inspect console output. As said in the thread, all my textures are power of 2 (512x512). I can't reproduce this behavior on PG, as this is a really complex development. I welcome any suggestion about how to have my code clean of warnings and, mainly, about the way to have my PBR materials not being renderered black on Android Chrome. Best regards.
  12. I was posting this thread at the wrong place (it was in Phaser 2). OK, I am having a very bad time with clickable objects. It works perfectly on desktop browser but when I run it on my Android mobile the hot spot is totally off. Please refer to the attached picture to have an idea what I am talking about. The blue square is the clickable object (it's a .png picture). Tapping the object won't fire the input event but if I tap around the position where I draw the marquee it will. In other words, the clickable area is off of the picture. I found this thread where the OP had a similar issue and mentioned that is could be related to the mobile devicePixelRatio when using Phaser.CANVAS but I couldn't establish a coherent relationship between the DPR and the displacement (otherwise it could be "compensated" with code). I really cannot see how to solve this. I am about to give up Phaser and try a different engine. Any idea?
  13. OK, this is weird. I spent a lot of time trying to figure out why my image objects wasn't firing when I tapped on it (it works on desktop). After several tests I noticed that it happened that on mobile screen the clickable area was off of the image (displaced). I found that someone had a similar issue and figured that it had something to do with devicepixelratio when using Phaser.CANVAS. I couldn't test with Phaser.AUTO because my mobile throws a WebGL error when I try to use it. Any idea how to fix this issue? Thanks!
  14. I have this simple game for small children that consists on several images that when tapped should produce a sound. I got it working on the computer (mouse click) but not on mobiles (finger tap) and I suspect that's because I am listening to the wrong event. Could someone tell me how to listen to a image "tap"? My current working code for computers is: // I am adding the functions and listeners dynamically with a // loop so aAssets is an array containing the image elements // enable input window[aAssets[i]].inputEnabled = true; // create the function to be triggered by the listener window['lst'+aAssets[i]] = function (me) { alert (me.key); } // add the respective listener window[aAssets[i]].events.onInputDown.add(window['lst'+aAssets[i]], this); PS: I found the events "onDown" and "onTap" and tried them but both causes an error when added. Thanks!
  15. I am currently creating a puzzle game app using Phaser and Cordova (crosswalk) but I am having some trouble with the meta viewport tags. Testing the game on my android phone with cordova, no matter what I set my meta viewport tag, the game is always extremely zoomed in on one small area of the canvas. However the reason I think this is a viewport problem, is that on chrome, when I set the meta viewport to this: <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width"> I get the exact same problem as in cordova, however when I don't set it at all, or set it to something like this: <meta name="viewport" content="user-scalable=no, width=3000"> The game runs perfectly fine! How can I fix this so that the canvas and cordova viewport will both work? Details: Phaser version 2.6.2 Phone model - Samsung Galaxy S7 P.S. Apologies if this is more of a Cordova problem I was not sure. A final thing I did with Cordova (if anyone has any experience with it) is set this in the config: <preference name="EnableViewportScale" value="true" /> Still no luck...
  16. Hi everybody, This topic is here to list known mobile apps using Babylon.js. Could you mention the one you know ? Thanks !
  17. Hello everybody, I've been obliged to find best solution for making html5 games for our company. It'd be great if some experienced developers would advice on which direction to go. We have a huge experience in Unity games development, but we already created around 10 games in Phaser 2 engine with WebStorm and TypeScript, but we're not fully satisfied because of the low performance of the games on mobile platforms and lack of support for optimised shaders. Our needs are: - Good performance on mobile platforms - 2D (but 3D would be appreciated, majority of our projects would be 2D) - Good support for sprite sheets (TexturePacker support would be great), sounds, particles, physics, real shaders (vertex, fragment), tweens, skeletal animations - Layout Editor would be great - JS ES6 or TypeScript support - Can be commercial
  18. stealman

    Space Ace

    Hello guys ! I would like to introduce my latest game Space Ace - actually the first one that I have done completely as it supposed to be. It is made in HTML5 using plain PIXI and Apache Tomcat server to provide HTML content and websocket listener. Originally it was meant to be PVP game but once I have realized that there will never really be more than one or two players online simultaneously (it is very common among most of indie games), I decided to make it more soloplay focused with multiplayer just as a nice to have. Game controlls and features are described on login page so I will not duplicate it here Feel free to play and enjoy and I am looking forward for some comments, here is URL - http://darkenlight.net/spaceace
  19. Hello, When I move a sprite with Game.physics.arcade.moveToXY the sprite move about 3 times slower on mobile (chrome) then on PC. I've tried setting a speed and setting a maxTime but same result. Does anyone knows why?
  20. Zendrael

    [Phaser] The Last Battery

    Hi! I Just released my new game called "The Last Battery"! You can play it for free at https://goo.gl/JGeumV and try to survive until your battery is running out! Also, my other games are at https://www.minzaogames.com Thanks!
  21. louisAtome

    WebGL resize stage blinking on iOS

    Hello, On my iOS devices (iPhone 4S, iPad Mini) when I resize the WebGL renderer, the elements of my stage are briefly scaled with the new size of the stage before being re-render with their original size. I just want to resize the drawing zone without changing the size of the children. The behaviour only occur on iOS with the WebGL renderer. I've made a jsFiddle to show the problem : http://jsfiddle.net/ntvLas1x/1/embedded/result/ . To reproduce, just click several times on the resize button from an iOS device and you will see the red square changing size. Thanks in advance, Louis
  22. GregDev

    Space Demons

    Just wanted say hi to the community by posting about my first game, it was build using the html5 canvas combined with other DOM elements. Didn't use a framework so it's pretty rough around the edges. I only released it for android (didn't want to pay the apple subscription fee :P) I'm building another mobile game using Phaser 2.9.2 CE right now and absolutely loving it - looking forward to sharing it with you guys! Google Play Store link: https://play.google.com/store/apps/details?id=com.gmm.spacedemons&hl=en Any feedback/comments would be very much appreciated!
  23. Hello everyone, I'm just making game/app that will check personality and skills of the kids, before they choose their carrier path in life. I have problem with hit area. In web browser everything works properly but when I run my app on mobile device, every sprite is scalling ok, but when I want to click on it I have to click a little bit below and in the right. It looks like sprite change position on the screen after scalling down but hit areas stay in their old positions. Either pixelPerfect = true and false doesn't work. Have you any ideas what is wrong? I'm not including code 'cause whole project is too big now to put everything here, it'll be not clear and won't gave you guys clue what's going on. If that'll be necessery I can try to compress it to some pseudo code or something. And happy new year everyone!
  24. Hello guys! First of all I would like to thank you for all your valuable comments on this forum. I’ve found basically all answers to my questions digging up this forum. I’m trying to make a simulation/rpg like game with Babylon and I'm experimenting with procedural generation and content streaming. I need help on two (probably related) questions: https://playground.babylonjs.com/#SCV25U#6 1 Z-Fighting / Flickering on Mobile. I’ve noticed that some meshes are flickering on mobile (especially the ones who are generated on click). I thought could be some Z-Fighting problem and I moved the ground generation before the trees generation, doing this has solved the issue only on the meshes who are generated on load, not on the meshes generated on con click. I’ve also tried various ways of click picking / invisible mesh combination but nothing changed apparently. I need to try with no overlapping visible meshes, but I still need an overlapping invisible plane to detect the click. 2 Merging / Instancing doubts. Merging a big group of boxes has really amazing FPS performance (even on mobile with a large world), but freezes the browser. So I’ve splitted and delayed the merging execution, still freezing but it looks better. I’ve tried with ribbons, amazing performance and results if you need something like Transport Tycoon, but isn’t what I was looking for. Instancing a big group of boxes has no freezing at all but really low FPS rate, I need to try to use a box without 2 useless faces, but I suppose the FPS rate will be much the same. Clues on solving this or ideas about different approaches will be really appreciated. Thanks, Marco.
  25. Rechi

    Interactive Snowcone

    For a Christmas Newsletter we created an interactive snowcone. The model represents our hometowns city tower. On desktop the snow is simply triggered by mouse drag, on mobile you can actually "shake" to let it snow. This was actually my first Babylon.js project and I'm quite happy with the result. http://www.pundr.at/xmas/