The Test team patrols, curates, and tests the WordPress experience. We use a QA mindset to do visual records, using, observing, user research, manual testing, and user testing. We also document and triage top flows.

The team gathers in #core-flow. Please drop by any time with questions or to help out.

4.2 Nux Group Recap / Call to Action, March 3, 2015

This week’s chat was dedicated to looking at the proposed new Welcome Screen, assigning folks to “own” one of the links, identify several things and report back next week:

The importance of highlighting that flow for new users in the Welcome Panel

Once you’ve clicked through to it, what is currently good or bad, or could be improved

Bonus: Whether this is a “Day 1″ link and if so, what should replace it?

Attendance at last week’s chat was sparser than usual, so we didn’t find volunteers to cover all of the Welcome Panel action links. If you’d like to volunteer to examine one of remaining the flows below, let us know in the comments.

The following people volunteered:

Settings

“Set your site front page” – @juliekuehl

“Turn comments on or off” – @suzettefranck

“Set your timezone and date format” – @courtneyengle

“Change URL structure” – @bethsoderberg

Appearance

“View your site” – @liljimmi @drewapicture

“Change or customize your theme” – @liljimmi

“Find new themes” – You? Looking for a volunteer

“Manage your site widgets” – @ipstenu

Content

“Write your first post” – @DrewAPicture

“Add a new page” – @abuango

“Edit your site title and tagline” – @jenniferbourn

Reporting Back

When reporting back with your findings, it would be helpful to document the current “workflow” for whichever action link you’re examining. Identify the pain points, possibly suggest alternatives, and provide vizrecs (visual records, i.e. screenshots) of your main points.

Things to keep in mind when writing your report.

Is this a must-have for the Welcome Panel?

Describe the flow from the point of clicking the link to following through the process

What is good or bad with the way it currently works?

Bonus: Suggestions for improvement

Reports can be shared in the comments and/or presented at next week’s NUX meeting.

View Your Site

The importance of highlighting that flow for new users in the Welcome Panel

I believe this is a must-have. After you’ve landed in the Dashbard after an install it is not instantly clear to a new user where their site is or how to get to it.

Once you’ve clicked through to it, what happens? What is currently good or bad, or could be improved

What happens after the click
When you click on the link you simply go to the Home page of the front-end of the site.

What is currently good or bad

The Good
The link does exactly what it says.

The Bad
The link loads in the current tab/window, so once users are on their site many feel they have “lost” the Dashboard. If you don’t know the address to /wp-admin it is difficult to get back.

You can use the admin bar to navigate back to the Dashboard, either via the 2nd link on the Admin Bar (Fuel gauge Dashicon + Site name) or the “Dashboard” first child link under that link. However, for a new user it isn’t super obvious that the Dashicon used = Dashboard. In my experience, new users need to be shown how to get back to the Dashboard.

Suggestions for improvement

I know there are issues with opening a link in a new tab, but is this 100% off the table? I always have the admin in one tab and the front-end in another and so do many of my students.

Can the Dashboard link be moved to a top-level link in the Admin bar?
Can we add the word “Dahsboard” after the site name link in the Admin Bar?
Can we have some kind of dismissible helper pop-up that points out the link back to the Dashboard (like Slack does when you first use it)?

Is this is a “Day 1” link and if so, what should replace it?

Change or customize your theme

The importance of highlighting that flow for new users in the Welcome Panel

I believe this is a must-have. Changing the appearance of the site front-end is one of the first actions new users want to take.

Once you’ve clicked through to it, what happens? What is currently good or bad, or could be improved

What happens after the click
When you click on the link you go to the theme customizer (/wp-admin/customize.php), the same link as the big “Customize Your Site” button on the current Welcome screen.

What is currently good or bad

The Good
The customizer is awesome! You can make theme changes in real time without actually changing the live site. You can save your changes if you like them.

The Bad
To a new user, the customizer can be overwhelming. It is not instantly obvious what to do or what you can do in the Customizer. If the user is comfortable clicking around and making changes they can quickly learn what to do. A more timid user may just back out.

Also, if a user does make changes they need to know to click “Save & Publish” to make them to take effect.

Suggestions for improvement

Saving changes. I would suggest changing the message in the alert box that appears if the user tries to close the Customizer without making changes.
New message “The changes you have made to your theme will be lost if you close the Customizer without clicking ‘Save & Publish.'”

