Skip to content

Commit 3648468

Browse files
reviewed Mark's posts for readability.
1 parent 4c8e18d commit 3648468

21 files changed

+577
-576
lines changed

app/posts/claims/2024-03-05-starting-beta.md

+34-16
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
---
2-
title: Where we are at the start of beta
2+
title: Evolving our approach to recording design decisions
33
description: Reflecting on our design decision logs from Alpha and moving towards the Design History tool from X-GOVUK.
44
author:
55
name: Mark Portnell
@@ -14,25 +14,43 @@ aside:
1414
Password: bsaasc123
1515
---
1616

17-
Through Alpha we recorded design decisions in Confluence. We kept things simple and easy to use and captured information in a table. When new evidence or assumptions were understood we created design hypotheses to test, how we would measure it and the outcomes of any testing with next steps if appropriate. Due to the shifting landscape this felt like a manageable approach for Alpha and allowed us to move forward at pace while also capturing important decisions and hypotheses as we went. Below is a screenshot of the confluence page:
18-
![A screenshot of the design decision log from Alpha"](alpha-design-log.png "A screenshot of our design decision log")
17+
## Recording design decisions in alpha
18+
During alpha, we recorded design decisions in Confluence using a simple table format. This method helped us:
19+
- Keep information organized.
20+
- Capture hypotheses, measurements, outcomes, and next steps as new evidence emerged.
1921

20-
When evaluating this method we a found few pros and cons:
22+
This approach allowed us to adapt quickly in a shifting landscape while maintaining a record of important decisions. Below is a screenshot of our design decision log:
2123

22-
Pros
23-
- Simple
24-
- Easy for anyone to contribute
24+
![A screenshot of our design decision log from alpha](alpha-design-log.png "A screenshot of our design decision log")
2525

26-
Cons
27-
- Not ‘in the open’
28-
- Lacks flexibility due a naturally rigid table structure
29-
- Difficult to navigate and find decisions related to specific journeys
30-
- Difficult to adapt structure as project evolves
26+
## Challenges with the Confluence approach
27+
While effective in some areas, this method had notable limitations:
3128

32-
During Alpha we moved through 7 version of the prototype with very early concepts being more exploratory and as we progressed we converged on certain principles. The last version to be tested in Alpha was v6 and we finished Alpha with v7 of the prototype that address usability issues in version 6 as well as starting to tackle new parts of the service that will be needed for private beta go live. A version of this [original design decision log](https://miro.com/app/board/uXjVN1iPGrY=/?share_link_id=574630710665) can be accessed with the password 'bsaasc123'.
29+
**Pros**
30+
- Straightforward to set up and maintain.
31+
- Encouraged team-wide input without requiring technical expertise.
3332

34-
Moving into Alpha we decided there was a need to iterate beyond this way of capturing design decisions and after coming across a [DfE blog](https://dfedigital.blog.gov.uk/2020/09/01/design-history/) regarding design histories we explored in more detail the option of using the X-GOVUK [design history tool](https://x-govuk.github.io/govuk-design-history/). After some discussion it was felt that utilising this tool would address some of the downsides our previous approach had. We did recognise, however, that the use of a tool such as this had limitations for who might be able to contribute. This issue was minimal as once the tool is setup there is only really the need to understand simple markdown to write posts and as we had a decent proportion of the design team that could write in simple markdown. For those that aren’t familiar we allow anyone to write a post in plain text that could be added quickly into markdown when needed by those who know how to do it.
33+
**Cons**
34+
- Information wasn’t publicly accessible.
35+
- The rigid table format limited flexibility.
36+
- Navigation was challenging, especially for journey-specific decisions.
37+
- Adapting the structure was difficult as the project evolved.
38+
39+
## Transition to the x-govuk design history tool
40+
In alpha, we explored alternatives to improve how we captured design decisions. Inspired by the [DfE’s blog on design histories](https://dfedigital.blog.gov.uk/2020/09/01/design-history/), we adopted the x-govuk [design history tool](https://x-govuk.github.io/govuk-design-history/). This tool addressed many of the limitations we faced, including:
41+
42+
- Improved flexibility for posts and structure.
43+
- Easier navigation and discovery of content.
44+
45+
### Addressing markdown knowledge
46+
To mitigate barriers for team members unfamiliar with markdown:
47+
- Those comfortable with markdown write posts directly.
48+
- Others draft in plain text, which the team converts to markdown.
49+
50+
## Alignment with NHS BSA UCD logs
51+
We follow NHS BSA's [UCD log recommendations](https://nhsbsa.github.io/nhsbsa-digital-playbook/design/interaction-designer/ucd-log/#resources), ensuring a consistent pattern for design history posts. This tool allows for flexibility when needed.
52+
53+
## Next steps
54+
We will reevaluate the use of this tool further into beta. For a complete overview of our alpha work, visit our [Alpha Showcase site](https://asc-tfrs-showcase-6fc2dfe855a7.herokuapp.com/) (password: 'bsaasc123').
3555

36-
To keep us in line with NHS BSA recommended approach to [UCD logs](https://nhsbsa.github.io/nhsbsa-digital-playbook/design/interaction-designer/ucd-log/#resources). We will maintain a common pattern for design history posts but the nature of this tool allows for flexibility if needed depending on the nature of the post.
3756

38-
We will reevaluate the use of this tool further into Beta. For a full overview of our Alpha for this service please view our [Alpha Showcase site](https://asc-tfrs-showcase-6fc2dfe855a7.herokuapp.com/), password 'bsaasc123'

app/posts/claims/2024-03-23-scaling-back-mvp.md

+3-1
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,9 @@ aside:
2121
Password: ascbsa123
2222
---
2323

24-
With an aggressive delivery deadline fast approaching and an increasing amount of technical unknowns the decision was made by the product owner to scale back the MVP at the start of Beta. Across a couple of workshops attended by the entire product team a series of key decisions were made to cut out or scale back certain features for MVP. These product decisions were all logged in our project decision log held in Jira along with any associated risks and mitigations. We finished Alpha with v7 of the prototype, this version was not tested with users before these decisions were made and therefore changes were made in v8 of the prototype for future testing. As these decisions also impact design and explain how we moved from v7 to v8 and some of the changes are made.
24+
With an aggressive delivery deadline fast approaching and an increasing amount of technical unknowns the decision was made by the product owner to scale back the MVP at the start of Beta. Across a couple of workshops attended by the entire product team a series of key decisions were made to cut out or scale back certain features for MVP. These product decisions were all logged in our project decision log held in Jira along with any associated risks and mitigations.
25+
26+
We finished Alpha with v7 of the prototype, this version was not tested with users before these decisions were made and therefore changes were made in v8 of the prototype for future testing. As these decisions also impact design and explain how we moved from v7 to v8 and some of the changes are made.
2527

2628

2729
## Using Azure B2C for authentication and account creation

app/posts/claims/2024-03-26-manage-claims.md

+32-34
Original file line numberDiff line numberDiff line change
@@ -16,68 +16,66 @@ aside:
1616
Password: bsaasc123
1717
---
1818

19-
20-
2119
## Why we did this work
2220

23-
At the end of Alpha the design for managing claims consisted of a single page with the tabs component on it. Each tab was for a specific state a claim could be in eg approved or submitted. Within each tab was a table with claims for that were in the corresponding state.
21+
At the end of alpha, the design for managing claims consisted of a single page with a tabs component. Each tab represented a specific state a claim could be in (e.g., approved or submitted). Within each tab was a table displaying claims in that corresponding state.
2422

25-
![A screenshot from v7 of the prototype showing managing claims screen.](manage-claims-v7.png "Manage claims screen from v7")
23+
![A screenshot from v7 of the prototype showing the managing claims screen.](manage-claims-v7.png "Manage claims screen from v7")
2624

27-
While on the whole this screen tested well during Alpha, there were a few issues we had discovered with the design:
28-
- The removal of pagination in the table for MVP meant the tables could end up being very long on a single tab.
29-
- Tabs on smaller screen sizes are vertically stacked on smaller screen sizes meaning multiple, potentially large, tables stacked on top of one another.
30-
- Due to the amount of data that could be on each tab loading times could be affected (this is something we struggled to test in the prototype).
31-
- When using assistive technologies the multiple tabs and large quantities of claims could prove problematic and we struggled to test with users with accessibility needs during alpha.
32-
- We would be introducing new types of claims into these tables in the future for the 60/40 work and introducing another columns would increase cognitive load further on a page that already causes a high cognitive load.
25+
While the screen tested well during alpha, we identified a few issues with the design:
26+
- The removal of pagination in the table for MVP meant the tables could become very long within a single tab.
27+
- On smaller screen sizes, the tabs were vertically stacked, meaning multiple large tables were stacked on top of one another.
28+
- Due to the large amount of data, loading times could be affected (this was hard to test in the prototype).
29+
- Multiple tabs and a large number of claims could create accessibility challenges for users of assistive technologies, and we struggled to test with accessibility users during alpha.
30+
- Future changes, such as adding new claim types for the 60/40 work, would increase the cognitive load further, particularly with the need for additional columns on already complex pages.
3331

34-
Given the above we decided to looks at ways we would simplify the design journey around managing claims while incorporating the MVP changes.
32+
Given these issues, we decided to explore ways to simplify the design of the claims management journey, while still incorporating the MVP changes.
3533

36-
>**How might we** improve accessibility, extensibility and scalability of the manage claims journey while not degrading usability.
34+
> **How might we** improve accessibility, extensibility, and scalability of the manage claims journey, while ensuring we don’t degrade usability?
3735
3836
## What our ideas were
3937

40-
Our starting point for this work was the idea that each tab should instead be separate pages of the service. We felt this would reduce the cognitive load by focussing a page on claims of a specific state without the other visual clutter. It would also allow the tables to better scale and extend as needed for more claims or additional features such as filters and search options in the future.
38+
Our starting point was the idea that each tab should be a separate page within the service. We felt this would reduce cognitive load by focusing each page on claims of a specific state, without visual clutter from other states. It would also make the tables more scalable, allowing for future additions like filters or search options.
4139

42-
The remaining challenge then became how we sign post to these different pages in an intuitive way. This sign posting page would also be the natural home for the start new claim button.
40+
The remaining challenge was how to signpost these different pages in an intuitive way. This page would also naturally house the "Start new claim" button.
4341

44-
We explored two ideas for this; the chevron card and basic card:
42+
We explored two design ideas for this: the chevron card and the basic card.
4543

4644
<div style="display: flex; flex-wrap: wrap; gap: 1rem;">
4745
<div style="flex: 1; max-width: 48%;">
48-
<figure>
49-
<img src="basic-cards.png" alt="A screenshot of some basic cards" style="width: 100%; height: auto;">
50-
<figcaption>Basic cards</figcaption>
51-
</figure>
46+
<figure>
47+
<img src="basic-cards.png" alt="A screenshot of basic cards" style="width: 100%; height: auto;">
48+
<figcaption>Basic cards</figcaption>
49+
</figure>
5250
</div>
5351
<div style="flex: 1; max-width: 48%;">
54-
<figure>
55-
<img src="chevron-cards.png" alt="A screenshot of some chevron cards" style="width: 100%; height: auto;">
56-
<figcaption>Chevron cards</figcaption>
57-
</figure>
52+
<figure>
53+
<img src="chevron-cards.png" alt="A screenshot of chevron cards" style="width: 100%; height: auto;">
54+
<figcaption>Chevron cards</figcaption>
55+
</figure>
5856
</div>
5957
</div>
6058

61-
After some deliberation we decided to opt for the chevron cards as they were more universally seen on the government website and therefore we formed a hypothesis that these would be better suited for this form of signposting.
59+
After deliberation, we opted for chevron cards as they are more commonly seen on government websites. We hypothesized that these would provide a familiar, easy-to-understand method of signposting.
6260

63-
>**We believe that** using the chevron card to sign post users to different claims state pages
64-
>**Will be a useful feature for** submitters
65-
>**As it will** help them clearly identify the different states claims can be in and allow users to easily navigate to these pages.
61+
> **We believe that** using chevron cards to signpost users to different claims state pages
62+
> **Will be a useful feature for** submitters
63+
> **As it will** help them easily identify different claim states and navigate to the relevant page.
6664
6765
## What we changed
6866

69-
The below show the designs we created and tested in v8:
67+
Here are the designs we created and tested in v8:
7068

71-
![A screenshot from v8 of the prototype showing managing claims screen.](manage-claims-v8.png "Manage claims")
69+
![A screenshot from v8 of the prototype showing the managing claims screen.](manage-claims-v8.png "Manage claims")
7270

73-
![A screenshot from v8 of the prototype showing not yet submitted claims screen.](claims-table-v8.png "Not yet submitted claims")
71+
![A screenshot from v8 of the prototype showing the not yet submitted claims screen.](claims-table-v8.png "Not yet submitted claims")
7472

7573
## How we tested our ideas and what we found
76-
We ran usability testing on these designs week commencing 6th May 2024. Here is a summary of the findings related to the above changes:
77-
- users found it very easy to make and submit claims still despite changes. Minimal confusion and little to suggest they would struggle to do this independently
78-
- a shift to pages for the claims tables instead of tabs meant users were able to pick up quicker what was going on that before
7974

75+
We ran usability testing on these designs in the week commencing 6th May 2024. Key findings include:
76+
- Users still found it easy to make and submit claims despite the changes. There was minimal confusion, and little to suggest they would struggle to do this independently.
77+
- The shift from tabs to separate pages for the claims tables meant users were able to understand the structure more quickly.
8078

8179
## What we will do next
82-
The changes we have made have improved usability as well as providing a better foundation for us to scale and extend as needed in the future, as a result we will move these changes into development and monitor any related findings early on in private beta.
8380

81+
The changes we've made have improved usability and provided a better foundation for future scalability. As a result, we will move these changes into development and monitor related findings early on in private beta.

0 commit comments

Comments
 (0)