Showing posts with label Xcode. Show all posts
Showing posts with label Xcode. Show all posts

Monday, August 26, 2019

Third In The Space Watch Trilogy

WatchOS 6 is launching soon, and I've been busy preparing some new games exclusively for the Apple Watch.

I've already released Kepler Attack, a fast paced space shooter inspired by the arcade classic Gyruss, and I've recently completed Star Warp, which is now available for pre-order on the App Store. Star Warp will launch on the 4th of September and is inspired by Galaxians.

And right now I'm busy working on another space game -  the third in my Space Watch Trilogy - and that game is called Asteroid Commando. No prizes for guessing the inspiration for this one...


Like the other two games, Asteroid Commando is built using Swift 5 and SpriteKit and is designed to take advantage of all the latest features of the Apple Watch. It uses the Digital Crown with haptic feedback, runs at a silky smooth 60fps, works with Game Center for the Watch and runs independently of the iPhone.

I've built up a framework while developing Snappy Word, Kepler Attack and Star Warp - sharing a menu system, leaderboard and save/load system between games lets me kick off new projects and get into the core game a lot faster.

Initial sprite set for the game
I'm finding the constraints of the Apple Watch a joy to work with. The smaller screen size and limited input, coupled with the shorter play sessions means that a Watch game is much smaller in scope than the average mobile game. And this means shorter development times without compromising the quality of the experience. In some ways, the Watch is a great delivery platform for what is essentially paid hyper casual games.

I plan on doing more regular updates as I close out Asteroid Commando, so please check back to see the new features I'll be adding over the coming weeks.

Cheers,
Johnno


Wednesday, May 22, 2019

Making Kepler Attack for Apple Watch



Kepler Attack is a retro space shooter that I made exclusively for the Apple Watch.

If you have an Apple Watch then you can get it here from the App Store.

Kepler Attack Game Footage

Why Apple Watch?

As my friends know, I am a huge Apple Watch fan. I've had a Watch since day one and I've made a number of games for the platform. All of these games are simple puzzle games - not the sort of games you would use to show off your Apple Watch to your friends.

So I figured it was about time the Watch had such a game!

And this, dear reader,  is why I created Kepler Attack.

Have I succeeded in creating a killer Watch game? Time will tell, but I think I've done a pretty good job in making something I can be proud of.

Origins

I started Kepler Attack on the 15th October 2018 and used art assets from my Ultra Dash game. The Watch app was part of the Ultra Dash project and my initial plan was to mimic that games mechanic, which involved racing through space avoiding obstacles.

You can read about the making of Ultra Dash here.

Months earlier, a friend and I had discussed Gyruss and how it would be perfect for the Watch. As I began to build out this new game I subconsciously leaned into Gyruss' mechanic. When I showed him Kepler Attack months later he exclaimed "Hey, I told you that would be a great game for the Watch!". So thanks Iain!

Controls

I explored a number of ways to control the player ship. I tried tapping the screen to move the ship left and right but this didn't work. It was slow and your finger obscured the action. Buttons weren't viable as the screen was too small to accommodate them.

As soon as I added the Digital Crown controls it was obvious that this was the right choice. Using the Crown as the controller led to the next logical change - making the the ship move in a circular motion, not just left and right.

On the 4th of November I split out the Watch game to be its own project, removing it from Ultra Dash.

Art

For Ultra Dash I wanted to make the art myself. In my making of blog post for that game I wrote:
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. 
Well, I was right. People do like beautiful games. And my art was programmer art. But hey, I got to do the art for the game - even if it didn't set the world on fire.

So for Kepler I listened to the feedback and contacted my good friend and amazing artist Pete Mullins to replace my placeholder art with something good.

Space Ship Design

I created the placeholder art in Affinity Designer and played with their sizes to get the hero and enemy ships to look good on the small Watch screen before getting Pete to redo it. This way I could make sure I had the required number of ships and their sizes locked down.
My placeholder ship art


Pete and I discussed how the final ships should look. I gathered a bunch of reference material for old vector style graphics from the likes of Asteroid and Tempest, as well as the blocky sprite stylings of arcade shooters.
Final art inspired by classic eighties arcade space shooters

The old school pixel look won out and Pete began creating some cool looking ship designs.

As well as the ships, we updated the asteroids, power ups and projectiles. We also added a new blocky pixel inspired font. The game was playing really well with super smooth controls and it looked the part.
Programmer Art

Final Art by Pete Mullins

Logo Design

I wanted the logo to capture the spirit of the classic eighties games like Galaxian and Galaga.
Classic arcade game logos


I mocked up the first attempt at a logo which served well as a placeholder piece.
My initial attempts at a logo


The final logo designed by Pete managed to capture the eighties arcade vibe while still feeling fresh. Importantly it also looked great on the small Watch face.


The final logo by Pete Mullins


Coding

I built the game with Xcode 10 using Swift 5 and the SpriteKit framework.

I used a storyboard to lay out the main menu in Xcode. Creating UI for the Watch is surprisingly easy using a combination of vertical and horizontal groups that can be stacked. I only used one screen with the menu and game screen sharing this space. The game screen (a SpriteKit Scene) is initially hidden from view.

Xcode menu storyboard
When the player taps to start playing I hide the menu group and show the SpriteKit Scene. This made it easier to transition to the game scene from the menu and not inherit all of the Watch UI that would have appeared, like the back button.

I laid out the game scene in the Sprite Kit Scene editor.
The scene editor for the game screen
I placed the hero ship and score and UI labels here, and programatically generated the enemies and asteroids.

