This a portfolio of some of my professional and personal projects that I have proudly brought to life.
Aikido Hombu Timetable
A labour of love, the Hombu App, as it is affectionately known, uses heuristic1 schedule parsing to retrieve aikido schedule data from the world headquarters of Aikikai aikido in Tokyo (where I also practiced aikido for 5 years).
This app was desperately needed because the official web site at the time was still a 90s-era site which required up to 4 clicks to get at the schedule for the day, plus it wasn’t mobile friendly. Viewing the schedule required POST form submissions so bookmarking was impossible. On top of that the schedule would change at the drop of a hat, so we would be often surprised by different teachers.
This app solved several problems by using push notifications and a pleasing chime to alert users to schedule changes which were often. By adding pictures of the teachers, scanning the schedule at glance is quick and convenient unlike the aforementioned 4-click method. Additionally, the back-end remembers teacher changes so visually one can see what changes have been made far into the future as well – up to 60 days, whereas the official schedule is limited to only 14 days.
The main language of users is Japanese, but many visitors speak English. Although told it is impossible to change the app language on-the-fly, I figured out how to do just that – seamlessly change the app language without leaving the app. As time went on, I added video support with animated video thumbnails and video pop-outs so again one doesn’t have to leave the app. Videos can also be saved from YouTube for offline viewing in the app. This technique has worked flawlessly for over three years despite numerous
YouTube API changes.
- PHP cURL system with cron jobs
- MySQL DB to hold changes
- Automatic app updater tool
- Weather API integration
- YouTube downloader and inline player
- Database failover to an alternate server
I’ve made a lot of websites using different technologies, from WordPress themes to static sites, to complete AJAX-driven sites. My favorite designs are load-balanced to parallel load assets, have mainly static html files that have been rendered previously with AJAX to fill in dynamic bits, lazy-load images with my custom size-aware scripts, and generally strive to look slick. Here are a few examples.
Worldwide Brands Canada
This site makes use of 100% static HTML with lazy-loaded image assets, minified CSS and JS, and parallel loading for faster asset downloads. This site is responsive and mobile friendly.
Here are some exciting performance insights into the above site courtesy of tools.pingdom.com. This site is hosted on $6/mo shared host with basic HDD disks, but the performance comes using parallel loading and taking advantage of Cloudflare’s caching ability like a CDN. Google Analytics is the bottleneck.
The site below is in Japanese, and makes use of minified CSS and JS, parallel loading and rich media like a responsive HD YouTube video embedded in the frame of a modern Macbook with an animated preview GIF. This is done so the YouTube clip is only loaded when the play button is pressed, yet the animation draws the visitor in to press the play button. In addition, MP3/OGG audio clips are HTML5-embedded into a listening quiz with a final score and advice presented to the quiz-taker. The main CTA (call-to-action) buttons stand out in a pleasing way.
Here are even better performance insights into the above site again courtesy of tools.pingdom.com. This site is hosted on a cheaper $4/mo shared host with basic spinning HDD disks, but the performance again comes using parallel loading and utilizing Cloudflare’s caching capability. Google Analytics is again the bottleneck.
Masakokoro Aikido Dojo
This was one of my first designs made nearly 7 years ago! It’s not updated much by the owner, but it’s still in existence and the graphic elements have held up over time.
Aikikai Aikido Hombu Timetable
This was a site made before the iOS Hombu App was released. It utilizes the same API that the iOS app uses, and uses AJAX and jQuery to populate the rows. The rows are static HTML fetched from cache and inserted into the DOM by jQuery. It automatically refreshes every 60 seconds, and is in both English and Japanese. It’s simple, but it illustrates the effectiveness of making an API that can be used across the web, iOS and Android apps.
There are more web sites I have created, like the one for a now-retired Canadian Member of Parliament, and the one for a medium-sized English school in Calgary that went bankrupt two years after I made their beautiful site. There are other sites I’ve contributed to with programming or data-scraping like a coupon site, an affiliate marketing site, a reverse phone number search site, and on. There is no shortage of freelance work.
- Heuristics are needed because different people who oversee the official schedule enter dates differently, and in different formats, and sometimes wildly different (i.e. 2016/5/08, 16-01-5, 2016年５月１２). ↩