Set Timezone, Time, and Date Format

The importance of highlighting that flow for new users in the Welcome Panel

Scheduling posts and displaying the date in post-meta are dependent upon the timezone and date formats. It is preferred that timezone and date formats are configured before the user makes a post.

Once you’ve clicked through to it, what is currently good or bad, or could be improved

After the click

Good

City time zones make locating the correct option easier.

Examples of date format options are clear to understand.

These settings are near the “Week Starts On” and could encourage users to complete this setting as well.

Bad

It is not a setting new users seek out to configure.

Users often discover the timezone issue when scheduling posts that publish at a different time than users expected.

These settings are near the WordPress Address and Site Address, which lacks any disclaimer of the dire consequences of modifying these settings if the user has a typo or doesn’t properly configure additional hosting and domain registration settings.

What Could Be Improved

WordPress could ask users during installation where they are located, or make that an option during hosting install packages.

When welcoming new users to the Timezone, Time, and Date Format, each option should have attention drawn to it to ensure the user has adjusted to their preference.

Is this is a “Day 1″ link and if so, what should replace it?

It is not essential for just getting the website launched, but will be an important factor when the user schedules content or wants the post-meta date displayed differently.

Change URL Structure

The importance of highlighting that flow for new users in the Welcome Panel

New users often have no idea where the URL structure for their website comes from, but do want to use a structure outside of the default.

Once you’ve clicked through to it, what is currently good or bad, or could be improved

What happens after the click
When you click on the link you go to the permalink settings page (/wp-admin/options-permalink.php).What is currently good

The examples of common settings are clear, with the exception of “custom structure”.

The radio buttons make it easy to choose one of the suggested common settings.

There is descriptive text at the top of the page that describes what these settings are.

The category and tag base settings, which may be confusing to new users, are separated into a different section than the “Common Settings.”

The information in the “Help” dropdown is very well written and informative.

What is currently bad

There is no real explanation of what parameters are accepted in the “custom structure” option. It is not clear how the suggested /%postname%/ is different from the “post name” option above it.

The last sentence in the introductory text (“A number of tags are available, and here are some examples to get you started.”) could be confusing to a new user. This text links to the codex page on using permalinks, which lists the information about tags pretty far down on the page. At first glance this codex page does not appear to the relate to the text from which it was linked.

The header “Optional” isn’t really descriptive.

It is not clear how to get back to the welcome screen/dashboard.

What could be improved

Change the header “Optional” to “Custom Structures,” which is what this section is called in the help drop down.

Move the “custom structure” setting to the new “Custom Structures” section described in the previous bullet.

A link or information icon next to the “custom structure” option could link to information about what types of values will work properly in the custom structure and how those values should be formatted.

Remove the last sentence of the introductory text and consider modifying the language in the rest of the introductory text to more closely align with the help drop down language.

Is this is a “Day 1″ link and if so, what should replace it?

Given that permalinks are supposed to be permanent, I believe changing the URL structure needs to be a “Day 1” task.

Adding a new Page

The importance of highlighting that flow for new users in the Welcome Panel

Apart from posts, Pages are the first things that get created immediately after installation. It can be an About, Contact or any other page.

Once you’ve clicked through to it, what is currently good or bad, or could be improved

The Good:

The Link currently does exactly as stated, taking the user to the “Add New Page” page, where the user is presented with a text box to enter the Title of the page and an editor to type and format the content of the page. Also the default settings of the Publish section is suitable for a beginner, as all that is needed is to click the publish button basically.

The Bad:

The only thing I find currently bad is the “Add an About Page” currently in the Welcome Panel. Its specific about the type of page to be created, it should instead be “Add a New Page” like in the new mockup.

Whether this is a “Day 1″ link and if so, what should replace it?

The need to create a page is of great importance at any level of development, but most importantly on Day 1. Pages are sometimes the first content to be created especially for non-blog oriented websites.

Widgets

The importance of highlighting that flow for new users in the Welcome Panel

While WP comes with default widgets, the flexibility of being able to change them and reorder lets people make their site unique. This will help us not have a million identical sites and let people express their individuality, which is something we tout.

Once you’ve clicked through to it, what is currently good or bad, or could be improved

Currently widgets takes you to /wp-admin/widgets.php

Assuming we can change that to go to /wp-admin/customize.php instead, we either end up at the main customizer page OR (theoretically?) the widgets subpanel

