GOV.UK Prototype Kit Bootcamp with Adam Silver

How to use the GOV.UK Prototype Kit to design services like a pro

For interaction designers and content designers who want to create realistic HTML prototypes quickly and easily, even if you don’t have a lot of coding experience.

Is this you?

  • You spend a lot of time wrangling with HTML, Nunjucks and JavaScript instead of actually prototyping.
  • You know how to make basic prototypes but anything more complicated feels overwhelming.
  • You want to be able to prototype your ideas without asking someone else for help.
  • You can use Figma but you want to unlock the benefits of using high-fidelity prototypes.

If you said yes to any of the above, that’s why I made this course...

Why I made this course

Headshot of Adam Silver

I’m Adam, a designer and former frontend developer from London, UK.

My mission is to create products and services that are simple and accessible to use.

I’ve been doing this for 20 years for organisations like Tesco, Just Eat, and more recently GOV.UK (which is when I started using the Prototype Kit).

And while I don’t claim to know it all, I have spent the last 9 years in government, prototyping 20+ different services used by citizens, specialists and internal staff.

I’ve created dozens of components and patterns for use with the GOV.UK Prototype Kit, some of which are now part of the GOV.UK Design System.

Along the way lots of interaction designers and content designers have asked me for help with the kit. So I know where they tend to struggle.

But I also remember when I started working in government because I experienced similar struggles:

  • I had to spend a lot of time working out how to use the kit.
  • I was frustrated because I couldn’t just make the thing, I had to work out how to make the thing.

And while the basics are quite simple, anything beyond that gets super confusing, super quickly.

So if you feel similarly, I think you’ll really like my course...

Preview the 3 prototypes

You’ll create three realistic prototypes:

Prototype 1: Apply for a juggling licence

Prototype 2: Apply for a juggling licence (task list)

Prototype 3: Manage juggling licence applications

Watch me create prototypes from scratch

Each lesson will be like jumping on a call with me.

You’ll see how I create:

  • multi-step journeys with branching questions and exit pages
  • task lists that handle partially complete tasks and file uploading
  • caseworking systems with search, filter and pagination

I’ve crammed everything I wish I knew when I started prototyping into this course.

90+ video lessons

4 sections • 92 lessons • 10 hours 36 mins

Before you start

7 lessons • 18 mins

Start here

1:28

Installing the GOV.UK Prototype Kit

1:00

Installing the Visual Studio GOV.UK Design System snippets

1:00

Git and Github quick start

4:00

Using iTerm2 instead of Terminal

1:00

Nunjucks quick start

1:38

Managing versions, variants and iterations

8:18

Prototype #1: Apply for a juggling licence

21 lessons • 2 hours 7 mins

Preview

2:35

Creating a new prototype

4:37

Naming the service

4:12

Start page

8:10

Email address

7:43

Disabling HTML5 form validation

1:24

Back link

3:51

Email address confirmation code

10:20

First and last name - multiple question page

2:21

Country - autocomplete

18:15

Juggling balls - radio buttons

3:21

Exit page - branching

5:09

Juggling trick - textarea and character count

3:14

Juggling objects - checkboxes and conditional reveal

4:34

Check answers

16:9

Changing an answer

4:9

Confirmation page

3:50

Phase banner

3:50

Accessibility statement

8:12

Accessibility statement - using markdown

7:17

Publishing your prototype

4:25

Prototype #2: Apply for a juggling licence (task list)

30 lessons • 4 hours 35 mins

Preview

4:07

Creating a new prototype

2:55

Start page

5:56

Eligibility flow and creating an account

10:01

Task list page

15:39

Header links

8:02

Personal details

14:00

Personal details - check answers

8:03

Personal details - marking as complete

9:27

Experience - questions

9:23

Experience - check answers

7:23

Experience - marking as complete

2:57

Evidence - has evidence

7:00

Evidence - file upload - part 1

8:01

Evidence - file upload - part 2

14:56

Evidence - file upload - part 3

8:00

Evidence - deleting files - part 1

12:12

Evidence - deleting files - part 2 (flash messages)

5:34

Evidence - check answers

5:32

Evidence - marking as complete

2:33

Task list page: progress indicator

6:39

Check answers page

10:48

Confirmation page

1:55

View submitted application

12:05

Task list page: better status indicators

14:48

Personal details - handling partial completion

21:36

Experience - handling partial completion

9:02

Evidence - handling partial completion

8:37

Check page - handling partial completion - part 1

14:50

Check page - handling partial completion - part 2

13:08

Prototype #3: Manage juggling licence applications

32 lessons • 3 hours 42 mins

Preview

2:03

Creating a new prototype

3:32

Sign-in page - part 1

3:34

Sign-in page - part 2

5:35

Generating data with Faker - part 1

7:15

Generating data with Faker - part 2

13:38

Application list

9:43

Custom header

5:32

Primary navigation

4:03

Generating a sent date

4:35

Application details

17:36

Generating application statuses

1:33

