A New Watch App

[UPDATE: You can pre-order/download Skip and Save here - https://itunes.apple.com/au/app/skip-and-save/id1318698486?mt=8]

I upgraded from my 3 year old Series 0 Apple Watch to the new Series 3 with LTE and I love it. Having worn the original Watch for the last 3 years I've noticed huge improvements in speed and accuracy (especially Siri) with the new model. The heart rate sensor has improved, the battery life is amazing even when it gets a hammering from workouts and phone calls.

Anyway, I was so smitten I had to make something for it.

As I've mentioned before I'm developing all my games in Unity from now on. It makes sense as a) I can go multi-platform, b) there is so much more support/tutorials/help available for Unity and c) it makes 3D development so much easier.

But an app is different to a game, so I feel I'm technically not breaking my promise to myself to focus on Unity for game development :-)

So what is this app? It's called Skip and Save and comes out of my habit of giving up the occasional treat and making a mental note that I just saved money in order to buy something else at a later date. I know, it's a dodgy way of budgeting, but it works for me.

I figured this would be a good process to make into an app and it seemed perfect for the Watch where the ideal apps are very limited interactions that take no more than a few seconds.

Building the Watch App
The Watch app development environment in Xcode is really nice. And laying out an app is super easy - so much easier than laying out an iPhone app as I would later discover.

You know have the ability to mix SpriteKit and SceneKit with regular screens. I used this to add ticker tape particle effects when you successfully skip and save money, and cool firework effects when you reach your goal.

I wanted to use as much of the Watch as I could, so I added in Siri voice recognition, Scribble support and support for all the different complications that the Watch has. I also made sure that the Watch could communicate back and forth with the iPhone version.

An early Watch build with a bar to show progress,

An updated version with a ring to show progress.

The first version of the app used force touch to access the options to setup your savings targets and to reset progress or undo a skip. From my own experience with other Watch apps I found this to be very unintuitive and often hid away key features. So I tried having a paged app that the user could swipe to  other pages to see more commands. This didn't feel good in practice either.

The final look of the Watch app. A single screen.

I settled on having a single screen app with buttons on screen to show more options to set targets, undo skips and reset progress and another information button to quickly see your targets.

I also tried out a number of images for the buttons and settled on a mixture of my own designs and those from the Font Awesome 5 set.

Building the iPhone App
As much as I love my Watch, the reality is the market for Watch only apps is still fairly small, so I needed to make an iPhone companion app. So I began the fun task of using Xcode and interface builder to create the app.

Storyboards for Watch apps are awesome. The way stack panels work is great, and you can overlay controls and even add a SpriteKit/SceneKit scene under a view - which lets you create some great layouts that can do awesome stuff in a simple and intuitive way.

The iPhone version is a little more complicated. I couldn't mix SpriteKit and standard views so had to rely on Core Animation to create the effects I had previously done in SpriteKit. So the knowledge I had from making games sadly couldn't be applied which meant I spent time having to learn new systems.

I also found creating responsive views a lot more complicated than in WatchKit and struggled with simple things like making my stack view contents remain at a fixed size. I'd end up with a mess of constraints that I would have to delete and start over again. Luckily RayWenderlich.com released a Udemy version of their training videos which included sections covering the very stuff I was struggling with - like stack views and how to use keyboards with scroll views.

One thing I did do with the iPhone app was to use vector images instead of pngs. They worked out really well, so I went back and updated the Watch to use vectors as well.

The original iPhone app had a light design.

Original iPhone design

I asked for some feedback on social media and got some great advice. Brent Helsop, a local developer gave me some great feedback and so the final version changed to better match the visual style of the Watch version.

Final look iPhone version

Time Spent
I worked on the app part time - spending up to 2 hours on any given day on it. I had a fully working version on my Watch within 8 days.

All up it took me 34 days of part time development to build the app - 10 days for the Watch (2 of that learning how to make complications), 22 for the iPhone and 2 days for iTunes Connect setup, screen shots and asset creation.

Launching It
The next stage of the story is how do I market it and what do I charge for it?

I've devoured the complete series of Under the Radar podcasts for some ideas as well as read lots of articles from other app developers. Being a game developer I have very little idea of how the app world works and these resources have been invaluable.