Leaving us on the main page would be bad. If we can’t at least get to the sub-panel, we should leave it as going to widgets.php

Issue 1 here, nothing’s expanded.

When I hover over the items, they light up. This is great, but the fade is very fast. Too fast to get a screengrab, and if I missed it, or the item is off the page (scroll down) I won’t notice. The same happens if I hover over the item in the preview. The light-up is too subtle to catch the eye if I don’t know I’m looking for it.

There’s not enough obvious interaction here. I clicked on the item to open it, but if you hover over the DOWN ARROW and not the main button, you don’t get the ‘drag’ interface. There’s also no draggability from the preview (which my brain thinks logically should be a thing, especially since there was a high-light).

Delete makes the item go away. Okay, good.

This makes the new item show up and defaults to ask me edit the title.

Whether this is a “Day 1″ link and if so, what should replace it?

The current link is to the old widgets.php page – if at all possible, we should deep link to the customizer.

NB: This brings up a new concern. If we deep link, will they know how to get back there?

Write Your First Post

Is this a must-have for the Welcome Panel?

This item is a must-have for the Welcome Panel because it is (supposedly) your first entry to writing content on your site.

The flow after the click

When you click the link, it takes you to the Add New Post screen.

You’re presented with a new post screen, which at first impression probably seems fairly overwhelming to a new user. There are inputs for a title, a writing interface (editor), buttons, labels, tons of boxes for entering stuff.

There’s a pointer open describing the Distraction-Free Writing. What the heck is that? And what does it have to do with writing your first post?

You write a post and click Publish. Now what? Oh, that bar at the top says I can view it.

Now I’m viewing the post on the front-end of my site, what do I do now?

Good

The title field is focused when you first hit the Add New Post screen.

The writing mode defaults to visual which should theoretically lower the barrier to making your content look and work the way you expect it to

Bad

This isn’t technically your first post. Your first post was actually created for you when you installed WordPress. What is this “Hello, World!” post? What is this “Uncategorized” category? What is a category?

Even as simple as we realize the post editing/writing screen is, it’s still quite busy and has a possibility of being overwhelming

Suggested Improvements

Pointers (or similar) guiding you through the process of writing your first post (add a title, write some content, click publish) would go a long way toward helping users navigate this screen the first time. Maybe even show them the help tab in their first time through the screen.

An explanation callout at the top of the screen on first visit explaining what the screen’s purpose is now and in the future might go a long way

Hide more meta boxes by default. Do we really need to display the post formats meta box? Maybe have the editor expanded by default

Site Title & Tagline

The importance of highlighting that flow for new users in the Welcome Panel:

