Welcome one and all! With over 200 blog posts, in 14 different categories, it's safe to say I can get carried away with my posts.

I am passionate about my industry and want to share and discuss topics from user interface design to photography!

Feel free to browse through my thoughts and let me know what you think.

November 2019

Component Driven Development (CDD) in React

Gatsby & WordPress – 4.3. – Forms with Netlify

Gatsby & WordPress – 4.2. – Deploying WordPress to Netlify with a Webhook

Gatsby & WordPress – 4.1. – Deploying to Netlify

Gatsby & WordPress – 3.9. – Generating SEO Tags

Gatsby & WordPress – 3.8. – Correcting The Homepage Slug

Gatsby & WordPress – 3.7. – Using WordPress Menus

Gatsby & WordPress – 3.6. – Styled Components

Gatsby & WordPress – 3.5. – Block to Component Parsing

Gatsby & WordPress – 3.4.5. – Render HTML Strings as Elements

Gatsby & WordPress – 3.4. – Programmatically Creating Pages and Posts

Gatsby & WordPress – 3.3. – Querying in a Page

Gatsby & WordPress – 3.2. WordPress as a Data Source for Gatsby

Gatsby & WordPress – 3.1 – Getting Started with Gatsby

Gatsby & WordPress – 2.7. – Yoast SEO and WPGraphQL

Gatsby & WordPress – 2.6. – ACF Gutenberg Block Development

Gatsby & WordPress – 2.5. – ACF and GraphQL

Gatsby & WordPress – 2.4. – Theme Development

Gatsby & WordPress – 2.3. – WPGraphQL

Gatsby & WordPress – 2.2.5. – Bedrock and Composer

Gatsby & WordPress – 2.2. WordPress Plugins

Gatsby & WordPress – 2.1. Getting Started with WordPress

Gatsby & WordPress – 1. Course Overview

Read Time in Real-Time with React

October 2019

Creating Accessible Colours Based on Props with Styled Components

Sharing State with Context in React

Using a CSV file as a Data Source in Gatsby

September 2019

Dynamically Generating Pages in NextJS using WordPress

Organise Gatsby Queries with GraphQL Fragments

Creating a Secure Password Indicator Within a Form using React and Formik

June 2019

Use Cases – Discovering and Understanding Requirements

May 2019

Owning The Business Internal Infrastructure

Hack For Good #2

Use Cases, User Journeys and Understanding Your Enterprise

Reviewing Porter’s 5 Forces In Modern Business

What is Strategic Thinking?

April 2019

The Impact Of Online Solutions To Businesses in the United Kingdom

HackSoton X (2019)

WordPress to Gatsby

Animation For The Web

September 2018

Return of the Jack

September 2017

What is Gutenberg?


June 2017

ShareUp 5 – Learning and Discussions

How to enable WebP in WordPress

WebP Image Format

Compress Presentations

3 Common Pitfalls of Growth Hacking

Winchester Creatives June 2017

May 2017

The Hive

Rocket League Loading Screen

Magnet Stand

Solent University – Poster Day

Rebuild Part 10: Going Live!

Rebuild Part 9: Tests and Comparison

Rebuild Part 8: Cross Compatible (Browser Support)

Rebuild Part 7: Laptops and PCs (Desktop)

Rebuild Part 6: Mobile First

Rebuild Part 5: Automation

Rebuild Part 4: Plugins

Rebuild Part 3: Setting up a blank canvas

Rebuild Part 2: Goals + Agenda

Rebuild Part 1 : Table of Contents + Running Tests

Third Chance


ShareUp 4 – May The 4th Be With You!

Illustration – Natural Clutch

Illustration – Mowgli

Illustration – Eye Candy

Why did I create my new website webjack?

Apocalypse Gang

April 2017

Attending My First WPBournemouth, April 2017

All Day Hey! April 2017

Can we identify our style?

Building a Website with 100 Google Pagespeed Score

HackSoton 2017

March 2017

Abstract – Devils Tape

Illustration – LuckyMe

Illustration – Breakneur

Simple, Fresh Signup Form

Illustration – 5%

Wedding Invitation Template – Landing Page

Animation – Loading Glass

Pure CSS Loader

Abstract – Cicely

Illustration – Fai

With Love – Mobile Dating Application

Starting Class – Browser Compatibility

Growing Class – Image Compression

February 2017

Starting Class – Online Resources

Long Exposure Lighting // Festival of Light

Hire and Hired Talk – Solent University

Reasons.London – February 2017

Starting Class – Velocity

Machine Pressure


Starting Class – Atom Text Editor

Pixel Boom



Long Exposure Traffic

Eyes Closed

January 2017





Farewell to the Airground

Wilf Hertz – Isolate






Crisp Janabelle


Illustration – Speak Colours




December 2016

Glass Thoughts

New Directions

Illustration – Disruption

Fullstack Hampshire

Illustration – Tracks

Flexible WAMP Apache Vhosts

November 2016

BIMA Digital Day

Tangerine Nightmare


Screw Space

Broken Son

Cracked Marble

October 2016

Materialette – Flat UI Colours

SVG & Media Queries

CSS Shorts – CSS Circles

Employability Talk at Solent University

ShareUp Soton #2

ShareUp Soton #1

CSS Secrets – The CH Unit


Stretched Space



September 2016

Monday Scoping

August 2016