I've decided to price the app as free with banner ads from AdMob. I did try out interstitial ads (which I know do way better than banners) but it just felt wrong. They work well in games, but in my app they were too intrusive. My thinking on going free is that the people who want to give up something to save money are probably not the sort of people to shell out real money on an app that they've never heard of before. So being free gives them a chance to give it a shot.

With the app done and price set to free I have to reach out to the folks who would love to use my app. That starts now as I wait for the app to launch early in January 2018.

The good news is I can get back to making games in Unity while I do my app marketing.

I'll let you all know when Skip and Save is live in the new year!

-Johnno

Learning Unity

I've been slowly wrapping my head around Unity. As I posted last month I took some time off developing Billy Carts to do a number of Unity tutorials and learn more about C# and the Unity way of doing things.

Things are progressing well and I'm starting to "get" Unity. My biggest problem at the moment is not knowing if they way I am solving a problem or implementing a system is the right way or the best way. The Unity tutorials, forums and google are certainly a help and I realise that I just have to plough forward and make stuff. I can always refactor my code later :-)

To help in my quest in getting a full understanding of Unity I've taken some advice from an old friend and am building a small game in Unity that is essentially a homage to an already existing game. Not quite a clone, but a game that has a very specific set of mechanics that I can emulate.

The reason for this is that I don't have to think about the game design and can focus on solving how to implement the mechanics and systems using Unity. Not having to think about the design of a mechanic but instead focus on implementing it is really accelerating my learning.

The game is simple and I've got the first stages of it up and running. I've given myself just over a month to complete it - which will probably end up being many times longer - but the goal is to take a game from start to finish so I can be exposed to as much Unity has to offer as I can.

I'll post some screen shots and more details soon!

- Johnno

A Unity Refresher

This week I decided to take some time off developing Billy Carts to focus on honing my Unity skills and learn more about the Unity editor. I have to admit I'm quite rusty from the time I spent away from Unity focusing on finishing up Ultra Dash, my Swift game.

And, despite having made quite a few games in my time, I'm not too proud to admit that I have a bit to learn still when it comes to Unity!!

So, rather than slogging on with Billy Carts and constantly googling "how do I do this in Unity again?" I've taken on the task of redoing some tutorials and going over some Unity resources.

As well as the excellent tutorials on the Unity site, I've also started redoing the tutorials from Ben Tristem's Learn to Code by Making Games course on Udemy.

Easy to follow video tutorials that will get you up and running in no time.

I'll also be revisiting his Game Physics - Introducing Gravitation & Rotation in Unity course to get the physics parts of my brain back into shape.

A great course to get your head around physics.

Redoing these tutorials is not only giving me a quick refresher in Unity but it's also exposing me to things I missed the first time around - like neat little short cuts and useful  keyboard commands.

My other source of reference for the next few days is the excellent Unity Games by Tutorials by the raywenderlich.com tutorial team. 

These are great books to make sure you get off on the right foot.

Ray Wenderlich makes some great books that you can either buy as books or as PDFs and the cool thing is they actually update them as things change. The Unity Games book for example, has recently been updated to take into account new stuff in Unity 5.5. 

While I like to have physical books as reference next my computer to leaf through, the knowledge that the PDFs won't be out of date within a few months is a good consolation.

What are your favourite Unity learning resources? 

Any must have books or online courses that make learning Unity a breeze? 

Let me know!

-Johnno

Back on Track!

So, Ultra Dash is done and dusted. Its approved for the App Store and is waiting for release on the 12th of April. I managed to do a few more minor tweaks in the last week, adding back the watch video functionality that I had removed previously.  I figured that launch time is when I'll get most traffic and it would be stupid of me to not have the option to let players watch videos to earn coins and unlock new characters and levels faster.

I added back the ability to watch video ads to earn coins!

I've also done an update to Snappy Word, adding a new game mode and fixing some crash bugs that I found using the crash reports that users submitted.

Sort mode is a new addition to Snappy Word

Now I'm getting used to programming in C# again after using Swift for the last month or two! I'm sure it won't take long to remember to keep adding semi-colons at the end of every line...

In much the same way that having time away from Ultra Dash helped me look at the game in a new light, having the break from Billy Carts has given me some new thoughts on the game.

