diff --git a/design/prototype-version-2/README.md b/design/prototype-version-2/README.md index fd2f282de..d129e49ae 100644 --- a/design/prototype-version-2/README.md +++ b/design/prototype-version-2/README.md @@ -1,6 +1,6 @@ # Prototype version 2 -Dates tested: 2022-05-12 to 2022-05-13 +Dates tested: *2022-05-12 to 2022-05-13* ## Status @@ -18,8 +18,6 @@ ___ ___ -
- ## Context > **Sprint 3** @@ -29,21 +27,18 @@ Changes made were based on feedback received during the first round of research. We introduced a return journey for testing, where we faked a previously created form with some errors and based the task on the form creator getting feedback from a colleague to make fixes. -
-
+___ ## Admin interface screenshots Below are the screens a form creator will see when making or editing their forms. -
### GOV.UK Forms landing page ![GOV.UK Forms landing page. Screenshot](screenshots/001-Form-Home.png) *Page with “GOV.UK Forms” heading and green “Create a form” start button.* -
### Name your form page @@ -56,9 +51,8 @@ Below the text input is a green “Save and continue” button. #### What we changed from the previous version -[Changes to the name your form page](page-detail/name-your-form.md) +[Changes to the ‘name your form’ page](name-your-form) -
### Form overview page @@ -69,9 +63,8 @@ There is a green “Add a question” button. #### What we changed from the previous version -[Changes to the form overview page](page-detail/form-overview.md) +[Changes to the ‘form overview’ page](form-overview) -
### Edit question 1 @@ -93,7 +86,7 @@ Next is a secondary heading, “What kind of answer do you need to this question - National Insurance number - Phone number -The page ends with a green “Save changes” button, next to a grey “Create next question” button before a red “Delete page” button. Below the three buttons is a “Go to form overview” link. +The page ends with a green “Save changes” button, next to a grey “Create next question” button before a red “Delete question” button. Below the three buttons is a “Go to form overview” link. On the right side of the screen there is a secondary heading, “Question preview” with a link to “Preview question in a new tab”. @@ -105,11 +98,6 @@ Below the link is a smaller version of an empty GOV.UK service page within an if The detail component, “Add hint text to help people answer the question”, is now expanded revealing the hint text “You can use hint text if you need to explain the format the answer should be in, or where to find the information you’ve asked for.” before a text input. -#### What we changed from the previous version - -[Changes to the edit question page](page-detail/edit-question.md) - -
### Edit question 2 - saved question @@ -125,7 +113,11 @@ The ‘Date’ radio is now selected. On the right side of the screen the iframe has now updated to include the question text “What is your date of birth?” and displays the date component underneath with inputs for ‘Day’, ‘Month’ and ‘Year’. The green “Continue” button is still disabled. -
+ +#### What we changed from the previous version + +[Changes to the ‘edit question’ page](edit-question) + ### Edit check your answers @@ -144,7 +136,6 @@ On the right side of the screen there is a secondary heading, “Page preview” The iframe includes the title “Check your answers” and displays the secondary heading, “Declaration”, above the text input content provided on the left, “By submitting this form you are confirming that, to the best of your knowledge, the answers you are providing are correct.” -
### Edit confirmation page @@ -163,7 +154,6 @@ On the right side of the screen there is a secondary heading, “Page preview” The iframe includes the title “Form submitted” above text “Your reference number is HDJ2123F” in a green box. There is also a secondary heading, “What happens next”, above the text input content provided on the left, “We’ve sent you an email to confirm we have received your form.” -
### Publish a form @@ -177,31 +167,25 @@ There is a green “Publish form” button, the word ‘or’, and then a link t On the right side of the screen the iframe includes the title “Apply for a juggling licence” above a green “Start now” button to simulate the journey from the start page. -
-
### Some things we changed since last time - standard pages call to action button text changed from “Create a new page” to “Save changes” -- standard pages rework of the in page preview (iframe on the right side of the screen) including adding a secondary heading, “Page preview” and adding a “Preview page in a new tab” link above the iframe +- standard pages rework of the in page preview (iframe on the right side of the screen) including adding a secondary heading, “Page preview” and adding a “Preview question in a new tab” or “Preview page in a new tab” link above the iframe For more information, see [v0.0.2 release notes](https://github.com/alphagov/forms-prototypes/releases/tag/v0.0.2). -
-
+___ ## Form runner screenshots Below are the screens the form filler (the end user) would see as they complete the form. -
- ### Preview start page ![Preview Apply for a juggling licence start page. Screenshot](screenshots/101-Preview-start-page.png) *Page with “Apply for a juggling licence” heading and a green “Start now” button containing a white arrow.* -
### Preview question 1 @@ -214,7 +198,6 @@ The basic structure includes a “Back” link which should take the form filler When the form filler clicks the “Continue” button the product should validate that an input has been given (field is not empty or radio is selected for example) before continuing through to the next question in sequence. -
### Preview final question @@ -223,7 +206,6 @@ When the form filler clicks the “Continue” button the product should validat This page is an example of the last question in a form sequence. The difference being a green “Check your answers” button in place of the usual “Continue”. -
### Preview check your answers (summary page) @@ -234,7 +216,6 @@ The summary list component lists rows of the “Short version” of the question Below is a secondary heading, “Declaration”, before the text “By submitting this form you are confirming that, to the best of your knowledge, the answers you are providing are correct.” This is an example declaration for the form filler to agree to, by clicking the green “Agree and submit” button. The text of the declaration is editable by the form creator within the admin side of the builder, meaning it can be customised as to the needs of the different forms or department. -
### Preview form submitted (confirmation page) @@ -243,28 +224,31 @@ Below is a secondary heading, “Declaration”, before the text “By submittin This page includes a secondary heading “What happens next” followed by the content “We’ve sent you an email to confirm we have received your form.” This text is editable by the form creator within the admin side of the builder, meaning it can be customised as to the needs of the different forms or department and should match their internal service level agreements (SLAs). -
- ___ -
- ## What we learned -> Give a synopsis of the key findings from the round of research we tested this version. -> Include examples of found needs, pain points or quotes to help explain the findings. These do not have to be too detailed, as this should be covered in the research findings packs/decks - which can be linked to from here. +There were several key issues identified that we should explore in the next iteration, including: -[MURAL board playback](https://app.mural.co/t/gaap0347/m/gaap0347/1652262618825/de85a467bad90d061809431a9fa8007393135c43?wid=0-1652696148470) +- users wanted an explicit option to change / edit the name of a form rather than use the ‘back button’ +- there is still some confusion over what value a short name provides +- there was still uncertainty around saving / how to save the form +- Preview pane is confusing initially and users don't know what it’s for. However, it becomes much more useful when editing / or going back to a question - - +### User resaearch documentation +- [2022-05-23 Basic Form Building](https://github.com/alphagov/forms/blob/main/research/2022-05-23_Basic_Form_Building.md) +- [MURAL board playback](https://app.mural.co/t/gaap0347/m/gaap0347/1652262618825/de85a467bad90d061809431a9fa8007393135c43?wid=0-1652696148470) +- [Supporting documents (Google drive)](https://drive.google.com/drive/folders/1ePhbd9quZvA8Z4l8WB9sMjmsWDI5rZd-) -
+___ ## Opportunities -> Are there any opportunities we would like to explore, or ideas that we think we could consider? -> List these here. They do not have to be full formulated at this point, but will inform our work (and should be added to Trello to discuss and ideate as a team). +Key decisions + +1. we are ready to implement the basic first steps of the form builder +2. we want to test the prototype with users who have never seen the tool before +3. we need to understand the needs around processing emails and if we should make it a default part of the tool
diff --git a/design/prototype-version-2/edit-question/README.md b/design/prototype-version-2/edit-question/README.md new file mode 100644 index 000000000..87f6d950b --- /dev/null +++ b/design/prototype-version-2/edit-question/README.md @@ -0,0 +1,123 @@ +# Edit question page + +## Context + +For this round there we made a large change to the level of information we gave form creators for each of the options when creating their form questions. This included more useful hint text and more explicit input labels. + +As part of the testing we asked users to create a form exploring how they experienced the iterated version of adding a short answer and date question type. We also tested how they previewed a question. +We then set the task of asking the participant to update an existing form, making changes based on feedback from a colleague. + +## What we tested last time + +![Old version of edit page 1. Screenshot](../../prototype-version-1/screenshots/006-Edit-question-1-hint-open.png) +*Page with “Page 1” caption above heading “Edit page”.* + +A secondary heading, “Question”, comes directly before the hint text “Long version - for example, What is your name?” and a text input. +A second hint text of “Short version - for example, Name” comes next before a second text input. + +Below is another secondary heading, “Answer”, with the hint text “What kind of answer you need to this question”. There are then radio buttons that determine the input type required: + +- A single line of text +- An email address +- An address +- A phone number +- A National Insurance number +- A date + +There is a detail component, blue link with an arrow before the text, “Add hint text”, that is expanded revealing the hint text “A short hint to help people answer the question” before a text input. + +The page ends with a green “Save and create next page” button; a red “Delete page” button; the word ‘or’; and finally a “go to page list” link. + + +On the right side of the screen there is a grey “Update preview” button above an “Open in a new tab” link. + +Below the link is a smaller version of an empty GOV.UK service page within an iframe, mimicking a mobile screen. It shows the GOV.UK logo on a black header. Within the body of the page is a ‘Back’ link and below this is a green ‘Continue’ button. + + +### What we saw + +- All users were unsure what a ‘short’ and ‘long’ version question was and why they would need to have or use both, this caused some hesitation + > P3: “It’s an unexpected question I guess” +- 2 users questioned what the ‘answer’ options were doing. 1 guessed that it would check format of the answers from people filling in the form. The other questioned if that was what was happening as they were unsure + > P2: “I like that it gives these options here (answer types) I don’t know how that will change the formatting when people are asked these questions. If I say date will it come up with boxes? Is that what this does? Does it change the format?” +- When asked 2 users commented about potentially missing ‘answer’ types. Both suggesting the need for multiple lines of text, or “free text” boxes. 1 also suggesting an ‘answer’ type option for ‘name’ + > P3: “I would call it ‘free text’, we have had answers like that, not sure ‘multiple lines’ is common language” + > P1: “...you might want Name as a type here too. If you wanted first name and last name separately. At the moment you’d have to do two separate form fields.” +- All users were able to use the hint text feature to add content about the reference number and expected format, but 1 user mentioned they wanted a numerical field rather than an open text field so they could restrict what was entered + > P1: “Here I’m being forced into using a single line of text” +- None of the users naturally noticed the preview pane on the right of the screen. When asked about it + - users were unsure what it was, until they came back to edit an existing question + - 1 user expected it to auto populate with questions as they built their form + > P1: “When you’re creating things on Whitehall, preview isn’t always a preview. [It doesn’t actually show you how it’s going to look] So that’s maybe shifted my mistrust of preview buttons.” + > P2: “If they [previews of each question] could all be there at once it would be a lot quicker.” + +## What we changed and why + +- Improved the content for the ‘question’ input labels - adding a label specific to the ‘short version’ of the question +- Added new hint text for each ‘question’ input to help guide the user into what content to consider for the long version and the short version - including how the ‘short name’ will be used +- Moved the hint text up to just below the ‘question’ inputs, as suggested by one of the participants - as it felt dicsonnected from the content, and was displayed in a different order than the person filling in the form would see it + > P2: “This is a guidance note to that question, so I’d expect it to be directly underneath.” +- Improved the hint text details link, and added more complete hint text for the hint text input. This is to give a better idea of what information might be useful to include here +- Made the ‘answer’ types a question, “What kind of answer do you need to this question?” - using the previous hint text as the question, so we could inform users that the ‘answer’ types will validate based on the selected formats +- Updated ‘answer’ radio options content to remove repetative content, “A(n)”, to reduce cognitive load and unnecessary repetition for screen reader users + - We also reordered this list to be alphabetical, while keeping what we thought would be the most common ‘answer’ type - “Single line of text” - at the top +- “go to page list” updated to “Go to form overview” and moved to underneath the buttons to improve expectation management, and accessibility for users of zoom text technology +- Content across the screen - and throughout the platform - that referred to ‘page’ changed to ‘question’ as that is more aligned with what the user is adding, editing, moving or deleting + +### Preview pane updates +- Made the position absolute, so it no longer followed the user as they scrolled - this felt confusing and could cause accessibility issues +- Added a secondary heading to the right side, “Question preview” to help users understand what they should expect to see +- Removed the “Update preview” button from the right side, and made the primary call to action a “Save changes” button which will reload the page - with the newly updated preview +- Updated the preview link content to be more explicit about what the link will do “Preview question in a new tab” +- Disabled the button inside the preview pane, as this could cause accessibility issues or confuse users into thinking it was functional + + +![Newer version of edit question 1 page. Screenshot](../screenshots/005-Edit-question-1-hint-open.png) +*Page with “Question 1” caption above a heading “Edit question”.* + +A secondary heading, “Question text”, comes directly before the hint text “Ask a question the way you would in person. For example ‘What is your address?’” and then a text input. + +A second secondary heading, “Question short name (optional)”, followed by hint text “The short name will be used when the form’s questions are all displayed in a list. Use a short descriptive name. For example ‘Address’.” and then a text input. + +Below these is a detail component, blue link with an arrow before the text, “Add hint text to help people answer the question” that is expanded. This reveals the hint text “You can use hint text if you need to explain the format the answer should be in, or where to find the information you’ve asked for.” before a text input. + +Next is a secondary heading, “What kind of answer do you need to this question?”, which has the hint text “The answer will be validated to check it’s in the selected format.” Below are radio buttons that determine the input type required: + +- Single line of text, selected +- Address +- Date +- Email address +- National Insurance number +- Phone number + +The page ends with a green “Save changes” button, next to a grey “Create next question” button before a red “Delete page” button. Below the three buttons is a “Go to form overview” link. + + +On the right side of the screen there is a secondary heading, “Question preview” with a link to “Preview question in a new tab”. + +Below the link is a smaller version of an empty GOV.UK service page within an iframe, to mimic a mobile screen. It shows the GOV.UK logo on a black header. Within the body of the page is a disabled green ‘Continue’ button. + +### Feedback from testing this version + +- All users found the new hint text for ‘long’ and ‘short’ version of the question useful. It helped them understand what the difference is and how they might want to write their longer questions + > P1: “‘Ask a question the way you would in person’ - I like that wording. That’s clear.” + > P3: “This seems a lot clearer than the last time” +- However, all users stated that they wouldn’t use ‘short’ version, as it’s still not entirely clear what the value of it is + > P1: “...the idea of this is good. I mean, my immediate thought is that it’s optional, why bother? What’s going to happen if I don’t opt to do that?” + > P2: “When they’re displayed in a list. What’s the list? Like a summary where they’re condensed?” +- 2 users noticed the hint text, but didn’t comment on it having moved. 1 commented as though it wasn’t in the previous version + > P3: “I like that you now have an option to put something to explain the question” +- Participant 1 made comment that the ‘delete question’ button was there when the page loaded, causing them confusion + > “Oh and you also have the option to delete a question - I think that’s new. It’s odd to have that here? You haven’t created a question so there’s nothing to delete. That’s confusing to be honest.” +- Participant 1 also saw the ‘save changes’ button as an unnecessary step and just wanted to be moved on, and didn’t seem to notice the ‘create next question’ button. However, when they did save the question they noticed that the preview pane had updated offering a preview of the current screen as it would appear to the form filler + > “Oh so that’s different. That’s annoying. I’ve saved changes but then I have to click on the next question.” + > “Ah ok. So the preview isn’t really a preview. It’s just a preview of what I’m doing now.” + > “I would have liked to see it building as I go along - now I’m like what’s happened to my first question.” +- Participant 2 was unsure about what would happen if they pressed to ‘create next question’. They were worried this would lose their progress + > “If I press create next question will it save what I’ve done? Or do I need to click Save changes first?” + > “I’d hope if I click next question it would save what I’ve done. But because there’s a save button next to it I’m not sure.” +- Particiapnt 3 commented that they would always press the new ‘save changes’ button, and felt reassured that the page reloaded. This was seen as positive and gave them confidence that the save was made + > “Personally I would always do a save changes before I go to the next question. The fact that it’s refreshed itself makes me happy that it’s a saved question” +- 2 users seemed to notice the preview pane after saving their question, 1 finding this useful to double check formatting before moving on. 1 user needed to be prompted by the user researcher before noticing the preview pane. The users questioned its usefulness and expected it to show the form as they built it + > P1: “I would have liked to see it building as I go along - now I’m like what’s happened to my first question.” + > P2: ask if the preview pane will show all of the questions: “That would be great. Without me having to use this button. But at the same time it’s helpful if you just want to check the one you’re looking at at the moment.” diff --git a/design/prototype-version-2/form-overview/README.md b/design/prototype-version-2/form-overview/README.md new file mode 100644 index 000000000..2653b2564 --- /dev/null +++ b/design/prototype-version-2/form-overview/README.md @@ -0,0 +1,84 @@ +# Form overview page + +## Context + +For this round of testing we removed clutter from the screen, only making certain elements appear when the user had added questions to their form and returned to the ‘form overview’ screen. We introduced sections to help the user identify what they were seeing - questions they had added versus pages added by the tool and what their next steps should be. We wanted to understand if this made sense to users and if it would be helpful to offer more handholding throughout the creation journey. + +As part of the testing we asked users to create a form, and then explored returning to edit an existing form, including the task of changing the name of a form, based on feedback from a colleague. + +## What we tested last time + +### User first lands on the ‘form overview’ page without any questions +![Old version of ‘form overview’page. Screenshot](../../prototype-version-1/screenshots/003-Form-Apply-for-a-juggling-licence.png) +*Page with “Form” caption above the heading “Apply for a juggling licence”.* + +There is a paragraph of text, “2 page draft form.” above a green “Add a question” button followed by a link to “Preview form (opens in new tab)”. + +Below the link is a summary list component of the standard generated pages, “Check your answers” and “Confirmation”. To the right of each of these rows is an “Edit” link. + +### User lands on the ‘form overview’ page after adding some questions +![Old version of ‘form overview’ page with some added questions. Screenshot](../../prototype-version-1/screenshots/008-Form-Apply-for-a-juggling-licence-added-questions.png) +*Page with “Form” caption above the heading “Apply for a juggling licence” with newly added questions listed in a summary list component.* + +The paragraph of text has now updated to “5 page draft form - Publish.” with “Publish” as a link. +The green “Add a question” button followed by a link to “Preview form (opens in new tab)” still appear below the paragraph. + +Below the link there are now three new pages that have been added by the form creator and appear at the top of the summary list. In three new rows, the short version of the name given to a question appear on the left. + +On the right are grey buttons for moving the page ‘Up’ or ‘Down’ reordering them in the form journey. +Depending on where they are in the list, the buttons vary. The first row - and therefore the first page in the form - only has a ‘Down’ button, while the second row has both an ‘Up’ and ‘Down’ button, and the final row - and final question page in the form - only has an ‘Up’ button. + +Each new row also has a relevant “Edit” link to make changes to the corresponding page. + +### What we saw + +When testing, all the users were quickly and easily able to proceed with the task of adding a question to their form. All 3 users either went straight into adding their questions, or ask if they can. There was little hesitation and users appeared confident in the approach. We later heard from users - when they returned to the screen with their added questions - that there was some confusion. + +- 1 user was a little confused by the ‘Down’ and ‘Up’ buttons next to each question, feeling unsure what they were for to begin with until tasked with moving questions about + > P2: “Now I get what these buttons [up and down buttons] are for, but before they were a mystery to me.” +- The other 2 users were able to guess and use the ‘Down’ and ‘Up’ buttons without an issue, but commented about the page reloading without acknowledgement of the change - having to scroll to find if the change had happened - and that this way of re-ordering questions would be painful where forms started getting longer - suggesting click and drag functionality as a potential option + > P1: “It’s maybe a bit annoying that it drops you up to the top of the page so you have to scroll down to see if it works.” +- 1 user - who described themselves as neuroatypical - told us the way we were displaying the questions would cause them some difficulty in reading and keeping track of where they were and if an action had taken place. They suggested visually separating the questions a bit more, or maybe numbering them [this idea came up again in version 2 research, with this participant] + > P3: “This might be a bit hard to read actually... quite tricky for me as someone who’s not neurotypical” + > P3: “Maybe have some numbers, visually separate the questions a bit more - the line definitely helps” + +## What we changed and why + +We removed unnecessary content from the screen, such as reference to number of pages in the draft and the summary list of standard generated pages - check your answers and confirmation page - on first time the user lands on the screen, or where there are no questions added to the form yet. We wanted to reduce confusion and test if we should simplify the page going forward. + +![New version of ‘form overview’ page. Screenshot](../screenshots/003-Form-Apply-for-a-juggling-licence.png) +*Page with “Apply for a juggling licence” caption above the heading that says “Form overview”.* + +There is a green “Add a question” button. + +![New version of ‘form overview’ page with some added questions. Screenshot](../screenshots/007-Form-Apply-for-a-juggling-licence-added-questions.png) +*Page with “Apply for a juggling licence” caption above the heading that says “Form overview” with newly added questions listed in a summary list component.* + +There is a green “Add a question” button. + +Below this is a section titled ‘Form name’ with a summary list showing the form name as the user had entered it with an ‘Edit’ link to the right of the row. + +The next section is titled ‘Your questions’. There is a summary list showing the questions the user has added; “What is your name?”; “What is your date of birth?”; and “What is your National Insurance number?”. In each row alongside the questions are actions the user can take. There is a ‘Down’ button for the first and second question. An ‘Up’ button for the second and last question. Each row ends with an ‘Edit’ link. + +The next section ‘Standard pages’ shows the pages that the platform automatically adds for each form. These include: +- ‘Check your answers’ which has hint text of “This page lists all the questions and answers so people can check before they submit the form. You can add a declaration for people to confirm their answers.” under the name. On the right side of the row is an ‘Edit’ link. +- ‘Confirmation’ with hint text “This page will be shown to confirm the form has been submitted. You can add information to tell people what will happen next.” There is an ‘Edit’ link on the right. + +The final section is titled ‘Next steps’. There is a link to “Test the form in a new tab” above a grey ‘Publish form’ button. + + +### Feedback from testing this version + +- None of the users were confused when landing on the screen for the first time, and each were confident what their next step was going to be. All 3 were able to share what they expected the page to do once they moved through the journey + > P1: “I’m guessing it’ll be some sort of preview page that you’ll come back to as you go along.” +- All 3 users were able to identify how they could change or fix the form name by using the browser back button. However, they suggested that this could be easier by having a more explicit way to edit it from this screen, as they were worried that by going back they would break the form + > P3: “If this page is going to change to show all of the questions, when this is complete then an edit button might be better than a back button.” +- 1 user commented about the need they had for numbered questions to help them + > P3: “I think having the questions numbered would make this a tiny bit easier to understand at a glance” +- Only 1 user commented on the newly added hint text for the generated pages + > P3: “I don’t know what differences you’ve made from the last one but this is a lot easier to read. This feels a bit simpler.” +- When asked about finalising the form, 2 users said they would definitely want to test the form out as though they were form fillers, with the other saying they would only test it if they were “feeling insecure” (P1) + > P2: “I’d expect there to be a full preview where I could go through all the questions one by one” + > P3: “‘Test the form in a new tab’ that is great. That’s 100% what I’d want to do.” +- 1 user brought up the fact that they still hadn’t set up an email for form submissions to be sent to + > P1: “Then I’d click on ‘publish form’. I still haven’t had a chance to add an email address of where the form is going, but I imagine the publish form process would take me through that.” diff --git a/design/prototype-version-2/page-detail/name-your-form.md b/design/prototype-version-2/name-your-form/README.md similarity index 52% rename from design/prototype-version-2/page-detail/name-your-form.md rename to design/prototype-version-2/name-your-form/README.md index a307b659d..bfd266b23 100644 --- a/design/prototype-version-2/page-detail/name-your-form.md +++ b/design/prototype-version-2/name-your-form/README.md @@ -2,11 +2,9 @@ ## Context -> Give a brief overview of -> - what we wanted to test for example, user needs or design changes -> - what tasks we gave to users +For this round of testing we updated the content of the hint text to help give form creators more guidance about where the name of their form will be used. -
+As part of the testing we asked users to create a form, and then explored returning to edit an existing form, including the task of changing the name of a form, based on feedback from a colleague. ## What we tested last time @@ -19,12 +17,10 @@ Below the text input is a green “Save and continue” button. ### What we saw -When testing some users were unsure what to call their forms, with some suggesting that they should have a list of names to choose from. This seemed to feel as though they expected the system to know or have a list of their department's forms already listed. +When testing some users were unsure what to call their forms, with some suggesting that they should have a list of names to choose from. This seemed to feel as though they expected the system to know or have a list of their department’s forms already listed. We also heard from some users that they were unsure what the name would be used for and who would see it. -> “we should better explain what the name of the form will be used for - that the end user will see it” - P2 - -
+> P2: “we should better explain what the name of the form will be used for - that the end user will see it” ## What we changed and why @@ -35,4 +31,13 @@ We updated the hint text content to help give form creators more context of what There is hint text that says, “The form name will be shown at the top of each page of the form. Use a name that describes what the form will help people to do. For example, ‘Apply for a licence’.” above a text input. -Below the text input is a green “Save and continue” button. +Below the text input is a green “Save and continue” button. + +### Feedback from testing this version + +- Name your form page: This page works well for users and it received positive feedback. The use of additional hint text made it clearer what users were being asked for and it overcomes problems with uncertainty of what the form should be named + > P1: “I’m guessing ‘the form name will be shown at the top of the page’ is new - that’s a good addition. That makes it clear that what you’re doing here is actually what’s going to be shown on the form.” + > P2: “Super clear, no problems” +- Form overview page: Users wanted an explicit option to change / edit the name of a form rather than use the ‘back button’ + > P3: “I wouldn't know how to fix a typo in the form name.” + > P3: “If I click back will it delete everything if I'd added questions.” diff --git a/design/prototype-version-2/page-detail/edit-question.md b/design/prototype-version-2/page-detail/edit-question.md deleted file mode 100644 index 8a3e5e8a7..000000000 --- a/design/prototype-version-2/page-detail/edit-question.md +++ /dev/null @@ -1,38 +0,0 @@ -# Edit question page - -## Context - -> Give a brief overview of -> - what we wanted to test for example, user needs or design changes -> - what tasks we gave to users - - -## What we tested last time - - - - -### What we saw - -> Give a synopsis of the key findings from the round of research we tested this version. -> Include examples of found needs, pain points or quotes to help explain the findings. These do not have to be too detailed, as this should be covered in the research findings packs/decks - which can be linked to from here. - - -## What we changed and why - - - -> What changes did we decide to make in order to improve the user experience, and why do we think this will help. -> List any changes and the hypothesis behind them, or the problem they intend to solve. diff --git a/design/prototype-version-2/page-detail/form-overview.md b/design/prototype-version-2/page-detail/form-overview.md deleted file mode 100644 index 2fa88f689..000000000 --- a/design/prototype-version-2/page-detail/form-overview.md +++ /dev/null @@ -1,38 +0,0 @@ -# Form overview page - -## Context - -> Give a brief overview of -> - what we wanted to test for example, user needs or design changes -> - what tasks we gave to users - - -## What we tested last time - - - - -### What we saw - -> Give a synopsis of the key findings from the round of research we tested this version. -> Include examples of found needs, pain points or quotes to help explain the findings. These do not have to be too detailed, as this should be covered in the research findings packs/decks - which can be linked to from here. - - -## What we changed and why - - - -> What changes did we decide to make in order to improve the user experience, and why do we think this will help. -> List any changes and the hypothesis behind them, or the problem they intend to solve.