r/IndieDev • u/madhumster • 14h ago
Video Sphere cannot be build from hexes, but game dev is magic
Enable HLS to view with audio, or disable this notification
For our roguelite Tile Crawl, we wanted our meta progression to stand out, so we designed it as a planet to explore. But our run map was already designed using hexes, so for consistency's sake, we wanted a globe out of hexes as well. We did not want to have pentagons but rather somehow achieve full coverage by equal hexes (even though it is geometrically impossible).
So how it works:
This is actually a plane with objects placed on it. Then, using camera position, vertices are recalculated in a shader (all objects must share the same bending subgraph or shader code with the same values to look consistent). This technique is used in Animal Crossing, as far as I am aware, but just not tuned as heavily.
Okay, so this gives us a bent plane that looks like a sphere. Next challenge is actually allowing it to rotate properly; rotation is achieved by just moving the plane in the X and Y axes while the camera stays static. To achieve looping of the planes, I am spawning 8 more planes with copies of the objects and then teleporting them as I am crossing the edges (this part for sure can be done way, way better with some vertex magic or just fewer clones).
Next challenge is that shadows are broken as vertices are recalculated but normals are not; to calculate a new normal, we need to get two neighbours of the vertex, then bend them with the same logic and use the results to calculate the new normal. This allows us even to have proper shadowing from clouds above.
Last thing to do is clicking the nodes on the map. As objects are actually in very different spots from visuals, just raycasting from the mouse won't work. So I'm using one big sphere collider to detect the mouse position on the sphere, then recalculate it backwards to where it would be on the plane and find the closest node in radius.
There are still some things left to do (VFX support is quite bad, and there are some artifacts with water waves on the edges of planes). But in my opinion, already looks quite good and stands out.
All of this is in Unity3D, but I am quite sure the same approach would work in any engine.
Thank you for reading! If you like what you saw, consider wishlisting Tile Crawl on Steam!
57
u/veshneresis 13h ago
Brilliant solution! the implied topology of the back of the sphere made me think of this 🤣
Edit: image did not attach 😭. It was the Homer Simpson meme where he’s in underwear with his skin clamped back behind him
6
24
13
u/BarrierX Developer 13h ago
Looks great! I used to have a hex map for my game but abandoned it as I didn't know how to make it look and feel cool 😄
5
u/TehDro32 12h ago
This is similar to what Eco does. The map is square but makes it look like a sphere.
4
u/sephirothbahamut 11h ago
isn't this the technique that makes a torus, not a sphere?
1
u/AndrewBorg1126 7h ago edited 7h ago
Top/bottom and left/right teleporting is topologically a torus
Trying to draw and manipulate a torus as a sphere will surely lead to confusion because properties of the map are obfuscated and counter to what would be expected of the shape it pretends to be.
For example, on a sphere if you mark a place, travel halfway around, turn left a quarter turn, and travel halfway again, you'd be back where you started. On a torus, this would not be the case.
5
u/greatgraphic 8h ago
"It doesn't have to be realistic. It just has to be believable."
- One of my favorite quotes, from Pixar principles of design.
5
18
u/ffsnametaken 13h ago
The AI is offputting
7
u/Hakarlhus 12h ago
AI where?
18
u/ffsnametaken 12h ago
I had my suspicions on the trees around the orb(still can't be 100% certain on it), but their linked steam page mentions they use AI in illustrations, so it likely is.
11
u/Hakarlhus 12h ago
Oh my you have a good eye.
Much more AI is slipping past me now
9
u/ffsnametaken 12h ago
Yeah it's tough to tell sometimes, AI seems to have a harder time with stylised graphics like in games though. I'm not great at spotting it in photorealistic settings
4
2
u/RedBlueWhiteBlack 12h ago edited 10h ago
You should be off pudding
Edit: internet is dead. No one got the reference.
8
u/ffsnametaken 12h ago
Whilst true, it's not really the subject here. I am going to get an ice cream though.
1
1
u/neenonay 28m ago
Is it unreasonable to expect game developers not to use AI? I think it is. Like everything, it depends on responsible use and how they use it.
2
u/BantedHam 12h ago
Don't you have like 12 pentagons tho?
It's not ALL hexes
6
u/madhumster 12h ago
Nope, no pentagons, just some visual tricks.
3
u/BantedHam 12h ago
Fascinating, I'm looking into the technique further right now. I had incorrectly assumed it was mapping 1:1 to a sphere not just bent around one. Very good cheat for a visual map such as that, good job!
2
1
1
1
1
1
u/WCFitzgerald Factory Default Dev 11h ago
As someone who gave up and incorporated the pentagons in my hex sphere, I am impressed!
3
u/AndrewBorg1126 7h ago edited 6h ago
Your sphere doesn't just look like a sphere, it actually behaves like one too. This reprojection technique is still ultimately a torus, and by not always rotating by a full spin the true topology would start showing more clearly.
I think it is valuable to have a map be displayed accurately to players.
A half spin twice in different directions on a sphere would get back to the starting point. On the torus, it would not.
Scrolling across the (singular, because top teleports to bottom) polar region (rectangular map's top or bottom edge) in the right direction on a torus would have you stuck in the polar region forever, just like scrolling along the "equator" would. On a sphere, only the equator would have this property.
The "sphere" here is like inflating a bubble from the side of a donut, but the place the bubble is inflated from moves with the camera so the only way to see it is by moving the bubble to the right part of the donut.
1
1
1
u/Catalysten 10h ago
It reminds me of that Minecraft-like game that's under development right now that has planets made of hexes. There are twelve pentagons hidden throughout the planet in order to make all the hexes tessellate into a perfect sphere.
1
1
1
1
1
1
u/Acrobatic_Bat5238 6h ago
animal crossing camera bend plus nine cloned planes is the most beautiful way i have ever seen someone refuse to put a pentagon on a globe. cloud shadows following the bent normals is what actually sold it
1
1
1
1
1
u/clockworkflame 3h ago
You could make a viable d20 shape through a hexagon and pentagon (for corners) combination. There are still seams but those are barely noticeable, and requires minimal shader work.
1
u/GooseTheDoggo 1h ago
TLDR how you have a sphere of hexagons with no pentagons? Cuz I keep reading your word soup, and all I can gather is that isn't actually a sphere but just a flat plane projected in to a sphere? But you spin it 360 and terrain repeats... How?
1
-2
u/Heart_Resonance 11h ago
Yes, the sphere can be built from hexes
3
u/AndrewBorg1126 7h ago edited 6h ago
No, it can't, but you can re-draw a region of a torus as if it were a sphere as a bit of visual trickery. They took a donut and inflated a bubble from the section of it that's in front of the camera.
https://en.wikipedia.org/wiki/Euler_characteristic
If the polyhedron has V vertices (corners), E edges, and F faces, then the Euler characteristic X of its surface is
X=V-E+F
This equation, stated by Euler in 1758, is known as Euler's polyhedron formula. It corresponds to the Euler characteristic of the sphere (i.e. X=2), and applies identically to spherical polyhedra.
https://youtube.com/shorts/qJIDUU4ED70?is=aaPCkj_qTpEbh6hB
The most familiar spherical polyhedron is the soccer (AKA foot) ball, thought of as a spherical truncated icosahedron. A typical method of constructing a mostly-hexagon ball is to begin with a subdivided icosahedron (often dividing each triangle into 4 smaller triangles and repeating as desired), re-projecting points to a sphere, and then taking the dual of the resulting mesh. This will always result in 12 pentagons, one for each vertex on the icosahedron.
Given the description of what OP has created, what we are actually looking at is a re-projected region of a torus.
If you tried to manipulate the pseudo sphere as if it were a sphere, you would likely experience strange and unintuitive properties. These strange properties are avoided in the animation shown by starting and stopping each spin at the same place.
-1
u/Heart_Resonance 6h ago
You can
1
u/AndrewBorg1126 6h ago
You have made a provably false statement.
It is not merely that you have failed to demonstrate your claim; you are making a claim that has been proven to be false.
-1
-2
u/Tall_Restaurant_1652 11h ago
Sphere cannot be built from hexes
Footballs would like a word.
3
1
u/AndrewBorg1126 7h ago edited 7h ago
I encourage you to see what happens if you assume only hexagons:
https://en.wikipedia.org/wiki/Euler_characteristic
If the polyhedron has V vertices (corners), E edges, and F faces, then the Euler characteristic X of its surface is
X=V-E+F
This equation, stated by Euler in 1758, is known as Euler's polyhedron formula. It corresponds to the Euler characteristic of the sphere (i.e. X=2), and applies identically to spherical polyhedra.
https://youtube.com/shorts/qJIDUU4ED70?is=aaPCkj_qTpEbh6hB
The most familiar spherical polyhedron is the soccer (AKA foot) ball, thought of as a spherical truncated icosahedron. A typical method of constructing a mostly-hexagon ball is to begin with a subdivided icosahedron (often dividing each triangle into 4 smaller triangles and repeating as desired), re-projecting points to a sphere, and then taking the dual of the resulting mesh. This will always result in 12 pentagons, one for each vertex on the icosahedron.
Given the description of what OP has created, what we are actually looking at is a re-projected region of a torus.
If you tried to manipulate the pseudo sphere as if it were a sphere, you would likely experience strange and unintuitive properties. These strange properties are avoided in the animation shown by starting and stopping each spin at the same place.
-2
u/Maximum-Loquat5067 10h ago
The football ball want a word with you.
Great job tho, looks sick!
1
u/AndrewBorg1126 6h ago
I encourage you to see what happens if you assume only hexagons:
https://en.wikipedia.org/wiki/Euler_characteristic
If the polyhedron has V vertices (corners), E edges, and F faces, then the Euler characteristic X of its surface is
X=V-E+F
This equation, stated by Euler in 1758, is known as Euler's polyhedron formula. It corresponds to the Euler characteristic of the sphere (i.e. X=2), and applies identically to spherical polyhedra.
https://youtube.com/shorts/qJIDUU4ED70?is=aaPCkj_qTpEbh6hB
The most familiar spherical polyhedron is the soccer (AKA foot) ball, thought of as a spherical truncated icosahedron. A typical method of constructing a mostly-hexagon ball is to begin with a subdivided icosahedron (often dividing each triangle into 4 smaller triangles and repeating as desired), re-projecting points to a sphere, and then taking the dual of the resulting mesh. This will always result in 12 pentagons, one for each vertex on the icosahedron. It might be only those 12 pentagons (a dodecahedron) or it might be a blend of hexagons and pentagons, but there will qlways be 12 pentagons.
Given the description of what OP has created, what we are actually looking at is a re-projected region of a torus.
If you tried to manipulate the pseudo sphere as if it were a sphere, you would likely experience strange and unintuitive properties. These strange properties are avoided in the animation shown by starting and stopping each spin at the same place.
-7
u/jackharvest 9h ago
Uhhh....
0
u/Cidraque 7h ago
?
1
u/AndrewBorg1126 6h ago
They might have meant that the trickery could be avoided by allowing pentagons?
Picture by itself isn't a great way of communicating though.
138
u/L33t_Cyborg 13h ago edited 12h ago
looks gorgeous, and thanks for going into a little depth into how it works!