HMRC Childcare Choices

Childcare Choices was a cross-government campaign led by HMRC, working with the Department for Education and the Department for Work and Pensions, to make sure working families knew about – and actually claimed – the childcare support on offer. Its two big rollouts were Tax-Free Childcare, where the government tops up every £8 a parent pays in with another £2, and the 30 hours of funded childcare. HMRC’s media plan ran across radio, audio streaming apps, mobile, online display and social, and every piece pointed parents to one place: the Childcare Choices website.

I handled the campaign’s digital display at WCRS from start to finish – typography and design, the campaign design, the HTML5 coding, and the build, deployment and management of the banners across every display size. I produced five different creatives, each built in every unit size and each led by one of the questions parents were asking: “Can I get 30 hours free childcare?”, “What is Tax-Free Childcare?”, “What is Childcare Choices?”, “Does the government help with childcare costs?” and “Do we get money towards childcare if we both work?”. All of the graphic assets were created from scratch, from the children’s photos to the paper-textured backgrounds and the oversized question marks. Each creative turns its question into a fast cut of bold colour and children’s faces, then lands on a single, simple call to action: find out more on the Childcare Choices site.

Services

Typography & Design, HTML5 Coding, Campaign Design, Campaign Build, Deployment & Management

Client

HMRC

Agency

WCRS

TECHNOLOGY

Built and animated for HMRC’s Childcare Choices campaign at WCRS, 2017–18.

HTML5

Every format was hand-coded in HTML5 and CSS, with no linked stylesheets or script files – each banner is one self-contained document. The background colours are plain CSS panels switched on and off through the sequence beneath a paper-texture PNG that gives every frame its printed feel, and the copy frames were built as layered transparent PNGs: a white base, an offset colour layer set to multiply, and a mask catching where its edges meet the background.

GSAP Library

All of the motion runs on GSAP’s TweenLite, loaded from a CDN. The sequence is split into frame functions – fr1(), fr2() and onwards – each ending with a delayed call that chains to the next, with fr1() kicked off from init(). Commenting out any one call freezes the banner on that frame, so each layout could be arranged and nudged live in the browser, and assets reused between frames are repositioned with TweenLite.set.

SVG & Masking

The campaign’s question marks are inline SVGs, with each one’s colour and opacity held in a single CSS class so it can be changed in one place. The copy sits in fixed-height containers with overflow hidden, which keeps every line easy to position while controlling exactly how much of it is revealed at each step of the sequence.

Frames

The half-page (300x600) laid out frame by frame – every beat of the sequence, from the opening question through the coloured question marks to the Childcare Choices end frame.

HMRC Childcare Choices 300x600 – frame 1

HMRC Childcare Choices 300x600 – frame 2

HMRC Childcare Choices 300x600 – frame 3

HMRC Childcare Choices 300x600 – frame 4

HMRC Childcare Choices 300x600 – frame 5

HMRC Childcare Choices 300x600 – frame 6

HMRC Childcare Choices 300x600 – frame 7

HMRC Childcare Choices 300x600 – frame 8

HMRC Childcare Choices 300x600 – frame 9

HMRC Childcare Choices 300x600 – frame 10

HMRC Childcare Choices 300x600 – frame 11

HMRC Childcare Choices 300x600 – frame 12

Hover to enlarge, click to view full size.

Live HTML5 Banners

The full build, running live from the original HTML5 files. Every size shares the same frame-by-frame structure, re-laid out for its own proportions, so the sequence reads the same whether it’s a 728x90 strip or a 300x600 tower. Click-throughs are switched off; each banner plays through three times and settles on its end frame – reload the page to watch them again.

Billboard 970x250

Leaderboard 728x90

Half-page 300x600

Wide skyscraper 160x600

MPU 300x250

HMRC Childcare Choices – five campaign creatives side by side: Can I get 30 hours free childcare, What is Tax-Free Childcare, What is Childcare Choices, Does the government help with childcare costs, Do we get money towards childcare if we both work