About MicroState
Pre-release build of MicroState. This is a hobby project and not a finished game.
Created with 2D Canvas and ~100 KB of vanilla JavaScript with procedural generation.
Terrain, cities, textures sprites and animations are all generated at runtime.
Help topics
-
For progress updates follow mastodon.social@iaincollins
🧭 Navigation
You can click and drag with the right mouse button to move around the map.
You can also move the the map selecting the Move tool and dragging with the left mouse
button.
The Arrow Keys and WSAD keys can also be used to move the map.
Two / three finger dragging and pinch-to-zoom is supported on devices with touch
input.
The mini map in the top right is interactive, it highlights the area of the map you are
viewing, you can click on it to view to another part of the map.
Zoom using the mouse wheel or the +/- buttons on the mini map. You can also rotate your
view from the minimap or by using the Q and E keys.
You can open the map using the 🗺️ Map button or by using the M key, and you can
click on the map to jump to a location.
⛰️ Terrain
Terrain can be Parkland, Soil, Scrub, Clay, Sand, Water
or Paved.
You can 🔼 Raise, 🔽 Lower, ⏬ Flatten, and 💫 Smooth terrain by
clicking and dragging using the relevant tools.
Unlike in many other isometric games, terrain is not constrained to being a fixed height or to
fixed angles, you can create rolling hills or steep cliffs.
Terrain that is too steep may be unable to support features like roads and may be automatically
levelled to support buildings.
- Parkland
- The default terrain type. Supports the widest variety of plant life including grasses,
wildflowers, bushes and trees. At higher elevations it transitions to heath and upland
vegetation. Near water it becomes riverbank or wetlands at lower elevations.
- Scrub
- Rough, brushy terrain with sparse, hardy vegetation like spruce trees. Transitions to more
open scrubland at higher elevations. Common in drier or degraded areas.
- Soil
- Loamy soil that supports woodland growth. Can develop into dense pine forests when trees are
planted. Well suited to forestry and rural areas.
- Clay
- Clay dessert terrain, with limited support for plant life.
- Sand
- Beach and dune terrain. Near water it forms sandy beaches; further inland it becomes dunes.
Sandy terrain far from water cannot support plant life, though palms can grow near the
shore.
- Water
- Water is always at sea level. It can be fresh (rivers and lakes), brackish
(estuaries), or sea water. Shallow water sits at the edge of land; deep water forms
in the middle of larger bodies of water. Roads on shallow water become bridges; roads cannot
cross deep water.
- Paved
- Hard urban surfacing with no plant life. Roads on paved terrain get wider pavements and
street lighting even without nearby buildings. Paved areas can feature decorative fountains
or quaysides where they meet water.
Terrain at higher elevation may not be able to support dense forest coverage, and sandy terrain
that is far from water may not be able to support plant life at all.
Hold the Control Key (⌘ on macOS) while placing terrain tiles to "flood fill" in an area
between other terrain tiles, or between roads.
Hold the Control Key (⌘ on macOS) while placing trees to "flood fill" terrain with maximum
tree coverage.
Hold the Control Key (⌘ on macOS) when changing a terrain type under a road to change the
terrain of connected roads.
🚦 Roads
You can place 🚦 Main Road which are optimised for heavy traffic and allow for higher
traffic speeds.
You can also place 🚸 Streets which are generally favoured by pedestrians, cyclists and in
residential areas.
When a Main Road intersects a Street, traffic travelling along the road always has
priority, allowing you to shape traffic flow.
You can place roads on any type of terrain except deep water - placing roads on shallower
water creates a bridge.
Roads can't lean too much to the right or left, or have too steep a gradient. You use the 💫
Smooth tool to fix issues with the terrain.
You can click to place a single stretch of road or click and drag to place a longer
stretch of road.
You can draw bridges over water, but bridges can't have intersections.
Hold the Shift Key while placing roads to constrain them along horizontal or vertical
lines.
Hold the Control Key (⌘ on macOS) while placing roads to draw a grid.
🚶 Pavements
All Main Roads and Streets have pavements by default, with streetlights if there
are
buildings nearby.
If you change a tile with a road to be Paved, it will add double-wide pavements and street
lighting, even if there are no buildings nearby.
Hold the Control Key (⌘ on macOS) when changing the type of a tile with a road to change
all tiles along a stretch of road.
🏙️ Buildings
You can zone areas for 🏠 Residential, 🏢 Commercial, and 🏭 Industrial
buildings.
You can click to zone one tile at a time, or click and drag to zone a larger area.
Zoned areas need to be reasonably close to a road and require power and plumbing to
develop.
Terrain under buildings will be automatically levelled if the ground is too steep.
How long construction takes depends on the size and type of building.
Improving road access can result in increased density of buildings.
When zoning across tiles with existing roads, tiles with roads will change their type to
match the new zoning.
When an area is zoned, developers may leave some space unused. You can erase and
re-zone an area to encourage higher density.
If you you pass over a road while zoning the road surface will be automatically changed
to Paved to accommodate a larger pavement.
Hold the Control Key (⌘ on macOS) when zoning to "flood fill" and change all the connected
tiles of the same type (up to road boundries).
💡 Utilities
Electric power is required for areas to develop and for buildings to function properly.
Place 💡 Power Plants to generate electricity.
Use ⚡ Pylons to carry power through power lines from Power Plants to zoned areas.
To deliver power to buildings Pylons must connect back to Power Plants through
connections from other Pylons on the power grid, or from a nearby building.
Pylons deliver power to buildings but they cannot be used to transfer power between zoned
buildings, they must connect back to a plant on the power grid.
Place 🚰 Water Pumps to provide water to zoned areas.
Use 💧 Water Pipes to carry water from Water Pumps to zoned areas.
To deliver water to buildings Water Pipes must connect back to Water Pumps through
connections from other Water Pipes on the water network.
Hold the Shift Key while placing Pylons or Water Pipes to constrain them along horizontal
or vertical lines.
🌲 Trees and decorations
You can click and drag to place trees on Parkland, Soil and Sandy
terrain, different environments support different types of trees.
You can also place trees along roadsides, if the terrain supports trees.
You can place decorations like ⛲ Fountains in paved plazas.
⚙️ Other options
Use the F key to toggle fullscreen mode.
The Planning view lets you easily view infrastructure and zoning, without terrain,
buildings or trees getting in the way.
The Grid view overlays a grid that is visible when not in planning view, to help with
aligning buildings and roads.
The ☀️ Time of Day button or N key toggles between day, night and dawn / dusk
lighting.
Take an Aerial Photograph using the 📸 button or the P key.
📺 Screensaver mode will activate a full screen animation that moves from point-to-point
across the map. You can click or tap anywhere on the screen to exit screensaver mode.
Use the ✨ New button or G key to generate a new map.
Use the 🏙️ City button or C key to generate a new city on the existing map.
Use the 💾 Save / Load button to save and load. The game is automatically saved every 5
minutes to an Autosave slot which is loaded on startup.
You can have multiple named save slots. You can also download and import save files and share
them with others.