Showing application statuses

6:25

Generating a rejected or approved date

6:27

Approving an application

8:03

Rejecting an application

3:11

Adding flash success messages

4:08

Updating applicant name

20:00

Filter - part 1 - layout

11:19

Filter - part 2 - status

17:23

Filter - part 3 - number of balls

6:21

Filter - part 4 - clear filters

1:52

Search - part 1 - layout

9:11

Search - part 2 - searching

3:06

Search - part 3 - clearing the search

3:21

Handling no results

1:12

Pagination - part 1

3:17

Pagination - part 2

10:57

Activity log - part 1 - generating events

5:15

Activity log - part 2 - layout

4:10

Activity log - part 3 - routes

14:53

Activity log - part 4 - adding new events

3:09

Next steps

2 lessons • 5 mins

How did I do?

2:00

Leave a testimonial

3:00

Other things you’ll get

Working code for the 3 prototypes

Each prototype is on Github. You’ll have access to the full working code from the course. So you can reference it and use it in your prototypes.

Lifetime access

This course is a one-time purchase. Once you buy it, it’s yours for as long as I’m running the course (which I plan to be for many years).

Content updates and new lessons

You’ll also get free access to content updates, as well as any content that is added in the future.

Access anywhere, anytime

You can access the lessons in a browser or with an iPhone or Android app. You can go through the course at your own pace and come back later to use it as a reference.

Frequently asked questions

Is this just a copy of the free GOV.UK tutorials?

No. While I’ve used the ‘Apply for a juggling licence’ prototype as a base, I’ve added many lessons to it. You’ll also learn how to create 2 additional prototypes which are far more advanced.

Is it okay if I use a Windows PC?

Yes, the Prototype Kit works on Windows, Mac and Linux. But all the lessons are recorded on Mac.

Do I need to know how to write HTML and CSS?

You should have a basic understanding of HTML to start prototyping. However, I've structured the course so you can copy the code, grasp the concepts, and adapt them to your specific needs.

Does this course teach you how to use the NHS Prototype Kit?

I do not have specific lessons teaching you how to use the NHS Prototype Kit, but most of the lessons should be transferable because the NHS Prototype Kit works similarly to the GOV.UK Prototype Kit.

Does this course teach you how to design good services?

In short, no. But I’ve only used interactions and content patterns that have tested well in real services I’ve designed in the past. So feel free to to take advantage of them as you see fit.

Can I buy this course on behalf of someone else?

Yes, just send me an email after you purchase with the details of the person you’ve bought it for.

Do you have a refund policy?

I do not offer a money-back guarantee. The GOV.UK Prototype Kit Bootcamp is a great course and I’ve described it accurately on this page.

But don’t take my word for it: you can read some of the feedback below from people who have already taken the course.

If you have any other questions, send me an email.

What former students say

“This is the perfect course if you’re focused on building a career in public sector design and want to develop mastery in prototyping. Although I’ve been prototyping for a few years I took the course with the goal of dramatically upping my game. Things which were previously confusing or a bit of a mystery have clicked into place. Being more confident means I spend more time designing and not stressing over the code.”
Gen Heald Interaction Designer
“I’ve been using the Prototype Kit for over 18 months. But I’ve found it challenging to locate practical guidance on its utilization. There’s a lack of resources showcasing the application of components and their statuses. I felt overwhelmed by the prospect of sifting through official documentation, fearing that the learning curve would be daunting and time-consuming. Fortunately, this course has been a game-changer. It has comprehensive guidance from the ground up, offering not only coding instruction but also invaluable insights into using components effectively in accordance with GDS guidelines. Whether you’re starting from scratch or looking to deepen your understanding, this course covers it all.”
Elmer Enicky UX Designer
“Although I’m familiar with the Prototype Kit, this course has taken my skills to the next level. Anyone unfamiliar with the Kit can learn from the ground up, using well-structured and layered learning, building lesson to lesson. I’m starting to put what I’ve learnt into practice and I’m optimistic that my prototypes will be far more realistic, yielding better insights when I put them in front of users.”
Tom Brown Interaction Designer
“Adam’s Prototype Kit course has been a fantastic investment for me. The content quality and quantity are really high, exceeding my expectations. I’m only halfway through the course, but I already feel more confident. I’ve also picked up some fantastic workflow tips just by watching Adam in action! Highly recommended for anyone who designs and builds government services.”
Tim Minor Interaction Designer
“Whilst I could create simple prototypes, I struggled to get dynamic data flowing through them. I felt like I was fudging it and making researchers’ jobs harder because they needed to know which journeys worked and which didn’t. But since taking Adam’s course, I feel confident about my ability to create whatever is required for a given project. Adam’s easy style, solid knowledge and principles, are a winning combination with this course. I feel like I can now create professional prototypes without faking it.”
Rob Langdon Senior Interaction Designer

If you’d like to join these designers and find out how I create realistic HTML prototypes for complex GOV.UK services and products, then all that’s left is a big green button: