Popular Content

Showing content with the highest reputation on 07/23/18 in all areas

  1. 6 points
    Here's a video I made that shows the process of using mocap data in a 3D web-page. Basically I did this: Used Perception Neuron suit to mocap dance move 3D scanned in my mate Used Blender to create avatar from scan and apply mocap dance Used CLO3D to add clothing Published on web using Babylon.js The live demo is at https://punkoffice.com/hype
  2. 2 points

    Panda 2 Tips & tricks

    By default, all audio is stopped when you change scene. Want to disable that? Add this to your config: audio: { stopOnSceneChange: false }
  3. 2 points

    Slavs - slavian rpg game

    Hi! We had small opportunities to open alpha test, but we prepared a lot of stuff last time: Game website: http://slavsgame.com - it is not ready yet, because we need to write full scenario and create bestiary. Access to play is closed, but in this week I unlock that, so feel free to create your account! In game I made some performance improvements, also fixed the animations, we change the default babylon JS loader (don't afraid i will add to site BJS logo and description with link to framework) and a lot of small features and bugfixes. https://streamable.com/wltry - currently state preview - this will be available in alpha test. I will prepare 3 version (normal, mobile and debug), because I want to collect some feedback from users. I think about perfomance, what do you change in game etc. I describe it more soon. Tom Furca
  4. 1 point
    Hi all, I've created this sub-forum specifically for discussion about Facebook Instant Games. Use it to chat about the API, ask questions and post links to tutorials or code you've found useful. It doesn't matter what HTML5 game framework you're using (if any), but if you are using one, please say so in your post, so others can better help you. The FB API is the same regardless, but how you implement it is likely framework specific. This forum will be moderated by Facebook Instant Games staff where possible. Cheers, Rich
  5. 1 point

    more GUI Controls (ie: Menu)

    I was just searching PGs for examples of AdvancedDynamicTexture.CreateForMesh and came across a really well done menu ( which I converted to TypeScript and am using): https://www.babylonjs-playground.com/#31DGYT#5 There's no menu in GUI... I've seen other nice controls like @Pryme8's spinner, dropdown and progress bar. I'm porting my interface from DOM to GUI, so interested to see what's out there before I start creating my own custom controls. One I'll be building for sure is a switcher (http://bootstrapswitch.com/). My question is - does anybody have GUI controls they'd like to share?
  6. 1 point
    I've created a Phaser3 game template example, it's available on GitHub here: GitHub: https://github.com/BdR76/Phaser3-example-game Play demo: Phaser3 example game This is a Phaser v3 example game template, it's intended to show the structure of a typical Phaser3 game and using some of the key features of Phaser. It shows how to use separate scenes, a simple but effective loading bar, sprite atlas loading, sprite animation, buttons similar to Phaser v2 and more. It's a bare minimum game, a starting point of sorts. I hope it's useful for someone just starting out with Phaser development. Have fun with it let me know if you have any improvements. (Btw the only thing still missing is scaling or a scale manager, I'll add that at a later time)
  7. 1 point

    Input Brainstorm/Flick Path

    http://www.babylonjs-playground.com/#GI1F90#7 So this is the starts to trying to work out a "flick" control for a project I am working on. I am trying to effectively track a simplified curve or line of the players finger/mouse click and drag to release. Ive got a basic mock up here, but there are a few bugs that I need to figure out still. But I was wondering if anyone has any better ideas of how to do this, or any other thoughts that come to mind.
  8. 1 point

    Input Brainstorm/Flick Path

    http://www.babylonjs-playground.com/#GI1F90#13 So from here I am almost ready to start trying to "tossing" stuff. Got a power level effected by the distance of the swipe and the speed of it, a release height, then lastly will work out the "curve". Going for a simulated feeling thats natural even though its not a true to life model, but hopefully will make sense when there are visual cues re-enforcing the physical movement of your finger. *UPDATE* http://www.babylonjs-playground.com/#GI1F90#27 So here is one dimension handled.... Next gotta script in left/right and then apply some custom logic to make the "stars" curve. *UPDATE AGAIN* http://www.babylonjs-playground.com/#GI1F90#32 Just need to make some adjustments and figure out the stuff for the curving. and besides a "ninja-star" game, I rotated the square so it was being tossed flat and a "cornhole" game would be ezpz to make as well with this mockup. http://www.babylonjs-playground.com/#GI1F90#39
  9. 1 point

    Microsurface PBR

    Hello, microsurface works only if you are using the specular/glossiness workflow (meaning metallic, roughness settings are left null). This controls how blurry the reflection appears meaning exactly like roughness would do on metallic/roughness workflow. The value is 1 - roughness . So yes it is basically just a different convention to describe your material. You will definitely see the impact more if your material is close to a mirror meaning the reflectivityColor being close to white. This might actually help a lot: https://doc.babylonjs.com/how_to/physically_based_rendering_master
  10. 1 point

    Microsurface PBR

    Pinging @RaananW
  11. 1 point

    Loading animations from separate files

    Sweet baby Jesus I got it working with the createAnimationRange and copyAnimationRange thanks for sharing your demo! Not sure why a skeleton swap doesn't work. If I find out I'll be sure to report back
  12. 1 point

    Loading animations from separate files

    I look your files and I think there is a problem of conceptions. Watch how I did it here for animation loading on the fly : http://www.babylonjs-playground.com/#GA8XI#12 You must also make sure that the bones of your first character are the same number as those in the file containing the animations. Use : createAnimationRange and copyAnimationRange
  13. 1 point

    Loading animations from separate files

    Use this before creating the scene: BABYLON.SceneLoader.CleanBoneMatrixWeights = true; And this for the creation of your characters character.updatePoseMatrix(BABYLON.Matrix.Identity()); This solved for me similar problem
  14. 1 point

    The Wingnut Chronicles

    It's buried in the docs and certainly had me confused in the beginning. https://doc.babylonjs.com/how_to/gui The fullscreen mode is not intented to be used with WebVR as it is a pure 2d rendering. For WebVR scenario you will have to use the texture mode. That took me a while to figure out how to work around that. That's why I was just saying that it's good to reduce your target devices For your spaceship - if you have the perspective from inside the spaceship - then you can attach the meshes/planes to the camera. - if it's read-only gauges especially. If re-usable controls are created then they will be super useful to a lot of people. Here is a menu: From your PGs and some other ones it looks like we are making progress for scrollbars. I ended up abandoning cardboard support. I may revisit - technically there is a button that clicks part of the screen Maybe just build your game for the desktop and then revisit? That's what I did. It ended up being less work in the end as GUI had come much further!! It's getting better every release.
  15. 1 point

    Loading animations from separate files

    @Jorisshh The scene appears to contain null properties. However, I've not been able to find out how these 'null' properties are generated. I'll install the latest .babylon exporter, as I know the version I'm currently using hasn't been updated since 12/2017. I receive errors in the log file for the t_pose scene with the mesh, so I still believe it's a configuration issue. Hopefully I'll find time to look further into this, as I can't sleep when something's broken - as devs such as @Wingnut and @Dad72 can attest to since they find me up at all hours of the night. Let's keep this post alive and get this one solved. DB
  16. 1 point

    Projecting camera onto 2d world

    https://www.babylonjs-playground.com/#VNE2Z#22 https://www.babylonjs-playground.com/#1BGF1O#3 https://www.babylonjs-playground.com/#1BGF1O#4 http://www.babylonjs-playground.com/#4IVMG#1 https://www.babylonjs-playground.com/#1JPHAD#11
  17. 1 point

    How to fix a Image to a Sprite

    put everithing inside a container. then rotate container.. sorry for my bad english
  18. 1 point
    This is because the material has to output linear color instead of gamma color when used with DefaultRenderingPipeline This is where it is done: https://github.com/BabylonJS/Babylon.js/blob/master/src/Shaders/default.fragment.fx#L435 perhaps @Luaacro would be interested by adding this feature to the terrain material?
  19. 1 point

    Custom Font

    First time posting, so be gentle 😜 @andrei.nicolae I think the easiest way to explain would be to show you how I have done it. I've included a stripped down version of the Boot.js file I am using in my current project. class Boot extends Phaser.Scene { constructor() { super({ key: 'Boot', active: true, pack: { files: [ //INSERT SOME FANCY FILES ], }, }); this.progress = 0; this.loaded = false; } preload() { // IMPORTANT: below I load google's webfont loader this.load .script('https://ajax.googleapis.com/ajax/libs/webfont/1.6.26/webfont') .setPath('assets/img/') .image({ key: 'foo', url: 'foo.png', }) this.load.on('progress', this.onLoadProgress, this); this.load.on('complete', this.onLoadComplete, this); } onLoadProgress(progress) { console.debug(`${Math.round(progress * 100)}%`); } onLoadComplete(loader, totalComplete, totalFailed) { // IMPORTANT: Here we utilize the webfonts loader script we loaded above. // NOTE: I played around with calling this in different places and settled // on this one currently. Feel free to play around with where it is called. // just make sure that you do not call it before it is done loading and also // make sure not to proceed to a scene that needs the font before it renders. WebFont.load({ active: () => this.loaded = true, custom: { families: ['Montserrat'], urls: ['assets/fonts/Montserrat.css'], //I included what this should look like below }, }); console.debug('completed: ', totalComplete); console.debug('failed: ', totalFailed); } update() { if (this.loaded) { this.scene.launch('Clouds'); this.scene.start('Title'); } } } export default Boot; Like I mentioned in the above comments, here is the accompanying css file. @font-face { font-family: 'Montserrat-Regular'; src: url('Montserrat-Regular.eot'); src: url('Montserrat-Regular.woff2') format('woff2'), url('Montserrat-Regular.woff') format('woff'), url('Montserrat-Regular.ttf') format('truetype'), url('Montserrat-Regular.svg#Montserrat-Regular') format('svg'), url('Montserrat-Regular.eot?#iefix') format('embedded-opentype'); font-weight: normal; font-style: normal; } Hopefully, the comments alone are sufficient. If not then the file I stripped down is here in it's ever-changing (work in progress) form: https://github.com/fielding/trouser-snake/blob/master/src/scenes/Boot.js. The game has a long way to go, so no judging haha 😜 If code/examples aren't your way of learning and you have any questions let me know.