Responsive web design/dev

These sites are listed in reverse chronological order, with the most recent at the top.

Case studies in this category

Reno Man Construction

Reno Man Construction

Website: renomanconstruction.co.nz
Client: Chris Routhan
Dates: May 2023, with ongoing support afterwards
My professional status: independent web designer/developer

Chris Routhan is a friend of mine - we're in the same band - and he's a self-employed builder by trade. He had looked at a few other Wellington builders' websites and knew that he wanted a very simple site - probably just a WordPress one-pager - to showcase what he does and the services he provides, and to give potential clients an easy way to get in touch with him.

I changed various aspects of our selected WordPress theme design and then built, content-loaded, proof-read and tested the website, selecting and optimising the photographic imagery from Chris's own collection, and organised webhosting. I also wrote most of the content myself. I now provide Chris with ongoing support and updates as required. Find out more about the Reno Man Construction project

Categories: Scoping/pitching/quoting, Client liaison, Project manager, IA & UX, Website designer, Front-end developer, Writing for the web, Content-loader, Responsive web design/dev, CSS-based layout, CSS3, HTML5, WordPress, Small sites

MPI - PBI

MPI - PBI

Website: piersearch.mpi.govt.nz/plants-biosecurity-index
Client: Ministry for Primary Industries
Dates: July - October 2022 launch date. Post-launch upgrades October 2022 - January 2024
Government status: Government Ministry
My professional status: contractor at MPI

I designed and built a series of web-based applications and tools within the biosecurity sphere for the Ministry for Primary Industries, under the umbrella of the PIER (Product Import and Export Requirements) project.

At the last minute we were asked to redesign and rebuild the Plants Biosecurity Index (PBI) and integrate it into SilverStripe, to be launched at the same time as the updated ONZPR and new PIER Search tools. The PBI is a searchable database of over 30,000 plant species that provides information on whether each species can be imported into New Zealand as seeds or nursery stock.

I was responsible for the UX consultation and design, responsive web design, front-end development, browser and device testing, e-government compliance and accessibility, proofreading, post-integration testing and QA. I also wrote the microtext, introductory text, and help text across all pages and templates, and produced a "naming conventions" document, in which I reviewed and standardised various text elements common to all pages across all four new tools in the PIER family. Find out more about the MPI - PBI project

Categories: IA & UX, Website designer, Front-end developer, Writing for the web, Responsive web design/dev, CSS-based layout, CSS3, HTML5, e-govt/WCAG compliance, SilverStripe, Government websites, Large sites

MPI - ONZPR in SilverStripe

MPI - ONZPR in SilverStripe

Website: onzpr.mpi.govt.nz
Client: Ministry for Primary Industries
Dates: April - October 2022 launch date. Post-launch upgrades October 2022 - January 2024
Government status: Government Ministry
My professional status: contractor at MPI

I designed and built a series of web-based applications and tools within the biosecurity sphere for the Ministry for Primary Industries, under the umbrella of the PIER (Product Import and Export Requirements) project.

In June 2020 we had launched our first application - the Official New Zealand Pest Register or ONZPR. In 2022 we updated the ONZPR and integrated it into the SilverStripe CMS to join PIER Search, which was being designed and built at the time. The ONZPR is a searchable database of almost 25,000 pests and pathogens relevant to New Zealand.

I was responsible for the UX design, responsive web design, front-end development, cross-browser and mobile device testing, e-government compliance and accessibility, and post-integration testing and QA. I was also responsible for writing the microtext, introductory text, and help text across all pages and templates. Find out more about the MPI - ONZPR in SilverStripe project

Categories: IA & UX, Website designer, Front-end developer, Writing for the web, Responsive web design/dev, CSS-based layout, CSS3, HTML5, e-govt/WCAG compliance, SilverStripe, Government websites, Large sites

MPI - PIER Search

MPI - PIER Search

Website: piersearch.mpi.govt.nz
Client: Ministry for Primary Industries
Dates: January 2020 - October 2022 launch date. Post-launch upgrades October 2022 - January 2024
Government status: Government Ministry
My professional status: contractor at MPI

I designed and built a series of web-based applications and tools within the biosecurity sphere for the Ministry for Primary Industries, under the umbrella of the PIER (Product Import and Export Requirements) project.

The core product in Phase 1 of the PIER project is PIER Search. This online search tool enables users to find NZ import and export requirements for a range of commodities and countries.

I was responsible for the UX design, responsive web design, front-end development, cross-browser and mobile device testing, e-government compliance and accessibility, some content-loading and CMS training, and post-integration testing and QA. I was also responsible for writing the microtext, introductory text, and help text across all pages and templates. Find out more about the MPI - PIER Search project

Categories: IA & UX, Website designer, Front-end developer, Writing for the web, Content-loader, Responsive web design/dev, CSS-based layout, CSS3, HTML5, e-govt/WCAG compliance, SilverStripe, Government websites, Large sites

MPI - ONZPR

MPI - ONZPR

Website: onzpr.mpi.govt.nz (site updated in 2022)
Client: Ministry for Primary Industries
Dates: September 2019 - June 2020
Government status: Government Ministry
My professional status: contractor at MPI