The game play right now is very similar to Faily Brakes - you steer your cart as it careens down the hill avoiding stuff and collecting coins. It's a fun formula that has done extremely well for Spunge Games!

Billy Carts is currently a down hill runner

Given the power of Unity and the ability to rapidly prototype stuff and change things like camera angles and lighting it would be remiss of me to not take advantage of this and try out some new ideas.

First thing I'd like to try is changing the procedurally generated hill to a procedurally generated plane, so instead of just rolling down the hill, how would it feel to drive in any direction? This would change the end game parameters which are currently stay on the track and avoid stuff - and might make the game feel too easy - but it's something I'd like to do.

I did a prototype of something similar before Christmas and it scared the bejesus out of Pete and myself. The prototype relied on building an entire world (mocked up by grey cubes) which would have meant lots of unique art assets from Pete.

But in the meantime I've had some ideas on other ways to do it that wouldn't require building an entire unique world - so I'm going to see if this new approach works. It may well suck, but I have to try!

My approach moving forward with Billy Carts will be to take a more organic approach to trying out stuff, seeing what works and following those "fun" paths. I'm painfully aware of feature creep so I will attempt to stick to the core pillars of:

1. Avoid stuff
2. Collect coins
3. Survive as long as you can to rack up the most points

So please join me us as we go on this slightly altered journey to seek out new fun.

Given my experience with beta testing using TestFlight for Ultra Dash and Snappy Word, I definitely want to start testing as soon as I have something playable. So if you're keen, send your Apple ID email to support AT redspritestudios DOT com.

- Johnno

The Making of Ultra Dash

Ultra Dash is a simple endless runner game for iOS that uses a one tap mechanic. Players collect coins while avoiding oncoming obstacles by tapping the screen to change lanes. The coins are used to unlock new characters and also act as a score to compare against friends. Ultra Dash is also playable as an iMessage game.

Avoid obstacles, collect coins. Simple!

The game is written in Swift 3 using SpriteKit. I absolutely love Swift. It's an elegant language that is simple to pick up yet packs some real power. I will miss it as I bunker down in Unity for my next project. But C# ain't too bad either :-)

My goal in making Ultra Dash was to make a simple arcade game and to do the art myself. I was warned by friends (and my daughter) that my art wasn't too hot and that I should hire an artist. But in the end, I figured that I'm making this game for myself and I really want to cover all aspects of development.

Play against friends in iMessage

Well, all aspects except for music. That was provided by Eric Skiff who has some amazing free music that he lets people use in their projects - check out his stuff here http://ericskiff.com

The journey from concept to App Store has been a long one. My initial commit to Bitbucket was back in June 4, 2015. Why the long development time for such a simple game?

Well, it's been a part-time endeavour that was never a top priority. It got shelved regularly for months at a time due to other commitments - and at one point I decided to call it quits and abandon the project altogether.

However, it was over the 2016 Christmas break that I decided to revisit the game. The time I had spent away from the project allowed me to look at it with fresh eyes - and it wasn't that bad. So I decided to focus on the core game and finish it for release.

Original mockup for the Start Screen

The original framework was inspired by Crossy Road and the innovative banner system that creators Matt Hall and Andy Sum created. Crossy Road did a great job in presenting the player with different options every time the player died - constantly surprising them with new choices such as rating the game, watching a video to earn coins, winning a prize, winning a character or giving them stats on how long until they can earn more coins.

After taking my hiatus and reviewing the game I decided not to follow that model. I ripped out the banner system, removed the coin machine and made the act of buying new characters all done from the start screen. And each character offers a different background and level layout.

How the start screen ended up

I also made a conscious decision to remove as much English text as I could, instead using emoji to tell communicate to the player.

When you die you get sad emojis... kind of like cartoon swear words!

As well as the framework I also simplified the control scheme and the core game loop.

The initial prototype was all about ducking under and over oncoming obstacles in one of 3 lanes while moving left/right to avoid those obstacles that were too tall to jump over.

 I experimented with a number of control schemes including left/right and jump buttons, twin touch (where you tap both finger to jump), release touch controls like the awesome SHREDD where you hold both sides to go straight in the center and release one side to move to that side.