Enemies

I used a lot of built in features of Xcode and Swift to make the game. Xcode has a simple particle emitter editor so I created the star field with this. The stars are an emitter at the centre of screen that spawns various sized blue squares that shoot off in different directions at different speeds.

For the enemy attack patterns I used Swift's bezier path function. With this I simply had to pick a number of random points on screen and plot a bezier curve through them. Super easy and it looks great!

        // create a bezier path that defines our curve
        let path = UIBezierPath()

        // Start position
        path.move(to: startPosList.randomElement()!)
        path.addQuadCurve(to: arcPosList.randomElement()!,
                          controlPoint: arcPosList.randomElement()!)

Then I attached the paths to the enemy ships and started them on their merry way.

            enemy.sprite.run( SKAction.repeatForever(
                SKAction.sequence([
                    SKAction.wait(forDuration: duration),
                    SKAction.follow(path.cgPath,
                                    asOffset: false,
                                    orientToPath: true,
                                    speed: 150.0)
                    ])),
                       withKey: "path"
            )

SpriteKit actions are a really powerful part of SpriteKit. As you can see above, you can run a set of actions on your sprite. There are a whole bunch of useful action methods that when chained together create some pretty cool movement sequences.

Actions let you follow paths, fade, scale your sprite on the x and y axis, wait for set time durations, move the sprite set amounts or to specific locations - you can add these inside fixed, single and repeating loops - and you can also call your own functions from within.

The majority of the hero, enemy and obstacle sprite logic was built with SKActions.

User Testing

Once I had a playable build I used TestFlight and the public beta link system to open up the game to external testers. I did a call out on my social media and posted on the TouchArcade forums. From these two sources I got a reasonably sized testing group to get some good feedback.

I would make changes and push out new builds, polishing the game until I was happy.

At the end of March 2019, I submitted Kepler Attack to the App Store as a pre-order and set the release date for 6 weeks in the future. Now it was time to get the word out...

Pricing

I set the price to 99c (Tier 1). I toyed with a higher price point but wanted to capture the arcade feel that inspired the game, and 99c felt like the right amount to charge for it.

Going free to play was out of the question as there is no way to serve ads or offer IAP on the Watch. Will users pay 99c for a game any more? I'll soon find out...

Marketing

Analysts calculated that there were around 45 million Apple Watches shipped in 2018. The Watch isn't the most obvious gaming platform, but I believe that a small percentage of owners would surely be interested in playing a game on their wrist. And even a small percentage of 45 million is quite a large number of potential players for an indie game developer!

My biggest challenge will be reaching those users, but I have a number of ideas on how to do this and will try a mixture of paid ads and boosted promotions on sites like Facebook and Instagram.

The Future

Right now I'm focused on getting the word out to those people who own Apple Watches. As mentioned above, they are a tough market to connect with. I'm hoping that if they can be made aware of my little game then they may want to buy it. It is the perfect game to idle away the time between meetings and waiting in line.

I have an update ready to release within a few weeks of initial launch. This new update adds a Top 100 leaderboard which is accessible right on the Watch. This is a really fun feature and adds a lot to the game.

My fingers are crossed that it does find an audience, but whatever the outcome, I can honestly say that I've made one of the best Apple Watch games you can play.

And I had fun doing it!

- Johnno

Development Environment

IDE: Xcode 10
Language: Swift 5 with SpriteKit

Tools

Programmer Art - placeholder art was made with Affinity Designer
Final Art - produced by Pete Mullins using Photo Shop
Icon Creator - Asset Catalog Creator
Screen Shots - Screenshot Creator Pro

Version Control - Source Tree and Bitbucket
Tasks - Trello to keep a list of To Do, Doing and Done tasks as well as backlog for future updates

Design and Code: John Passfield
Art: Pete Mullins



Thursday, December 29, 2016

Christmas Projects

Christmas holiday time is a great time to relax and take your mind of work or school.

It's also a great time to look into  new hobbies, read new books, learn new stuff or catch up on those TV shows and movies that you may have missed out on.

One of the things I love to do is to use the time to work on a small project. The original TY the Tasmanian Tiger game began as a Christmas project way back in the early 2000's. I did the initial prototype programming while Steve Stamatiadis did the art for the in game characters including TY. But that's a blog post for another time!

This year I got a Sphero BB-8 for Christmas and my son got a Force Band to use with his Ollie that he got last Christmas. The Force Band works amazingly well with both the BB-8 and the Ollie. Being able to control your droid using simple hand gestures is the closest feeling you'll get to using the Force. It truly is amazing.

Being a huge fan of the Apple Watch I decided to start a Christmas project to make my own Force Band for my Watch.

The Sphero SDK is freely available for all platforms and is fairly simple to integrate into an iPhone Xcode project.  I found a great sample project from Robotics Trends that used the Watch's accelerometers to control a Sphero. This is a great entry point!

Trying out different control methods for BB-8 with Apple Watch
However I decided to start fresh and explore some other input methods that the Watch offers.

I tried using buttons and swipe controls to move BB-8 - all of which work okay, but the one I found interesting to explore is the use of the Digital Crown as a steering wheel.

This actually feels great having BB-8 move while rotating the crown to steer the little droid. I have a few extra features to add, such as a simple way to slow down and speed up the droid - and the UI could use a little love :-) 

Speaking of which,  I better get back to my Christmas project so my son and I can take our droids on adventures with the Force Band and Apple Watch.

I hope you all have a happy new year!

- Johnno