I designed and built a series of web-based applications and tools within the biosecurity sphere for the Ministry for Primary Industries, under the umbrella of the PIER (Product Import and Export Requirements) project.

Our first application was the Official New Zealand Pest Register or ONZPR. The ONZPR is a searchable database of almost 25,000 pests and pathogens relevant to New Zealand, and includes general information about each pest, as well as specific details for researchers, importers, exporters and the general public.

I was responsible for the UX design, responsive web design, front-end development, cross-browser and mobile device testing, e-government compliance and accessibility, and post-integration testing and QA. I also wrote the microtext, introductory text, and help text across all pages and templates. Find out more about the MPI - ONZPR project

Categories: IA & UX, Website designer, Front-end developer, Writing for the web, Responsive web design/dev, CSS-based layout, CSS3, HTML5, e-govt/WCAG compliance, ASP or ASP.NET, Government websites, Large sites

NZNO - Kai Tiaki

NZNO - Kai Tiaki

Website: kaitiaki.org.nz (site has since been modified)
Client: New Zealand Nurses Organisation
Dates: June 2016 - June 2019 and December 2019 - March 2022
My professional status: web consultant with The Hive Creative

The New Zealand Nurses Organisation is a workers' union representing more than 55,000 nurses and health workers, and is the leading professional body of nurses in Aotearoa New Zealand. They first approached The Hive Creative in 2016, asking for advice on how best to convert their monthly printed journal, Kai Tiaki, into an online PDF for members.

In December 2019 we were invited to design, build and content-load an issue-based WordPress site that mirrored the print version of the journal. The latest issue would be uploaded to the site and published each month at the same time as the print version came out. The website would be accessible via login to members, with the news articles accessible to everyone. Member organisations would have an IP address-based login system for their employees.

I was responsible for the selection and re-styling of the WordPress theme and associated plugins, CSS3, some PHP wrangling, building the site, site hosting management, browser and device testing, writing help pages and technical documentation, QA and client support; and content-loading, web editing and proof-reading for the first year of publication.

I replicated the design exactly by adding my own set of CSS stylesheets to the build, and extending these styles for page layout and customised formatting to match the needs of each new issue.

I formatted some quite complex pages of content (generally the monthly features and nursing training pages) which included responsive tables, pullquotes, multi-column layouts and other highlighted blocks of special content - and created new CSS styles to use with these as required. I also figured out the best responsive behaviour and created a new set of styles each time a table was used to display tabular data in an article (each one was unique).

We produced an absolutely beautiful and pixel-perfect online journal every month for the first year of publication, getting everything done exactly right, following my very comprehensive style guide for the editing team, and making sure every macron was in place, every t crossed and i dotted. We published the online issue just a day or so after the print edition went out to members each month. Find out more about the NZNO - Kai Tiaki project

Categories: Front-end developer, Writing for the web, Content-loader, Webmaster, Responsive web design/dev, CSS-based layout, CSS3, HTML5, e-govt/WCAG compliance, WordPress, Large sites

MacDiarmid Institute

MacDiarmid Institute

Website: macdiarmid.ac.nz
Client: The MacDiarmid Institute
Dates: January - March 2017 and August 2018 - July 2019 with ongoing support after launch
Government status: Centre of Research Excellence (CoRE)
My professional status: independent web designer/developer

The MacDiarmid Institute for Advanced Materials and Nanotechnology is one of New Zealand's oldest Centres of Research Excellence (CoREs). It brings together almost 100 research investigators along with graduate and PhD students from seven institutions across Aotearoa. Their research focus is materials science and new technology, especially the unexplored territory where chemistry, physics, biology and engineering meet.

Their existing website was old, messy, out-of-date and hard to maintain. The navigation architecture wasn't well organised and it had become difficult for visitors to find the information they were looking for. It was time for a new website with a new logical architecture and a much stronger focus on the institute's researchers, with the majority of the pages being re-written prior to launch. We also wanted to migrate and incorporate news articles and magazine items from the old site, as much of this content was valuable as an ongoing archive of the Institution's research projects and progress.

I was responsible for the initial proposal and quote, client liaison, project management, information architecture and UX design, responsive design development and front-end development, browser and device testing, content-loading, post-integration testing, QA, proof-reading, web editor training and ongoing support. I loaded all 800 pages of new content with the help of my developer, and reformatted over 500 news articles migrated from the old site. Find out more about the MacDiarmid Institute project

Categories: Showcase sites, Scoping/pitching/quoting, Client liaison, Project manager, IA & UX, Website designer, Front-end developer, Writing for the web, Content-loader, Responsive web design/dev, CSS-based layout, CSS3, HTML5, jQuery/JavaScript, e-govt/WCAG compliance, SilverStripe, Government websites, Large sites

Bloomsbury Associates

Bloomsbury Associates

Website: bloomsbury.co.nz
Client: Bloomsbury Associates
Dates: February - July 2018, with ongoing webmaster support after delivery
My professional status: independent web designer/developer