Here are some of the option buttons I used to try out each of the different combinations of controls and lanes:

I tried a lot of control scheme

And different level layouts

And in the end I went with 2 lanes 1 tap!

In the end I opted for a simple one touch control system and 2 lanes so you can play the game single handed. I also removed the ducking/jumping element and the extra tall obstacles.

For monetisation I settled on showing an interstitial ad after every 5 deaths and a banner ad on the bottom of the screen. I used HeyZap to mediate my ads and added a Remove Ads button to turn off the banner and the interstitials.

To buy a new character you have to spend in game coins that you collect. I originally had the ability to watch a video to earn coins but decided to keep the game as simple as possible. At one point I considered adding an option to watch a video to unlock a character, a technique used by Folmer Kelly in some of his games.

Testing!

Beta testing with TestFlight has been a godsend. If you don't do external testing then you are missing out on a lot of great feedback. TestFlight and putting the game into the hands of folks has been invaluable. 

Wrapping Up

My goal in making this game was to satisfy an itch to program a game and make the art. It may not be the most beautiful game in the world but I have scratched that itch and can now happily move onto the world of 3D and Unity. I will miss Swift though... of course if the game does well I will still be coding in Swift to release updates. Oh, and I also have an Apple TV and MacOS version ready to go...

Lessons Learned

Okay, this isn't a new lesson for me, but it was just a reminder of something I've known for the last 20 plus years. Making games is hard work. Even the simplest, plainest games. They take effort. And there are so many things that make up a game beyond the core mechanic - especially in this day of mobile games and Steam. The little things that eat away at your time like achievements, ad networks, multiplayer coding, cloud storage - all this stuff takes time to research if you don't already know how to do it, time to implement and lots of time to test, fix bugs and retest.

So, to everyone out there that has shipped a game or is in the process of making a game - I have huge respect!

Hopes

One of my hopes for Ultra Dash is that it has the chance to find an audience. I am a bit worried that the art may impact on that chance. Anecdotally any screen shot of Ultra Dash I tweeted would get around 0 favourites while a beautiful 3D Billy Carts screen shots could get up to 20 favourites. People like beautiful games. 

This isn't a surprising revelation, but it's easy for people to forget this simple fact. 

I'm also keen to see how the removal of English text impacts on the game. Will it be downloaded in countries other than Australia, USA and UK? I'm also keen to see how the banner ads earn compared to the video - I'll be looking at all of this data to help influence how I approach ads and UI for Billy Carts.

Well, that's my 2 cents on making Ultra Dash - it launches on April 12th so I hope you'll download it and check it out.

To wrap up here's a list of stuff I used to make the game.

Thanks for reading!

- Johnno

Development Environment
IDE: Xcode
Language: Swift 3 with SpriteKit

Tools
Art - Pixelmator and Affinity Designer to create the sprites and icon artwork
Sound -  Audacity
Icon Creator - Asset Catalog Creator

Music - Eric Skiff

Version Control - Source Tree and Bitbucket
Tasks - Trello to keep a list of To Do, Doing and Done tasks

Knowledge
Ray Wenderlich's site and books:

• 2D Apple Games - for general SpriteKit and game dev learning
• iOS 10 by Tutorials - for Message App learning

Platforms: iPhone, iPad, iPod Touch, Message
Coming Soon: MacOS and TVOS (if the game does okay).

Resurrection

In a previous blog post titled Gotta know when to hold 'em, know when to fold 'em, know when to walk away I wrote about knowing when to stop working on a project.

It's okay to step back and focus on something else and not feel the pressure of having to see a project through to completion. There's no shame in shelving a project until the conditions are right.

Last year I shelved a 2D endless runner I was working on. It didn't quite have the appeal I was hoping for, and despite being 90% done I couldn't see a way that I could really improve it.

Well, thanks to some down time from Billy Carts during the holiday vacation, I had the chance to go back to the project and try out some ideas that had been percolating in the back of my mind.  I had recently relaunched Snappy Word so that it worked with iMessage. Being able to play inside the iMessage app added a lot to the simple word game. I thought about doing the same with the endless runner so decided to use the time to try it out.

Ultra Dash running in iMessage

