So the other day I saw a HN post about an app to help people fast, this intrigued me because in the past I have attempted intermittent fasting (for those unfamiliar with the term here is a linky poo) and failed miserably. What could this app offer?
Sadly the app was iOS only and listed features on the App Store was not very descriptive. So I thought about what I would want in an app to help me fast and as a game dev the first thing that came to my mind was gamification. I also wanted…
Easy to export data
A quick glance at how I am doing throughout the day
Super easy mechanism to stop and start
I had also seen a post on reddit that used the data from when his daughter was awake/sleeping to make a really cool visualization.
The image shows one continuous spiral around from the inside when his daughter was born, each revolution represents a single day (midnight at the top). I thought that this would be a cool way to express the data I was creating.
When I approached this my two options (well for fast development) were Unity3d and HTML5. Unity seemed like overkill for this project, but I was concerned about storing data when making an offline HTML5 app.
Unfortunately across browsers there is no guarantee of persistent data, a user can very easily delete their webapp data by accident clearing their browser cache. In the end I decided that as long as the user knows this flaw it wouldn’t be too bad and this method negates the need for server-side infrastructure or a bloated app. Were there other ways to achieve this? Probably lots, I had thought about wrapping the app in something like Cordova, but that came with its own downsides.
So this is it. I called the app chowtime because I am a hilarious human being and no one can take that from me. There are a few features I am thinking about adding still that might improve it, but otherwise I am pretty happy with it.
Setting goals for time that you aren’t eating.
Editing existing data in case you pressed the button by accident or forgot to press it.
So lately I have been thinking about changing my image online.
This is mainly because the current image is very similar to your average techy joe, I wanted to differentiate myself from the crowd. I also wanted my new brand to be a bit more fun and enthusiastic to better suit the side of my brand in the game dev community.
Similar enough that all my hard SEO work on “Jono Shields” wasn’t wasted.
Fun and silly, but still clever. No sophistication required though.
Covers regular tech and game dev.
A clean aesthetic that is easily identifiable.
This idea was actually taken from a friend (Nat) whose current role is Battle Mage at a fantastic VR Studio called Conical. Drawing inspiration from the fantasy realm, the role of battle mage insinuates a mastering of both the magical and physical aspects of battling. To be a technical artist/generalist you have to have mastery of both the practical sword (artistic utensil) and magical enchantments (source code).
I figure that I am basically a Druid, I write powerful spells to achieve things that human abilities on their own can not. I have libraries dedicated to the spells I write, they are open and other wizards can use them and learn from them. I also carry with me my Tome (laptop) that allows me quick access to my spells.
With this in mind I started drawing a self portrait of myself in an adventure time style. I went with this aesthetic because it was clean and easy to reproduce and at I was heavily inspired by the character of Magic Man in the cartoon.
And my interpretation of Jono…
Next I had to learn how to use Inkscape so that I could vector my magnificent art piece so that it could be super lovely and clean.
Then I fleshed out a website using a template I borrowed from Launchaco. Added some bright colours, a fun wizard quote and played with the layout a bit. I also made a couple of web service calls to grab my twitter follower count and public github repo count for some interesting up to date numbers.
Welcome to another “Is Jono obsessed with procedural generation?”.
This week I read a great article on HackerNews. This prompted me to create a procedural mountain generator based on Cellular Automata, an algorithm in which a collection of cells change state over time based on their neighbouring cells.
In CA a group of cells is iterated on over again and again, each time the cell’s state is determined by its neighbouring cells.
I’m not going to go into great detail here because it has already been done much better than I would have here (chapter 7.2 is particularly relevant to what I am doing here).
But after reading that and seeing some awesome pictures like the one below (Rule 30 of the elementary CA), I decided to give it a crack.
After I creating the elementary cellular automata like the above I added randomness by intermittently swapping between the basic rules.
Add some colour and…
Next I wanted to make it a bit more interesting. Trees are randomly placed anywhere there was solid ground (i.e. the black in the above picture). They appear randomly with a higher chance of spawning the further down the mountain. An example with new colours is below…
You also might have spotted the cave at the top, they have a chance of spawning wherever there is a flat piece of ground that extends for at least 5 pixels. They are also a lot less common than trees.
You might also note that in the above picture there are multiple mountains, I changed the cellular automata rules slightly, so that if the above 3 cells are totally empty then there is a small chance that the cell will be filled. A single filled cell triggers each line below to expand on it creating another mountain.
Next on my list to spruce things up was waterfalls…
To make the waterfalls it was easier to do a second pass on the whole scene, this is because the scene is generated from top to bottom and I would need to keep track of the waterfall the whole way down. So instead I just loop through looking for nice flat pieces of rock face and draw the whole waterfall. I also dither the waterfall left and right when passing down over parts of the mountain that weren’t entirely flat.
Lastly I added some fog just by throwing a layer of white over the top, making sure that the opacity increases as it goes down. I also randomly changed the colour of a bunch to give the rock face a nice speckled look.