I'm Jon, a web & mobile developer from Brisbane, Australia. This is my portfolio, where you can browse a whole lot of interesting stuff I’ve had a hand in making. Looking for something more formal?

Check out my CV.

Or head on over to the Contact Page and find a way to say Hi!







BAM! Festival is a 3 day festival held just outside Brisbane. I created this website by using the Joomla CMS, and writing a new template from scratch. Implementing this website provided me with numerous challenges, such as:

  • It was my first time working with Joomla, so I had to learn how the system worked and what was involved in implementing a custom template.
  • I had to implement a completely transparent layout, so that the background could be changed at any time, and show through the entire body.

BAM! Festival
A Joomla based website, with a custom made template and features.
I wrote this for internal use at Creative Intersection as it was something we needed.

Originally, it was just for iPad. The original idea is that it pulls down project time data from toggl and displays the time currently spent on a project in relation to how much time was quoted. It also breaks this down on a per-person basis.

When I got into it, I found that Toggl's API doesn't provide the time spent for a certain project. For this data, I wrote a middleware Node.js server that spoofs user login on Toggl, and scrapes the data from each project's page. For this reason, it's not suitable for wide release (unauthorised data scraping, insecure use of user details).

I also wrote a native Android version of this app to better familiarise myself with that platform.
Project Monitor
Monitoring of Toggl project timelines for iPad and Android Tablets.
This website was created for a few different services:
  • RSVP - allows guests to RSVP online
  • Directions - Provides directions to each of the venues from the home address of the guest
  • Information - Provides an information resource about the time and format of each of the events


Because of the obvious privacy concerns, each user was given a login code with their wedding invitation that they could use to log in to the website. This meant that each user is greeted personally, and also granted the ability to provide personalized directions using the Google Maps API.
Bee & James
A wedding website which providing information and services for wedding.
Pseudo-FTP was a project I did in my final semester of TAFE. It used C++ to implement a file transfer server on a unix based system, and wxWidgets to implement a file transfer client on a windows based system. The aim of the project was to learn the concepts of networking in relation to C++ (using Berkeley sockets & wxSockets), and comprehensive GUI implementation using wxWidgets.

This project was done in a team; I implemented the unix file server entirely, and completed major portions of the windows client.
Pseudo-FTP
An academic implementation of network file transfer.
As a fun side project for myself, I wrote this iPad app to view the Tromsø webcam served by Universitetet i Tromsø at weather.cs.uit.no.

It uses a few different components to pull down different data:

  • The image itself pulled directly from the weather.cs.uit.no server, and updated every 30 seconds
  • The basic weather information (current, only one measurement), is scraped by a PHP script on demand. Of course, this is cached, so the actual scraping only happens once every 30 seconds.
  • The weather information from the graph (last ~6 hours, hundreds of measurements) is served as static JSON file. A node.js process is run every 10 minutes on a cron job which updates the data in this file by scraping the raw data logger on weather.cs.uit.no
Tromsø Now
Webcam and weather viewer for UiT's Tromsø Webcam
Motivational Australia was the name of my final individual project at TAFE. It was an event management system, with every feature you would imagine on an real-world counterpart, such as:
  • User registration/Account maintenance
  • Shopping cart complete with a timeout ticket reservation system
  • Interactive venue seating plan representation - users can see where their seat is in the venue
  • Recommendations Engine
  • Privacy Policy
  • Search
All of these features were implemented from scratch, using Java (JSF), Hibernate (among other frameworks), JavaScript and MySQL. Eclipse was used as the IDE, and ANT was used as a build and deployment tool.

Apart from all of the features, we were required to fully plan the project beforehand, which included creating:
  • Site Map & Site Flow Diagram
  • Domain Model
  • Database Model
  • User Interface Prototypes
  • Unit Tests
  • Suite Tests
  • User Stories
  • Package Layout, Class, Responsibilities & Collaboration Table and Project Structure Diagram
  • Project Release Plan
  • Ant Build File
I then had to implement the project to the release plan, which proved a challenge.

