Back in November2014 I wrote a blog post about a custom set of GOV.UK stencils I’d created for prototyping a government digital services using Evolus Pencil. At the time I had a need to quickly be able to prototype screens to help feed into discussions.
Amazingly, 9 years later I’m still getting a large amount of requests to share the stencils I created. It’s great to see people are still interested in the Gov.UK stencils I’ve created but the problem is they are out of date and trying to keep them up to date is a bit of a chore, especially as I haven’t needed to prototype for a very long while.
Instead of me updating the Stencils, I want to share quickly how you can very quickly create your own stencils for prototyping using Evolus Pencil and the Rich Text control. Using the Rich text control will enable you to create very quick prototypes and even your save them as your own Stencils if you’d like instead of using my very much out of date ones.
Getting started
- In order to create your own Stencils you will need to download and install Pencil
- Next, go to a page that you’d like to mimic the layout or style of and copy all of those elements by left-clicking, dragging over the content you’d like to copy and then right-clicking and selecting copy
- Next open Pencil and click on ‘Common Shapes’
- Drag a
Rich Textelement on to the canvas. - Double-click the
Rich text, delete the content and then right click and Paste the content you originally copied
That’s it, you’ve now created something that can be altered or even saved as your own stencil to re-use for prototyping.
Please note: Some websites can be a bit hit-and-miss where things aren’t copied over correctly and so it might take a bit more fiddling depending on what you’re after.
Below is a brief video to demonstrate the above bullet points