Bloomsbury Associates is an independent financial advisory practice established to provide investment services to clients in New Zealand. In 2010 I designed and built their first website, and have been taking care of it ever since. An office relocation in 2018 combined with a redesign of their logo and branding was the perfect opportunity to create a new, responsive website for them.

All the content was new, written especially for the website by Matai Partners. I liaised with them and together we worked on creating the perfect marriage of website design and content for the new site, taking inspiration from the new logo, typeface and branding colours from Scratch Design.

I was responsible for the initial quote, client liaison, project management, scoping, information architecture, responsive design and front-end development, building the completed website, content-loading, editing, testing, proof-reading, QA and ongoing support. There's no CMS - we don't need one - instead, I code all the content by hand.

I am the webmaster for the site, providing updates as required and have also redesigned and developed new HTML emails using Campaign Monitor, which are sent out quarterly to the company's clients. Find out more about the Bloomsbury Associates project

Categories: Scoping/pitching/quoting, Client liaison, Project manager, IA & UX, Website designer, Front-end developer, Writing for the web, Content-loader, Webmaster, Responsive web design/dev, CSS-based layout, CSS3, HTML5, jQuery/JavaScript, HTML email, Dreamweaver templates, No CMS, Small sites

TradeMe

TradeMe

Website: trademe.co.nz
Client: TradeMe
Dates: October 2017 - March 2018
My professional status: contractor at TradeMe

TradeMe has spent the last couple of years working on a new responsive website to replace their current arrangement of separate mobile and desktop sites, with the design teams working on a redesign of the look and feel of the website at the same time.

The new site was initially available to the public as a Preview version, and the TradeMe team actively solicited feedback from their users, so that they could make improvements to the new site on an ongoing basis. The new site is built in AngularJS by the back-end dev team, with the front-end devs working on templated elements within pages that contain a combination of Angular and HTML5.

TradeMe wanted some help getting their latest set of updates to a point where they could be added to the live Preview site, and took on myself and two other contractors for six months to help them get there.

I was responsible for HTML5 and CSS3 coding, as well as peer reviews, accessibility compliance, browser and device testing, and bug-fixing. I began as a member of the Tangram Squad, responsible for building individual elements that could be re-used on multiple pages within the site. After two months I switched to the Design Vision team, where we worked on whole example pages, tweaking and improving on the design and functionality of individual elements in situ. Find out more about the TradeMe project

Categories: Showcase sites, Front-end developer, Govt web standards tester, Responsive web design/dev, CSS-based layout, CSS3, HTML5, e-govt/WCAG compliance, Other CMS, E-commerce, Large sites

Wild Workouts

Wild Workouts

Website: wildworkouts.co.nz (site has since been redesigned)
Client: Karen at Wild Workouts
Dates: October 2017 - January 2018, with ongoing webmaster support until 2020
My professional status: independent web designer/developer

Wild Workouts is an outdoor health and fitness company run by Duck Patten and Karen van Rensburg. They take fitness outside and make it fun. They have been providing training in Wellington’s wild weather since the start of 2010, and are located out and around Wellington as a mobile training outfit.

They had an existing responsive themed WordPress website built for them a few years ago, which had become a bit messy. It needed a tidy-up and for some of the pages to be redesigned and rebuilt so that they looked nicer and were more user-friendly. They also needed some out-of-date content to be updated and changed.

They asked me if I'd be willing to maintain and develop their website - migrating the site to my web host and then taking over as webmaster. Find out more about the Wild Workouts project

Categories: Scoping/pitching/quoting, Client liaison, Project manager, Website designer, Front-end developer, Content-loader, Webmaster, Responsive web design/dev, CSS-based layout, CSS3, HTML5, WordPress, Small sites

NZ Association of Economists

NZ Association of Economists

Website: nzae.org.nz
Client: Anthony Byett at NZAE
Dates: September 2017 - January 2018, with ongoing webmaster support after delivery
My professional status: independent web designer/developer

The New Zealand Association of Economists was founded in 1959 and promotes collaboration and discussion among professional economists in New Zealand. The organisation encourages and publishes research and disseminates information on research projects. It promotes the profession of economics in New Zealand and fosters interest in and understanding of New Zealand's economic problems.

They had an existing responsive themed WordPress website built for them a few years ago, which had become a bit messy. It needed a tidy-up and for some of the pages to be redesigned and rebuilt so that they looked nicer and were more user-friendly. There was also some missing content which needed locating and restoring, and some new plugins and widgets to be added.

They asked me if I'd be willing to work with their editor to maintain and develop their website - migrating the site to my web host and then taking over as webmaster. Initially Anthony requested a number of improvements and alterations to the site, and since then we have continued to work together on whatever updates and additions are required. Find out more about the NZ Association of Economists project

Categories: Scoping/pitching/quoting, Client liaison, Project manager, Website designer, Front-end developer, Webmaster, Responsive web design/dev, CSS-based layout, CSS3, HTML5, WordPress, Large sites

New Zealand Kindergartens

New Zealand Kindergartens

Website: nzkindergarten.org.nz
Client: New Zealand Kindergartens
Dates: June 2017 – March 2018
My professional status: web consultant with The Hive Creative

