[HN Gopher] Townscaper Running in the Browser
___________________________________________________________________
Townscaper Running in the Browser
Author : krstffr
Score : 473 points
Date : 2021-12-01 15:17 UTC (7 hours ago)
(HTM) web link (oskarstalberg.com)
(TXT) w3m dump (oskarstalberg.com)
| sktrdie wrote:
| I feel like this is how the UX for developing software should be.
| Types and intellisense plus copilot somewhat bring us close to
| something like this. Where adding a new module somehow
| automatically adjust itself to the project instead of having to
| provide strict API interfaces. Just a thought.
| GabeIsko wrote:
| Hey, this sounds like the goal of the low code industry. To
| deliver an authoring experience where you don't have to worry
| about the semantics of code do develop software. It works
| really well in certain contexts, but a word of warning - there
| are trade offs. For instance, putting constraints on how
| applications talk to each other using APIs may seem limiting,
| but it does provide a standard interface that can be relied on
| for software to connect with one another.
| eterm wrote:
| And runs into a familiar problem.
|
| Because a real world requirement in software development is the
| equivalent of, "I want to model my town".
|
| And in townscaper I can't, because the presets don't fit my
| real world town.
|
| So you then need to hire in a specialist block customiser who
| can write custom blocks for you to use in the modeller.
|
| And then you realise you've just pushed the problem one step
| deeper.
| sagivo wrote:
| Works pretty smoothly on my Android device running Firefox. Any
| details on how it was built?
| japhib wrote:
| it's just Unity's WebGL export
| _Microft wrote:
| There is also another game/toy by Oskar Stalberg in which you can
| build a teeny, tiny block of house(s) on a 5x5 grid. Very cute,
| especially with all the well decorated balconies.
|
| https://oskarstalberg.com/game/house/index.html
|
| The author is on Twitter and sometimes tweets about development
| of his games and the techniques involved.
|
| https://twitter.com/OskSta
| julius_deane wrote:
| looks like the precursor to Townscapper
| [deleted]
| and0 wrote:
| Also wanted to pop in to recommend his Twitter. Watching these
| games get made has been a blast. Just the right mix of
| interesting math and creativity. I always dig into his blog
| posts and threads.
| brundolf wrote:
| I highly recommend following indie devs on Twitter. It's always
| cool watching the game take shape over the years, and sometimes
| you also get behind-the-scenes details
| m12k wrote:
| The house toy has a cute little easter egg: If you remove all
| the foundation pieces of the structure, the remaining structure
| above starts bobbing up and down slowly, hovering - very subtle
| way to acknowledge "yep, I did in fact think about that case
| too".
| adamrezich wrote:
| in Townscaper, doing the same can cause propellers to appear
| beneath your structures
| stavros wrote:
| Hmm, how? All I see is stilts (in the browser version, at
| least, which I imagine should be the same as the Steam
| version).
| ldite wrote:
| https://oskarstalberg.com/Townscaper/#MzJODmOgd6TMNh6DKtk
| 6nH...
| stavros wrote:
| Ahaha jeez, he really did think of everything.
| BorisTheBrave wrote:
| It only appears in certain rare configurations. You need
| a section of town with no exterior corners.
| stavros wrote:
| Ahh I see, thank you.
| marcoslozada wrote:
| If you put some good audio headphones its amazing!
| kinduff wrote:
| Just got blown away when I "turned off" the sun and the buildings
| started to turn on their lights.
|
| I'm a big fan of Oskar.
| tdrdt wrote:
| Here a very interesting talk by Oskar Stalberg where he explains
| how this works: https://youtu.be/1hqt8JkYRdI
| btown wrote:
| And here's another, slightly more technical talk from him about
| the "wave function collapse" algorithm he uses for procedural
| generation in his games: https://www.youtube.com/watch?v=0bcZb-
| SsnrA
| tdrdt wrote:
| Ah thank you. I was in fact looking for that talk!
|
| What I really like about this is that the base grid is not
| straight. Therefore the buildings are arranged in a very
| European style.
| ChrisArchitect wrote:
| Gorgeous.
| ChrisArchitect wrote:
| And like super 'calming'? anyone else feel that just poking
| about
| chriscjcj wrote:
| Not sure why, but whenever I'm presented with something like
| this, I always seem to want to build the least functional, least
| utilitarian, most maddening and stupidest structure I can.
|
| http://oskarstalberg.com/Townscaper/#IzhCuCAJioFFB00CAajRAN2...
| ElijahLynn wrote:
| I dig it, very cool!
| evilhackerdude wrote:
| Interesting, according to Oskar it's straight up exported from
| Unity for web:
|
| https://twitter.com/OskSta/status/1466063657582931974
| julius_deane wrote:
| Full version is available in Steam.
| simonebrunozzi wrote:
| What does the full version have, compared to this web version?
| _Microft wrote:
| It is also available on GOG if for some reason you do not have
| or do not want to use Steam.
|
| https://www.gog.com/game/townscaper
| brundolf wrote:
| Also on iOS/Android
| atum47 wrote:
| Yeah, this is super nice. I remember seeing all over twitter back
| then. At the time the articles were focusing on the wave function
| collapse, which I find awesome. Thank you for publishing it to
| the web so we could play with it.
| _Microft wrote:
| Here is a third party tool that lets you explore your Townscaper
| creations from a first person view.
|
| https://meliharvey.github.io/threescaper/
| bullen wrote:
| Here is a speech about Townscaper:
|
| https://www.youtube.com/watch?v=APIdkBwwWJI
|
| at 1:12
| Toutouxc wrote:
| What is missing from this demo compared to the full game? I
| thought that even the full game was this minimalistic.
| citizenkeen wrote:
| What makes you think it's a demo?
| seaish wrote:
| It's labeled "A demo of Townscaper" in the side panel.
| seaish wrote:
| Full game doesn't crash, doesn't give you the browser scroll
| function on middle click (the shortcut to pick a color of an
| existing building), ability to export as STL, no full game
| links, ability to create oversized screenshots, some settings.
| The full game isn't deterministically equal to the browser one
| (roofs slope in different directions sometimes, decorations in
| different places). It should also run slightly better, although
| both are pretty lightweight.
|
| Notably, the export strings are the same.
|
| Basically: you're not missing anything from the core
| experience, but the browser version is slightly inferior. And
| buying the full version helps Oskar make more neat stuff in the
| future.
|
| Edit: it's also a smaller build area.
| dusted wrote:
| oh this is delightful!
| aroman wrote:
| It takes about 90 seconds to load for me, but once it does, it's
| buttery smooth on my M1 Pro. Unity's web story is still so bad
| for many reasons, but the initial load times are a huge one
| (~15MB of wasm for an empty scene last I checked). They were
| working on Project Tiny[0] to address exactly this, but they've
| now paused work on it indefinitely :( Someone please build tools
| to fix this!
|
| [0] https://unity.com/solutions/instant-games
| daredevildave wrote:
| PlayCanvas[0] is the probably the closest "web-first" solution
| compared to Unity. Used by lots of Snap Games & Instant Games.
| It's written in JS which means that it's _way_ smaller ~350kB
| for an empty scene if I recall.
|
| [0] https://playcanvas.com
| bathtub365 wrote:
| When did you last check? What packages were in use? On a toy
| project built from 2020.3 I have 2.2MB of WASM.
| somethoughts wrote:
| Its interesting in that perhaps if Unity gets it right it could
| fill the functional use case void that has been present ever
| since the demise of Adobe Flash - rich interactive user
| experiences within the browser.
|
| And done natively with no need for the plugin mess and security
| holes of Flash. The key would be navigating the feature creep
| that led to the bulk and security holes of Flash.
| aroman wrote:
| Totally agree. Unity is definitely in the best position to
| become the new Flash, but so far, they seem completely
| uninterested in investing in that future. I can't totally
| blame them, because the vast majority of their revenue comes
| from mobile and their services business.
|
| Unity already has the bulk, but the security holes shouldn't
| be as big of an issue given that it's "just a website" and
| runs in the browser sandbox.
| kingcharles wrote:
| I have a $300 laptop and a mobile (cell) Internet connection
| and it loaded quickly for me and is also butter-smooth. [Note:
| I also have 156 other tabs currently open in Chrome. And
| another 30 in Edge. Don't hate me!]
| lupire wrote:
| It's smooth, but it uses massive GPU resources even when
| idling.
| jcun4128 wrote:
| It's interesting I have a mid computer (3060/i9/80gb ram/ssd)
| and with gigabit fiber, it still takes a long time. What is
| taking a while? Maybe it's request load.
|
| Once it loads though wow, the graphics are great, nice little
| physics effects. Wonder how many online games are like this.
| Light source/shadow also cool.
|
| On subsequent loads it's fast like it's near 80-90% already.
| tpmx wrote:
| It took 6 seconds for me (pretty similar computer and
| connection speed). I am however just 6 ms RTT away from its
| hosting location in Copenhagen, DK. (I'm in southern Sweden.)
| jcun4128 wrote:
| Okay guess it is just a data transfer thing, I'm in the
| middle of US.
| londons_explore wrote:
| 80gb of ram is now mid range???
| tpmx wrote:
| I'd say 16 GB is mid range at the moment.
| jcun4128 wrote:
| ah yeah mostly meant the graphics card, 3060 is lower tier
| of 30 series.
|
| in terms of gaming yeah this is a mid-tier computer
|
| I want to get a 3090FE just because, but I'm not dropping
| $4K on that
| BatFastard wrote:
| You are in top 1% in RAM, top 2% in processor, and top 2%
| in GPU. I would not call that mid range. Hell I am
| running a 980Ti and its still on the top 10%.
| jcun4128 wrote:
| It's unrelenting ha with the new intel surpassing some
| Ryzen (at the expense of power/heat) and DDR5... crazy.
|
| Yeah I know for dev work can scale down eg. pi zero on a
| keychain and use cloud resources.
| citizenkeen wrote:
| Meanwhile, Godot 4 should be _editable_ in the browser.
| aroman wrote:
| Yes, but afaik, the experience of building for the browser as
| a runtime target for games in Godot is still not much better
| than Unity, just less bloated. I for one would love it if
| Godot made web a first-class focus, but it doesn't seem like
| they are yet.
| Demcox wrote:
| Have an 14" M1 Pro and it takes me about 5-7 second and I have
| about 250Mbit down. I think you're limited by DL speed.
|
| edit The bottleneck is most likely distance too server and RTT
| Andrew_nenakhov wrote:
| Works just fine in Firefox on my aging Moto Z4. Took 45 seconds
| to load, but then was very smooth.
| braymundo wrote:
| It runs perfectly for me on Chrome, but struggles on Safari
| (macOS, Monterey, MacBook Pro 2018). Does anyone know why?
| japhib wrote:
| Safari is pretty behind the times as browsers go, especially
| with WebGL. For instance, it doesn't support WebGL 2 (except
| maybe in beta?), which means you have to use WebGL 1. I'm
| guessing that's where some of the performance issues would come
| from.
| z3t4 wrote:
| Cool demo, well polished. Now it only needs some gameplay! I
| could imagine a friendly MMO game where you trade resources with
| other sea villages.
| skuthus wrote:
| Part of the fun for me is that it's kind of like a zen garden,
| but for buildings. I would love to see people start to populate
| and let the computer decide what they do and what the buildings
| are used for based on conditions created by the design of the
| city.
| padolsey wrote:
| This is a bit like saying that AoE is cool but could do with
| some lasers. Townscaper is v well established and has found
| quite a niche and fandom for itself.
| brundolf wrote:
| It's not a demo, it's a complete product already being sold. I
| think it's nice that it isn't a traditional game.
| z3t4 wrote:
| I'm not a casual gamer so I think it's too simple. One should
| not however underestimate the casual gaming market, as it is
| huge.
| totololo wrote:
| In a way bad north is this technology with a gameplay
| https://www.badnorth.com/
| typon wrote:
| This is incredible. How the heck does the algorithm work so well?
| It manages to produce beautiful looking things no matter what I
| do
| bobajeff wrote:
| Impressive. Would be more impressive if it ran on mobile browser,
| though.
|
| Edit: Scratch that it does run. I got scared away by the message
| about webgl builds not being supported on Mobile.
| tdrdt wrote:
| It is running in Firefox on mobile just fine while I don't have
| a high end smartphone.
| raajg wrote:
| Wow, the entire town is URL encoded!! Example:
| http://oskarstalberg.com/Townscaper/#IzpjOEQ0ejP2X9w-b--c-X-...
| JayStavis wrote:
| How do you imagine this is done? Hashing the town state and
| storing lookup key as URL params?
| jwolfe wrote:
| Couldn't it be as simple as a list of (color, x, y, z)
| (base64 encoded) in the fragment? URL fragments can get
| really long.
|
| Not sure what you'd need a look up key for.
| namdnay wrote:
| The lookup key would be if the backend stores all the
| generated towns, and you're just referencing them. But I
| think simple encoding as you say is more probable
| slingnow wrote:
| And how exactly would you represent these hypothetical
| stored towns?
|
| Probably with a simple encoding.
| samwillis wrote:
| I believe Oskar is bit packing the data into the string,
| somewhere in his twitter feed he explains it.
|
| Edit: Found it:
| https://twitter.com/OskSta/status/1198958801363308544
|
| He designed it so you can fit a saved town in a tweet.
|
| "It's my own very context specific implementation. I know how
| many bits I need for each bit of data, so I just store it all
| in a big bit array. I then convert that bit array to my own
| custom base 64 format, based on 64 web safe characters."
|
| Worth reading the whole thread, as will all of Oskars twitter
| feed its super interesting.
| IshKebab wrote:
| No need. It's barely any data.
| slingnow wrote:
| You have a fixed 3D grid, which appears to only need to store
| either a color or 'null' in every spot. You can encode this
| entire grid in any number of ways such that it creates a
| valid URL. Base64 most likely.
|
| https://en.wikipedia.org/wiki/Base64
| raajg wrote:
| I have the Steam game too, but I'm somehow enjoying the browser
| version much more. Perhaps because of (seemingly) light-weight
| nature
___________________________________________________________________
(page generated 2021-12-01 23:00 UTC)