This is a very important step in setting up the site, as it deals with the name of the site (many times the name a the user’s business” and the tagline. These two elements are used in almost all themes and site owners want to control the name of their site/business/blog.

Is this is a “Day 1″ link and if so, what should replace it?

Yes!

Getting started / The welcome screen

When starting at the welcome screen, I immediately click the “view your site” link (to open in a new tab, so I don’t lose the welcome screen) to see what my WordPress site look like. Yikes. It’s pretty sparse. I immediately notice that I want to change the name of my site to my business name.

I went back to the welcome screen and I sat there for a while looking around, unsure of where to go or what to click to change the name of my site. I’m not ready to customize it yet. I just want to change the name.

Unsure of what to do, I click the blue “Customize Your Site” button hoping to figure it out, even though I don’t want to get into customization yet.

Once you’ve clicked through to it, what happens? What is currently good or bad, or could be improved?

Ah. Here I see my site with an extra panel on the left to customize the site and I quickly see the link “Site Title & Tagline” and click it.

I see the checkbox to turn off the Title and Tagline and try it. Then I wonder how to only use just the title or just the description. What if I don’t want to use both.

I click in the title field and delete what’s there. Ah. Figured out how to only use only the title OR the tagline. Sweet. Made my changes and saved it.

THE GOOD

Once I clicked the blue button to customize the site, changing the site finding out how and where to change the site title and tagline was clear.

The checkbox to turn the header text on/off was easy to use and made sense.

THE BAD

When I saw the welcome screen, all I wanted to do was change the name of my site to be MY business name (my site name), and I wasn’t sure where to go to do that.

Clicking the customize button wasn’t my first thought, as I wasn’t ready to get into customizing the site yet. I just wanted to change the name of the site.

Suggestions for improvement:

#1: Add a more clear path to change the Title and Tagline. Give users a link up front.

Maybe the link is something like: “Change Site Title & Tagline (Customize Site)” — With this approach we’re helping users find out how to do this faster, and we’re communicating that you change the site Title & Tagline as part of the Customizing the site?

#2: The “Turn off Header Text checkbox” verbiage could be better. Everywhere else we refer to the “header text as the Title & Tagline” … shouldn’t the checkbox label say “Turn off Title & Tagline”?

After Changing the Title & Tagline

I was thrown through a loop when I finished changing my Title & Tagline. I closed the window and was on a weird screen I hadn’t seen before. WHAT?!? I thought …

Why wasn’t I brought back to the welcome screen I was just on? Where were those other links to help me get started? Why am I on this other pages with images? What is this? Themes? I didn’t pick these themes?

As a user, I REALLY want to go back to the first screen I saw.

Changing the Title & Tagline (Down The Road)

I did appreciate that I am able to change the Title & Tagline in more than one place in the future:

Through the customizer

In the settings under general

I also appreciate that for those using the The 5 Minute Install, they can add their own site title immediately.

I initially would have loved to have seen a field for the site tagline as well — because I am used to working with clients who have taglines. But the more I thought about it, not all themes use the tagline, and not all users have a tagline either — adding would may cause more of a roadblock to installing WordPress and getting started than helping.

The importance of highlighting that flow for new users in the Welcome Panel

I believe this is a must for the Welcome Panel since it is something that needs to be setup before content is created (at least as it stands now). The process should be altered to be more clear instruction and provide links to additional information on comments and trackbacks.

What happens after the click

From the Welcome screen, click on “Turn comments on or off” which takes you to the discussion settings page, which has comments enabled by default:

Once you arrive at the discussion settings page, there is no specific option to turn comments on or off site-wide. The user is presented with a list of options, and it is not obvious how to turn comments off or what they are even used for.

What is currently good or bad

The Good

This is something that site owners want to do when they first set up their blog, so it is good that there is an option provided.

The Bad

The link does not include any instruction on what comments are, what they are used for, and there isn’t an option to turn comments off site-wide.

If you turn off comments, it will only be for posts going forward, but past posts and pages will still have the discussion settings enabled, which is very confusing for new users.

Suggestions for improvement

Include a link at the top of the Discussion settings page to read more about what comments are, perhaps this page: https://codex.wordpress.org/Comments_in_WordPress The problem with this page is that it still doesn’t tell you how to specifically turn comments off. In order to turn comments off, you have to take the checks off “Allow people to post comments on new articles” but any posts or pages that have already been created using the discussion settings have to be modified to turn off comments individually.

I think what people would like to see is a “Disable comments site-wide” option that would remove comments from all past and future posts/pages and that the language was more clear

If comments are turned off, the other options should be grayed out since they only apply if they are using comments. These options should appear conditionally if the comments or pingbacks are checked.

Turn Comments On or Off

The importance of highlighting that flow for new users in the Welcome Panel

This is a critical choice that really separates blogs from websites and should be done immediately. It is most often set once and forgotten. New users, however, my not understand the choice and what it means for their site.

Once you’ve clicked through to it, what happens? What is currently good or bad, or could be improved?

What happens after the click

When you click on the link, you go to the Settings > Reading screen.

What is currently good or bad

The Good
It’s an easy either/or choice. It’s also a “set it and forget it” choice.

The Bad
Who would ever thing to look under “Reading” for this? Putting it on the Welcome Panel alone is an improvement. I’m not a fan of the “static page” link that goes to the Pages screen. With the pages available as a dropdown, it seems unnecessary and problematic when folks bounce over there with no real idea why, or how to get back. One other big thing that’s missing for new users is any information on how to make the decision between the two and/or the consequences of the choice.

Suggestions for improvement

Replacing the “static page” link with a tooltip on what a static page is and adding one for “latest posts” would help new users make an informed decision.

Is this a “Day 1” link and if so, what should replace it?

I believe this should be a “Day 1” link. It could perhaps display a checkmark once the setting is saved, but perhaps continuing to display the link so people can return to it isn’t a bad idea.

I’m still of the opinion that there should be a screen/panel just for things that are nearly always set once and then forgotten: front page setting, comments, timezone/date format, and permalinks could all be put on one screen rather than scattered hither and yon for new users. That screen could also provide information on where to find them once this “Day 1” panel had been completed.