Suggested commit on all UMN 2015-tagged issues: Issue #xxx by [standard list], Bojhan, eliza411, ivanstegic, LewisNyman, lunk_rat, nickrosencrans, stpaultim, Mark LaCroix, webchick
Just before Twin Cities DrupalCamp 2015, a group of Drupal contributors participated both in-person (@LewisNyman, @Bojhan, @webchick, @eliza411, @stpaultim, @ivanstegic, @lunk_rat, and others) and remotely in Formal usability testing of Drupal 8 at the University of Minnesota Usability Lab.
Seven participants tested Drupal 8, all with a background in web development, some with prior Drupal experience and some without, but all new to Drupal 8. A set of scenarios were prepared that lead participants through a variety of content authoring and site building tasks:
- Add an about page and add it to the main navigation
- Create a content type with fields
- Test the mobile content authoring/editing experience
- Place a pre-configured block in the left sidebar (or create one in Views).
(We also tried to test Quick Edit, but sadly no one found it! Sniff!)
This issue will attempt to collate the 100+ issues we found during testing, categorized, and prioritized according to their overall usability impact. (Note that Usability priorities do not always reflect the Drupal core definitions of issue priority and therefore may actually be classified as different priorities in the issue tracker.)
Each of these needs to be "issue-ified" and tagged both "UMN 2015" and "Usability." We will attempt to do this at the sprint on Sunday.
Table of Contents
Mental model
Description |
Issue |
UX priority |
Drupal uses weird words for everything, making Drupal extremely difficult to approach for new users. |
#2513398: Conduct a full-scale terminology review of Drupal (Fix Drupal terminology so that it is more accessible to users) |
critical |
Wayfinding, or clues on how to get started, were lacking. Task-based headings and navigation — verbs — would have been more helpful than the nouns presented. "This is a jambled-up hardware store with no wayfinding. I have to go through every aisle looking for electrical outlets. |
#2634854: Add dropdowns to horizontal toolbar menu (as with 'admin toolbar' in contrib) |
critical |
"Expected structure to present a hierarchy, instead of presenting a list of equal choices. ""Larger categories should not be equal to smaller categories."" When using a tool like Drupal, there are certain concepts that are key. But when looking at links and structure, everything appears equal." |
#2518960: Emphasize the most important items on the 'structure' page |
critical |
Compared to Wordpress, "You don't have to figure out how to place your block inside your view inside your region inside your homepage." "If all you use is Drupal, you're not going to be able to make any other kind of website." |
#2820235: Add inline entity form to core as experimental |
critical |
Dependence on previews led to inefficiency. "Until I saw them, I was never sure if I did the right thing." The inability to see the work in a realtime preview was frustrating. |
|
critical |
"Order of operations are backwards! For example, dependencies and prerequisites for structuring taxonomy/content/etc. are reverse from the way users conceptualize it. (e.g. creating terms before adding a field for terms) "I have to go to the Block page and abstractly add a block." |
#2635710: Add option to automatically create an entity reference view when a new content type is created |
critical |
User expected a much more fleshed-out basic install. Made Drupal appear limited in functionality. |
#2527954: Add a 'Standard + demo content' profile |
critical |
The user saw a page shown on the front page, and got alarmed thinking it was accidentally created as the site's homepage. |
#2514794: Frontpage view is confusing when only one node is promoted to the default front page |
critical |
"The new standard for the homepage is a big fat image, and an endless scrolling list of news is outdated. It was scary, and led users to feel like whoops! I broke the homepage." |
#2514794: Frontpage view is confusing when only one node is promoted to the default front page |
major |
Where did my content go?! |
#2513402: Any time a user creates a thing and saves, display a link to the thing created in the status. |
major |
Reluctance to get too deep into Drupal for fear of breaking the installation prevented the user from exploring or trying new things. |
|
critical |
Desire to approach sitebuilding in a hierarchical manner led user to try building the site menu first. Inability to simply add a tab let user to reject Drupal. |
|
major |
"When I get frustrated with stuff, I like to get into the part where I can write the code and tell it exactly what I want to do." The administrative interface seemed too helpful for users who want to fine-tune. |
|
major |
Distrust in Drupal led user to depend on external services and embeds to get Drupal features done. "Drupal isn't robust enough to handle complicated things." |
|
major |
We ship with a configuration interface and no content manager role/workflow. People who maintain content are intimidated by a new installation, because they see a full administrative suite with no context that lets them see their role. "We dumped a content editor into an admin 2 interface." |
|
major |
"Teaser was confusing. "Well … and that's just bad content strategy."" |
|
normal |
Blocks
Description |
Issue |
UX priority |
The idea that there was an existing library of blocks was completely lost to the user. |
#2512456: Implement the new block layout design to emphasize the primary interaction of placing a block |
critical |
"I would expect to click something like, [Configure this page]. Or hover over something and click, [Add a block here]." Tried to add a block from the pencil icons." |
#2061679: Add a tour for the improved block admin UI at admin/structure/blocks. |
major |
Users wanted to add blocks from regions, both on the front-end, and from the back-end block admin form. |
#2513520: Add a contextual link to add a block to a region #2513528: Add a link to add a block in empty regions on the Block layout page. |
major |
When placing a block, users expected to be able to add a block through the add block button and then fill in the body, including dynamic blocks. |
|
major |
Order of block placement/configuration form is not intuitive. Cache settings is too prominent. Region (primary action) is at the bottom. |
#2361921: Re-order the 'place/configure block' form so it's focused on the task at hand. |
major |
Regions were understood as blocks; for example, "Primary menu" being interpreted as the primary menu, not as a region in which you can place a menu. |
#2513526: Rename the menu regions |
major |
Disabled as a region makes no sense. It is an action you take on the block, not a place to put it. |
#2513534: Remove the 'disabled' region from Block UI |
normal |
The "demonstrate block regions" link was completely missed. If that had been used, the user might have better understood block regions. |
#2514150: Advertise the block region demonstration in a more prominent way |
normal |
User went to appearance looking for blocks. "I'm looking for layout." |
#2513556: Add a link to the Block Layout page on the Appearance page#2811175: [plan] Add layouts to Drupal |
normal |
Expected blocks are draggable. (mental model from panelizer) |
|
minor |
Content creation
Description |
Issue |
UX priority |
Finding where to get started creating a basic page was difficult. |
#2377543: Add "Add" item to toolbar. |
critical |
"I would like to see what this would look like if I'm not logged in." The status of what was being displayed, that of an unpublished preview, was not clear. |
|
major |
When you click back on the browser during node preview, when node preview is required, the save and publish button does not appear |
|
major |
There's no way to save from the preview. |
|
normal |
Save button was expected on the right sidebar, like it is with Wordpress. |
|
normal |
Content types
Description |
Issue |
UX priority |
User is looking for the word "Forms" when they actually need to create a content type. Users cannot tell a content type is the container that fields are being attached to. |
#2528340: Improve description text for 'Content types' item on the Structure page |
critical |
After adding a content type, user is brought to the Manage Fields page. Since this page does not have the content type name in the header (header just says "Manage fields"), the user believed that they failed to create the content type. "This page has nothing to do with what I just did. Whatever the helpdesk said didn't work." |
#2514218: [regression] Pages Manage Fields, Manage form, Manage display should include name of content type or entity |
normal |
User did not get the connection that creating content types and fields were creating entities on the back-end database, despite knowing what a data model was. |
|
major |
Accidentally requiring preview leads user to lose the ability to save changes without any visible way to undo that setting, or even to know it's set. |
|
major |
After creating the content type, user did not know how to find the form. The link exists … but there's no trail. |
#3353280: After creating a content type, some users unsure how to access the content form for what they created |
major |
The difference between ① Manage Display, ② Manage Form Display and ③ Main Tab was hard to understand. |
#2521780: The 'Edit', 'Manage display' and 'Manage form display' tabs were hard to understand |
major |
It was not clear that the content type admin page and the content creation page were two completely-different things. |
#3353281: [PLAN?] Ways to more easily distinguish content type admin page and the content creation page |
normal |
When user changed the content type name, the old name was showing in the breadcrumb. |
#2513570: Changing name (label) of content type is not reflected in breadcrumb link text |
normal |
Field UI
Taxonomy
Quick Edit
Description |
Issue |
UX priority |
Not a single participant was able to find the quick edit functionality. Pencil Icon did not make sense. What does it do? |
#2761985: Refine/finalize design to discoverable Quick Edit feature |
major |
Selecting/deselecting the view pencil icon was not an expected interaction. |
|
major |
Expected hover text on the pencil icon. |
|
normal |
Configuration management
Content listing page
WYSIWYG
Description |
Issue |
UX priority |
When pasting from Word, the line breaks get entered twice for some reason. User went into Source Mode to fix this. |
#2516932: When pasting from Word, empty paragraphs were created |
major |
"Looks like your clipboard was copied from Word. Do you want to clean it before pasting?"
[OK] [CANCEL] (Also, what happens if user clicks cancel?) |
|
normal |
Bulleted list pasted in from Word (2010) as characters, not as a <ul> . |
|
normal |
User had to create a second-level heading using HTML because there was no option available. But the WYSIWYG editor then stripped that out of the code. User 2 bolded the text and skipped the accessibility-friendly standards. |
#2521906: Add default configuration to support h2-h6 level headings |
normal |
No box to enter a caption when caption option is checked in image dialog. |
|
normal |
Image size field is too prominent. |
#2519862: Remove the width/height inputs from EditorImageDialog |
minor |
The text doesn't wrap in the Source view on Firefox. |
|
minor |
Help
Description |
Issue |
UX priority |
Help topics sorted alphabetically by module prevents user from learning workflow. "It just jumps around from the obtuse to the very basic." |
#2516902: Introduce a visual hierarchy to the help page. |
critical |
The help system is not task driven, like users would expect. Neither "Content Type" nor the word "Forms" appear on the Help topic page, because they're not modules. |
|
critical |
Bartik
Description |
Issue |
UX priority |
Bartik's default typeface seemed a little strange when using Chrome on Windows 7. |
|
normal |
The target for the Add Content link was too small. (on default front page) (mobile) |
#2524272: Make Bartik sidebar menu blocks finger-friendly |
normal |
Options to view/edit/delete and the selected option was highlighted in white, which seemed backwards. (mobile) |
|
minor |
Search
Views
Description |
Issue |
UX priority |
Loading up the Views Edit UI was frightening to the user, who did not want to see any of this, let alone try changing of it. The pencil icon was cognitive dissonance compared to exposing what seemed to be advanced, dangerous options. "This makes me want to never touch Drupal again." |
|
major |
"How does one delete a field?" (views) |
|
major |
How does one add a field? (views) |
|
major |
When checking the "More" link, the error offers no ways to recover if the view includes no page display. User had to abandon and try again. |
|
normal |
The block the user created did not contain users; it contained information about users. It was just a list of member-for's. |
#2321645: Default entity view for User should show user name |
normal |
"""What do you want to display?"" the Views page asks. The user selected ""user entities"".
""How do you want to display it?"" the Views page asks. But the options presented included no context around it. There wasn't enough information to make an informed decision. (Distinction between field vs. teaser or whatever is not clear.)" |
|
normal |
Mobile
Description |
Issue |
UX priority |
Mobile browser zooms in beyond the padding. User had a hard time scrolling without that padding. |
#2516918: Prevent mobile browsers from zooming on all form inputs |
major |
"Display of preview bar on mobile was broken — items overlapped." |
#2524284: The spacing of the buttons in the preview bar is cramped on narrow screens |
normal |
(In iOS) User tried to bold two things. The first word bolded just fine, but when trying to highlight a new word, user had to try twice. |
|
normal |
"Manipulating text on a small viewport was troublesome. ""If I try and scroll up to the formatting buttons, I'm afraid it'll lose my selected text.""" |
|
normal |
Attempted to boldify text by tapping the word and using iOS controls. |
|
minor |
Expected text can be doubletapped on mobile. |
|
minor |
Comments
Comment #1
webchickWrong tag. :)
Comment #2
cilefen CreditAttribution: cilefen commentedWhat makes you think there will be any? ;-)
Comment #3
webchickComment #4
webchickComment #5
eliza411 CreditAttribution: eliza411 commentedComment #6
webchickUgh, thank you. I still struggle with saying things correctly. :(
Comment #7
jhodgdonNote to coordinators/committers for this effort:
We have gone through *every* hook_help() and updated it over the past couple of months. With few exceptions, I think the help now matches the UI. So, when UI is updated, please also update the hook_help() so it stays correct and matches how Drupal actually behaves. This almost never happens and it needs to. Thanks!
Comment #8
webchickRoger that! :)
Comment #9
webchickMoving to tables instead of lists for better scannability.
Comment #10
lunk rat CreditAttribution: lunk rat commentedComment #11
webchickComment #12
webchickComment #13
webchickComment #14
webchickComment #15
webchickOk calling it a night. ~50 down, ~90 to go. ;(
Comment #16
LewisNyman CreditAttribution: LewisNyman at Wunder commentedComment #17
LewisNyman CreditAttribution: LewisNyman at Wunder commentedComment #18
ivanstegic CreditAttribution: ivanstegic at TEN7 commentedComment #19
webchickPassing the baton to @Michelle. ;)
Comment #20
LewisNyman CreditAttribution: LewisNyman at Wunder commentedComment #21
MichelleComment #22
MichelleComment #23
ivanstegic CreditAttribution: ivanstegic at TEN7 commentedComment #24
MichelleComment #25
ivanstegic CreditAttribution: ivanstegic at TEN7 commentedComment #26
lunk rat CreditAttribution: lunk rat commentedComment #27
lunk rat CreditAttribution: lunk rat commentedComment #28
lunk rat CreditAttribution: lunk rat commentedComment #29
ivanstegic CreditAttribution: ivanstegic at TEN7 commentedComment #30
lunk rat CreditAttribution: lunk rat commentedComment #31
ivanstegic CreditAttribution: ivanstegic at TEN7 commentedDone for today! Great sprint guys :)
Comment #32
lunk rat CreditAttribution: lunk rat commentedComment #33
lunk rat CreditAttribution: lunk rat commentedComment #34
webchickJust switching this to a Plan, since this issue itself is not actionable. Also marking active, since the testing already happened and there *are* actionable things referenced from it right now!
For anyone following along, @Michelle did AMAZING work making sure all of the issues we found during UX testing are in the issue summary. YAYYY! The next step is going to be to create issues for all of these, with the proposed suggestions from the spreadsheet in the issue summary of those issues.
I feel like at least some of those issues will need to be created by someone who saw the UX testing in person (we're working really hard to get the videos of these sessions posted publicly, which should hopefully happen sometime this week/next so others can see too), but there are also lots of problems that are pretty straight-forward and clear. So please feel free to take an row in a table which doesn't have any issue linked and add one! (Tag "UMN 2015" and "Usability" please)
Comment #35
webchickBig update, putting everything into categories, sorting within those categories by priority, adding a table of contents.
Comment #36
webchickSmart quotes will be the death of me.
Comment #37
lunk rat CreditAttribution: lunk rat commentedComment #38
lunk rat CreditAttribution: lunk rat commentedComment #39
webchickBased on discussions with the team, adding a suggested commit message to the issue summary for all UMN 2015 issues, based on the criteria of:
1) Sat through at least one of the 3 grueling days
2) Actively participated during the UX testing (note-taker, scenario-writer, etc.)
Comment #40
darol100 CreditAttribution: darol100 as a volunteer and commentedComment #41
andypostline 5&6
comment and content types are needs ordering at least - #2230177: Without Field UI comment module presents a poor UX
Comment #42
LewisNyman CreditAttribution: LewisNyman at Wunder commentedComment #43
LewisNyman CreditAttribution: LewisNyman at Wunder commentedComment #44
LewisNyman CreditAttribution: LewisNyman at Wunder commentedComment #45
LewisNyman CreditAttribution: LewisNyman at Wunder commentedComment #46
LewisNyman CreditAttribution: LewisNyman at Wunder commentedComment #47
LewisNyman CreditAttribution: LewisNyman at Wunder commentedComment #48
LewisNyman CreditAttribution: LewisNyman at Wunder commentedComment #49
LewisNyman CreditAttribution: LewisNyman at Wunder commentedComment #50
LewisNyman CreditAttribution: LewisNyman at Wunder commentedComment #51
LewisNyman CreditAttribution: LewisNyman at Wunder commentedComment #52
LewisNyman CreditAttribution: LewisNyman at Wunder commentedComment #53
LewisNyman CreditAttribution: LewisNyman at Wunder commentedComment #54
LewisNyman CreditAttribution: LewisNyman at Wunder commentedComment #55
LewisNyman CreditAttribution: LewisNyman at Wunder commentedComment #56
LewisNyman CreditAttribution: LewisNyman at Wunder commentedComment #57
LewisNyman CreditAttribution: LewisNyman at Wunder commentedComment #58
LewisNyman CreditAttribution: LewisNyman at Wunder commentedComment #59
LewisNyman CreditAttribution: LewisNyman at Wunder commentedComment #60
LewisNyman CreditAttribution: LewisNyman at Wunder commentedComment #61
LewisNyman CreditAttribution: LewisNyman at Wunder commentedComment #62
webchickAdding https://www.drupal.org/u/mark-lacroix to the recommended commit message. He is doing yeoman's work to ensure we can get WebEx videos into a standard format while preserving participants' anonymity.
Comment #63
cilefen CreditAttribution: cilefen commentedComment #64
cilefen CreditAttribution: cilefen commentedComment #65
lunk rat CreditAttribution: lunk rat commentedComment #66
webchickIn awesome news, the critical blocks issue we identified in testing was just resolved! :D #2512456: Implement the new block layout design to emphasize the primary interaction of placing a block And in fixing it, we took out #2513528: Add a link to add a block in empty regions on the Block layout page. in the process.
Other issues recently fixed include:
Off to a rockin' start. :D
Also, the videos have been processed and we should have a blog post up soon with a better summary and pointers to that.
Comment #67
daffie CreditAttribution: daffie commented@webchick: When all or most issues are fixed are you going to do another usability testing to see it is now good enough.
Comment #68
webchickThe University of Minnesota has tentatively offered to host us next year for another round of UX testing, so we could know for sure then. However, in the meantime, I'd prefer us to embrace more informal usability testing in between rounds of formal testing. I just do not personally have a lot of experience in this area, beyond having read http://www.sensible.com/rsme.html and gone "YES!!" all the way through. :)
Comment #69
Gábor Hojtsy@webchick: while certainly not that professional, it is possible to do usability testing with a good script and google hangouts on air (for video and audio recording). We used that setup for several rounds of multilingual usability testing (see https://groups.drupal.org/node/271918). I think you considered that good enough of a testing setup to not test the features this time, so such a setup would be good to retest things. A good script is definitely useful, Dharmesh and Lisa helped us a lot back then with that, unfortunately neither are active in the Drupal community anymore :/
Comment #70
mbrett5062 CreditAttribution: mbrett5062 commentedI have recently opened an issue Add an extra "Save" button to the top of long admin list pages (Modules, Blocks, Permissions, etc).
I think it may be worthy of consideration as an improvement. While I did not see mention of it as an issue in the usability testing, I think it could still be helpful.
Comment #71
LewisNyman CreditAttribution: LewisNyman at Wunder commentedThe script we used for the UMN study should be freely available to copy and edit. @webchick @bojhan is there a canonical link to it? We should be able to provide a script for less formal testing.
Comment #72
webchickIt's in the issue summary (albeit buried) at https://docs.google.com/document/d/19GAnkMk6UBkRLR-LgojdU4KNY_RCVKIORinr....
We will make a canonical page for this under https://www.drupal.org/usability-tests but that's blocked on a blog post generally announcing all the things, including videos. Hoping to get to that this week.
Comment #73
ivanstegic CreditAttribution: ivanstegic at TEN7 commentedComment #74
dasjoCreated sub-ticket #2539740: Provide users with a visual way to understand and build content types (dream fields) as an experimental module.
Comment #75
tkoleary CreditAttribution: tkoleary at Acquia commentedComment #76
tkoleary CreditAttribution: tkoleary at Acquia commentedComment #77
tkoleary CreditAttribution: tkoleary at Acquia commentedComment #78
tkoleary CreditAttribution: tkoleary at Acquia commentedComment #79
tkoleary CreditAttribution: tkoleary at Acquia commentedComment #81
tedbowDoes anyone know which version of Drupal's were using?
In reviewing a child issue #2361921: Re-order the 'place/configure block' form so it's focused on the task at hand. I assumed they were using drupal 8.0.0-beta12 because it came out right after the testing but they were likely using beta11.
I think it is important so that we know which UI they were dealing with. I would update the issue summary if I knew the version.
Comment #82
Gábor HojtsyI fast-forwarded through https://events.drupal.org/barcelona2015/sessions/making-drupal-better-ou... (video recording) and did not find the information. However there are participant video snippets, so you maybe able to tell from the state of the UI there. (Or from the session if I was not attentive enough and it is indeed covered).
Comment #83
tedbow@Gábor Hojtsy thanks for linking this.
for my purposes in #2361921: Re-order the 'place/configure block' form so it's focused on the task at hand. it least confirm that testing was done before the "Place Block" button next to each region and when the list of blocks was on the right
https://youtu.be/E31e5hzHMOE?t=19m
But I guess the fact that #2512456: Implement the new block layout design to emphasize the primary interaction of placing a block was a child issue of this also would tell me that
Comment #84
webchickAdding Quick Edit visibility issue.
Comment #85
Bojhan CreditAttribution: Bojhan as a volunteer and commented@tedblow This was before those changes. The list of blocks was on the right in the testing.
Comment #87
tkoleary CreditAttribution: tkoleary at Acquia commentedComment #88
tkoleary CreditAttribution: tkoleary at Acquia commentedComment #89
tkoleary CreditAttribution: tkoleary at Acquia commentedComment #90
tkoleary CreditAttribution: tkoleary at Acquia commentedComment #91
tkoleary CreditAttribution: tkoleary at Acquia commentedComment #92
tkoleary CreditAttribution: tkoleary at Acquia commentedComment #93
tkoleary CreditAttribution: tkoleary at Acquia commentedAdded dream fields issue #2539740: Provide users with a visual way to understand and build content types (dream fields) as an experimental module.
Comment #94
tkoleary CreditAttribution: tkoleary at Acquia commentedAdded layout issue from ideas queue #2811175: [plan] Add layouts to Drupal
Comment #105
Anybody2022 still many of these points are open and relevant, would it perhaps make sense to revive this for Drupal 10?
(Just found this when I was creating taxonomy terms and the UX felt horrible to place a new taxonomy term below an existing one ;))
Comment #108
bnjmnmComment #109
bnjmnmComment #110
bnjmnmComment #111
lauriii