Beeching Gardens :: WordPress Website

Simple one-page website for a leading London-based garden design company.

Seqirus :: WordPress-based Playbook for Intranet

Seqirus is the second largest influenza vaccine company in the world. It is a global organisation with offices in the US, UK, Germany and Australia. Its growing client list now includes the NHS. I was contracted by Seqirius as a wordpress consultant to plan, architect, design and build a new rich, interactive Playbook for use throughout the company. The Seqirus Playbook is about what the company does. It tells the story of how Seqirus makes its seasonal influenza vaccines every year and it provides its staff with the key building blocks, tools and knowledge that they need to be on the front line of influenza protection and public health. Users are taken on a journey, from planning, right through to timely delivery of the vaccines. It helps them learn together, constantly improving their processes and ways of working. It is a living, digital resource where they can share ideas and best practices on their journey to become the world’s best influenza vaccine company. The planning phase consisted of taking requirements from different parts of the businesses (from scientists to management), aligning with the content team (technical copywriters and 2 design agencies) and establishing the best way to utilise their existing infrastructure in order to deploy new, previously unused technologies like LAMP etc. I was also required to travel during this phase including a week long trip to Australia to meet Seqirus management and the project lead. The architecture was fairly straightforward with the one caveat of Security. Seeing as Seqirus is a billion-dollar pharmaceutical with significant IP a lot of thought and effort had to be put to the security of the playbook. Ensuring only the right people could view the right content, securing this viewed content so it could not be easily copied, exported, extracted or exported too. User rights management was done outside wordpress via Microsoft’s Active Directory and this then communicated with WordPress to temporarily permit access for the session. Significant and sophisticated user tracking was also incorporated. Full security audits were undertaken. The design phase was kickstarted by myself by creating a variety of HTML5 prototypes that were shared within the business for feedback and UX testing. The best elements were progressed, the worst omitted. Eventually a uniform, usable design started to manifest itself and through wireframes, proto-framing and, eventually a static build, an ultra flexible, useable, powerful UI was created that could support and enhance the massive amount of content (interactive animations, technical copy, graphs, stats, tables, videos etc) that were required. Towards the end of the project, Seqirus design agency, Blue Dog – London, who also created the brand guidelines, reviewed the site and gave a further round of brand-centric feedback. This was then incorporated to ensure that every pixel was both visually perfect and exactly on-brand. The build phase was straightforward due to the high degree of detail and effort that was put into the preceding three phases. The most significant area was the incorporation of the new WordPress Gutenberg editing suite as one of the client’s main prerequisites was to be able to edit and create advanced pages and sections within the playbook at will. Luckily i was very well versed in Gutenberg having been developing with it actively over the last 12 months and so i managed to build an extremely powerful and flexible set of playbook centric blocks, and a range of backend supporting features that could be used to enhance the overall editing experience both seamlessly and efficiently. Another notable aspect of the build was the heavy usage of the WordPress Rest API via a wealth of handwritten javascript based modules alongside traditional php theme-based templates having decided that this hybrid JS/PHP approach was best suited re time and long-term support constraints.

UK Government (Planning Inspectorate) :: WordPress API Architecture, Plugin Development & Stack Upgrade

I was contracted by the UK Government to review, architect and develop a new set of Rest APIs for the Planning Inspectorate, the body responsible for all national infrastructure and local planning information. The Planning Inspectorate were leveraging a combination of technologies and legacy APIs to allow the seamless transfer of the different documents, imagery, data and content between their respective platforms and third parties.

Through my detailed review I was able to identify numerous architectural inefficiencies that i was then able to re architect into a simplified, stable, standardised, documented, flexible Rest API. Some superfluous requirements were sidelined under my instruction to be coded as standalone Laravel solutions in the future. The API was constructed using WordPresses new core api (WP-API V2) as a series of plugins, each one catering for a different document type. In addition to the above i was responsible for managing and documenting the upgrading of their frontend WordPress site and all the supporting environments (test, dev, staging) and the wealth of customised plugins that their stack required and ensuring that all areas of the site continued to work as desired. I also was responsible for setting up version control on all of the stacks plugins and source code.

Woodfords Investment Management :: WordPress Portal, Architecture Proposal & MVPs

Woodfords Investment Management is one of the leading Fund Management companies in the UK and it is headed by Neil Woodford the UK’s top fund manager, they are based in Oxford, England. I was contracted under a strict NDA to work on their highly customised WordPress-based Investment Portal that included a brand site, a secure client portal and a wealth of advanced printing functionality.

After a few months of fixing a variety of legacy issues and deploying some new features (coupled with my Technical Direction experience) i came to the conclusion that in terms of efficiency, scalability, cost and time it would be far better to overhaul, refactor and re-architect all things WordPress within Woodfords!

