News for hackers. Stuff that matters.
Re:Tools we used to create a hit HTML5 game on Steam by roland35 on Tuesday November 19, 2019 @10:38AM (#21573984)
Quick summary, for those like me who get game sites blocked at work :)

- Sublime text, then VS Code

- Photoshop

- Paint.net (pixel editing)

- TexturePacker (create sprite sheets)

- Trello, Then Codecks (project task management)

- Chrome (for devtools)

- Bitbucket (git host) and SourceTree (git client GUI)

- Electron/NW.js (native PC executable for HTML game)

- Greenworks (Steam SDK)

- Back4App/Parse (Payment, user auth)

- Humblestore widget (payment processing)

- Layershift (hosting node

- Crowdin (translation)

- CoffeeScript (programming language)

- Python/Ruby (scripting languages)

Re:Tools we used to create a hit HTML5 game on Steam by ttty on Thursday November 21, 2019 @07:20AM (#21593372)
Some more notes from my experience:

If you're serious about large scale games, you should look into typescript. I'd start away from any other language, like coffee script, Ruby... See my next point.

Use node.js on the back end so you can do client side and server side validation with the same code. Another benefit is that you can also make your game single player much easier. I usually prefer to start the game multiplayer first and then do single player.

Another tool useful for game is pixi.js (or phaser if you need what they provide. Pixi just does the rendering part, phaser does a lot of game related things)

I'd use illustrator instead of Photoshop because you can scale your graphics without losing quality. Vectorial is better than bitmap.

For state management I use redux.

If you're interested here is my game https://bitplanets.com . It's a RTS game, where you need to conquer planets. You can play with your friends and people online. Of course no need to download or register and works on mobile. (60fps if on a decent phone)

Re:Tools we used to create a hit HTML5 game on Steam by sdegutis on Tuesday November 19, 2019 @01:55PM (#21576763)
It still confuses and unsettles me that Paint.net started as open source and then went closed source. I mean, people already had the source. All because someone tried to fork it? It just doesn't add up.
Re:Tools we used to create a hit HTML5 game on Steam by keithnz on Tuesday November 19, 2019 @06:10PM (#21579371)
see

https://blog.getpaint.net/2007/12/04/freeware-authors-beware...

Someone tried to claim it as their own by repackaging it and packaging up some plugins... He obviously got annoyed and figured he doesn't want to make it so easy to make your own version.

It adds up for me, just kind of unfortunate, I'd like to think it still would've been better off open, but it's his creation and his time and effort so if that's what he wants to do, I'm ok with it.

Re:Tools we used to create a hit HTML5 game on Steam by riadd on Tuesday November 19, 2019 @01:35PM (#21576471)
I added some more mentions:

- Buzz! / FFmpeg - SugarJS - tween.js - hjson

Re:Tools we used to create a hit HTML5 game on Steam by jszymborski on Tuesday November 19, 2019 @11:31AM (#21574795)
It's not clear to me if they used Electron's Node backend for much more than it's File API. If that's the case, they might have been better off just using a QT webview (e.g. pywebview) for the sake of performance (which they cite as reason for moving from NW.js/Electron).
Re:Tools we used to create a hit HTML5 game on Steam by Phillips126 on Tuesday November 19, 2019 @12:53PM (#21575905)
I'm not very familiar with Qt or Qt webview but from their documentation it states:

> This version of Qt WebEngine is based on Chromium version 73.0.3683, with additional security fixes from newer versions.

Assuming they both have a full Chromium embed, would there have been better performance? I assume the developers are mostly JavaScript devs so their choice to use Electron/Node makes sense.

Re:Tools we used to create a hit HTML5 game on Steam by mister_hn on Tuesday November 19, 2019 @01:37PM (#21576499)
Qr 5.13 is based on Chrome 76-77
Re:Tools we used to create a hit HTML5 game on Steam by IggleSniggle on Tuesday November 19, 2019 @01:49PM (#21576675)
Most folks complaint with Electron isn't that it isn't performative, but rather that it is bloated (you ship an entire browser when all you needed was eg the canvas and v8 engine).
Re:Tools we used to create a hit HTML5 game on Steam by seangrogg on Tuesday November 19, 2019 @03:07PM (#21577679)
In all fairness, are you aware of a tool for web developers that only ships the canvas and v8 engine? Legitimately curious, because I've tried looking in the past for similar reasons (game dev on an engine I already know) and came up empty-handed.
Re:Tools we used to create a hit HTML5 game on Steam by cztomsik on Wednesday November 20, 2019 @07:25AM (#21583278)
WebGL is planned for graffiti

It's not finished yet but you can get close to 20M mem usage + overhead of your libs & assets. Executable size is node.js + 2M (30M total IIRC and it compresses nicely to ~10M *.dmg because node contains a lot of strings)

Please file an issue if you want it to happen so that it can be tracked how many people want it too (I had no idea that this is a thing in gaming community). It's now at the bottom of my priorities (I'm working on raspi support so that it can run as smartmirror) but it's not that hard to add so it could actually happen.

https://github.com/cztomsik/graffiti

Re:Tools we used to create a hit HTML5 game on Steam by seangrogg on Wednesday November 20, 2019 @12:29PM (#21586074)
I added a watch to it and starred; I think it'd be a good idea to be more clear with what's being built in the README.md because I wouldn't have thought that this was a stripped-down browser based on the headline. As well, it's difficult to see exactly what you are getting from graffiti (is it just canvas, does it include DOM stuff) at a glance which may turn away those browsing repos.
Re:Tools we used to create a hit HTML5 game on Steam by cztomsik on Friday November 22, 2019 @09:16AM (#21605697)
Agreed that README is very unclear - it's not a browser at all, actually. It's just a GUI library for rust & node.js which happens to have little DOM-like layer.

This pseudo-DOM is really just enough to make web frameworks work. I want to do GUI apps with the same tools & libs which I use for web development but I don't want to include the whole browser and moreover I want it to be enough resource-savvy so that it can run on my raspi attached to the TV.

It's hard to describe what it is good for because there are many use-cases. It's really rather a platform just like Electron or Qt is, but of course it's very limited now. But really, if you or anybode else have better headline, I'd love to hear it.

And thanks for the interest :-)

Re:Tools we used to create a hit HTML5 game on Steam by devit on Tuesday November 19, 2019 @05:11PM (#21578855)
Just setup a localhost server and open the default browser on it.

Or just have a website, if you don't need privileged access to the user's machine.

Re:Tools we used to create a hit HTML5 game on Steam by IggleSniggle on Tuesday November 19, 2019 @06:28PM (#21579503)
Just in case you are not being facetious: totally agreed; but in the case of delivering a game on platforms that include Steam, and also for perception reasons, not really an option.
Re:Tools we used to create a hit HTML5 game on Steam by luismedel on Wednesday November 20, 2019 @04:29AM (#21582389)
I've always dreamed for an Ejecta[0] like solution for desktop systems.

[0] https://github.com/phoboslab/Ejecta

Re:Tools we used to create a hit HTML5 game on Steam by seangrogg on Wednesday November 20, 2019 @12:31PM (#21586107)
This would be great, if only... Realistically, I just want a canvas with some audio/input stuff in most cases (though being able to put some divs in places may be nice for rendering things like menus).
Re:Tools we used to create a hit HTML5 game on Steam by Kiro on Wednesday November 20, 2019 @07:28AM (#21583291)
I second this. Ejecta is beautiful and I really hoped the concept would catch on.
Re:Tools we used to create a hit HTML5 game on Steam by 1ark on Wednesday November 20, 2019 @09:30PM (#21590930)
I looked a bit a few months ago. There are some interesting things out there. But you will probably be a bit on your own (but not uncommon when it comes to game dev though!)

https://github.com/mrautio/duktape-webgl

https://medium.com/@bnolan/translating-sites-into-3d-with-du...

Re:Tools we used to create a hit HTML5 game on Steam by shantly on Tuesday November 19, 2019 @03:25PM (#21577875)
They tend to use ~10x the memory that seems reasonable—generous, even—for what they're doing, and periodically misbehave and decide to eat tons of cycles continuously for no obvious reason, in a way native apps don't, or at least not so frequently and nigh-universally.

Sure, partial counterexample in VSCode, but then there's all the others.

Re:Tools we used to create a hit HTML5 game on Steam by IggleSniggle on Tuesday November 19, 2019 @06:36PM (#21579577)
I agree with what you are saying with regards to the tendency of the platform. But, aside from the weight of unnecessary/unused browser features, I think that has more to do with the needs of the developers attracted to the platform more than the platform itself.

"The needs" being a requirement to ship a MVP ASAP using developers that can agree on a lowest common denominator language of js.

Re:Tools we used to create a hit HTML5 game on Steam by stjohnswarts on Tuesday November 19, 2019 @07:18PM (#21579891)
I wonder if the VsCode coders don't share their SOP somewhere for us mere mortals to learn some techniques they use to keep electron under control.
Re:Tools we used to create a hit HTML5 game on Steam by fuzzy2 on Tuesday November 19, 2019 @12:47PM (#21575809)
> pywebview

Uses Edge or IE on Windows by default. Nope nope nope. :D

Re:Tools we used to create a hit HTML5 game on Steam by jszymborski on Tuesday November 19, 2019 @08:48PM (#21580403)
you can set it to use CEF, however
Re:Tools we used to create a hit HTML5 game on Steam by The_rationalist on Tuesday November 19, 2019 @03:02PM (#21577610)
Re:Tools we used to create a hit HTML5 game on Steam by pier25 on Tuesday November 19, 2019 @02:54PM (#21577490)
QT is expensive for the indie developers.

A better choice would have been to simply use WKWebView in macOS and the equivalent in .NET/UWP for Windows.

Re:Tools we used to create a hit HTML5 game on Steam by snazz on Tuesday November 19, 2019 @04:23PM (#21578464)
Except for then you have to deal with whatever version of embedded Internet Explorer .NET uses. Maybe the UWP solution uses Edge now, but that still isn’t wonderful compared with embedding Chromium.
Re:Tools we used to create a hit HTML5 game on Steam by tenryuu on Wednesday November 20, 2019 @02:55AM (#21581952)
Usually in .NET you typically get IE, not Edge. People have been using CefSharp as a replacement. A number of software I have contributed to have done this.

In contrast, UWP applications do use the Edge rendering engine, and while it may or may not be possible to use CEF in these applications, you won't be able to get it certified by Microsoft, therefore no one, at least to my research, has bothered doing so.

I wonder what the future brings with Edge now just being chromium based

Re:Tools we used to create a hit HTML5 game on Steam by colejohnson66 on Tuesday November 19, 2019 @06:38PM (#21579587)
Nitpick: QT isn’t expensive if you agree to the LGPL. If you want to do your own thing, you have to pay up.
Re:Tools we used to create a hit HTML5 game on Steam by bakuninsbart on Tuesday November 19, 2019 @03:18PM (#21577798)
It is an html game, runs basically on a potato with electrical wires plugged into.
Re:Tools we used to create a hit HTML5 game on Steam by ben-schaaf on Tuesday November 19, 2019 @05:54PM (#21579238)
Most websites don't run well on even high end hardware. There's most certainly a performance tradeoff using a browser, especially for something as performance sensitive as a game.
Re:Tools we used to create a hit HTML5 game on Steam by soylentgraham on Wednesday November 20, 2019 @03:52AM (#21582208)
There's a performance trade off using the DOM. If you only draw to canvases and execute javascript, the browser becomes a very fast engine.
Re:Tools we used to create a hit HTML5 game on Steam by lucasverra on Tuesday November 19, 2019 @11:29AM (#21574759)
i can vouch for back4app, satisfied client.

Parse server OSS (and b4a service) does help us in our development.

Re:Tools we used to create a hit HTML5 game on Steam by buboard on Tuesday November 19, 2019 @01:09PM (#21576102)
They could have just used flash
Re:Tools we used to create a hit HTML5 game on Steam by pier25 on Tuesday November 19, 2019 @02:58PM (#21577535)
Even better, Haxe.

The language is very familiar for AS3 devs and it transpiles to performant C++.

Many games such as Papers Please have been made with Haxe.

There are numerous engines/libs for game devs:

http://kha.tech/

https://www.openfl.org

https://github.com/haxenme/NME

Re:Tools we used to create a hit HTML5 game on Steam by joshtynjala on Tuesday November 19, 2019 @03:44PM (#21578059)
Just to add a little more... Haxe not only transpiles to C++, but it also transpiles to JavaScript. With a Haxe codebase, can deploy a project as both a native app and on the web. Really nice for games especially.
Re:Tools we used to create a hit HTML5 game on Steam by rafaelvasco on Tuesday November 19, 2019 @03:45PM (#21578076)
Haxe is really amazing. Currently my favorite ones are Kha and Luxe, though the new version of Luxe has been on development for a long time;
Re:Tools we used to create a hit HTML5 game on Steam by chii on Wednesday November 20, 2019 @04:22AM (#21582361)
Kha is really nice and I like using it. It's amazing that the author developed a specialised IDE (granted it's a modified version of vscode) for the framework.

The quality is so very high, much much higher than a typical open source project, because it's not just a bit of code, but an entire toolchain and workflow. So much so that an entire engine is built off this framework! https://armory3d.org/

Re:Tools we used to create a hit HTML5 game on Steam by rishav_sharan on Tuesday November 19, 2019 @09:35PM (#21580642)
I am currently using Haxeflixel game engine for a trivial project and I am enjoying the overall experience. Haxe is a great little language a8the engine is fully featured. The basics like scene management, gui, pathfinding etc are bundled in.

I also tried Heaps which on paper looks amazing but could not proceed due to lack of documentation.

Re:Tools we used to create a hit HTML5 game on Steam by dave7 on Thursday November 21, 2019 @04:07AM (#21592495)
Dead Cells is another recent high-profile Haxe success story.
Re:Tools we used to create a hit HTML5 game on Steam by badloginagain on Tuesday November 19, 2019 @01:11PM (#21576134)
Nooooo. Flash is dead, thank god.[1]

1. https://www.rystedtcreative.com/tech-talks/flash-dead/

Re:Tools we used to create a hit HTML5 game on Steam by andai on Tuesday November 19, 2019 @02:39PM (#21577310)
I remember steam games were made in Flash a few years ago. Doesn’t it just export to HTML5 these days? Isn’t it used / couldn’t it be used to make a steam game?
Re:Tools we used to create a hit HTML5 game on Steam by egypturnash on Tuesday November 19, 2019 @02:50PM (#21577443)
Yes, it does. Adobe changed its name to "Animate" once they got the HTML5 export working. Dunno if it's in use for any games nowadays.
Re:Tools we used to create a hit HTML5 game on Steam by pjmlp on Wednesday November 20, 2019 @03:00AM (#21581975)
You can also AOT compile, so that would be another option.