VS

Climate Map

How I made a fully interactive historical climate map. Why I did it and what's next.

Globe

Award Winning

I love competing in challenges where I have the freedom to bring my creativity to a pre-defined structure and timeline. It makes finishing very likely. The competitive spirit pushes me to do my best, quickly learn and implement new skills while make rapid decisions. No time to ponder and doubt, just sprint. It’s perfect for my ADHD.

So I joined the Contra x Figma Makeathon! The challenge was to use the Figma suite of products to create almost any web project you’d like. Just the type of freedom I thrive in. With one hitch...

I don’t use Figma. I have in the past, but I rarely use it. My preferred software is native and Figma is native to nothing but a browser. Many people seemingly don't much care for the tools they use, but enjoy what they get out of them. I am no such person. I need my tools to bring joy along the way as much as the final result will.

That being said, Figma is a lot more complex and all encompassing since last I used it (a few months ago). I love what they're doing now, so the challenge seems very worth the money. If they can get my skeptical ass to say good things, imagine the concurring new user numbers.

Battle of Britain Prototype Game

False Start

Now what do I actually build? Well a few days before finding out about the competition, I had an idea. I was reading Britain at Bay and loving it so much that in parallel I started reading Hitler & Stalin. Two World War II book about fronts I did not understand all too well. I loved both books, but especially the first one, which shone a spotlight on the first years of the war.

The book goes into deep detail about Britain before the war and into macro detail during the first 3 years. Seeing as the country spent most of their military budget on the Royal Air Force (RAF), but never actually trained the RAF how to fight. They were more of a show pony, hoping the paper impression would be enough to stave off war and any decision that might bring it.

Meaning that they had to learn how to fight an air battle during a war, against an enemy that had done air wars over Spain and Poland. They even invented a lot of the best tactics for the time. The RAF were so clueless that the first 3 years of bombing missions had no way to verify their own success, leading to a culture of overstatement. They gave it their all thinking they were crippling their enemy. The Germans thought that the enemy bombing campaign hadn't even started yet. Seeing the few scattered and uncoordinated bombs as proof of a lack of effort.

So I can see the setting of a great strategy game building up. Play as the RAF, defend the country as best you can and learn how to attack the enemy, one crashed plane at a time.

But while coming up with a game concept and art style is simple, finding the fun is a long therm challenge. One I couldn’t rush through. I realized after 2 days, that I won’t do this concept any justice in the meagre time I have left. So I abandoned it.

Saving Grace

Lucky for me I’ve been playing an insane amount of Total War, both Rome II and Pharaoh. That plus my deep interest and frequent reading of history and I got my next idea. I always struggled to visualize history from a textbook, so what if I built an interactive climate migration map that shows where the people had to flee, what caused it, where they went and what happened next. It was a wonderful vision.

The historical climate map in The Great Hunger

So I started with the begging, out of Africa. I needed a map I can design overlays for. My first implementation used modern place names and default styling. But it worked. I managed to find a solution for that using Open History Map an amazing service. I had a big problem with loading the map on time, since if you moved anywhere you'd see full seconds of blacknes before the textures loaded. That's still an issue but I lowered it substantially. I added even more heaviness by styling the map differently for each era, mostly with different colors. The style differentiation was too important to skip.

I moved on to creating more eras, The Sea Peoples that are blamed for ruining ancient Egyptian civilization, that's the Bronze Age Collapse. I kept researching and adding more, periods where the world heated up and cooled and heated up again. I knew some of this way back from my high school thesis about global warming. It's fitting how I moved on to climate change. The simple idea of how much the climate has affected human history is powerful and ever present. And I'm overjoyed at having made so much progress.

So it's right here, a full History of Climate Migration Map, to browse, learn and enjoy. It might not be fully finished, I have a lot of interesting ideas I'd like to add, but it exists and is functional. Please tell me what you think about it! I'd be delighted to learn.

the Historical Climate Map in Ugarit

Issues

This was a strange project for me, having to work with heavy frameworks and lots of API's. I used Vite & React, heaviness I usually do my best to avoid, but it was inevitable here. My mad dash got a lot of the functionality and visuals I liked, but performance suffered and I lacked the time to fix it before submissions.

I have lots to fix in the future, a whole list of things awaiting my attention. Turn this map into more than just the story of climate migration throughout human history. Add more features and improve the performance. Make the mobile version feel cared for, instead of just passable.

The Historical Climate Map in The Dark Ages period

That's all to come. As for winning, I did not. Congratulations to the winners. I hope to do better in the future. But this was a wonderful experience and I'm overjoyed at having participated.