WebGL - Casual Vehicular Action (Completed)

[adamgolden]

Edit: November 1st, 2022: Casual Racing published on itch.io:
https://forum.unity.com/threads/published-on-itch-io-casual-racing-desktop-webgl.1355867/

Edit: December 31st, 2021: [Tower Offense]( WebGL - Casual Vehicular Action (Completed) page-2#post-7773255) released.
Edit: November 12th, 2021: [Casual Racing]( WebGL - Casual Vehicular Action (Completed) page-2#post-7652242) released.

Previous Weekly Updates

Edit: November 6th, 2021: [Weekly-ish update.]( WebGL - Casual Vehicular Action (Completed) page-2#post-7633705)
Edit: October 29th, 2021: [Weekly update.]( WebGL - Casual Vehicular Action (Completed) page-2#post-7615078)
Edit: October 22nd, 2021: [Weekly update.]( WebGL - Casual Vehicular Action (Completed) page-2#post-7595560)
Edit: October 15th, 2021: [Weekly update.]( WebGL - Casual Vehicular Action (Completed) page-2#post-7576444)
Edit: October 9th, 2021: [Weekly-ish update.]( WebGL - Casual Vehicular Action (Completed) page-2#post-7559251)
Edit: October 1st, 2021: [Weekly update.]( WebGL - Casual Vehicular Action (Completed) page-2#post-7540019)
Edit: September 24th, 2021: [Weekly update.]( WebGL - Casual Vehicular Action (Completed) page-2#post-7521131)
Edit: September 17th, 2021: [Weekly update.]( WebGL - Casual Vehicular Action (Completed) page-2#post-7504048)
Edit: September 10th, 2021: [Weekly update.]( WebGL - Casual Vehicular Action (Completed) page-2#post-7487516)
Edit: September 3rd, 2021: [Weekly update.]( WebGL - Casual Vehicular Action (Completed) page-2#post-7471633)
Edit: August 27th, 2021: [Weekly update.]( WebGL - Casual Vehicular Action (Completed) page-2#post-7455248)
Edit: August 20th, 2021: [Weekly update.]( WebGL - Casual Vehicular Action (Completed) page-2#post-7436330)
Edit: August 13th, 2021: [Weekly update.]( WebGL - Casual Vehicular Action (Completed) page-2#post-7416512)
Edit: August 6th, 2021: [Weekly update.]( WebGL - Casual Vehicular Action (Completed) page-2#post-7396454)
Edit: July 31st, 2021: [Weekly-ish update.]( WebGL - Casual Vehicular Action (Completed) page-2#post-7376561)
Edit: July 23rd, 2021: [Weekly update.]( WebGL - Casual Vehicular Action (Completed) page-2#post-7357328)
Edit: July 16th, 2021: [Weekly update.]( WebGL - Casual Vehicular Action (Completed) page-2#post-7335445)
Edit: July 9th, 2021: ** Weekly update. **
Edit: July 2nd, 2021: ** Weekly update. **
Edit: June 25th, 2021: ** Weekly update. **
Edit: June 18th, 2021: ** Weekly update. **
Edit: June 11th, 2021: ** Weekly update. **
Edit: June 4th, 2021: Weekly update.
Edit: May 28th, 2021: Weekly update.
Edit: May 21st, 2021: ** Weekly update. **
Edit: May 14th, 2021: ** Weekly update. **
Edit: May 7th, 2021: Weekly update (+video) .
Edit: April 30th, 2021: Weekly update .
Edit: April 23rd, 2021: Weekly update .
Edit: April 14th, 2021: Weekly update .
Edit: April 9th, 2021: ** Weekly update .
Edit: April 1st, 2021: Weekly update .
Edit: March 26th, 2021: Weekly update (no video).
Edit: March 20th, 2021: ** Weekly update ** (no video, and a minute late on post despite that!).
Edit: March 12th, 2021: ** Weekly update ** (no video).
Edit: March 5th, 2021: Weekly update (no video).
Edit: February 26th, 2021: Weekly update (no video).
Edit: February 19th, 2021: Weekly update (+video).
Edit: February 12th, 2021: Weekly update (no video).
Edit: February 5th, 2021: Weekly update (+video).
Edit: January 29th, 2021: ** Weekly update (+video) .
Edit: January 22nd, 2021: Weekly update (no video).
Edit: January 15th, 2021: Weekly update (+video) .
Edit: January 8th, 2021: Weekly update (no video).
Edit: January 1st, 2021: Weekly gameplay video update .
Edit: December 25th, 2020: Weekly gameplay video update .
Edit: December 18th, 2020: Weekly gameplay video update .
Edit: December 11th, 2020: Weekly gameplay video update.
Edit: December 4th, 2020: ** Weekly gameplay video update **.
Edit: November 27, 2020: Weekly gameplay video update .
Edit: November 20, 2020: Weekly gameplay video update .
Edit: November 13, 2020: Weekly gameplay video update .
Edit: November 6, 2020: Weekly gameplay video update .
Edit: October 30, 2020. Gameplay video posted. Jump here .

Original Post Follows:
This is my current project. By the end of the year I’m hoping it to be a solid foundation for my first title with Unity Engine. I’d appreciate any feedback related to performance in particular. Did it load? Was the framerate playable/smooth in your browser? Did it stutter at all, and if so, what seemed to be the cause? Does the vehicle engine’s audio play?

I still have much to add and improve - quite a few underlying systems and custom editors have just recently reached a point where I’m happy enough with workflow and performance to consider them reasonably/mostly ready to create a game with… but however much I test builds on my own, there’s no substitute for actual feedback. I’ve only had this laptop and my phone to test with on a regular basis.

The first world (with the car at night) is where my primary interest in feedback is, given it’s quite large and populated with content compared to the others. I’ve included an older test world (the “rail shooter” genre-ish one) plus 3 small “Mobile WebGL-compatible” worlds as well.

Please note it’s mostly programmer art - I’ve spent limited time on design and making things look nice… the worlds are all throwaways / temporary. The primary focus at this stage of development is functionality, stability and an acceptable level of performance. I’ve exaggerated the effect of some LOD systems by making their transition distance a bit closer than I would normally.

Graphics and other options are available in the menus. If you find it’s not working well, please try disabling Post Processing, Shadows or reducing MSAA. Thanks for your interest and for whatever feedback anyone can offer - in particular about whether it’s working and performance in general.

https://tentatively.online/open/test

[fataldevelop]

Hi, here are my results for iPad Air 2 (both Safari and Firefox(few frames faster))
Dynamic Texture Blending ~10 fps when tapping, 20 fps without tapping
Vehicle Test ~12 fps when accelerate, ~20 free drive, ~30 not moving. Sound works well
2d Scene ~24 fps

on iphone 6 didn’t started at all, but maybe it shouldn’t, device is too old.

[adamgolden]

Thanks for the feedback - yes, the performance of my Mobile WebGL worlds is disappointing. I was hesitant to include them at all, but given a lot of people are only using phones/tablets these days I didn’t originally want to just “forget about mobile browsers.” I won’t be releasing anything targeting it (maybe in 5-10 years when devices are faster, if then) and hopefully by then Unity will also officially support it. Mostly because I don’t want to work on super-simple concepts. I also have input issues on my phone (an S5) with the texture blending test in default browser, sometimes it doesn’t even detect the tap - but my phone is a dinosaur

[adamgolden]

These are the worlds mentioned above that can be selected when using Mobile WebGL without getting a warning:

For comparison with the iPad Air 2 feedback, Galaxy S5 gets the following fps until it heats up, then frame rates are about 10 less. Samsung Browser slightly outperforms Chrome.

blend: 32-38
2d-ish: 45-50
vehicle: 29-40

Updated live build to use 2020.2.0b7 (the feedback provided was on 0b5). I still have input issues on Mobile WebGL… I could upgrade to the new input system at some point and see if that fixes it, and/or dig around for what I might be doing wrong, but as I won’t be targeting mobile browsers anyway it’s not a priority.

[Aviryx]

In regard to what you posted.

“The feedback I’m currently seeking is how the world shown below is performing on desktop browsers for Windows, Mac and Linux (does it load, is it working, does engine audio play, is the framerate high enough to be considered playable).”

OS: Windows
Browser(s): Chrome, Firefox, Edge
Worlds: 1, 2, 5

No issues at all. 60fps, audio loads and plays fine. No stuttering or anything (Good choice to include a way to turn the car back over because I had quite a lot of fun off-roading trying to flip it).

The only other thing I would mention is that sometimes it feels like you lose momentum too quickly when turning after you build up some speed. I was trying to do big jumps but found that going straight worked better than trying to turn into a jump. Maybe that’s just me though.

[adamgolden]

@Aviryx thanks, that’s all great news - I’m glad you enjoyed it! And yes, my vehicle control definitely needs work… it’s not just you. I want to have fast-paced action, ramps/jumps, obstacles, time distortion, things to pick up, driving through breakable stuff like windows, etc. so controls will have to be tight and I’ll need to work around anything aggravating from a gameplay perspective (which I’ll probably also seek a round of feedback for once things are further along). I think it’s looking good right now on the technical side… but actual design and gameplay will take a lot of time as well, and other technical hurdles may present themselves along the way.

Actually on the 2nd world, you can use up (W) and down (S) to speed up / slow down time - this is a remnant from previous gameplay tests. The same world also has dynamic shattering / fragment pooling… each time you complete a mini-game there (i.e. getting all stars) a panel displays, which breaks apart based on exactly where it’s shot. Well if that were a window / secret entrance to a shortcut… and the projectile was a car… anyway, slowly but surely !

[fataldevelop]

Hey, just tested on Windows in Chrome (GTX 1060 6GB)
I don’t know how WebGL is handling 4k displays, but i assume it is trying to render 4k
World1 ~40 fps
World2 ~40-50 fps

But 1060 is definitely not for 4k gaming. I assume your webgl tests should run fine on other PCs

[adamgolden]

@fataldevelop

But 1060 is definitely not for 4k gaming. I assume your webgl tests should run fine on other PCs

Thanks for taking a look - my previous laptop (2012, Intel i7-3520M with a NVIDIA GeForce 640M LE) struggles in the browser in full screen at 1920x1080 for even 30fps most of the time, but with graphics options turned down it’s much better. The “Low-End Platforms” worlds run at 60fps in the window and 24-40fps in full screen with the options at defaults (i.e. Post Processing enabled, 2X MSAA, 100% quality etc.).

However, that same laptop runs all worlds at 60fps+ (99% of the time) in a standalone Windows build. The difference between running as an application vs. in a web browser is definitely significant (and I assume likely to remain so). A Windows build can be downloaded from the Main Menu - it’s an automated process, current platforms I test with are built/packaged together, so any update to the WebGL version also has the Windows and Android versions with it.

Also worth mentioning, these worlds have a lot of transparency and batches, they’re not an attempt at best performance possible or “as good as it gets” - I’m just trying to gauge how they run, which so far looks like “good enough.” A mix of stuff including transparency and physics and particles etc. is more realistic for me, as my focus now is to actually have fun with development, vs. spending my time solving technical challenges.

Anyway - my current system (AMD Ryzen 7 4800H, NVIDIA GeForce GTX 1660 Ti) runs everything >= 60fps with all options highest / max. My “must hit” benchmark is that remaining to be the case and also hopefully still having a smooth experience on my older laptop in a standalone build… but if not, that’s fine too, it’s long overdue for retirement

[adamgolden]

https://tentatively.online/open/test

[adamgolden]

Since Feedback Friday last week I’ve made some progress. I took the advice of @Antypodish and @Billy4184 about the drifty camera - there’s now a Controls Option that lets you adjust how drifty. I’ve made the default to be 50% of what it was previously. I integrated most of the gameplay from the daytime “rail shooterish” world along with adding indicators for nearby challenges (as shown in the previous post). My current focus is adding gameplay mechanics - I’ll sink time into visual style / design / color palette when everything I want to code is roughed in.

There are interior lobbies to the towers now with a total of over 550 breakable windows. Destroying one also handles related LODs (which took some effort), so no matter how far away you are, the window is still gone. I disabled physics on the shards until I do a “Fragment Physics” slider in options for % of fragments to use it with, but they’re still roughly thrown based on impact. You can drive into/through lobby windows or shoot them out. There’s no sound except for the vehicle right now but I’ll add shatttering glass effects and some other stuff soon, maybe random items inside buildings etc… not to mention random prop placement and other typical stuff, and though I’m not keen on populating the world much as it’s a throwaway, I still do need the functionality as part of my workflow/tools/etc. Not to mention this is already effectively a stress test for WebGL - there’s a lot in this (over 1/4 million objects last time I checked the profiler). Actual game worlds will probably have less / be more tailored to a specific flow of gameplay.

I added an “Advanced Config” button in Graphics Options. Right now the new page just has Structure LOD Bias and Draw Distance, but will have more options soon and be somewhat reorganized. You can increase the distance at which structure interiors are visible with the first slider - but I wouldn’t advise maxing it out unless you’re running the Windows build because not allowing structures to use a lower level of detail further out will drastically increase batch counts. However, the game does have a different feel if you reduce the draw distance and then increase interiors to the edge of that, with buildings and trees coming out of the fog as you’re driving along etc… it’s possible I won’t include a Draw Distance option at all because it could break whatever visual style I go with, but for now it’s fine.

Also since my previous post I’ve roughed in the equivalent of a “rail grinding”/slingshot gameplay mechanic - there’s a couple of examples early in the world, and it’s not quite done yet (still need to have the car banking around corners, optimize things a bit).

In order to slingshot, you have to 1) be going in the direction of the “entry” and 2) be going faster than a minimum speed. The faster you’re moving the more of an effect the slingshot has. There’s an arrow on the ground that’s green if you’re approaching from the right direction (up to an angle difference limit), or red if not. The “11.4” there is the current velocity, as you accelerate towards it the color changes from red to yellow to green then it says “OK!”. I’ll convert this to KPH/MPH eventually. The arrow also needs replacing or to be changed to several in a row, it’s not visually enough at high speed… still mulling over design of it that complements boost pads and checkpoint challenges (some of the next stuff I’ll be roughing in). You’ll be driving over boosts then hitting a rail to get around a corner without losing speed - most rails will line you up perfectly to continue, with the intention of maintaining nausea-inducing speeds for most of the course.

If you’re going fast enough and approaching from the right direction, the lock opens and hitting it will attach you to the rail and accelerate your motion (like slingshot you off the end of it… which isn’t a big deal if you hit the rail at a slower speed, but if you’re already going fast when you hit it, the boost is huge).

Initially, only the beginning of the rail is glowing/more opaque, but as you get flung along it, the portion of the rail nearest to you (magnified by your speed) lights up, while the rest of the rail is mostly transparent. It looks a lot better in motion but here’s what it’s like exiting the rail from a sharp corner:

There’s also a bridge you use as a ramp further down that road, with a rail you can catch in the air if you have enough speed from the previous rail and your aim is close enough.

Finally, the current build is now using Unity Engine 2021.1.0a2. Hopefully progress continues to be reasonably smooth, I’ve got a long way to go yet. 1 week down, 51 to go. I’m kidding, …probably

[adamgolden]

https://vimeo.com/473771861

https://tentatively.online/open/test

[adamgolden]

A week later…
Lots of recent additions/changes/fixes, some of which are listed on the Main Menu in-game for anyone who played before. Below are the current options menus - there will also be a “Foliage LOD Bias” slider added next update and I want to reorganize the two graphics ones… but it’s mostly together.

And the latest gameplay video:

https://vimeo.com/476275577

[adamgolden]

It’s Friday again! Here’s another video - I’ve got new gameplay added (skip to 2:10 if you’ve seen previous videos or played before), refined a number of systems, added compass + indicators, can have multiple scenarios per world now, got a checkpoint/lap structure in place and a ~3.5km route roughed in. It’s been a decent week I guess, but most of what’s visibly new was done in the last few days… I spent way more time than I care to admit since last update bug hunting/stomping

…note the red barriers near the beginning in the ‘checkpoint dash’ scenario are early tests, you can shoot them (3 shots to destroy) and the less health they have the less they slow you down if you hit them… i.e. for obstacle courses etc. There’s no visual indication of how much health is left yet, but I’ll probably make the barriers blink bright when hit (instead of alpha curve like now) then be a bit darker or more transparent after the blink based on remaining health… so it’ll be easy to tell how much it’ll slow you down if you hit it. I’ll be making the impact on velocity and their health multiplier based on volume. So something larger you’ll know will take more damage to destroy just by looking at it… there will be different colors and materials of barriers (some more damage-resistant than others) as well and they’ll be sparkly like gems, at least until you smash them

Obstacle courses with destructible content, multiple paths to take plus exploration/completionist elements are definitely where things are heading… but there’s more to add/refine with gameplay mechanics and I also want to spend a bit more time optimizing before mostly shifting focus to designing [hopefully] fun environments.

https://vimeo.com/479144411

Play Now (Desktop WebGL): https://tentatively.online/open/test

[adamgolden]

Added new environment, streamlined a number of things related to worlds and scenarios. The previous “Main Menu” is now accessible at any time from the ? button near the top left. To get to the previous world and gameplay click Next World from this one’s menu or pick it from the Select World menu

https://vimeo.com/481884826

[adamgolden]

Another week, another video :). A number of improvements, bugfixes, rewiring of how scenarios work under the hood, added/improved camera transition systems, created an optimized system for object placement along routes + extended my editor with related tools. Each route can now easily have 1000s of objects, and routes can be any length without much impact on performance. Only the nearest objects are spawned in from pools, up to the distance ahead that’s allowed (which may eventually be another performance option). I’ve also added route previews to scenario selection. These are meshes generated from the actual routes and - eventually - selecting one will transition it to a minimap/progress area (which doesn’t exist yet) instead of how it just transitions out right now.

I haven’t spent much time populating the new environment aside from benchmarking/testing purposes… it’s a tough call given these worlds are intended to be throwaway/temporary, but at the same time, whatever… maybe I’ll get around to it before doing another world, at least along the routes. There’s a bit more cleanup and gameplay-related stuff I want to deal with before switching back to design either way.

Note - you can press R at any time while playing to abort and display the scenario menu. Also, you can now hop with spacebar, although there’s really no mechanic/usefulness just yet aside from getting over a guardrail instead of going around it. Also, don’t forget to brake - the current rail layout can hurl the vehicle at unmanageable speeds if you build it up that far (i.e. by hitting every rail and not slowing yourself down as necessary).

https://vimeo.com/484633401

[adamgolden]

I’ve been busy this week - gaming, Netflix, Amazon Prime Video …but I did manage to get a few things accomplished.

There is now a route progress minimap (to the right of the score), which fills in based on progress, with the label and current region transitioning color between red->yellow->green along the route.

I’ve refined the basic jump from before into a jump->double-jump system (spacebar, spacebar) along with stat to the left of the compass indicating how many jumps are remaining before at least 2 wheels must touch the ground for reset. I’ll eventually add a powerup that increases the max, so in some gameplay or worlds you might be able to triple-jump or even have no limit, which will make for some interesting layouts where ramps and rooftops are concerned. I’ve also added particle effect for the initial jump (ring of smoke burst expanding outward at the ground) and on any subsequent airborne jumps a similar one but with less particles and moving mostly downward as opposed to outward.

I’ve also added a stat to the right of the compass for #/# stars collected along the route, thrown a long string of stars into the “Service Road” route and added the stat to the Game Over menu (which applies to any completion state, i.e. success, complete, fail, aborted).

Trees now have collision, so you can’t just drive through them like they aren’t there anymore. I may do more soon re how the vehicle interacts with them, for example at low speed it will still stop you instantly, but at higher speed jiggle it and throw leaves particles, and at very high speed, fracture the trunk into a bunch of pieces based on where you hit and probably explode a puff of leaves or something. I want to keep that reasonably simple / mostly avoid it for now because I haven’t decided whether I’ll be doing trees like this, or low-poly style with no textures, or actual meshes + billboards in the distance - that’s design-related so it’s still a long way off. I’ll probably switch to design and creating worlds that will actually be in the final game about 3/4 of the way through the year (maybe 5-7 months from now, but that’s subject to change as there’s no actual release date or fixed completion schedule).

Also, worth noting again… the game will be free. I’m creating this by myself in my spare time while teaching myself Unity, refining/optimizing what I’ve done as my abilities improve and time/motivation permits (I’ve rewritten a few things along the way after learning new techniques or better ways to do things - but that’s just how it goes and is a part of the learning process). Anyway, another week down!

[adamgolden]

More progress with destructible environment systems. Added airstrikes, which throw up a cloud of debris with each particle textured like the point on the terrain it originates from. I actually wasn’t sure what was going to be possible for WebGL (where performance is concerned) or how far I could take the idea until all the pieces were together. There were a lot of underlying systems that had to be added and improved. There are still a few improvements to be made, but I’m considering it good enough now as-is to move on.

Blasts like these can also hit the player, also destroy guardrails (and way more stuff soon), breaking them off their posts to bounce around freely with physics. Later I’ll be adding explosive ammo, so this kind of thing will be more integrated with gameplay than just the dodge mechanic I’ve roughed in for now.

2021.1.0a9 + URP 10.2.2

https://vimeo.com/489940492

[adamgolden]

A few new things added - first/third person camera toggle with F, first person is now the default. I didn’t enable first person on the old test world (city at night), the vehicle only has 1 headlight right now and it looks dumb with a single bright patch on the ground in front of you all the time

Further improvements to destructible environment systems, groundcover now also removed in real time from blasts. Also, you can now exit any rail you’re attached to immediately by pressing jump (spacebar), or press jump when upside down to flip over (previously was only by click). Significant performance and stability improvements. Also roughed in damage indicator, corners of screen transition red for a moment when a blast is close to the vehicle (currently post processing must be enabled to see that, though there will also be indication of the direction that damage was taken from which won’t require it).

Also discovered and fixed a few bugs along the way, still two known issues to resolve at some point between other stuff. The main one is new and related to the icons displayed during hovering of interests/powerups - sometimes they don’t display now, but you can still click/collect the item in question. The other is related to compass indicators and first person roll - when the world’s upside down the directions are thrown off… or it’s just me being disoriented when upside down. Either way, it got my attention so I’ll take a closer look, I also noticed an indicator wasn’t vertical from the compass so I’m definitely doing something wrong somewhere.

[adamgolden]

Since last week’s update (aside from random improvements/changes) I fixed all of the issues mentioned in my previous post, plus did a significant rewrite of part of my groundcover system. The video starts at default Medium setting, the thumbnail image is while driving around after I set it to highest. The new system is still rough (for example I’ll soon have “patches” of the same kinds of groundcover together, like clusters to break up how uniform it is). Also the trees don’t have collision anymore, but it’ll be different when they do again - you’ll be able to hit them and they’ll be removed like they are from blasts and you’ll be slowed down instead of just being stopped instantly like before. Anyway, I’m pretty happy with how things are going. Happy holidays everyone, good luck with your projects!

[adamgolden]

Weapon selection is now roughed in. Primary control is mouse wheel, secondary is pressing number (i.e. 1 for default weapon, 2 for rocket launcher). Also will switch if you click a weapon’s icon. The Rocket Launcher weapon is also new. For now it has no cooldown period or ammo limit, so have fun! Just don’t fire at something too close

I’ve added support to my groundcover system for weighting sprite selection by texture/noise, so there can be patches of specific kinds of grass within a large field of grass for example. Note that the default option for foliage on WebGL builds is the upper end of “Medium”, turn this up to max if you want to see what I’m talking about more easily (so there’s denser foliage). Tree collision is back, but now as mentioned last week, driving into it will slow you down instead of the previous behaviour. This fits gameplay much better as you’re not getting stopped instantly when going really fast, or having a tree in the way of a checkpoint ruining an otherwise great run. I’ve also added a subtle-ish “rustling” sound when a tree is hit by a projectile or removed. Default projectile behaviour with one is to be removed on impact. You can also destroy trees by hitting them directly with a rocket (airstrikes or nearby rocket impacts also destroy them, along with any other groundcover in the blast radius).

Most in-world text is now part of the same draw call, averaging about 60 batches less during gameplay vs. before. There is a limitation to the technique in general with transparency however - as triangles in the same mesh can’t properly be depth sorted and there can be quite a few glyphs visible at the same time that must be sorted. I don’t want to switch to opaque with alpha clip for text despite the advantages, as I’d lose the “transition softness” that fading affords. However, it may later be a user preference. The only difference procedurally is the material being used (aside from adding a bool for text to flag it for inclusion only while using the opaque shader). Anyway, still able to merge most in-world text on menus, and already designed it so I can have separate merges at once if I need that for gameplay menus overlapping.

Lots of random fixes, changes and improvements. A few new bugs …camera transition out of “flythrough” type mode sometimes rolls improperly, haven’t got around to updating how I transition that yet. Another bug has to do with star stats. Anyway, neither are significant right now and will be cleared up by next week’s update anyway. That’s all to mention for now, happy new year!

https://vimeo.com/496327025