New Zealand Kindergartens is a not-for-profit Incorporated Society and registered charity, governed by a board made up of elected and appointed members. NZK currently represents 14 local Kindergarten Associations. Collectively their members educate and care for more than 7,000 children who participate at 161 kindergartens and six centres, supported by 169 head teachers, 22 senior teachers, and more than 835 class teachers.

In 2017 Hive Creative (formerly Insight Consultants Ltd) designed a beautiful Annual Report for New Zealand Kindergartens. They decided it was time for a new website, and asked that it be designed along the same lines as the Annual Report. Hive asked me to join the project as their web consultant.

I was responsible for the selection and re-styling of the WordPress theme and associated plugins, some PHP wrangling, building the site, site hosting management, browser and device testing, member and board member login system, content-loading, QA, proof-reading and client support, and CMS training. I trained Jo Newth at NZK how to use the WordPress CMS and then worked with her to content-load the whole website before launch, which I also proof-read.

Initially the website was designed and built with a two-tiered member login system, allowing access to the members-only section for members, and also to the board members' section for board members. Find out more about the New Zealand Kindergartens project

Categories: Front-end developer, Writing for the web, Content-loader, Responsive web design/dev, CSS-based layout, CSS3, HTML5, WordPress, Medium sites

Marlborough Vintners

Marlborough Vintners

Website: no longer online
Client: Acumen Republic
Dates: April - July 2017, with ongoing webmaster support until 2022
My professional status: contractor at Acumen Republic

The Marlborough Vintners Hotel (MVH) was a Heritage Collection luxury boutique hotel located amongst the vineyards near Blenheim in the heart of Marlborough wine country. The hotel consisted of 16 one-bedroom suites overlooking vineyards and gardens, together with the on-site Vintners Room Restaurant. Marlborough Vintners Hotel hosted conferences and weddings as well as providing luxury guest accommodation. Their brand management company was Wellington-based firm Acumen Republic.

Acumen asked me to build a responsive WordPress website for MVH, based on an existing WordPress theme in order to save time and keep the costs down. Acumen selected the theme based on MVH's requirements, and I built, content-loaded and tested the website, optimised the photographic imagery supplied by MVH, changed various aspects of the design, and organised webhosting. I also provided Acumen and, later, MVH staff with WordPress training and ongoing webmaster support and website updates. Find out more about the Marlborough Vintners project

Categories: Scoping/pitching/quoting, Client liaison, Project manager, Website designer, Front-end developer, Writing for the web, Content-loader, Webmaster, Responsive web design/dev, CSS-based layout, CSS3, HTML5, WordPress, Small sites

TEAM Asparona

TEAM Asparona

Website: no longer online
Client: James Fowler
Dates: January - April 2017, with ongoing support until 2020
My professional status: independent web designer/developer

TEAM Asparona was a cloud-based Enterprise Information Management (EIM) company. Their main product was an EIM ecosystem called ContentWorX.

TEAM Asparona's in-house IT staff had begun the build of a new responsive themed WordPress website, and they wanted help to get it finished and launched as quickly as possible. Their GM James Fowler contacted me to see if I could help, and between us we came up with a list of tasks to complete within a fixed-price budget and tight timeline.

I was responsible for reviewing the site, migrating it to my WP hosting platform, tidying up the homepage, populating some pages and reformatting others, adding some new sections to the site - and generally preparing it for launch. After the successful launch I sorted out an SSL Certificate for the site so that we could transfer to an https URL. On a day-to-day level James managed the site, but I was always available to help with anything tricky, as required. Find out more about the TEAM Asparona project

Categories: Scoping/pitching/quoting, Client liaison, Project manager, Website designer, Front-end developer, Writing for the web, Content-loader, Responsive web design/dev, CSS-based layout, CSS3, HTML5, WordPress, Small sites

Vision Wallcoverings

Vision Wallcoverings

Website: no longer online
Client: Vision Wallcoverings
Dates: December 2016 - June 2020
My professional status: independent web designer/developer

Having become the webmaster for New Zealand wallpaper company Aspiring Walls nine months earlier, in December 2016 I was invited to look after the website of their sister company in Australia, on which the Aspiring Walls website is based. Vision Wallcoverings had been supplying wallpaper products to the Australian market for over 40 years and had one of Australia’s largest ranges of wallpapers and murals designed for both domestic and commercial settings.

The Australian dev company that originally built both sites would remain responsible for any dev work that needed doing, while I would take over as webmaster, responsible for the day-to-day care of the website including all of the e-commerce product updates. Being responsible for updates across both sites meant that I could re-use elements such as product images, saving both companies time and money. Find out more about the Vision Wallcoverings project

Categories: Client liaison, Project manager, Content-loader, Webmaster, Responsive web design/dev, CSS-based layout, CSS3, HTML5, WordPress, E-commerce, Large sites

Transpower GOL

Transpower GOL

Website: internal Transpower access only
Client: Transpower
Dates: June 2016 - March 2017
Government status: State-Owned Enterprise
My professional status: contractor at Transpower