For more information, you can download the project's final documentation here.
Motivational Australia
A feature-complete Java & Hibernate based event management system.
This project was a relatively simple game, implemented in order to teach Test Driven Development. It was implemented in Java, using JUnit to perform unit tests.

The project was implemented in a team of two people. We took turns at first writing an exhaustive testing regime, and then having the other person write the class to satisfy the tests.
Hiring Game
A simple Java game implemented to teach test driven development.
The Cargo Manager was another relatively simple project that was implemented in order to put test driven development into practice, especially in the context of a user interface. In this project, we also had to create a test plan through which our GUI must pass, as well as writing the whole project in a test driven manner.

I worked in a team with one other person to implement this project. This was another part of learning test driven development, where we took turns to write the tests and implement the classes. I wrote all of the GUI for this project.
Cargo Manager
A Cargo loading manager written to teach test driven development with GUIs.
uimg is a simple convenience application I wrote to save myself some time. It is very simple, but it has come in handy countless times since I wrote it. It takes an image that is currently on the clipboard, such as a screenshot, uploads it (via FTP) to my web hosting, and replaces the item on the clipboard with a url to the uploaded image. This especially comes in handy when chatting to someone and needing to show them a screenshot.

It is intended to be used by an application launcher such as Launchy or SlickRun (similar to Quicksilver on mac). In the above screenshot it is seen being launched by SlickRun.
uimg
A clipboard manipulator that replaces images with a url.
My Last.fm Activity Chart was a personal project which I created using the Last.fm Developer API (REST) because I wanted a good looking Last.fm chart for my deviantArt account, and the official provided charts did not fit my needs. Some of the features I implemented include:
  • List of the 10 most recently played tracks
  • Currently playing track (if any)
  • Weekly top 10
  • Randomly chooses between a set of 5 backgrounds
  • Caches that last 30 seconds to reduce server load
The project was written in PHP, and the page return in an image format, so the chart can be placed anywhere extremely easily. For example, here is the current live chart:

Last.fm Activity
A customized Last.fm chart using the Last.fm API.
The Online Alerts manager was an industry project which I completed at Uni. The aim of the web service was to upgrade old functionality that was previously handled with text documents. It performed the following main functions:

  • Allowed users to send new alerts
  • Allowed users to upload and parse the old format text files so their alerts can be input into the new database
  • Allowed users to browse alerts
  • Allowed users to search for alerts, and subscribe to a feed matching that search, so that every time an alert matching that search query was added, their feed was updated.


The project was implemented using C#, ASP.NET and Linq to SQL in conjunction with MS SQL.
Online Alerts
Web service for managing, adding, searching and sending alerts via RSS.
While at Creative Intersection I was given the opportunity to develop this colouring in app for Debbie Neale - an artist who creates beatufiul designs for kids to colour in. You can find it on the App Store under Click 'N' Colour or Click 'N' Colour Premium.
Click & Colour
Kids iPad app for colouring in designs.
After the floods hit Brisbane, my boss at Creative Intersection came up with the great idea of creating a site to aid small businesses in networking to share their assets and help each other recover. It came naturally, since we were already housing one of our clients after the CBD lost power for a few days.

On the technical side of things, the entire site was rapidly developed by myself and a designer over the course of two days. The backend was written on a LAMP stack, and the frontend was based on jQuery and Knockout.js.

Knockout is a front-end javascript data binding tool. I had been waiting for a chance to use it so when this opportunity presented itself, I jumped at the chance. It's used to handle the multi-select searching on the 'Find a Business' page, to template the data for each business into each one of those expandable boxes, and for the whole sign up and edit process. Using dependent observables makes it ludicrously easy to have tickbox to entirely change what search results were presented to the user. After this experience, I'm already working on a new project with knockout.
Save A Business
Business networking tool to aid recovery after the 2011 Brisbane Floods.
UberGloss was a final year uni project in a team of 5 people. I worked heavily on both the back and front ends. The task was to turn the given software (a very basic glossary with barely any interface, that handled word adding) into something more. We added the ability to browse the site as a guest, upvote/downvote definitions and translations, link words to other words, search for definitions, and cross reference large passages of text with the site's database. We totally redesigned the site, and added heavy social media aspects. Where the original system was just a glossary, we gave it mission, a purpose, social incentives and business model.

