The Canadian International Autoshow is an annual event held in Toronto, Canada. I developed a promotional mobile microsite for GNR8R in conjunction with AutoLife.

Initial visual designs were provided by a dedicated designer. Though lacking a back-end, I built the site to be dynamic, taking into account the user's date/time and timezone to avoid showing past events and ended prize draws while the show was running.

Furthermore, I was solely responsible for the visual and UX design of the map function and shuttle timetables. For the map I designed an clickable floor map in an abstract modern style to blend in with the previous designs, while for the shuttle timetables I used public transport timetables as a reference for communicating times clearly.

AutoLife is a Canadian automobile and lifestyle site created by GNR8R as an antidote to pre-existing sites which were seen as having a singular focus, being very sales-driven and lacking in transparency.

I was brought in take over front-end development from an offshore team, and to develop the motion design of the site, build new features and maintain existing features. As part of this process, I created functional prototypes of the animation and features and consulted with dedicated designers.

Following the launch of the MVP, I took a greater role in the design of new features, leveraging and extending the existing design language to lay out and build new pages.

From start to initial release, I was integral to the front-end development of an AngularJavascript adaptive online ordering site for the Australian national fast-food chain, Red Rooster.

In the first phase I took responsibility for the realisation of the tablet/desktop UI, developing a custom touch-driven menu and user-flow, separate from the mobile user-flow.

On the basis of my performance, I took over as primary front-end developer on the second half of the project, being responsible for diagnosing and implementing all front-end fixes and enhancements.

In partnership with Xequals, I have been developing a cross-platform mobile game called State Asset Wars. Inspired by the popular trading game Dope Wars, it puts a dark satirical spin on national and international politics.

On this project I have taken a leadership role, and have spearheaded UI design and development, while also providing creative direction on that front.

At my suggestion the game is being developed in Unity, for release across Android and iOS.

My second personal website, skeletonclock.digital was inspired in name and visuals by skeleton clocks - these are clocks where the ornamentation is provided by the innards and movements of the clock itself.

I designed the site as a stack of cards which is navigating using static arrow buttons and a set of tabs at the top of the page. Each card slides in or off from the side of the screen and contains a category of my works, which can be scrolled vertically just like any conventional page. I also included separate interstitial pages like plates in a book, as a canvas for interactive animations I had developed.

The whole site was built on the ASP.NET CMS Umbraco, with lots of modular Javascript on the front-end to manage transitions.

The design studio EightyOne came to me with the ambition to make an "award-winning" website for their client DOT.

The site would feature advanced interactive animations, page transitions and visual effects, while still being fully responsive and functional on mobile devices and older browsers.

Through the project, I was involved in the design process and made key contributions to the animation design, interactivity and usability.

Implementation was undertaken solely by me using a variety of web animation techniques and technologies including WebGL for 3D animation, CSS animation and Javascript-based SVG animation. The backend of the site is powered by Silverstripe CMS.

On behalf of Xequals, I oversaw the design and development of a responsive web app for Remarkit, an IT equipment recycling company.

Remarkit needed a portal for their clients, including major telecommunications businesses, to manage the reselling of refurbished devices such as smartphones and tablets.

As lead developer, I helped scope and was responsible for all front-end development, wireframing and some visual prototyping. The web UI was developed entirely by me using AngularJavascript, in liasion with a developer from Remarkit who built the back-end.

Key features of this app include ordering and order tracking, reporting and custom client theming. It is fully responsive, to be accessible both on-site and in the office.

In the absence of any tools on the market fulfilling their needs, EightyOne got me to design and develop a time management tool for OS X.

Specifically, they needed a simple yet powerful tool which would enable each of their employees and freelancers to easily track their time worked against any given job and upload timesheet entries to WorkflowMax.

Through ongoing discussions with the future users, I created wireframes and iterated functionality and layout to suit their needs.

The final application makes it easy for users to track just the jobs that are relevant to them, even when working with other applications. With just two clicks they can track time against a job. The application adapts to the user's workflow with a range of display and behaviour options, and automatically resolves network issues so the user does not need to worry about the backend.

Furthermore, I designed the aesthetics of the UI to be clean and simple with a view to the future, bridging the gap between the then-current version of OS X (Mavericks), and as-yet unseen subsequent iterations.

For a startup I was involved in (Spoink Games!), Hungry Piggies was redeveloped as a 2.5D Flash game designed to integrate with Facebook.

In this instance I was responsible for the bulk of the development work, as well as some UI design.

To develop my web design and development skills, but also to showcase the design projects I have completed, I built my first website.

Through this website I wanted to present the broad range of work I had done to that point, and convey my experience across the whole design-development continuum. I also specifically wanted the site to be fully responsive as is expected from a modern website, and to express some of my aesthetic sensibilities.

The site design went through several iterations, and was built from scratch in ASP.NET, together with HTML5, Javascript, and Sass/CSS for styling.

For my third personal website (this site), I decided to focus on modern simplicity and good typography, with simple, clean motion design. The idea was to put the focus on my projects rather than distract from them.

I chose to develop it using NextJs (a first for me), to gain the benefits of both server-side rendering and isomorphic React development. In addition, I learned react-spring to implement natural looking animations in a modern way.

For testing and documentation purposes, I created a Storybook. You can view the Storybook for this project here.