Transpower’s Grid Operators who manage the National Grid were using an old application that had been co-opted from another team and wasn’t entirely fit for purpose in its new environment. They wanted a new custom-made application – based on the original but reinvented to match exactly what they needed. They felt it would be useful to have a UX designer on the team, to help them figure out how to turn their requirements into reality. Several processes had to be integrated with other Transpower applications, sharing and updating information/data between apps, which added another layer of complexity to the project.

I was responsible for information architecture, UX consultation and design, wireframes and schematics (keeping these updated on an ongoing basis), responsive application design, and front-end development of the application screens. I collaborated and consulted closely with the developer, working on the integrated application within Visual Studio once she had built the app, then did post-integration testing and QA. I also helped the BA to maintain and update the requirements.

The project was carried out within an Agile work environment. The process was highly consultative, with expert opinions being sought daily from our two SMEs (Grid Operators from Auckland and Christchurch) and also from the rest of the team, particularly our BA, our chief tester, our developer, and our system integration and security specialist. Find out more about the Transpower GOL project

Categories: IA & UX, Website designer, Front-end developer, Responsive web design/dev, CSS-based layout, CSS3, HTML5, ASP or ASP.NET, Government websites, Small sites

Major Consulting

Major Consulting

Website: majorconsulting.co.nz (site has since been redesigned)
Client: Shelley Major
Dates: April - December 2016, with ongoing support until December 2018
My professional status: independent web designer/developer

Major Consulting Group (MCG) is a Wellington-based health and safety consultancy working with clients across New Zealand and in Australia in a variety of sectors, making a difference to health, safety and organisational performance. They provide a range of assurance and safety culture audits as well as practical assistance, tailoring enduring health and safety business processes for their clients.

They asked me to quote for a responsive WordPress website, based on an existing theme in order to save time and keep the costs down. Their director and I selected the theme together, based on their requirements, and I built, content-loaded and tested the website, selected all the photographic imagery from iStock, changed various aspects of the design, and organised webhosting. I also provided MCG staff with WordPress training and ongoing support. Find out more about the Major Consulting project

Categories: Scoping/pitching/quoting, Client liaison, Project manager, IA & UX, Website designer, Front-end developer, Writing for the web, Content-loader, Responsive web design/dev, CSS-based layout, CSS3, HTML5, WordPress, Small sites

Education New Zealand

Education New Zealand

Website: enz.govt.nz (site design has been updated)
Client: Education New Zealand
Dates: April - June 2016
Government status: Crown Entity
My professional status: contractor at Touchcast

Education New Zealand wanted their existing website to be migrated to the SilverStripe CMS, together with a design refresh at the same time.

Touchcast were invited to design and develop the new responsive website, and I was asked to join the team for a few weeks to carry out the front-end development for the site, working alongside the SilverStripe developer.

I was responsible for building the HTML and CSS for the new designs, using SASS (SCSS) as my pre-processor and Bootstrap as my framework. I was also responsible for preparing the page elements as re-usable twigs which we set up to auto-create the HTML templates, ready for the developer to integrate into SilverStripe. Find out more about the Education New Zealand project

Categories: Front-end developer, Responsive web design/dev, CSS-based layout, CSS3, HTML5, e-govt/WCAG compliance, SilverStripe, Government websites, Medium sites

Aspiring Walls

Aspiring Walls

Website: aspiringwalls.co.nz
Client: Aspiring Walls
Dates: March 2016 onwards
My professional status: independent web designer/developer

Wellington-based company Aspiring Walls has been supplying wallpaper products to the New Zealand market for over 40 years.They have one of New Zealand’s largest ranges of wallpapers and murals designed for both domestic and commercial settings, sourced from producers worldwide and supplying an extensive network of retail stockists nationally.

They were just about to launch a new responsive WordPress website that was based on one done for a sister company in Australia by an Australian dev company. They were looking for a New Zealand-based webmaster to take care of the website and asked if I'd be interested, based on my extensive WordPress and e-commerce experience. I am responsible for arranging and managing hosting; adding and removing product ranges; and improving design, layout, functionality and formatting as required. Find out more about the Aspiring Walls project

Categories: Client liaison, Project manager, Content-loader, Webmaster, Responsive web design/dev, CSS-based layout, CSS3, HTML5, WordPress, E-commerce, Large sites

OFLC (2016)

OFLC (2016)

Website: classificationoffice.govt.nz (site has since been redesigned)
Client: Office of Film & Literature Classification
Dates: September 2015 - April 2016, with ongoing support until December 2021
Government status: Government Agency
My professional status: independent web designer/developer

I built a new version of the Information for Students site in 2015 for the Office of Film & Literature Classification, which left their main website looking a little tired and outdated. The next project was therefore to design and build a new responsive version of the main site.

I was responsible for client liaison, project proposal and quote, project management, scoping, information architecture, wireframes and schematics, responsive design and front-end development, HTML5, CSS3, LESS, jQuery, e-govt accessibility compliance, QA, client training and ongoing support, content coding, formatting and loading, some content writing and editing (Dreamweaver templates). Find out more about the OFLC (2016) project

