A claim form that speaks to citizens, not to lawyers

The project team is brought together to frame the needs and explain the stakes of such a redesign:

• design a form for every type of audience
• build perfectly accessible flows
• support the user end to end through the steps they take
• explain things clearly and be transparent, particularly around legal terms and the data being requested

(On the topics of pedagogy and clarity of information, we invite you to read the work carried out for MAIF on Legal Design). This context-setting phase also surfaces of the existing data and the work already done upstream. The Défenseur des droits had hired an external provider to rework the user flows of the claim form. Several workshops were run to gather the needs of the business teams (in particular the lawyers), but not those of the users. The outcome of these workshops led to splitting the form into several distinct steps. Each step gathers the important information needed to improve how the Défenseur des droits teams handle the requests.

The audit of the existing form addresses several goals:

1. Assess the interfaces and the flows against usability criteria. For instance: form fields that don’t offer an explicit input format (date…)
2. Cross-reference the blockers identified with the data from Google Analytics. For instance: understand why users leave the form at a specific step
3. Take advantage of this phase to prepare the guerrilla tests with users

To bring in the user view, tests are run on the current form at the Maison de la Justice et du Droit in Bordeaux.

Users are asked to fill in the form while describing the actions they take, their feelings, what bothers them in the flow, but also what works well.

We quickly understand that some of the terms used are not understandable to everyone.

That’s the case for the word “jurisdiction”, for instance. This confirms how important it is to work on the wording and to embed contextual help in the interfaces.

Some steps also turn out to be anxiety-inducing for the user. When they are asked to enter the name of the person named in the complaint, for instance. Nothing is in place to reassure them or to be transparent about how this data is going to be used.

Finally, these tests teach us more about the general use that can be made of this kind of form. Some users tell us that they don’t necessarily have the documents on hand at the moment of filling it in. Others prefer to write the reason for their request in a word-processing application before pasting it into the dedicated field of the form.

All this information sheds necessary light on the use of this kind of form in different contexts. For example, many users point out that they don’t necessarily have the time to fill everything in one go. That raises the question of a potential save feature (which can however be problematic given how sensitive the data being submitted is).

These pieces of feedback are integrated directly into the audit report to reinforce the usability recommendations.

Building on these new elements (the audit of the current form and the user feedback), the flows are reviewed. It’s of course not about completely rethinking these new flows, but about smoothing the sequence of steps, rationalising the content and gaining in consistency. We change the order of certain steps to gain in simplicity and avoid asking for the same information several times. To better guide the user, we reduce the number of questions per screen. A single-choice “yes” / “no” system shows the next questions based on the answer selected. This step is the ideal moment to set the skeleton of the interface:

• The sequence of steps on the left
• A “Help” button always present in the same place
• A header that lets the user leave the form at any time to protect them depending on the context of the claim
• Letting the user upload documents as they go or at the end of the form

A lot of work goes into the order of the content shown in the interfaces, so that the questions asked unfold in a coherent and smooth way.

To address the need for reassurance, info boxes are embedded in the screens: “Why do we need this information?”, “Keeping your data safe”…

The same goes for contextual help: tooltips for legal terms, examples of documents to prepare…

We prototype the full set of flows corresponding to each area of competence of the Défenseur des droits (except whistleblowers):

• discrimination
• public services
• security professionals
• children and adolescents
• following up a case and adding new documents

Building the prototype lets us simulate the flow end to end. It’s useful to refine the screens and get an overall view of how the steps unfold. We make sure to reduce the risks of frustration by asking closed questions first and then asking the user to explain their problem in their own words. This structure addresses user needs as well as business needs. The funnel pre-qualifies the user’s request while avoiding asking for all the information at once. It also helps the lawyers gather as much of the information needed to handle the request as possible.

The aim is to improve the readability of the screens and the understanding of the components.

For example, the info boxes used to highlight a critical piece of information will come with a red background and a “Warning” pictogram ⚠️.

Secondary information, on the other hand, will have a white background and an “Information” pictogram 💡.

The interface is kept as clean as possible to reduce the user’s cognitive load and let them focus on entering the requested information.

This matches the user’s need for a clean interface that gets to the essentials.

To make the handover easier for the technical teams in charge of integrating the mockups, a UI Kit is provided, bringing together all the fields with their different states, the components and the visual identity of the institutional site (fonts, colours, pictograms). The screens are passed on with their technical specifications and the prototypes are also made available to help understand the behaviour of the components and the micro-interactions. To see the form, head here (opens in new window).