Being able to challenge a friend with iMessage added that something that was missing. However, I decided to do some more reworking of the core game with the intent of making it a lot simpler.

I pared down the user interface by combining the character selection screen with the main menu. I  removed all English language text replacing everything with universal icons. I removed the earn coins functionality and the random prize boxes, as well as the share functionality. Because it's an iMessage app this is how I want people to share.

Main Screen/Player Select

I also stripped out some unnecessary collectables and objectives paring the game down into a straightforward score chaser.

I ended up keeping the original programmer-art graphics because, well, they've grown on me.  Billy Carts has amazing 3D art and because this is probably my last 2D game I might as well make it as personal as possible :-)

The game will be launching soon on iOS and now it's time for me to get back to Billy Carts - so expect some more 3D game goodness blog posts soon!

-Johnno

John's Cartoons Returns

Today's blog post isn't a game development related post but it does involve HTML and CSS coding with some Bootstrap.

I'm going to talk about updating my old comics web site johnscartoons.com. I created the site way back in 2002, which is 15 years ago now... man, that sounds like a loooong time ago.  Anyway, the site was where I published a whole bunch of my cartoons that I made during my *cough* younger years. A few years ago the site got out of synch and stopped pointing to the right sever, or something like that - internet stuff has never been my strong suit :-) But I decided enough was enough and figured it was time to work out what the problem was and use the site as a great little project to apply my new JavaScript skills (step 1 is to get the site back up, step 2 will be JavaScript - so don't expect much at the moment).

So as you may have guessed I used to draw single panel gag strips and write comics back in the nineties while I was making games. In fact, after I quit my original day job around 1992 I actually supplemented my savings by selling the occasional gag strip and co-writing a comic series with Pete Mullins.

So while I was programming/designing/writing Flight of the Amazon Queen and designing Halloween Harry I was writing and drawing comics for money. Not a lot of money, but enough to cover rent.

Yes, they are kinda corny - I was influenced a lot by Gary Larson's The Far Side single panel strip.

Anyway, I've set up the site again and built it with some basic HTML and CSS using Bootstrap. Previously I had used some drag and drop web site builders - but now I can go crazy and test out my JavaScript skills to do some interesting stuff.

I have a big backlog of cartoons, so I'll try and update the site with new "old" strips every week and slowly build the site out as I learn new stuff.

At the moment the site only has 12 cartoons and the links in the menu bar don't go anywhere, but they will soon.

Anyway, if you're keen to see more, head over to www.johnscartoons.com. Be warned, as well as being corny some can be a little rude.

Enjoy!

- John

Visiting the Upside-Down

One of my non-game projects has led me into the Upside-Down - the world of full stack web development.

For many of you web development is the norm and the world of game development with Unity3D, Unreal, Xcode, etc. is an alternative reality, but for me the world of web development is both overwhelming and exhilarating.

My last venture into web development was with 3 Blokes Studios doing Facebook games. Back then we used Flash/ActionScript to write our front end and PHP for our backend. The games I worked on included Hospital Town, Virtual Villagers and Galactic Allies.

Virtual Villagers on Facebook

While I'm still getting my head around all of the front end and back end tools, I must say I am very impressed with the technology available. It's so easy to be stuck in the bubble of game development and work solely within the realms of Unity3D and C#, or focus one hundred percent on iOS development and Swift/Objective C. Sometimes the web raises its scary head but its usually (at least for me) in the shape of trying to set up a Wordpress page.

Galactic Allies on Facebook

But I've been lucky to dip my toe back into the web.

My experience so far has been limited to HTML, CSS and JavaScript with Bootstrap to make some truly sexy front ends. For those unaware, Bootstrap is a front-end only framework that was originally known as Twitter Blueprint. It provides a bunch of re-usabel components that make building a web front end super easy and helps maintain a consistent and professional look.

Hospital Town on Facebook

I'm still immersing myself into this world and am looking forward to learning more about jQuery, AngularJS, Node.js and React - which are just a few of the many, many other frameworks that help make web dev easier. In fact, the sheer number of options can be overwhelming and it seems like new stuff is appearing all the time.

Just when I thought I had a handle on JavaScript I learn about CoffeeScript (which was used to build Trello) and the new kid on the block, Elm. These are both languages that compile to JavaScript but let you write better code.