Categories: Scoping/pitching/quoting, Client liaison, Project manager, IA & UX, Website designer, Front-end developer, Govt web standards tester, Writing for the web, Content-loader, Responsive web design/dev, CSS-based layout, CSS3, HTML5, jQuery/JavaScript, e-govt/WCAG compliance, Dreamweaver templates, Government websites, Medium sites

Grosvenor KiwiSaver

Grosvenor KiwiSaver

Website: in-house online forms, not available to the public
Client: Grosvenor KiwiSaver
Dates: October - November 2015
My professional status: independent web designer/developer

Grosvenor Investment Management Limited is one of the Government's official KiwiSaver providers, with a dedicated KiwiSaver website to cater for their 94,000 members. They wanted to prototype a complete online joining/transfer process, which would initially be used by their KiwiSaver advisers, and which could be rolled out to all users on the website at a later date.

They asked me if I could help them to wireframe and design the various pages and screens that would be required (responsive design), and then to build these ready for integration by their in-house developers. I ended up working alongside the developer as we restyled his .asp forms together. Find out more about the Grosvenor KiwiSaver project

Categories: Scoping/pitching/quoting, Client liaison, Project manager, IA & UX, Website designer, Front-end developer, Responsive web design/dev, CSS-based layout, CSS3, HTML5, ASP or ASP.NET, E-commerce, Small sites

Beer Belly Jellies

Beer Belly Jellies

Website: no longer online
Client: Lindy MacLennan
Dates: September - October 2015, with ongoing support until December 2017
My professional status: independent web designer/developer

Beer Belly Jellies was a small business creating craft beer jellies, handmade with New Zealand craft beer. They had had a responsive themed WordPress website built for them a couple of years earlier, which had become a bit messy. It needed a tidy-up and for some of the pages to be redesigned and rebuilt so that they looked nicer and were more user-friendly.

They asked me if I'd be willing to help by identifying some "quick wins" that would improve the look and functionality of the site within a limited number of hours of work. I was responsible for improving the design, layout and formatting of the website. Find out more about the Beer Belly Jellies project

Categories: Scoping/pitching/quoting, Client liaison, Project manager, Website designer, Front-end developer, Writing for the web, Content-loader, Responsive web design/dev, CSS-based layout, CSS3, HTML5, WordPress, E-commerce, Small sites

BookerMartin Comms

BookerMartin Comms

Website: no longer online
Client: Frances Martin and Mike Booker
Dates: August - November 2015
My professional status: independent web designer/developer

I met Frances Martin through the webmaster work I did for the Zero Harm website. Frances and her business partner Mike Booker needed a website for their communications company, BookerMartin Communications. They do communications work for both business and government, and wanted a very simple, minimal, responsive website that they could update themselves.

They asked me to quote for a single-page website, based on an existing WordPress theme in order to save time and keep the costs down. Mike and I selected the theme together, based on their requirements, and I built and tested the website, improved various aspects of the design and organised webhosting. Find out more about the BookerMartin Comms project

Categories: Scoping/pitching/quoting, Client liaison, Project manager, IA & UX, Website designer, Front-end developer, Writing for the web, Content-loader, Responsive web design/dev, CSS-based layout, CSS3, HTML5, WordPress, Small sites

Education Council

Education Council

Website: no longer online
Client: Education Council
Dates: May-July 2015, November 2015
Government status: Independent statutory body
My professional status: Web consultant with Insight Consultants Ltd

In 2015 the New Zealand Teachers Council was re-structured, re-named and re-branded and became the Education Council of Aotearoa New Zealand. Insight Consultants has been working with the NZ Teachers Council for many years, and designed the new branding and identity for the Education Council. They also provided a new design for the existing website, and were asked to oversee the website re-skinning process that was carried out by another web design/dev company.

I was asked by Chris Payne, Insight's Director, to work alongside his team as their resident web consultant. Initially they asked me to sort through the 800+ PDF and image files on the website, updating some of these with the new logo/branding. I also provided advice on meta-tagging in relation to internal search engine optimisation, reviewed the progress of the web design company that was re-skinning the website, created a master sitemap and advised them on best practice for the FAQs section. Find out more about the Education Council project

Categories: Client liaison, IA & UX, Responsive web design/dev, CSS-based layout, Drupal, Government websites, Large sites

Zero Harm

Zero Harm

Website: zeroharm.org.nz (site has since been redesigned)
Client: Business Leaders’ Health & Safety Forum
Dates: February 2015 - November 2020
My professional status: independent web designer/developer

The Business Leaders’ Health and Safety Forum is a coalition of business and government leaders committed to improving the performance of workplace health and safety in New Zealand. Their vision is all business leaders passionately committed to achieving Zero Harm Workplaces. They needed a new webmaster to take care of their website, and approached me after a personal recommendation from one of my other clients.

I am responsible for regularly updating their responsive website, creating and removing pages, content-loading, making graphics, and editing/proofreading content. I am also responsible for doing a full content audit of the website and, to review the website IA with a view to updating and improving it. I will also be doing a similar review of the homepage to see if that can be improved, and re-designing and re-building it if necessary. I'm also responsible for social media consultation, helping the organisation to decide what social media to use and how to use it. Find out more about the Zero Harm project