Behind the scenes, we incorporated Hibernate (the original software simply used inline SQL), and wrote a whole system allowing the frontend to communicate with the backend asynchronously. On the frontend we made many of the common tasks asynchronous, and generally improved the user experience.
Ubergloss
Glossary handling many languages, translations and cross referencing.
Another solo uni project, I came up with the idea for this Freelancing website aimed at the Australian market (this was before freelancer.com.au).

It is written from the ground up on a LAMP stack, with the front end using Prototype.

Feel free to explore it yourself, you can see a live version of the site at jonpacker.com/freelancemarket
Freelance Market
A fully-featured freelancer networking site.
I wrote all of the code for the iPhone and iPad version of this app for a client while at Creative Intersection.

It allows a spectator to track the location of a player on the field. At the end of the game, the user can view a slew of statistics based on the data recorded.

The app was originally written for iPad, and a well thought-out MVC implementation allowed us to easily extend to a universal app when the time came.
Coachbuddy
Soccer player tracking and statistics in a universal iOS app.
When Opera first released their developer preview allowing the addition of speed-dial extensions, I quickly wrote this. It displays your Twitter home timeline within your Opera speed dial.

This extension won the Opera Team-Up award for best speed dial extension.

It implements an OAuth Consumer in JavaScript, and consumes the Twitter REST api.

The preferences page was implemented using Knockout.js, which allowed me to bind the inputs on the page directly to the persistent extension settings.
Timeline
An award winning Opera speed-dial extension for Twitter.
This Opera speed-dial extension shows a local weather radar.

The way the data is retrieved is interesting. Since BOM (Australian public meteorology service) do not publish a generic API of any kind, I had to get creative.

Since I cannot do generic cross-domain ajax requests thanks to security restrictions, James Padolsey's Cross Domain Ajax library was used. This allowed me to scrape the web page, filter the data I needed using some regular expressions, and publish it on the page.

This is done every 30 seconds or so, to keep the feed up to date.