The reason a new WordPress architecture was required was the same as in many organisations that adopted WordPress early on – years and layers of code added to patch WordPress’s legacy shortcomings that are now obsolete due to improvements within the WordPress core. In addition to this the stack had a complete reliance on a third party page building software package which meant that non standard WordPress code had to be written (and sometimes learnt) at every opportunity making all updates and fixes both harder and more time-consuming.

The future too looked bleak too – the take up of the Gutenberg editor means page editors become obsolete, non-standard and impossible to support effectively and their inability to work alongside the ubiquitous WP-API was inherently self-destructive.

I thus spent the last few months researching, architecting and prototyping a next-generation wordpress based hub that would allow the agency, Jerram, to demonstrate to Woodfords what they could have in a hands-on interactive way. Once this was completed I was responsible for creating a slick HTML5 presentation based in Reveal JS and Revolution Slider to help convince the client that they need to rethink their current approach.

Unipart Group :: Enterprise-level WordPress Architecture, Design and Development

The Unipart Group is one of the world’s leading manufacturing, logistics and consultancy companies whose components and services are used by clients including Tesla, Apple, Mclaren, Land Rover Jaguar and Sky. I was recruited by H2O, Oxfords Top Marketing Agency, to migrate and re-architect all their group company websites into a enterprise-level WordPress multisite environment.

In order to deliver the right solution for all the parties involved I had to attend numerous high level meetings with the respective stakeholders, including management, to ensure that all requirements were factored in at the start of the project. Great care was taken to ensure that the overall product was both intuitive and logical to maintain, manage and update whilst allowing a high degree of creative and interactive functionality in the front end. It also had to be very secure and easily scalable, following WordPress conventions at every opportunity.

New branded sub sites could be added at will by the client, all maintaining the parents overarching brand but allowing certain areas to vary, permitting each child to have its own, unique identification including colors, fonts and layouts.

