John Campbell Logo

web developer · photographer

Front-End Web Development

The world of web design and user-interface has gone up a few gears since the introduction of mobile devices. Websites and web apps used to be static documents that catered to the most common desktop monitor displays, and many still are. But when you consider that tablets and phones constitute upwards of 30% of web-browsing, it’s clear that responsive design has become the standard.

Responsive design and web development, to me, is about using all available front-end technologies to detect features of the device you’re using, and enhancing your experience in a way that takes full advantage of those features.

I make use of HTML, CSS, and Javascript to create clean, intuitive front-end web experiences. I also tend to flesh out my coding with the use of Javascript libraries (eg. jQuery), PHP, Wordpress CMS functionality, and some database work using MySQL.

My stongest focus, because it presents the most functional front-end opportunities, is Javascript. I started out by making my own slider plugins, and went on to other things, like parallaxing, user-intent, and other custom user experiences.

My Work

Publishers Hotel

Publishers Hotel website

Publishers Hotel needed a CMS based website to showcase their restaurant and wine bar. The CMS allows them to create and manage events for the restaurant, easily change their food and drinks menus, and update their contact details.

I developed the front-end in plain HTML, and converted it to a Wordpress theme thereafter, integrating it with the Wordpress back-end features and plugins. Plugins include Gravity Forms and Advanced Custom Fields.

In addition to coding, I also did the photography for the site, including editing.

Jayco Australia

Jayco Australia website

Jayco is Australia's leading caravan brand, and commands roughly 40% of the RV market. They were in need of a brand refresh, and I was part of the development team that created their new CMS driven website. The website can be updated via an admin interface, with more than 50% of the content being editable.

I was involved primarily with the interactivity and javascript functionality of the site. I also assisted with some of the CMS integration, web page creation, and styling.

Technologies I used in development were HTML, SASS, JS & jQuery, some PHP and MySQL, and Git.

Classic Timber Furniture

competition landing page

Classic Timber furniture needed a series of landing pages and online competitions to better engage its online audience. This particular campaign was a competition used to encourage prospective consumers to sign up to a newsletter, in order to grow the business' email database. Liking their Facebook page was encouraged during the process, resulting in a 50% conversion rate (that's high).

I created the site using current front-end coding languages, and as always, made sure it resolved well accross all devices. I also integrated the signup with a MySQL database, which was used to store the entrants' details.

Victorian National Party

Victorian National Party website

The Victorian National Party needed a new website that would sell their brand in a way that engenders trust and identifies with their audience. They also needed a CRM that allowed them to manage their members, volunteers, news, and donations in a more effective way.

I developed the website as a plain HTML website, including all the interactive and responsive aspects. From there, a back-end developer converted the site to a Nationbuilder theme, and wired up all the back-end functionality. From there, I assisted with final QA and modifying some of the Nationbuilder theme elements.

This site, as with all of these examples, is fully responsive.

Unipolar Water Technologies

Unipolar Water website

Unipolar Water needed a new website to promote their technology in a way that caters to both the scientifically savvy, and those who are more interested in the benefits of the technology as regards their own industry.

I managed a front-end coder who did all the front-end markup and styling. Once he was finished, I set about creating all the interactivity and animation on the site, some of the responsive elements, and performance optimising.

Fork me on GitHub