Prototyping ONS Prototype Kit
Overview
The ONS Prototype Kit is a powerful tool designed to help developers build high fidelity prototypes that mirror the final product in functionality and design using the latest styles and components from the ONS design system.
This allows teams to collaborate effectively, creating innovative, user-centered, and accessible services. Built prototypes can be shared with colleagues, stakeholders, and users for testing and feedback.
Who is it for?
Those who want to build and test new features or services using the latest styles and components from the ONS design system.
Developers: Developers can test how the design translates into real-world implementation and ensure compliance with ONS accessibility and usability standards.
It is also useful for other professionals who collaborate with developers to build accessible solutions. These include, but are not limited to the following:
- Designers: Professionals looking to create consistent and accessible user interfaces that align with the ONS design standards. Designers can create and test high-fidelity prototypes before development. It is useful for exploring and refining user interactions
- User Researchers: Individuals who need to use realistic prototypes for user testing to gather feedback and improve service design.
- Content Designers: To structure and test clear, user-friendly content and to ensure that language is accessible, meeting ONS guidelines.
- Product Owners & Stakeholders: To visualize and approve designs before full-scale development. To ensure the prototype aligns with business and user needs.
Requirements
This guide requires some technical or developer experience.
To install and use the prototype kit, you will need a terminal application and a code editor, such as Visual Studio Code (opens in a new tab) (opens in a new tab) .
If you are using a local ONS device, you may need to request elevated permissions and access to a command terminal by raising a service call.
Install the Prototype Kit
Install Prototype Kit on PC
Learn how to install the ONS Prototype Kit on a PC using this step-by-step guide.
Install Prototype Kit on Mac
Learn how to install the ONS Prototype Kit on a Mac using this step-by-step guide.
Install Prototype Kit on ONS PC
Learn how to install the ONS Prototype Kit on an ONS network PC using this step-by-step guide.
Update the Prototype Kit
Update the Prototype Kit
Keep your prototype kit up to date with the latest components and features. Follow steps for Windows PC or macOS.
Further help
If you need any help installing the prototype kit, or creating or publishing your prototype, email the design system team at ons.design.system@ons.gov.uk (opens in a new tab) (opens in a new tab)
Help improve this page
Let us know how we could improve this page, or share your user research findings. Discuss this page on GitHub (opens in a new tab)