High speed, detailed, rich animations formed a key part of the front end design and in order to minimise the use of heavy videos, and not detrimentally impact page load speeds, i decided to utilize AirBnB’s Lottie ( https://airbnb.design/lottie ) & the BodyMovin plugin. This was both massively beneficial and cutting edge. The reasons are as follows:

  1. The Agency (like most) liked to create animations and adverts in Adobe After Effects. This enabled them to export their animations directly from After Effects into BodyMovin’s Json format.
  2. Json could then be uploaded / updated in real-time and remotely. It could even be pushed via the WP-API. This means that animations could be changed and amended remotely at anytime.
  3. The resulting animations were incredibly quick to load
  4. The performance of the animations was second to none as it utilises the latest browser hardware improvements.
  5. The same animations could then run in their native apps and via their smart tvs too – and be updated in real-time! Bingo! 🙂

Once the basic platform was archirected and deployed it was also my responsibility to manage the migration of the data between the different databases.

The original designs were supplied in PhotoShop and XD, it was y responsibility to create semantic HTML5 designs from these. The resulting theme was built from scratch by myself and utilised the underscores (_s) starting theme and Bootstrap 4 for the layout. Other libraries like Slick JS, FullScreen JS, Reveal JS etc were used too. There was a theme options page too to allow generic sub site settings to be added, inherited. Custom plugins were also created to allow subsites to choose which functionality they required by default.WEBSITE: www.unipart.com

AngloInfo :: Multisite WordPress Consultancy and Development

Angloinfo is the largest online community of global citizens, with over ninety local sites across the globe . I was contracted both to advise, spec and deliver a massive overhaul of their multisite WordPress platform that’s used both as a CMS to manage their sites content and over five hundred customised blogs with tens of millions of monthly page views. As the sole developer my work was 40% front end and 60% backend. My first task was to undergo an audit of the site and its structure and then to make recommendations to the necessary stakeholders about the options available and the time, cost, risks associated. Once the plan and process had been agreed and signed off my first task was to update WordPress from version 3.0 to the current version 4.7. This was considerably challenging as no downtime was allowed and the legacy system had been highly customised 5 years previously to allow functionality that wasn’t available within WordPress at that time. All functionality had to be mapped across into the new WordPress environment and workarounds were created to implement the bespoke existing customisations. The data involved was colossal (terabytes of images, hundreds of gigabytes of data, millions of posts and comments, thousands of users) and it all needed seamlessly porting to the new environments. Numerous Automation scripts were written, tested and then deployed to assist with this task (legacy data was ported first and new ‘current’ data was continuously mapped during the pre-live phase). The responsive sites frontend had to follow strict design / brand guidelines and utilized a laravel-powered Rest API to manage the navigation and other custom elements of the site including managing cookies, analytics, user states and advertising. The backend was highly customized too allowing the different user types to access and control a variety of areas of their sites ranging from Network & Site Admins, Franchisees and individual blog users. Documentation  was written to assist in the transition for both internal AngloInfo users and the end users (bloggers). The site was hosted via Amazon EC2 and had to continuously scale to cope with the significant traffic loads. All media was served via a CDN and the utilized Cloudflare for caching. Other areas that were investigated and proposed included the use of AMP pages, leveraging ElasticSearch for heavy queries, Domain mapping and personalised websites and native Mobile blogging apps for AngloInfo bloggers. WEBSITE: www.angloinfo.com

RBI :: Enterprise-level WordPress Consultant / Lead Developer

I was contracted as a WordPress Consultant (Lead Developer) for RBI who are one of the few enterprise-scale users of WordPress. I was responsible for technically owning the WordPress-side of Estates Gazette, the leading UK Property Data and Intelligence Publishers. The site consisted of a heavily customised WordPress backend that allowed their large editorial team to create and manage content and its associated workflow over print, web and mobile. The front end was a responsive, gated portal for paid subscribers (100,000+ property developers, lawyers, architects etc) with a wealth of useful content, tools and data. Free to air articles were also possible to entice interested parties to sign up. The site was hosted on amazon’s beanstalk, with daily auto scaling too. It has a very heavy caching requirement due to the high traffic / interaction nature of the site (100,000+ heavy users a month, 200,000+ news articles in database etc.) We used a heavily customised version of wp super cache that allowed for the wider organisations content gating requirements etc. The site I inherited was managed by a team of in-house (offshore) developers with a varied level of WordPress knowledge. The core theme (canvas), the WordPress version and the plugins were all very outdated and thus insecure too. Firstly I updated the stack, rigorously regression test it before release. I then undertook a full code audit (50+ plugins) and refactored the code using WordPress’s latest hooks. I was then able to start designing, prototyping, and developing new functionality (with iterative feedback from the product owner). This included:

ElasticSearch

Setting up and utilising Elastic Search within WordPress for all searches (ElasticSearch is a enterprise level search used by the likes of Tesco and Wikipedia). It improved search speed by 1100% and terms returned were up to x7 times more accurate. I also started investigations into the utilisation of ElasticSearch as a data source for high traffic mobile apps enabling WordPress to act as a Mobile Apps CMS.

Live Polling

Creating the ability for the editorial team to create live real-time, cache sensitive blogs for key events like Brexit, Budgets etc. Features included aggregation and subsequent real-time filtering of both internal and external data sources (including the BBC, Sky, Twitter, YouTube, Instagram, Linked In, Facebook etc). In addition I customised Word Presses ‘PressThis’ feature to allow both internal and external journalists to submit articles of interest straight to the editor by simply tapping a button on their browser or via their mobile. Other functionality I developed was wide ranging from new features like the automated the creation of a Digital archive for the Estates Gazette Print Edition (weekly glossy property magazine) to a wealth of technical debt and bug fixes. I also implemented a series of custom API endpoints utilising Word Presses new Rest API for use by WoodWing their magazine publishing tool.
I introduced a better, leaner git process that was based on feature branching and minimised contamination of old code from offshore development teams and worked alongside their Senior DevOps Engineer perfecting the local, dev, systest and uat environments and maximising their similarities with the live environment to minimise surprises (legacy) when code went live! I also managed to find time to educate and train both the editorial team, journalists and the testing team about key WordPress functionality and features. Tools used whilst there included: Vagrant, VVV, Git, BitBucket, Jira, Confluence, HipChat + Slack, Amazon’s BeanStalk and EC2, ElasticSearch, TeamCity, Command Line, WP-CLI. WEBSITES: www.egi.co.uk , www.estatesgazette.com , www.reedbusiness.com

BuzzMyVideos :: Mobile CMS, UX, UI and Build

BuzzMyVideos is a leading MCN with over 5000 YouTube channels. I reported directly to the owners (two ex-YouTube executives). The majority of work I was tasked with involved setting up and managing a new mobile arm for the business that enabled their creators (including Roberto Saviano) to have their own apps on both the Google Play and Apple’s App Store. The apps were targeting the fans of the creators and contained a social feed with timeline-based posts from Instagram, Facebook and Twitter, a chat room, direct messaging with the creator and exclusive CMS-powered content and media not available elsewhere. My duties included planning and AB testing the UX, designing the base UI’s and creating detailed wire-frames and user journeys. I also setup an App CMS / Management suite on the Google Cloud and built a range of hybrid Mobile apps for individual Creators (JS / CSS3 / Rest API-based). I was also responsible for the day to day management of two offshore Mobile Development Agencies and built their new wordpress-based website.

BuzzMyVideos :: MCN Website

Whilst working for BuzzMyVideos, a leading MCN, founded by two YouTube executives I was required to completely rebuild their public facing website from scratch. The new site is WordPress based and in addition involved setting up a git repository and a staging and production site. A badly written premium theme was purchased (always good to allow a dev to view the code before purchasing :)) so in addition to setting up the theme I had to rewrite a mass of css and js to make it perform correctly. Custom post types for jobs were introduced and the legacy business logic was removed.

CantSeeMeMusic