Media Grid – User testing round 1

We recently performed some quick user tests on the Media Grid (at Beta 2) to see how users fare when performing various tasks, and came out with some interesting results.

TL;DR – The concept of the Media Grid was intuitive and easy for users to understand, especially navigation and editing metadata; however, uploading media and bulk selection tasks were still problematic for most. A lot of work could be done to make these more straightforward.  

We also tested hiding all metadata (title, mime type, etc.) from the grid view, and saw no difference in performance, which hints at the possibility that metadata is not as important here as it is in the list view.

Follow the jump to see more details about this round of user tests. Continue reading

#media-grid, #user-testing

Media Library user interviews: Summary of findings

To get a better understanding of the kinds of tasks users perform in the current Media Library (and related Add Media page) before working on refinements to the Media Grid project, we interviewed 8 users on their current habits, tasks, pain points, and a little about what they would like to see.

TL;DR: Grid is good, but…

Images are by far the most common media type to be found in user’s libraries, and files can number into the hundreds (some in the thousands) in most cases. Given this, most users would benefit from the ability to see larger thumbnails of files, as well as a more a efficient grid layout.

However, much of the data that is displayed in the list view (title, attachment page, date, etc.) is also important to how users sort through and find media, and their importance changes based on the “mode” the user is in, so parity with the list view, or the option to switch back to it, will be important.

Want to know more about the interviews? Read on…   Continue reading

#media-grid

Do you use the Media Library to manage your media? Let's chat!

A group of us have been look into improvements to the Media Library (Media > Library) interface in the admin dashboard. If you currently use Media Library, or have used it in the past, we want to ask you about it.

We’re looking for about 5-10 people to meet with over the next couple of days, so we can chat. Should take just take a few minutes of your time!

If interested, please send me an email at jerrysarcastic [at] gmail, or ping me at jerrysarcastic on IRC.

#media-grid

Media Grid: Thumbnail Resizing

Outside of a grid layout, there are a few other features that the Media Grid team has been discussing. Lets talk about one of these feature: Thumbnail Resizing.

Recap: Why a grid?
The entire purpose of moving towards a grid layout for the Media Library is to make it easier for you to manage your media — images, videos, audio, documents, and more. The library currently uses a standard “wp-list-table” view. (This actually could use some love, too.)

Media Table View

The Media Grid plugin currently replaces the tableview with the existing Media Manager grid, commonly seen while adding an image to your post.

Media Manager

Images and videos are visual files, and lend themselves to a thumbnail grid. Its easy to find an image by scrolling through a grid. There’s a lot of potential for extending previews to other types (like audio, pdf’s, etc), which would also benefit from the grid UI.

Resizing

While working on the Media Grid plugin, I often found myself reference other file management tools. Programs like OS X’s Finder, Windows’ Explorer, Apple’s iPhone (Mac and iOS), and a few others. One pattern I noticed was that most of these applications offers some way to change the way you view “things” (files, images, documents, whatev’s) in your list. In my own experience, I find myself changing the thumbnail size while browsing a bunch of images on my computer:

Finder Default Icons

Finder’s default thumbnail size.

Just move this little slider...

Just move this little slider…

…and boom, larger icons!

The larger grid view really shines when browsing more details images, or lots of similar images. Its also a great way to just look through your images in more detail, without having to jump to a full size view for each one.

The Media Grid plugin currently has some thumbnail size options. The first iteration used a slider and animated the thumbnails as they changed size, right in front of your eyes! It was cool… at first. Then it quickly got annoying.

A few more iterations

The animation was jumpy, and more distracting than anything else. I nixed the animation, but the slider still felt unnatural — there aren’t any other sliders in wp-admin. I decided to keep things simple, and replaced the slider with a three buttons: Small, Medium, Large. After another few weeks of using this, I found myself using Small and Medium often; Large was rarely used. So I trimmed the options down to simply: Small and Large. This is where’re at in the current plugin:

Resize_in_Action

(I wrote about some of the above earlier, over on the Media Grid team blog.)

Now what?

What do you think about the size options? Are the helpful, or unnecessary bloat? Or somewhere in between?

What do you think about the two (Small, Large) options?

Is the straight-forward label toggle a good UI? What about icons, like this:

Media Library Nav Bar

#media-grid

Media Grid Update

I’ve been working alongside @ericlewis on making the Media Library better. Our primary focus has been to adapt the existing media manager modal for use in the page. We’ve been developing over at GitHub: https://github.com/helenhousandi/wp-media-grid-view

There are two active branches right now.

In the persistent-sidebar branch, I’ve been exploring alternate UI’s for a grid view, as well as interactions for selecting, browsing, and editing your media. I pushed the latest from the branch to the Media Grid plugin on the WordPress.org plugin repo the other day. Please install it and let us know what you think: https://wordpress.org/plugins/media-grid/

Over in the backbone branch, Eric has made considerable progress breaking the media manager out of its modal. He’s also managed to add the thumbnail size options.

We’re experimenting with using a blog for more regular updates and discussions. If you’d like to join in, just let me know: http://coremediagrid.wordpress.com

We’ll have our normal meeting in IRC today (#wordpress-ui) at 16:00 UTC (12pm eastern) to discuss our next steps. We hope to see you there!

#media-grid

Back at the first 3.8 chat I mentioned…

Back at the first 3.8 chat, I mentioned wanting to see a grid layout for the media library. I threw together a few wireframes and wrote out my thoughts. This is still listed as a “feature as a plugin,” but has no lead, and no weekly meeting. I’d like to change that — anyone and everyone who’s interested in improving the layout of the media library: lets meet in #wordpress-ui Friday, August 30 @ 15:00 UTC. If you’re interested in joining (and leading?) this group, please leave a message and try to join us Friday.

#media-grid