Empowering Defence teams to create exceptional digital services

Involvement

  • UX
  • UR
  • Interaction Design
  • Prototyping
  • Development
  • Accessibility
  • Photography
Client
Ministry of Defence
Industry
Government
Year
2023
Visit website (opens in a new window)

Overview

I was appointed to work with the Ministry of Defence on the Service Manual. My role was to join the team as an Interaction Designer, focusing on the design and development of this product.

I worked closely with a Content Designer, User Researcher, Project Manager and Product Owner to design and develop the Defence Service Manual. This product enables teams to design and deliver excellent digital services in Defence whilst meeting service standards.

Homepage design for the Defence Service Manual for desktop and mobile

Preparing the foundations

To get the Defence Service Manual off the ground promptly, we extended the GOV Frontend and modified it for our users to reflect the Ministry of Defence branding. We designed new components and patterns to present information in an easy-to-digest visual way instead of just content alone.

An example of this includes our dos and don’t list component inspired by NHS Digital. We needed a way for our users to understand what they should and should not do. We also discussed this component with the former head of design at NHS Digital, Dean Vipond, who is now working with us at the Ministry of Defence on a different team.

Ministry of Defence do and don’t list component inspired by NHS Digital

Technology choices

The primary aspect of the service is content and guidance material, so the configuration was vital for non-tech content designers to publish content more comfortably, faster and happier.

I chose Eleventy (11ty) as it seemed perfectly fitting for this type of project and projects I have worked on previously. 11ty is a static site generator that can be customisable in many ways to achieve the desired results. It’s also fast, well-documented, easy to work with and a pleasure to use.

I configured 11ty to make managing content easy for non-tech content designers using Markdown. Markdown is an easy-to-read and easy-to-write plain text format, preventing the need for HTML or Nunjucks involvement.

I opted for a GitHub and Netlify combination. I used GitHub for storing, managing and tracking code changes and Netlify was used to handle the build and development cycle. I also incorporated Netlify’s highly configurable form-handling technology to manage all feedback forms.

Code editor in development mode also showing a preview of the rendered output on a mobile device

User testing and insights

We tested with many users, some varying from User Researchers, Content Designers, and Interaction Designers in the Ministry of Defence and Royal Navy. All research gave vital insights and allowed us to design a service usable by all teams and areas of expertise.

We also added methods for collecting feedback from our users and are currently collecting that feedback and making changes to accommodate those needs and requirements. We also introduced Google Analytics and Microsoft Clarity as other means of gathering usable data for improving the service.

One of my favourites was Microsoft Clarity. You could see users interacting with the service, where they clicked, and how they used the site. It was very insightful watching some of the interactivity happening with anonymous users and having that data available for the team to review. I highly recommend integrating this product into your service for valuable user interaction and recorded data.

Google Analytics dashboard illustrating user interactions and statistics for the Defence Service Manual
Microsoft Clarity dashboard illustrating user interactions and statistics for the Defence Service Manual
Microsoft Clarity recordings to show user interactions for the Defence Service Manual
Microsoft Clarity heat maps to show user interaction for the Defence Service Manual

Going above and beyond

Mia, our content designer wrote a blog to promote the Defence Service Manual on the Digital Defence Blog. We needed a lovely photograph to show the service and some hand-drawn illustrations to show how a user would interact with the service. My wife and I set the scene and captured the photograph.

Bespoke illustration for a user researcher in Defence

My wife hand-drew the little figure illustrations based on a brief the team organised. The drawings were well-liked by the department and the rest of the group.

The results

We designed and developed a service manual inspired by the Government service manual specific to Defence. We also launched the product in less than four months and continue to iterate the offering for all its users.

Trevor is a brilliant Interaction Designer, UCD/UX professional and team player. He’s always forthcoming with ideas, assistance and innovation whilst ensuring user needs and accessibility are at the heart of everything he does

Iftekar Choudhury
Delivery Manager at Ministry of Defence