1) Anonymize User
My user will be called “R.”
​
2) Background of User
My user for this test was a young graduate student who is knowledgeable about computers. She has used WordPress a few times as well as Squarespace. I choose her because she had little to no knowledge of Accessibility issues of websites.
3) Details of tasks, including the exact wording you gave to your user
The user test was completed using the following website: https://a11yfirst.library.illinois.edu/plugins-dev/custom/index.html
The questions were as follows:
-
Please write up a few lines of your choice. It should include a title for the page and at least one paragraph. The paragraph should be titled.
-
Please edit the look and feel of the document so that you're happy with the design
-
Please add a photo to your webpage
-
Can you please check the accessibility of the document?
4) What they did
​
Before starting the test, I gave R. some background on Accessibility and also about A11yFirst by telling her that it is specifically an accessibility plugin, because she had no prior knowledge about this topic.
I gave her the link to the main page : https://a11yfirst.library.illinois.edu/ to start her tasks
Task 1:
​
R. was lost initially because of the already existing text in the editor which was not in English. She figured out that it can be deleted and fresh text can be added. She could understand that once she wrote the text she could change the text characteristics by clicking on 'heading'. However like in 'Word' she was looking for 'Title' function to place a title to the page.
​
​
​
​
​
​
​
​
​
​
​
Task 2:
​
When R. was asked to this task, she wanted to highlight certain text using the trackpad and was able to bold and underline text. However when she wanted to change the color of the text she was unable to find the color palette, this was off-putting for her because she was constantly comparing this editor to 'Microsoft Word'.
​
​
​
​
​
​
​
​
Task 3:
When R. was asked to perform the third task, she was relatively very comfortable because she could see the universally used icon for 'Insert Image'. She instinctively clicked on the icon and it took her to this page.
However it took her by surprise that it did not let her upload images from her laptop as she was expecting it to work like 'Insert Image' on any other application. She was not able to work around the fact that a link was needed to insert an image. She could not understand the concept of Alternate Text and its significance was lost on her.
The text written in 'Preview' box perplexed her as she was not able to delete it. She even tried to drag an image and drop it on the editor and was unable to do so. Finally she just randomly googled an image of a house and put the link and inserted the image.
Additionally she was not able to understand why the link address copied from the google search list was not able to bring the image into the document. She tried a couple of times before she realized that she would need to copy the image address and not the link address to bring the image into the document.
​
​
​
​
​
​
​
​
​
Task 4:
This was the last task and I asked R. to work on checking the accessibility of the document. It was interesting because she assumed the document would throw errors like the grammar check in Word if some issue was observed in the accessibility of the text and image.
It took a couple of clicks for her to realize that accessibility checker was right next to the help menu. She was happy that at least the mouse hover revealed the function of the button in the editor toolbox. She was particularly impressed by the corrections provided by the accessibility checker. She applied them all and was happy completing the user study.
​
​
​
​
​
​
​
5) What is interesting
​
The user compared the editor to 'Word' constantly and was focused on finding issues with how it is not like 'Word'. User was perplexed with link address not being helpful in bring the image and how only 'Image Address' worked in getting the image to the document.
User was happy about the 'Accessibility Checker' and the corrections it provided automatically rather than reading a help document to correct the mistakes.
6) What they didn't do
​
User did not fixate a lot on the fact that the color palette was not there. User did not play around with the tool to understand more about the tasks and only performed tasks as told. User did not use 'Help' at all.
7) What was surprising to you
User never accessed the 'Help' menu and did not know the significance of Alternate text.
This is particularly worrying because if the common user is not interested in learning about this editor in one go and making accessible webpages then the marketing of this awesome tool would be difficult
8) Candidate reasons why you think they did and didn't do certain things it
I think the initial look of how the toolbar looks like in 'Word' made the user feel that the editor functioned in pretty much the same way. It took a few minutes to figure out that the color palette was not available because of the easy access to the color functions in 'Word'. The image upload concern that was pointed out by R. was unique because every application nowadays has a drag-and-drop function.
9) Relation to the readings
-
Getting a diverse set of opinions is important for any user study.
-
Informing the user about the tool beforehand may bias the user study.
10) Redesign Speculations
Items that need to be fixed:
-
Short video on home page that helps people understand the significance of this editor
-
The accessibility button should either be larger and could simply say' Check Accessibility'
-
Spell and Grammar check should be implemented like in 'Word'
-
There should not be any text in the preview box in the add-image box
-
Drag and Drop function should be implemented
-
Explanation for 'Alternate Text' should be in the box for 'Alternate Text' as this will help user understand significance
