My first ever app I made and sold...

I was digging through a cupboard today, when I came across the package shown below.

I was initially flabbergasted that I still had a copy on hand, but that soon gave way to feelings of nostalgia that took me back 30 years (yes, that is 3 decades) to when I first created this.

It is basically the first time I had “scratched my own itch”. Being a commercial pilot at the time, I was finding paper based logbooks to be painful to manage, so I wanted to use my programming skills to create a computer based one which would make it easier to tally up certain entries, especially looking at the recruitment process, where pilots would be asked questions like “How many hours do you have on multi engine aircraft?” or “How many in-command hours do you have on a certain aircraft type” etc.

I wanted to create a simple logbook app which could answer that, and so Sabre Personal Logbook was born sometime in 1990.

I wrote this using Clarion 2.1, which is still the most productive and useful application creation framework that I have ever come across to date. I think the original app took about 3 months to create, including the creation of the boxwork art, printing the manuals etc. I even created it using the IBM PS/2 shown on the box art!

There was no such thing as Paypal or Stripe back in those days, heck, even the internet was in its infancy, so everything was done via magazine ads (mainly in Australian Aviation magazine), or pilot specific BBS’s (Bulletin Board Systems), and payments were via people sending you cheques to bank. Wow, there was surely a lot more trust in those days (plus less scammers too, so I guess it all evens out). We even had one of the first online shops in Australia called PC Aviator as our distributor for a bit there.

We had a good run for a year or two, and sold several hundred copies of the app, and we had senior check and training pilots from airlines like Qantas and Cathay Pacific using it and giving us feedback. We had plans to create a “Professional” version for companies and flying schools which could track multiple pilots (hence the moniker “Personal” on this first version), but that never eventuated, as I got distracted with other aspects of the business, and life in general.

Eventually, we just stopped promoting and selling the app, and it simply died a natural death. I did experiment with creating an online version using ColdFusion for a while there, which would have been the first online pilot logbook, but web technology was in its infancy back then, and hosting was super expensive, and online payment gateways took a long time to become mainstream here in Australia, so I abandoned that project.

It was good to come across this today though. Funny to see that the passion to create apps still runs deep within me. These days, I run a very successful app that makes far more in one day than I made in 2 years of selling my Logbook app (indeed, the executable file for the logbook app was smaller than just the CSS file in my current app), but this was my first foray into selling something to total strangers, and I am still excited by it.

There have been many many apps in between, but you never forget your first.

Building a 'Nosedive' rating app in a couple of hours

This month, the family and I have been watching the NetFlix series "Black Mirror", catching up older seasons and devouring Season 3.  One of our favourite episodes was 'Nosedive', and so I don't give out spoiler alerts here, I won't go into the plot line, but nevertheless, we were all fascinated by the 'Rating' app that everyone used on the show.

So much so, that my wife, the kids and I all started 'air gesturing' each other the 'swipe and flick' routine as if we were using the app to rate each other throughout the day.

This made me think - how about if we actually had a dummy app that we could use?  I noticed that NetFlix had created a demo site on the internet to promote the show, so I (ahem) "borrowed" some of the assets like the background, star graphics and the rating sounds, and mocked up a small dummy 'Nosedive' app in a couple of hours that I had spare.

Now I can really annoy the kids.  "Didn't do your homework?, ONE star for you!" (dew dew dew dew dew).  Wife brings me a nice hot cup of tea? "Five stars, my dear..." (dinga ding ding ding DING!).

I never intended to make money from this little side project - I just installed it on our phones using my developer account.  I am releasing the source code on GitHub in case any others want to take things further.

Please note that this is nothing like the actual app - there is no facial recognition (although I have been playing around with the Microsoft Face API to see if I can do something there).  There is not aggregate rating for people, and there is no central database that things are stored in (though I have thought about using Firebase to store rating data in the cloud).  It is purely a gimmick - although there is no reason that anyone can't take this starting code and build all that on.  Have at it! :)

Building the App

The app itself is built using the Ionic framework, which I have been using for over a year now, and really love.  It facilitates creating a hybrid app quickly and easily that can be used on iOS and Android devices.  No need for Swift or Objective-C, it is all done in javascript and HTML/CSS.

Nothing too tricky about this app - it is a simple one page application, which is the rating page.  As I mentioned all the assets, including the background swirling pink video, the rating star graphics and the notification sounds, were all downloaded from the NetFlix promotional site I mentioned above.  That is 90% of the work right there.

The rest was just implementing the swipe gestures to set the star level, and then the flick gesture to 'send' the rating and play the sounds.

Setting the ratings was one area that stumped me for a while.  Initially, I was playing around with the $ionicGesture event handler, and trying to trap left and right swipes including the distance swiped and the swipe velocity to try and calculate the star rating to give.  That all turned out to be extremely tricky and difficult, so in the end, I ended up using a typical programmers shortcut - in that I cheated! :)

I ended up placing an HTML range slider control on the screen, just under the stars.  I then made this slider element invisible, and used CSS to reverse offset the slider to that it lay just on top of the stars themselves.

This way, if anyone put their finger on the stars and moved left or right, it effectively moved the hidden slider left and right.  The upside is very accurate tracking of where the user lifted their finger, as the rating value would correspond with the star where they lifted their finger.

The downside is that on some devices, the slider will not move unless the user starts their finger on the current star (e.g. if you wanted to go from 2 stars to 5 stars, you would have to place your finger on the second start, then slide to the fifth star.  If you just tapped the fifth star or started on the third star to slide up, the slider would not move).  Most users I tested this on (well, my wife and kids) seemed to naturally start at the current star anyway, so I figured I could get away with this.  At least it worked with minimal (read: NO) coding required.

The last thing so do was to implement the Cordova Native Audio plugin to generate the sounds.  This was pretty trivial to do, and was only a few lines of code.  I had to capture the swipe up gesture to trigger the 'send' sound at first, then wait one second, then play the 'rating' sound depending on the rating (one to five) that the user had chosen. Check the code for details.

Yes, yes, yes, the pedants among you might say well the sending phone only plays the 'send' sound and the rating sound is played on the receiver's phone, but for our app, we aren't really 'sending' the rating anywhere, and are just using it as a too to tease or annoy others, so the rating playing on our own phone after a delay is enough to let the other person know exactly what we think of them (as long as they are in hearing range in a relatively quiet environment).

Anyhow, I will let others feel free to build upon the code base and see what they come up with.  I won't be releasing this app on the App Stores or anything, as I don't want to push things too far and be hit with a copyright violation from NetFlix!  Have fun.