It's still early days for me and I have a lot to learn, but I'm having a lot of fun. For anyone interested in finding out more, here are just a few articles/links that friends have shared with me that I've found useful. These are by no means complete - merely scratching the surface - so please let me know ones that I have missed!

Tools

Microsoft Visual Studio Code - https://code.visualstudio.com

I tried out a bunch of editors including Atom and Sublime Text but I've found Visual Studio Code to be simply amazing. It's free, has loads of extensions and works on Windows, Linux and MacOS.  Make sure your grab the Bootstrap 3 Snippets and vscode-icons extensions and do yourself a favour and learn the Emmet snippets shortcuts (which are built in). These makes writing HTML a breeze!

Languages

JavaScript - https://www.javascript.com

Elm - http://elm-lang.org

CoffeeScript - http://coffeescript.org

Frameworks

Bootstrap - http://getbootstrap.com

React - https://facebook.github.io/react/

jQuery - http://jquery.com

AngularJS - https://angularjs.org

Learning

w3schools.com

Node.js Applications with VS Code

Udemy.com - they have a bunch of great courses on all aspects of web development. My tip for Udemy is to log in, check out the courses, and wait. They usually send you an email with discounts for courses.

Articles

React is the new jQuery

After React: Elm?

Minesweeper - a brief journey from JavaScript/React to Elm

Now, I wonder if I can apply these new skills to making something fun on the web? I guess I better return to the Upside-Down to find out :-)

Click the photo to see more of Michael's cool art!

-Johnno

Time To Switch

Sorry about the heading. I couldn't resist a pun.

So the Nintendo Switch is launching in just over a month and I'm very excited for this new console. Admittedly I am a huge Nintendo fanboy. I have most of their systems starting way back in 1982 with Game & Watch Parachute. I loved that game so much that I picked up a keychain version of it at Super Potato in Tokyo.

My Parachute keychain

Despite my love for Nintendo I actually skipped the Wii U. For the last generation I took solace in the New Nintendo 3DS XL instead. The Wii U looked okay, but there wasn't anything about it that compelled me to go out and buy one. The second screen concept didn't do it for me and I found the 3DS was scratching my Nintendo IP itch with Mario, Zelda and Animal Crossing. So, for the first time ever I skipped that generation. Okay, I also skipped the Virtual Boy but that was more a case of not having the cash at the time to buy it having put aside my pennies for a shiny imported Japanese PlayStation.

Virtual Boy - Nintendo was ahead of their time!

So why am I excited about the Switch?

Well, the 3DS is my current go to console. I spend more time playing around with it than I do with my PlayStation. A big factor is that the 3DS is a portable system. I can play anywhere, anytime - and I love how quick it is to start. Flip it open and I can be playing within seconds.

The Switch is promising me this same experience. I don't have to sit in front of the TV if I don't want to. I can take it with me if I want. And hopefully it will have the same fast boot up of the 3DS.

Another thing that excites me is that Nintendo has re-embraced their Wii style control system again - and this time they've packed two motion controllers in the box. This means new ways to do motion control but more importantly it means that 2 player game experiences are possible for 100% of the folks who buy a Switch. Everyone will have two controllers. And they can play 2 player games away from the TV as well. This has a lot of potential.

And of course there is the new Zelda game at launch and a new Mario coming at the end of the year. These look great. And I'm guessing we'll also get an Animal Crossing sometime (but probably not for a year or two) - and then it will be the perfect system.

I just love the dog faced controller!

Of course, naysayers have said that it's just a tablet with a hefty price tag.

Yes, it is technically a tablet. But it's a tablet that comes with 2 controllers, amazing games and the playfulness that only Nintendo can deliver.  You can't judge something just by the hardware - not every non Apple tablet is as slick as an iPad even if their tech specs are the same.

So, I'm excited. Nintendo has managed to sell me on the handheld/TV hybrid console model.

Now, to balance things out, I fully understand that this is a Nintendo product - so some things will probably suck. I'm expecting a poor to average online experience, a mediocre e-shop and higher than industry standard prices for downloadable games. But if it's as half as much fun as the 3DS then I'll be more than happy!

How about you? Are you excited for the Switch?

-Johnno