Categories: Client liaison, Project manager, IA & UX, Website designer, Front-end developer, Writing for the web, Content-loader, Webmaster, Responsive web design/dev, CSS-based layout, CSS3, HTML5, jQuery/JavaScript, SilverStripe, Medium sites

OFLC - info for students

OFLC - info for students

Website: no longer online
Client: Office of Film & Literature Classification
Dates: October 2014 - March 2015 and June-July 2015, with ongoing support after delivery
Government status: Government Agency
My professional status: independent web designer/developer

The OFLC had contracted a young designer to redesign their information for students website which I had originally designed and built for them back in 2010. Following completion of the design, the OFLC team decided that they needed to have a responsive website rather than a static one. I was invited to make the design responsive and then build the new Dreamweaver templates.

I was responsible for client liaison, project proposal and quote, project management, scoping, information architecture, wireframes and schematics, design development, responsive design and development, HTML5, CSS3, LESS, jQuery, e-govt accessibility compliance, QA, client training and ongoing support, content coding, formatting and loading, some content writing and editing (Dreamweaver templates). Find out more about the OFLC - info for students project

Categories: Scoping/pitching/quoting, Client liaison, Project manager, IA & UX, Website designer, Front-end developer, Govt web standards tester, Writing for the web, Content-loader, Responsive web design/dev, CSS-based layout, CSS3, HTML5, jQuery/JavaScript, e-govt/WCAG compliance, Dreamweaver templates, Government websites, Medium sites

BNZ Community

BNZ Community

Website: no longer online
Client: Bank of New Zealand
Dates: September - December 2014
My professional status: contractor at the Bank of New Zealand

The Bank of New Zealand was nearing completion with their Community web project - an interactive community/forum for BNZ customers, hosted within the main BNZ website. They needed someone to finish it off, tidy it up, and get it over the line.

I was originally asked to join the in-house web team for four weeks to carry out the front-end development, and my contract was eventually extended to 12 weeks so that I could continue to tidy and improve the site after it went online. I was responsible for the HTML5 and CSS3 (SASS) coding, as well as browser and device testing. The project was managed using informal Agile methodology and the website was set within the Lithium CMS framework. Find out more about the BNZ Community project

Categories: Front-end developer, Writing for the web, Responsive web design/dev, CSS-based layout, CSS3, HTML5, Lithium, Medium sites

Govt.nz

Govt.nz

Website: govt.nz (site has since been redesigned)
Client: Department of Internal Affairs
Dates: December 2013 - June 2014
Government status: Government Department
My professional status: contractor at DIA

Govt.nz is a ground-breaking project run by the Department of Internal Affairs, that seeks to improve the way that government communicates with citizens online. Govt.nz aims to enable visitors to find the government information they are seeking, quickly and easily. It is based on the UK all-of-government website, gov.uk, and both sites are user-focused, with user testing as their foundation.

I was taken on to replace the original designer/front-end developer halfway through the Beta phase. I was responsible for UX research, UX proposal-writing and UX design, responsive web design, responsive front-end development within an instance of the Government's Common Web Platform (CWP), browser and device testing, government web standards accessibility compliance and testing to the very highest level, post-integration testing and QA, attending regular team meetings and doing regular "show and tell" updates for the major stakeholders within DIA.

The project was run using Agile methods, with daily standups and two-week sprints, the team being managed by experienced scrum masters. This Agile methodology was completely new to DIA. The website was on-line and available to the public throughout the Beta phase, and we welcomed feedback and comments from visitors, all of which we investigated further and acted upon as necessary. Find out more about the Govt.nz project

Categories: Showcase sites, Client liaison, IA & UX, Website designer, Front-end developer, Govt web standards tester, Writing for the web, Responsive web design/dev, CSS-based layout, CSS3, HTML5, jQuery/JavaScript, e-govt/WCAG compliance, SilverStripe, Government websites, Medium sites

Hearts n Roses

Hearts n Roses

Website: no longer online
Client: Deborah Harris
Dates: November 2013 - April 2015
My professional status: independent web designer/developer

Deborah Harris made and sold handmade heart pendants and felt the time was right to branch out and put her artwork online. The website needed to be a fully-functioning e-commerce site where she could display and sell the individual heart pendants. She also wanted a weddings section where she could showcase her custom-made bespoke hearts that were made to order to match the flowers and colours chosen by the wedding and bridal party.

I was responsible for client liaison, project management, hosting and Domain name management, scoping, information architecture, site schematics, selection and re-styling of the WordPress e-commerce theme, HTML5, CSS3, LESS, some PHP wrangling, building the skeleton site, testing, CMS training, QA and ongoing support, some content production management, writing and editing, creating product and portfolio graphics. Find out more about the Hearts n Roses project

Categories: Scoping/pitching/quoting, Client liaison, Project manager, IA & UX, Website designer, Front-end developer, Writing for the web, Content-loader, Responsive web design/dev, CSS-based layout, CSS3, HTML5, WordPress, E-commerce, Small sites

