Make WordPress UI

Tagged: discovery-cycle-1 Toggle Comment Threads | Keyboard Shortcuts

  • lessbloat 8:40 pm on October 2, 2012 Permalink
    Tags: discovery-cycle-1,   

    Decided to run another user through this afternoon:

    Here’s the video, and my notes:

    Step two notes – Log in

    No problems.

    Step two notes – Explain what you see

    No problems.

    Step Three notes – Preview your blog

    No problems.

    Step Four notes – Change your background color

    3:22 – She tried typing “blue” into the hex text field – didn’t work.
    3:26 – No issues figuring out the color selector. Yay!

    Step Five notes – Change your site title

    No problems.

    Step Six notes – Add your first post

    No problems.

    Step Seven notes – Preview your new post

    No problems.

    Step Eight notes – Publish an image

    7:55 – Our first successful test of the new media flow. Double yay!

    Recap

    Smashing success. Came in at 8:32 for all tasks. Quickest time yet I do believe…

     

    • Isaac Keyet 11:20 pm on October 2, 2012 Permalink | Log in to Reply

      re: step 4: probably way overkill but it’d be cool if the field did support the basic colors as specified in html and css. I.e.: aqua, black, blue, fuchsia, gray, grey, green, lime, maroon, navy, olive, purple, red, silver, teal, white, and yellow.

    • toscho 12:04 am on October 3, 2012 Permalink | Log in to Reply

      Or add a script that converts these words automatically to hex values when they are typed.

    • bradparbs 4:34 am on October 7, 2012 Permalink | Log in to Reply

      Based on this and the other videos, no one seems to know what QuickPress is. I threw a ticket up on Trac, #22119, suggesting we rename it. I think it might help.

  • lessbloat 5:37 pm on October 2, 2012 Permalink
    Tags: discovery-cycle-1,   

    Ran another user through Discovery Cycle 1 this morning.

    Here’s the video, and my notes:

    Step two notes – Log in

    No problems.

    Step two notes – Explain what you see

    No problems.

    Step Three notes – Preview your blog

    No problems.

    Step Four notes – Change your background color

    • 3:36 – He had to play around a bit, but he figured out how to change the color to blue fairly quickly
    • 3:52 – He clicked the “default” button resetting the work he had done to choose a color.

    Step Five notes – Change your site title

    No problems.

    Step Six notes – Add your first post

    No problems.

    Step Seven notes – Preview your new post

    No problems.

    Step Eight notes – Publish an image

    • 7:20 – Cool, he clicks into new media workflow. But unfortunately he’s looking to paste a URL, which isn’t currently in the new media workflow just yet.
    • 9:05 – He discovers the “Upload/insert” link, and has no trouble adding the URL.

    Recap

    • Overall, I’m super happy with this test. He completed everything in 10 min which is a great time (compared to where we started off at the beginning of the 3.5 cycle).
    • Happy to see the first user try the new media flow, even if it didn’t work out for him. We’ll continue to to test new users as that section fills out.
    • 7:30 – When he entered a URL into the media uploader, it appeared to succeed for a brief second, you saw a file upload happening briefly and then it disappeared (just a heads up @koopersmith).
    • Do we need to do anything about the “default” button in the color picker? Would be a shame if someone took a bunch of time to find just the right color, then lost it with a click.
     

  • lessbloat 4:03 pm on September 3, 2012 Permalink
    Tags: discovery-cycle-1,   

    I sent two additional users through discovery cycle 1 on Friday afternoon. The four initial tests can be found here.

    User #5 through these scenarios

    Here’s the video, and my notes:

    Step two notes – Log in

    No problems.

    Step two notes – Explain what you see

    No problems.

    Step Three notes – Preview your blog

    Found it after a bit of trial and error

    Step Four notes – Change your background color

    5:20 – Yay! She was able to use the color picker.

    Step Five notes – Change your site title

    5:55 – No problems.

    Step Six notes – Add your first post

    6:42 – No problems. Used the “+ new” menu

    Step Seven notes – Preview your new post

    No problems.

    Step Eight notes – Publish an image

    9:40 – No problems – Another instance of a user literally copying and pasting the image into the visual editor.

    Recap

    Quickest user test so far. By far. Yay!!!!

    User #6 through these scenarios

    Here’s the video, and my notes:

    Step two notes – Log in

    • Takes 2 times to log in, but no problems.
    • She see’s the big IE is out of date notice.
    • 2:20 – “It’s a little distracting”, referring to dashboard in general.

    Step two notes – Explain what you see

    No problems.

    Step Three notes – Preview your blog

    No problems. Clicked link in welcome screen.

    Step Four notes – Change your background color

    • 3:30 – hunting and pecking through left nav
    • 5:00 – tries using color picker (which semi-works in IE7/8?), she selects a color from the right hue slider, but it doesn’t update the color. :-(
    • 5:50 – comes back a second time, and only see’s hex text box – user gives up.

    Step Five notes – Change your site title

    • 6:30 – User ends up in Appearance -> header (this is about the 3rd user out of 6 that have tried it here). Note: we need to add a link on this page.
    • 7:40 – Still trying to find it in appearance -> header
    • 8:24 – Finds it in settings -> general

    Step Six notes – Add your first post

    9:30 – IE7/8? woes adding title in “Add new post”

    Step Seven notes – Preview your new post

    No problems.

    Step Eight notes – Publish an image

    No problems.

    Recap

    • So we’ve still got problems with the color picker. I think it’s slightly unfair to judge this too critically since the user is using IE7, or 8?
    • I’m going to work up a quick patch to add a link to edit the users site title from the appearance -> header page.
     

    • toscho 11:10 am on September 4, 2012 Permalink | Log in to Reply

      I think I will add the ability to edit the blog title on the header appearance page to my themes from now on. These videos are real eye-openers. :)

    • snaushads 7:15 pm on September 5, 2012 Permalink | Log in to Reply

      Im new to Make WordPress, though ive been using wordpress for 2 yrs (not as a developer), I got to know how the UI is being worked upon by Matts “State of the Word 2012″.
      And yes the video made me realize that its not the way “i” think users use WordPress.
      How can i contribute as a non-programmer ?

      I understand the correct url would be: http://make.wordpress.org/ui/tag/discovery-cycle-1/

      Thanks.

  • lessbloat 4:48 pm on August 27, 2012 Permalink
    Tags: discovery-cycle-1,   

    Now that we’ve got a couple of rough patches (welcome screen, color picker, “view” my site) it’s time go back and test a few users in our first discovery cycle with these patches applied, and see if we’ve made any progress.

    Here’s the video, and here are my notes:

    Step two notes – Log in

    No problems.

    Step two notes – Explain what you see

    No problems.

    Step Three notes – Preview your blog

    • 4:00 – She’s looking for a link
    • 4:14 – “Oh here it is” – She clicks “Visit my blog” in toolbar (Win for “view” my site patch).

    Step Four notes – Change your background color

    • 5:45 – When asked to change the background color, she immediately (instinctively) clicked the big blue “customize my site” button (woot!).
    • 5:55 – she easily found the BG color option in the customizer.
    • 6:00 – Oh noooes, she found a bug in Iris (so painful to watch…)! clicking the right column of Iris does’t change the color in the text-field (After a bit of testing, it looks like if you click the right column first, before clicking the left gradient box, nothing happens. If you click, if you click the left box first, then the right column, it works as expected.) cc// @mattwiebe
    • 8:07 – “Each time I view my blog it gives me a slightly different picture”.
    • 9:10 – still trying to figure out why BG color isn’t changing – “I’m so confused”
    • 10:30 – Moved on without being able to figure out how to change BG color. :-(

    Step Five notes – Change your site title

    • 10:50 – Looking in Appearance -> Header for a place to change her site title (which really makes sense, we need to add a link there).
    • 11:10 – didn’t find it in Appearance -> Header, no she’s checking all up and down the left nav
    • 12:20 – Found it in the customizer
    • 12:30 – What the? She couldn’t add spaces? That is weird. There is a bug in one of the patches? cc// koopersmith can you spot any reason why this would be happening in one of the patches listed above?
    • 13:20 – “I’m very confused – I don’t know how I would insert spaces”
    • 14:22 – gave up without being able to add spaces…

    Step Six notes – Add your first post

    No problems.

    Step Seven notes – Preview your new post

    No problems.

    Step Eight notes – Publish an image

    She found how to upload the image – not going to worry about anything after that for now, since media manager is being revamped. We’ll do plenty of user testing on the new media manager once it’s complete.

    Recap

    • Bug in Iris prevented her from changing her background color
    • Can we please NOT have rotating header images in twenty twelve? None of the users we’ve tested have really comprehended what’s going on there.
    • We really should add a link on “Appearance -> Header” to “Settings -> General” to change their site title or tagline.
    • There was a bug in the customizer when she tried to update her site title which wouldn’t allow her to add spaces.

    I’d like to get the color picker bug fixed before I run another user through these changes, but overall, I’d say these patches have already really improved things for first-time users. Thoughts?

     

    • Amy Hendrix (sabreuse) 4:58 pm on August 27, 2012 Permalink | Log in to Reply

      I’m really excited about some of the improvements!

      (And Twenty Twelve doesn’t ship with any header image at all — if anything, we’ll be documenting that yes, you can add a header, and you don’t need to go to some scary code-snippet back alley to do so.)

    • Isaac Keyet 6:06 pm on August 27, 2012 Permalink | Log in to Reply

      Honestly it seemed like the main problem she had with changing colors was not the bug but that type of color picker altogether – a round color picker with the slider setting the black key (like the default apple picker) would probably be easier to comprehend for beginners. e.g.: http://cl.ly/image/061K1E1k2S2u

      • etoxin 7:42 am on August 28, 2012 Permalink | Log in to Reply

        It looks like the actual picker (in the square) is far too transparent. Maybe a small subtle animation on click could solve this or a darker colour.

        • etoxin 7:50 am on August 28, 2012 Permalink | Log in to Reply

          At 8:25 she gets the colour picker to work. Maybe simplify it to colour swatches and offer an advanced colour picker.

    • toscho 6:42 pm on August 27, 2012 Permalink | Log in to Reply

      What a pleasant voice. :)

      It should be possible to change the site title in Appearance/Header without going to settings.

      And I think the pointer for media uploads is positioned a little bit too obtrusive. The Upload/Insert text is clear enough.

      • lessbloat 6:47 pm on August 27, 2012 Permalink | Log in to Reply

        The fact that she saw that is a bug. That pointer shouldn’t even be showing unless they click the “Add images/media” link under the right column “Learn how to” section. I’ll look into suppressing that pointer unless they click that link. This implementation is just a stop-gap until we figure out how we want to connect the two related pointers. I didn’t want that to stop me from starting to test users, so I made a quick work-around (which unfortunately was buggy). ;-)

    • Peter Chester 6:49 pm on August 27, 2012 Permalink | Log in to Reply

      I get so happy reading this! Rock on!!!

    • John Blackbourn (johnbillion) 7:07 pm on August 27, 2012 Permalink | Log in to Reply

      Where did the “Install a new theme” pointer that popped up on step 5 come from?

      • lessbloat 7:12 pm on August 27, 2012 Permalink | Log in to Reply

        Same bug as @toscho mentioned. I had forgot a “!” in the pointer code. This one should have only been triggered when the user clicked the “Change your theme” link in the right column of the welcome screen. Instead of only showing those pointers when the user clicked those links, I was showing the pointers all of the time, unless the user clicked those links… ;-) Ah… what fun a missing “!” can cause.

        Anyhoo. This is fixed now on my testing install, and should be good to go for the next user test.

      • Konstantin Kovshenin 4:26 am on August 28, 2012 Permalink | Log in to Reply

        Why was she taken to Appearante – Themes in the first place? She was on her Dashboard, she clicked Customize, she saved and closed, and should be returned to where she initially was, her Dashboard. I pronounced the same “whoops” she did when watching the video :)

        @koopersmith, I think we fixed “redirecting to where we came from” in the Customizer in 3.4? Did it break again or does it work for front-end only?

        • Daryl Koopersmith 5:20 am on August 28, 2012 Permalink | Log in to Reply

          I think we fixed “redirecting to where we came from” in the Customizer in 3.4? Did it break again or does it work for front-end only?

          Neither — default behavior is to redirect to the manage themes page, and it doesn’t appear that these patches are using either of the methods that will cause the “return” action to redirect to another page.

          We have two different solutions to do so: one is a query arg (see the admin bar for an example) and the other is customize-loader.js, which uses HTML5 history to maintain page state (used in the theme browser).

        • lessbloat 9:00 am on August 28, 2012 Permalink | Log in to Reply

          Good catch. Ya, it would be great if clicking close would take her back to the dashboard, instead of themes.php.

    • Diana 11:01 pm on September 9, 2012 Permalink | Log in to Reply

      Greate material! I would like to reinforce some aspects :) :
      This color picker is really confusing for most people, the tinyMCE text color is way more helpful providing some colors right on click .
      In Customizing panel, the itens should be separated by area such Header, Content, Background etc , though this is more a theme author approach?!
      Title and Description should stay within Header options, (not link to Settings).
      The “Insert into post” button should be blue.
      Most people access Dashboard instead using the left menu itens, then I think this panel should display icons/links for those panels with some short description. (People are afraid of going somewhere they can’t go back :D )

  • lessbloat 5:52 pm on June 27, 2012 Permalink
    Tags: discovery-cycle-1,   

    It’s summary time.

    Recap

    We’ve run 3 users through the same set of scenarios (via usertesting.com). You can review the results here, here, and here.

    Disclaimer

    Now… What exactly are we trying to accomplish with all of this?

    It’s important to note that we have to think about these discoveries in the context of the typical WP user. But to be honest, I’m not entirely sure I know what the “typical WP user” looks like (but I hope to dig into that over the next couple of months ;-) ). Sure, I have assumptions, as I’m sure you do, but my assumptions aren’t backed by any sort of data.

    The important thing to keep in mind here is that these 3 people were paid to perform a list of tasks. While we can benefit from watching their interactions (and looking for patterns of complexity/confusion), we need to recognize that the flow they follow is prescribed, and likely different in some ways from an actual user.

    Overview of discoveries

    Here’s an unfiltered list of observations across all of the tests:

    Background

    • Had trouble figuring out how the color selector worked (x3)

    Dashboard

    • Unsure what “QuickPress” was
    • Unsure where “1 post”, “1 page” came from under “Right Now”
    • Had lots of trouble finding a link to view their site

    Media Upload

    • User clicked “Select files” when they actually had a URL to paste (and should have used the “From URL” tab). (x3)

    Post Add New

    • Lost all changes when she clicked a link taking her away from the new post page (after already making some changes)
    • Didn’t notice “Insert into post” button when adding an image in the media modal
    • Clicked “Preview” button, but didn’t realize a new tab had opened (causing confusion)
    • Doesn’t appear to be a clear path for users that just wish to post a photo

    Settings

    • Had trouble knowing where to go to change her site title (x3)

    Toolbar

    • User didn’t notice links in toolbar (x2)
    • User never noticed “+ new” dropdown (x2)
    • The blog dropdown menu is completely different when in the admin vs. on site (should it be?)

    Twenty Eleven

    • Confusion over why the header image was changing (x2)

    Next steps

    This is where I need your insight/input.

    1) First, is there anything that you noticed that’s not on this list?
    2) Next, which of these do you think we should attempt to address (are there any quick wins that would benefit all WP users)?
    3) If you had to prioritize your list, what would you tackle first?

    I’ll hold off for a day before I post my thoughts. Don’t be shy! ;-) I’d love to hear what you think.

     

    • Drew Jaynes 12:53 am on June 28, 2012 Permalink | Log in to Reply

      1) Something I think that is starkly missing is mention if the seeming importance of the Welcome Screen and the way in which these 3 users relied so heavily on it. The users weren’t dismissing the screen and using the Dashboard so much as returning to it over and over for guidance.

      2) I think one quick win would be to revisit the “Add Media” button. I know I’ve seen some discussion on trace of a labeled button or a larger icon. Another option might be something like an idea suggested by @kovshenin for dragging media directly into the editor. On the topic of the ‘site title’ issues, it seems like we’re moving more and more toward consolidating settings and previews into the Customizer. Perhaps some clearer verbiage on the Welcome Screen about what the Customizer is for (and some pointers once you get there) would be more helpful.

      3) Not to rehash too much, but I’d say 1) Add Media, 2) Clearer connection between Welcome Screen & Customizer.

    • Helen Hou-Sandi 10:15 pm on June 28, 2012 Permalink | Log in to Reply

      1. Maybe I missed it, but I didn’t see any mention of the featured image/post thumbnail functionality – there are quite a few tickets already about how weird and difficult that workflow is.

      2. More prominence for the Customizer and a consolidation of all of those items into the same admin menu rather than spread out between Appearance and Settings seems like a relatively quick win. Or even duplicating menu items. Would also *love* to find a better color picker – Koop and I have discussed this in the past.

      3. Besides the featured image thing, which I’ve talked about several times, I’ve been contemplating a reworking of the dashboard to become more useful – I think I called it “more mission control, less info center”. Full editor + post formats (would help with quick posting photos, much like the iOS app does) for Quick Press, better/prettier information about basic site/post metrics (including all other public post types), etc. This would also hopefully roll in the nice things the welcome panel does – a guide to getting things done for first-timers, as well as quickly enabling power users to get where they usually need to go. For instance, I could see items like “Edit the home page” for a site that has a static front page assigned.

    • Chelsea 12:08 am on June 29, 2012 Permalink | Log in to Reply

      1) I think the “Settings” issue can be expanded to an overall organization/delineation between “Settings” and “Appearance” (as @lessbloat mentioned in an earlier user test writeup). It might be worth thinking about doing user tests specific to figuring out which part of the admin users generally look for things like “Site Title” “Header” “Language” etc. Its something I see a lot of people struggle with when setting up a new WordPress site.

      2) I second @helenyhou on making the Customiser more prominent. It could also go a long way with giving insight on how to address the problem I mentioned in #1.

      3) I would prioritize rehashing the media flow/making it easier to create media-heavy content above everything else. Its what we get criticised for the most and I think its the biggest thing other CMSs have over WordPress.

    • lessbloat 4:29 am on June 29, 2012 Permalink | Log in to Reply

      1) As I alluded to in my disclaimer, the area that I’m most interested in focusing (at the moment) is in gathering more data around who’s using WordPress, and what they’re doing with it. For example, I’d like to figure out the percentage of people who download WP that:

      • use it for business vs. a personal site
      • use it for a blog/website/blog & website/other
      • consider themselves designers/developers/both/neither
      • are first time users/repeat users
      • are building a site themselves/or for someone else
      • consider themselves novice/intermediate/pros

      I’m also very interested in figuring out a way to create a benchmark of sorts and a way to chart our peaks and valleys within the app (moments of joy/pain) over time. If we can figure out a way to do that, we can then prioritize the elimination of the biggest valleys, and work on flows that get users to moments of joy quicker and more frequently.

      2) A couple of things:

      • Welcome screen – I think we all agree that a second pass may be beneficial here
      • Media insert – Giving the “Insert into post” button a class of button-primary (would make it stand out a bit better)
      • Toolbar links – I may be opening up a can of worms here (not knowing any back story on the current design), but I’d love to see A) some visual indication that each of the 4 drop downs are in fact a drop downs, without having to hover over them, and B) some ideas around ways to make the “+ new” drop down stand out a bit more (it’s a really handy resource, and 2 of the 3 users never noticed it).
      • Color selector – I’m with @helenyhou, I’d love to see this get some attention (paging @koopersmith ;-) )
      • Media upload – It might be nice to at least start brainstorming alternative flows here

      3) Honestly, these all sound exciting to me. I’ve tried to list them in order (based on impact/time) specifically with the goal of improving this discovery cycle. After we’ve got a few patches pulled together, I’ll apply them to my little testing environment, and rerun this scenario-set with 2 additional users.

      I’ll also be working towards getting my hands on some more data. I’ll post more about that to this P2 in the coming weeks.

    • Shane Pearlman 3:43 pm on June 29, 2012 Permalink | Log in to Reply

      For #1, I’m deeply fascinated with that question. While .com may have some success in beginning to build those analytics, I have no clue how to proceed on .org driven sites besides surveys. With such a vast ecosystem, how do you get strong data about user roles and behaviors. For example, I’m deeply curious how many users on average have admin level access (even if they don’t need it) vs people in editorial / authorship roles. It truly affects their experience on the back end.

      @lessbloat, how were you thinking of exploring?

      • lessbloat 4:23 pm on June 29, 2012 Permalink | Log in to Reply

        For the first part of #1, I’d love to start off by running a series of small (one-question) KissInsights polls after people click the download button on http://wordpress.org/download/. It would look something like this: http://cl.ly/0n0y1v3N3Y1m1L0D1X1S

        After we get some data, I’ll summarize the results on this P2.

        The second part (figuring out a way to measure peaks and valleys over time) is going to take some noodling. I’m all ears if you’ve got any ideas.

        • Shane Pearlman 6:43 pm on July 3, 2012 Permalink | Log in to Reply

          +1 for the kiss insight poll. That is a great idea.

          • lessbloat 7:34 pm on July 3, 2012 Permalink | Log in to Reply

            With that said, it’s still self-selecting. I have no idea at this point what percentage of users get their WP install from WP.org. I’d also venture to say that those users fall on the outskirts of WP’s 30 million users (on the more advanced side). But, it’s a start, and any data is better than no data IMO, as long as you acknowledge that it’s a bit tainted.

            Though @Jane did have a great idea about adding the UI Advisory signup form on the forums, maybe we could get a few KissInsignts tests in there?

  • lessbloat 6:01 pm on June 26, 2012 Permalink
    Tags: discovery-cycle-1,   

    Round 3 of this “Discovery Cycle” is ready to preview. Check out round one & round two, if you’ve not already.

    Here’s the video for this round.

    (More …)

     

    • Mel Choyce 6:40 pm on June 26, 2012 Permalink | Log in to Reply

      It’s really interesting to see where everyone tripped up. Watching everyone try to user the color picker was pretty painful. Maybe something like this would be a little more intuitive? http://www.colorpicker.com/ As you change the hue on the right, it adjusts the color accordingly, while on the current WP color picker, the inside color box doesn’t change at all when you adjust the outer ring (which is pretty counter-intuitive).

      I also liked your suggestion in the first round of adding “View My Site” into the dashboard menu.

      These were great to watch, thanks for doing them!

      • lessbloat 4:44 pm on June 27, 2012 Permalink | Log in to Reply

        Thanks for taking the time to watch them. I appreciate the feedback. :-)

    • Shane Pearlman 6:55 pm on June 26, 2012 Permalink | Log in to Reply

      These are simply wonderful. Any chance in the future you might be willing to set it up so that core team might watch them live and discuss? We ran our last usability test for our plugin (http://wordpress.org/extend/plugins/the-events-calendar/) on join.me and invited all contributors to watch real time and chat on Skype. The discussion that sprung from all participating concurrently was highly valuable.

      • lessbloat 4:42 pm on June 27, 2012 Permalink | Log in to Reply

        Thanks Shane.

        That sounds fun. Usertesting.com doesn’t offer live streaming (that I’m aware of). I’m sure you could take one of the videos and rig it up to a live streaming service of some sort though.

  • lessbloat 7:45 pm on June 25, 2012 Permalink
    Tags: discovery-cycle-1,   

    I’m back with results from round 2 of our “Discovery Cycle“. This lady was certainly a bit more savvy. If you haven’t seen round one, you might want to check that out first. I left the detailed user instructions out of the summary this time, since they’re the same for both users.

    Here’s the video, if you’d like to follow along.

    (More …)

     

    • John Blackbourn (johnbillion) 2:40 am on June 26, 2012 Permalink | Log in to Reply

      my gut says to almost never use “target=blank” in a web app. If a user wants a link to open in a new tab, they can right click and make it happen, or hold down command

      As soon as she pressed ‘Preview’ I knew that the user wasn’t going to immediately realise a new tab had opened. This definitely needs to change. Maybe we should preview the post in a lightbox? We need to bear in mind the current sub-optimal behaviour surrounding saving data when previewing posts (#11049, #20299), so we can’t necessarily navigate away from the post editing screen when a preview is performed.

      The ‘Preview Post’ link in the ‘Post Update’ message for draft posts also opens in a new tab, as does the ‘Change Permalinks’ button when you’ve not yet set pretty permalinks. These are equally as confusing.

      Right clicks on editor and pastes the copied image (it worked)</blockquote.
      TIL! :D

      • lessbloat 11:50 am on June 26, 2012 Permalink | Log in to Reply

        TIL!

        No doubt. I had no idea this was possible. In fact, while I was watching the video and taking notes, I paused it just before she did it and typed “Right clicks on editor and attempts to paste the copied image (obviously it didn’t work)” But then when I unpaused it, I had to change my notes…

    • Matt Mullenweg 2:34 pm on June 26, 2012 Permalink | Log in to Reply

      For preview, I’d almost rather have some sort of frame (doesn’t need to be a real frame) that makes it clear you’re in preview mode and provides you a clear path back. The admin bar, which currently has no indication at all you’re previewing something, would be an ideal place for this. It’s fair to note that even if we didn’t open a new tab clicking “previous” still would work, and that learning the new tab action is probably a one-time thing.

      • Helen Hou-Sandi 10:19 pm on June 28, 2012 Permalink | Log in to Reply

        A (colored?!) item in the toolbar indicating that you’re in preview mode would make so much sense, even just as a quick fix.

    • Chelsea 5:41 pm on June 26, 2012 Permalink | Log in to Reply

      “There appears to be a blur in users minds between what should fall under “Appearance” and what falls under “settings”. Settings did not immediately stand out to this user as the place that she’d change her site title. There may be a recurring theme emerging here.

      I’ve seen this a lot in new user workshops as well. People find it disorienting to have to go to two parts of the admin to accomplish what, in their mind, is one overarching task (customizing the look of their site).

  • lessbloat 9:08 pm on June 22, 2012 Permalink
    Tags: discovery-cycle-1,   

    Hey everyone, my name is Dave Martin. 

    I thought I’d introduce myself, as I hope to start spending some time contributing to core.

    I’ve been designer at Automattic for close to 2 years (working on Akismet, VideoPress, and CodePoet). Before Automattic, I was the lead UI designer at Campaign Monitor for 2 years. I look forward to meeting you.

    I’m just getting my feet wet, and quite honestly haven’t a clue where to get started ;-) , so I thought I’d set up a quick user test (I’m a big fan of user testing). I set up a temporary WP install, and ran a user from usertesting.com through a couple scenarios.

    You can download the video here if you’re interested.

    Here are my notes (sorry, they’re kind of long):

    (More …)

     

    • Jane Wells 10:13 pm on June 22, 2012 Permalink | Log in to Reply

      We should revisit the welcome box in every release, really. We totally failed to take the customizer into consideration with that, or to look at revising any of the content there in 3.4.

    • scribu 12:34 am on June 23, 2012 Permalink | Log in to Reply

      Hello Dave,

      I’m a developer, not a designer, but I found this post very informative. Moar please! :D

    • Helen Hou-Sandi 5:14 am on June 23, 2012 Permalink | Log in to Reply

      I need to make time to actually watch the video soon, although your transcription probably about covers it, but THANK YOU for doing this! We definitely have plenty of things to think about and work on, and I hope we can do more of this testing :)

      Wanted to note that I did look at the video to see which version the test was done on, since she never discovered the theme customizer, and it is trunk. So, there’s that. A little sad – we need to fix that for sure.

      • lessbloat 3:10 pm on June 25, 2012 Permalink | Log in to Reply

        Howdy Helen,

        I hope we can do more of this testing

        I hope so too! ;-)

        Next steps:

        • 2 more rounds of people going through these same 8 scenarios (I’ll recap what I see with each one, like I did with this first one).
        • I’ll summarize everything that we discovered across all 3 tests.
        • Then, I’d love y’alls helps to 1) prioritize tasks, 2) create Trac tickets, and 3) write patches for the quick wins.
        • I’ll run 2 more people through the same scenarios after the patches have been applied to see what impact they’ve made.

        All of these steps together form one “discovery cycle”. The goal being to find/fix reoccurring patterns of complexity, difficulty or confusion.

        • lessbloat 3:57 pm on June 25, 2012 Permalink | Log in to Reply

          I felt the need to clarify that with all of this, I’d love to hear your thoughts, feedback, and even criticisms! ;-)

          I’m very much aware that I’m a new fish in this very big pond (which to be quite honest is pretty intimidating) :-)

          I’m the “awkward new kid that just moved to a new school”. So, If I’m doing something wrong, or out of order, please let me know, and help me get on track.

          My hope with doing this “Discovery cycle” is:

          • That we can expose some quick wins by just observing users.
          • That I can get to know you guys, and see how things get done around here.
          • That I can get my feet wet – create my first ticket, and write my first patch.
          • That these discovery cycles can become a regular practice, and those of you who are interested can take ownership of one in future releases (which could include testing broad areas within wp-admin (as I’ve done), or focusing in on very specific functionality – like media uploads).

    • arena 9:47 am on June 23, 2012 Permalink | Log in to Reply

      Hi Dave

      And what if the admin bar was really about administration of site including items such as

      • Appearance
      • Plugins
      • Tools
      • Settings

      • lessbloat 3:13 pm on June 25, 2012 Permalink | Log in to Reply

        Yep, I’m sure the Toolbar could use for some testing/tweaking as well.

    • Thomas Scholz 11:18 pm on June 23, 2012 Permalink | Log in to Reply

      Thanks, very interesting. We have way too many distractions in the interface. Especially the initial dashboard widgets are rather confusing (Quickpress, Feeds). And the first visible help text doesn’t say anything useful.

      It almost hurt to watch her struggle. :)

      • lessbloat 3:12 pm on June 25, 2012 Permalink | Log in to Reply

        It almost hurt to watch her struggle

        Ha ha. Yep. That’s why these are so valuable/worthwhile…

    • krembo99 3:34 am on June 24, 2012 Permalink | Log in to Reply

      This is a great .. If only you had time to watch all the videos of all the users :-) but is sure can produce good results to tackle some of the notorious UI flows that were inherited from older versions (mainly – media / attachments handling ..)

      • lessbloat 3:15 pm on June 25, 2012 Permalink | Log in to Reply

        Let’s start with just a couple. ;-)

        It’s funny, you’d be surprised how much you can catch by just observing a hand full of people.

    • Matt Mullenweg 4:47 pm on June 25, 2012 Permalink | Log in to Reply

      Thank you very much for this, I think more frequent and more transparent testing will allow us to make much better informed product and UX decisions. If we do this right we should see the videos get better and better (shorter and less confusion) from release to release. :)

    • Jannis Gundermann 11:19 pm on June 27, 2012 Permalink | Log in to Reply

      This was fascinating to watch, thanks for uploading this.

      I found that most of her struggles were quite logical from a user point of view.
      “Settings” for example does not really speak “Change the title of my blog” to a user.

      I would assume most non-technical users will file it under:

      It’s something I can see on my page…
      Oh there is an “Appearance” tab, click…
      Hmm… well I can see it here so I must be in the right tab but I can’t change it here…
      Doesn’t work, I will come back to this (aka I won’t change the title or ask someone else for help).

      The other issue that was really great to observe was the image uploading option that with all the options in the popup/modal didn’t even show her the “Save all changes” button on her initial view.

      Really great stuff, thanks again.

c
compose new post
j
next post/next comment
k
previous post/previous comment
r
reply
e
edit
o
show/hide comments
t
go to top
l
go to login
h
show/hide help
shift + esc
cancel