The settings page also uses some creative JavaScript--since some radars are spread over two states, they appear twice on the list. Thanks to the way I implemented the persistent preferences using Knockout JS, every element with a certain value attached to it is selected when one of them is. The end result means there's an elegant solution to one option appearing twice on a radio-style mutually exclusive list!
Radardial
Live Australian weather radars in your Opera speed-dial.
Beacon
Tromsøbrua and the Arctic Cathedral in Tromsø, Norway.
Temperate
A transition of seasons in Rovaniemi, Finland
Fall
Frosty colours over a lake on verge of freezing in late autumn.
Frost
Morning frost in Autumn in Rovaniemi, Finland
Kemijoki
The Kemijoki and the Jätkänkynttilä bridge in Rovaniemi, Finland
Vøringfossen
The Vøringfoss in Eidfjord, Norway.
Spectral
Reflections on the fjord from Samnanger, Norway
Into Saltfjellet
On the E6 heading into a freshly snowed Saltfjellet, Norway.
Nordland
On the E6, east of Rana, Norway
Samnanger Shed
A shed perched on a rock in Samnanger in Hordaland, Norway
Eidfjordsvatnet
Reflections on Eidfjordsvatnet in Norway.
Brisbane Under Fog
Sunrise from Mt Coot-tha in Brisbane, Australia - 3 shot panorama.
Stor Dragonheim
Bare cloven rock in Geirangerfjord, Norway
Dugurdsnatten
The mountain Dugurdsnatten and the river Hallingdalselve in Hallingdal, Norway
Tweed River
The Tweed River after sunrise in Northern Rivers, NSW, Australia
Overseer
The view from the top of Mt. Warning, in Northern Rivers, NSW, Australia
Atlanterhavsveien
Storseisundet Bridge on the Atlantic Highway, Norway
Lom Stavkirke
An 800 year old Stave Church in Lom, Norway
Under and Over
Train tracks piercing the rock in Hallingdal, Norway
Autumn Snow
Early snow in north Norway.
Korkea Jehkkas
The first Finnish fell that comes into view upon leaving Norway.
Eidfjord
From the ferry port of Brimnes on the Eidfjord, Norway
Saana
Saana from Kilpisjärvi, Finland
Isterdalen
Isterdalen valley from above Trollstigen, Møre og Romsdal, Norway
Vaattunkiköngäs
A trail near the Vaattunkiköngäs rapids north of Rovaniemi, Finland
Store Kongeriket II
Geirangerfjorden in Autumn, Norway
Store Kongeriket
Geirangerfjorden in Autumn, Norway
Kondolilla Forest
Picabeen Palms in the forest leading to the base of the Kondolilla Falls, north of Brisbane, Australia.
Kondolilla Forest 2
Kondolilla National Park, north of Brisbane, Australia
Fallen
A fallen tree in Kondolilla National Park, north of Brisbane, Australia
Kondolilla Forest 3
A waterfall in Kondolilla National Park, north of Brisbane, Australia
Still Life
Water droplets in the sunset from my home in Brisbane, Australia
Precipice
The view over the precipice of Queen Mary Falls, Main Range National Park, southwest of Brisbane, Australia
Lake Moogerah
Lake Moogerah and the northern ramparts of Main Range National Park, south west of Brisbane, Australia
Impact
The base of Queen Mary Falls, Main Range National Park, south west of Brisbane, Australia
Gorge
The precipice and following gorge into which Queen Mary Falls flows, Main Range National Park, southwest of Brisbane, Australia
Queen Mary Falls
Queen Mary Falls, Main Range National Park, southwest of Brisbane, Australia
Cedar Creek
The final waterfall and rock wall of Cedar Creek in the Samford Valley, north west of Brisbane, Australia
Coolangatta
Coolangatta beach on a January summer day. South of Brisbane on the Gold Coast, Australia
Bunya Rainforest
Flowing creek and forest in the rain at Bunya Mountains national park, west of Brisbane, Australia
Submerged
Deep in the rainforest on a wet December day, at Bunya Mountains national park, west of Brisbane, Australia
Misty Mountains
A low mist hanging over the forests atop the Bunya Mountains, west of Brisbane, Australia
O'reilly's
The view toward Main Range and Mount Barney national park from O'reilly's, in Lamington National Park, south of Brisbane, Australia. The prominent peak is Wilson's Peak.
Ferie
Milford Road, Eglington Valley, Fjordland National Park, New Zealand
Down with the Sun
Lake Pukaki, New Zealand
Mt Cook Evening
Mt Cook, Canterbury, New Zealand
Mt Cook
Mt Cook & the Tasman Valley, Canterbury, New Zealand
Milford Sound Morning
Milford Sound, New Zealand
Matka
Lake Hawea, New Zealand
Palette
Just outside Twizel, New Zealand
Muinaiset
Briksdal, Norway
Tristania Falls
Tristania Falls, Dorrigo, NSW, Australia
Bee & James
Wedding information website
Freelance Market
A modern web design for a Freelancing website I created as a project.
Tromsø Now
Weather monitoring iPad app.
RadarDial Preferences
Preferences page for the RadarDial Speed Dial extensions. Only image used was wood texture in the background.
WebcamViewer Prefs
Preferences page for the WebcamViewer Opera extension. Only image used is the background texture
If you need more detailed contact information such as my address, please email me.
phone +61421556967
phone (work) +67421556967
twitter @jdpacker
skype jonathan-packer
skype (work) creativeintersection-6
zerply jonpacker
linkedin Jon Packer
github jonpacker
facebook Jon Packer
500px jonpacker
flickr nrth
deviantart jonpacker
last.fm jonathan00
my opera jonpacker