Aquavilla

Aquavilla

Website: aquavilla.co.nz (site has since been redesigned)
Client: Jeremy Brown, on behalf of his mum
Dates: August 2013
My professional status: independent web designer/developer

Aquavilla is a boutique accomodation cottage in Plimmerton, north of Wellington. The owners had had some problems with the responsive WordPress theme that their website was built in, and needed someone to tidy it up, restyle it a bit, and make it work properly. They also wanted a new photo gallery and a contact us form. Find out more about the Aquavilla project

Categories: Client liaison, Project manager, Website designer, Front-end developer, Responsive web design/dev, CSS-based layout, CSS3, jQuery/JavaScript, WordPress, Small sites

WebWeaver Productions

WebWeaver Productions

Website: webweaver.co.nz
Client: me
Dates: August 2013 - April 2015 onwards
My professional status: independent web designer/developer

Commissioned, designed, architecture-d, developed, built, written, edited and project-managed by me. The site is designed to be fully accessible, is written in valid HTML5 and CSS3, and has been fully tested and displays consistently across a wide range of operating systems, browsers and devices.

The latest iteration of the site is responsive, designed for ease of reading in whatever device it's being viewed, and fully tested across a range of devices and platforms. It runs on the SilverStripe Content Management System, built and integrated by my WebWeaver colleague, Tom St George. Find out more about the WebWeaver Productions project

Categories: Showcase sites, Project manager, IA & UX, Website designer, Front-end developer, Govt web standards tester, Writing for the web, Content-loader, Webmaster, Responsive web design/dev, CSS-based layout, CSS3, HTML5, jQuery/JavaScript, e-govt/WCAG compliance, SilverStripe, Large sites

EWRB

EWRB

Website: ewrb.govt.nz (site has since been redesigned)
Client: Electrical Workers Registration Board and the Ministry of Business, Innovation and Employment
Dates: July - December 2013
Government status: Government Agency
My professional status: Web consultant with Insight Consultants Ltd

The Electrical Workers Registration Board ensures the competence of electrical and electronic workers. Its work is overseen by the Ministry of Business, Innovation and Employment (MBIE). Their old website was very old and out of date, and Insight Consultants Ltd was invited to design a new site, which was to be built using an instance of the Government's new Common Web Platform (CWP) in SilverStripe as a starting-point.

I was responsible for helping with the initial pitch/quote, wireframing including responsive UX design, and advising the designers how best to design the website within the framework of the CWP. I then developed the design across a range of breakpoints, and built the templates in HTML5 and CSS3 (designing the responsivity in-browser as I built). I was responsible for browser and device testing and was also asked to do a thorough proof-read and QA of the site prior to launch. Find out more about the EWRB project

Categories: Scoping/pitching/quoting, Client liaison, Project manager, IA & UX, Website designer, Front-end developer, Govt web standards tester, Writing for the web, Content-loader, Responsive web design/dev, CSS-based layout, CSS3, HTML5, jQuery/JavaScript, e-govt/WCAG compliance, SilverStripe, Government websites, Medium sites

Zumo Coffee

Zumo Coffee

Website: zumo.co.nz (responsive web design wireframes)
Client: Zumo Coffee Roasters
Dates: February 2013
My professional status: independent web designer/developer

Zumo is a coffee roasting company and coffee house based in Nelson. I was approached to put together a quote for an online web application which would allow Nelsonians to order their cup of Zumo coffee via their smartphone, tablet or desktop computer, ready for pickup/takeaway, in-house enjoyment or home delivery.

As part of the quote, I put together a full set of wireframes to demonstrate the responsive layout, the web app's functionality, and the ordering process itself; across the 11 templates that I had identified as being necessary for the app to function as required. The project was put on hold a short while after I delivered my wireframes, but I'm including it in my portfolio because it was a great piece of work! Find out more about the Zumo Coffee project

Categories: Scoping/pitching/quoting, Client liaison, Project manager, IA & UX, Responsive web design/dev, E-commerce, Small sites

Co-operative Bank

Co-operative Bank

Website: co-operativebank.co.nz (site has since been redesigned)
Client: Co-operative Bank
Dates: October - December 2012
My professional status: contractor at the Co-operative Bank

The Co-operative Bank was established in 1928 and is the only bank in New Zealand to share its profits with its customers. As a co-operative its main purpose is to create prosperity for its customers, not to create profit for anyone else. The bank has 34 branches throughout the country and around 128,000 customers from all over New Zealand.

The bank's existing website was in need of an update which would tide them over for a few months until they were in a position to carry out a complete overhaul. I was responsible for the HTML, CSS and jQuery and design development for the new design, focusing on the content-driven parts of the website, and partnering with David Harrison from Triptech who was responsible for the online banking pages. Find out more about the Co-operative Bank project

Categories: Client liaison, Website designer, Front-end developer, Content-loader, Responsive web design/dev, CSS-based layout, CSS3, HTML5, jQuery/JavaScript, ASP or ASP.NET, Medium sites