Accessibility and the World Wide Web (Part 1)

Daily UI #011 – Flash Message (Error/Success)

July 2016

Daily UI #010 – Social Share

Daily UI #009 – Music Player

Daily UI #008 – 404 Error Page

Daily UI #007 – Settings Screen

Adobe Illustrator – Transform Tool

Daily UI #006 – User Profile

Daily UI #005 – Icon Design

Daily UI #004 – Calculator

Daily UI #003 – Landing Page

Daily UI #002 – Credit Card Checkout

Daily UI #001 – App Screen

Textured Thursdays Pack #3

June 2016

Textured Thursdays Pack #2

Sass or SCSS?

Liquid Lions





Simple Example of How Sass Can Speed Up Your Workflow

Update on Topics and Setup

Edit Object Colours in Bulk in Adobe Illustrator

Colour Themes in Adobe Illustrator

Adobe Illustrator Tutorial – Hexagon Logo

CSS Secrets – Remove All Default Anchor Styles

Speed Art – Collision

Acrylic Painting – Attempt 1

May 2016

WordPress Plugins – Easy Google Fonts

Cloud Art Collection

Speed Art – Shape Shift

WordPress Plugins – WS Custom Login

WordPress Plugins – Google XML Sitemaps

Speed Art – Divide

WordPress Plugins – RealFaviconGenerator

WordPress Plugins – WP-DB-Backup

Enter – Animation

Half Full – Animation

WordPress Plugins – WP Our Team

WordPress Plugins – Jssor Slider

April 2016

Speed Art – Cloudy (Adobe Illustrator)

Learning CSS 3 : #7 The Box Model

Illustration – Groovy

CSS Secrets – Box Sizing

Illustration – Miami

CSS Secrets – !important

Illustration – Block Spiral

Learning CSS 3 : #6 Full Screen Background Images

Illustration – Impossible Triangle

Southampton Common

Learning CSS 3 : #5 Adding Colour

Okami Poster

Designing for Web Devices or Screen Sizes

March 2016

Learning CSS 3 : #4 Writing CSS Code (Selectors, Classes, IDs)

Smoke Brushes for Adobe Illustrator

Bubbles A3 Poster Illustration

Learning CSS 3 : #3 Remove Default Browser Styling

Throwback Thursday – World Skills Award UK Competition

Learning CSS 3 : #2 Linking a CSS file to HTML 5

Deep Clash – A3 Mandala Poster

Upload Image – User Interface

Learning CSS 3 : #1 Intro to The Series

Vintage Ensembles – Vintage Clothing Website

Southampton Docks

Learning HTML 5 : #9 Validating Your Code

Learning HTML 5 : #8 Semantic HTML

Learning HTML 5 : #7 Commenting Your Code

Learning HTML 5 : #6 Types of Lists

Learning HTML 5 : #5 Bookmarking with Anchor Tags

Website Design and Development Trends 2016

My Experience at Meetdraw

Illustration – Ghoul

Illustration – Zags

Illustration – Torn

February 2016

Speed Art – Foxes (Adobe Illustrator)

Create a Tab Navigation Menu with CSS

Learning HTML 5 : #4 Navigating to webpages

Learning HTML 5 : #3 Adding Images to Webpages

Learning HTML 5 : #2 Headings and Paragraphs

Learning HTML 5 : #1 Introduction

Create Adaptive Images using Adobe Photoshop CC

How to Save an Illustrator file to SVG for use in HTML Code

Making a Responsive Photography Portfolio Website – #6 jQuery and WordPress

Making a Responsive Photography Portfolio Website – #5 Adaptive Images

Making a Responsive Photography Portfolio Website – #4 Media Queries

Making a Responsive Photography Portfolio Website – #3 Flexbox

Making a Responsive Photography Portfolio Website – #2 Flexible Units

Making a Responsive Photography Portfolio Website – #1 Adding Images

Foxes Line Illustration

Kill the Hamburger Menu?

Printing My Artwork!

Love Chemistry

Cold Echos Mandala Tapestry

Animating X – Pure SVG and CSS Animation

Codepen – Social Media 3D Card

Carved Face // Animated

No Face

January 2016

Woman Experimental Line Art Poster (A4)

Bauhaus Themed A4 Poster

Deer Line Art (A4 Poster)

Broken Planets A4 Illustration

Responsive Design Report

Try Not to Fall | Abstract Illustration

Re-branding and YouTube Channel Launch!

December 2015

Subliminal – Line Art Poster (A4)

New Year Resolutions


Is Flat Design Here To Stay? (Publication)


Symmetrical Patterns

Design vs. Decoration

Lotus Flower Vector

Never-ending Cube Pattern | Free Download

Burger Buns – Header/Logo

Text Animation

CSS Column Count Layouts

Web Design and Development Talk by Moov2 Talk at Solent

November 2015

Workout Application – Routine Session

Aperture Photography | Mobile Application

New Logo/Watermark!

Contact UI Animation

Best Blend Website

Best Blend Stylesheet

Best Blend Logo

Television Login Interface

Fluid Illustration

Trends in Design

Geometric Icon Pack

Volume Control Interface

Microphone Icon

Planning and its Importance

Simple UI Form

Pure SVG and CSS loading icon

Double Exposure

Glowing Planet

Orange Flower

Penllergare Woods

New Website is Live!

Tell Me About Your Project