GOVUK Wireframing Kit for Sketch
The GOV.UK Wireframing Kit for Sketch is a no-code design solution I created for designers in Government.
Until version 5.0 the kit was solely my work. It is now maintained by the cross Gov design community.
So, before designers can do anything they usually need to install it by writing commands into their terminal, along with other dev-heavy applications like Homebrew, NPM (Node Package Manager) and node-sass.
Nothing stifles creativity quite like a broken Node environment. So, for designers who have limited coding skills, the Prototype Kit is often an over engineered solution.
Designers often spend more time trying to fix their code than actually designing anything.
There was a need for something less intimidating for designers which would allow them to spend more time designing than fighting with code.
I wanted to create a simpler way to design screens and prototype ideas. Not to replace the Prototype Kit, but to offer a simpler alternative for when you need something less polished.
If they made a change to a style, pattern or component then I would make changes to the Wireframing kit to keep them in sync.
Each component was mapped to the same examples featured in GOV.UK Elements so that it felt familiar and could be cross referenced easily.
There were examples for both desktop and mobile screens.
In version 2.0, the radio buttons and checkboxes were updated to the larger styles inline with an update to GOV.UK Frontend.
In version 3.0 the kit was ported from GOV.UK Elements to the GOV.UK Design System. Elements were mapped to 'styles', 'components' and 'patterns' to again make it familiar and easy to be cross referenced.
In version 4.0 the colour palette and the focus styles were updated to align with an update to GOV.UK Frontend and to meet the Web Content Accessibility Guidelines 2.1.
Designers can now hit the ground running and be efficient in their teams within a week or two.
In contrast, we found designers who are new to Government take around 6 to 12 months to be effective with the Prototype Kit.
With a clear need for simpler tools, other designers have ported the Sketch Wireframing kit to other tools: