Select a St John Ambulance project
⇨ VIP Portal ⇨ Public Site

SJA: Major Accounts Portal
A simple build with a cutting-edge Component

Brief

Design and build the responsive front end of a back-end-first accounts portal for VIP customers, to drive sales growth in the B2B commercial training division.

The portal is not available to the general public, so detailed screenshots are included throughout the page.

Execution

Based on wireframes from a UX Designer, the skeleton of the site structure was built around the VB functionality and design was first tried in-browser before being created in LESS.

The "Enter Customer Details" accordion (shown here) uses my accordion Web Component, so markup in the page body is kept simple (it's easier to edit content wrapped in clearly-labelled custom tags than fight with div soup!) and the accordion template & markup can easily be applied to any other section of the portal if desired.

Finished Product

Delivered in sprints and with the support of a testing team, the portal was successfully deployed in Feb 2015.

For comparison purposes, an image showing the new and old portals is displayed here - please ask me for more detailed screenshots.


SJA: Public Website
Rebuilding key pages to increase donations and engagement

Brief

St John Ambulance's online presence until 2014 was an old Foundation-based site which had undergone a hastily-constructed, mobile-unfriendly responsive retrofit sometime in 2013.

The brief was to rebuild key site templates in Bootstrap 3 to improve user experience, engagement, and donations. The site is currently live at SJA.org.uk and may have changed since release.

Production

Delivered in sprints, the project first saw me designing new templates for the Donation and Campaign pages, two key pages with templates that are also used sitewide, as well as the main section of the homepage to allow the display of video content.

Similar to the VIP Portal, the front end build was completed around the VB functionality code and styling was LESS-based.

Results

After rigorous testing, the templates were released successfully in late 2014.

In the month post-release, clickthroughs from the Donation page to the Donation form increased by 99% and engagement on the campaign pages (time spent on page) was up by 88% week-on-week.