Cars and Jobs
I was engaged by GNR8R to completely redesign and rebuild carsandjobs.com, a Canadian national automotive jobs and education site.
The existing site featured a dated design and unfocused content that was hard to navigate and poorly mobile optimised. In consultation with a marketing expert, I was responsible for overhauling the visual design, structure and layout of the site. Rather than arrange the content from the automotive industry's POV, I divided the site into three main sections - For jobseekers, For students and For employers.
In addition, I was took charge of front-end development and directed an external team of back-end developers. The front-end was initially built against a mock API from which specifications were derived and documented for the back-end developers.
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.
Bridge was a startup developing a web app for tradesmen and contractors to manage their workflow. They contracted me as a front-end developer to help get them to MVP and beyond.
With my background in design, I was able to refine the look-and-feel of the existing codebase to bring it in line with the designers' vision, while adapting the designs where necessary and providing suggestions and feedback to the designers. In addition I worked with other front-end and back-end developers to fix bugs and build new features for launch.
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.
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.
DOT loves data
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.
EightyOne is a design and production studio with which I have had a long working relationship.
Due to my expertise in web and UX, I was involved early in the process of creating a website to represent them.
With my design input, they created visual layouts which I was then responsible for turning into a living, fully responsive website.
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.
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 Bag
In conjunction with iLuvNZ.co.nz and Buy NZ, the digital production studio Xequals wanted to build a Facebook game to promote New Zealand brands.
Xequals brought me on to be involved in all aspects of the design and development process.
The final game forms the basis of an active marketing campaign aimed at driving brand recognition and engagement, with the support of numerous local brands who contributed prizes for top players.
The production studio Prod required a new website as a point of contact with clients and potential clients. I helped them design and was responsible for implementing this site.
Due to the nature of their working partnerships it is not always possible to publicly present work they have done. So they decided to use the site to convey a sense of taste and open possibilities through the showcasing of interesting imagery. The site also included a secure area for clients to log in and view the progress of jobs for which the studio was performing work. For this I was responsible for both the UI design and implementation.
For this I implemented and laid out the functionality for displaying a different image and text each day of the week. And through the use of dynamic CSS and SVG graphics, I provided the means to coordinate the colour scheme of the site with the imagery, right down to the colour of the company logo.
Team Sports Australasia
Team Sports Australasia is a Nike sportswear distributor for the Australian and New Zealand markets.
I was responsible for implementing a new website design for them, from provided visuals.
This website build was deployed to form both the Australian and New Zealand websites. The finished Australian site in particular was commended by Nike itself as a model distributor website.
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.
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.