To change things up, I tested a different set of scenarios this morning. I asked the user to add:
- A regular post
- A post with a gallery
- An audio MP3
- A video from Vimeo
You can download the video here.
My observations:
Step 1: Login
No problems.
Step 2: Preview your blog
No problems.
Step 3: Add text post
1:25 – I said “enter the description of “welcome to my blog” – and she didn’t make the connection that I wanted her to add it to the editor (that’s my bad).
Step 4: Where would you click
No problems. She correctly chose “Media Library”.
Step 5: Add gallery post
4:25 – User was confused – thought she’d see the images she just added in the editor (instead the generic gallery camera block was there). So, she tried to go through the process again.
5:18 – “Okay, so I don’t feel like it inserted it, cause it doesn’t show the media”.
5:50 – She click away to the media library, and tries to add the images in the media library to a gallery (we’ve seen this before with one of the other users).
6:45 – She decides to publish it anyway, and view what it looks like.
Step 6: Add Audio post
7:10 – When asked to add a MP3 file to a post (from a URL I gave her), she clicked the “Add Media” button, then clicked “Embed From URL”, and pasted in the URL. When she pasted in the URL, it said http://http://URL.mp3 (with 2 http://’s).
Step 7: Add Video post
8:04 – When asked to embed a video from a URL, she clicked the “Add Media” button and used “Embed From URL” to paste the link.
Step 8: Preview your blog
No problems.
Summary
- This user was confused that she didn’t visually see the gallery images that she had added to the post. If we can’t show a preview of the actual images, could we add a one line description like, “Your gallery images will be shown here”, either just above or just below the camera icon?
- Are we confusing users by having a top level link called “Media Library” in addition to the new media modal “Media Library” link? This is the second time I’ve seen a user resort to clicking on the main left nav “Media Library” link when trying to figure out an issue within a specific post.
- If the user pastes a full URL into the “Embed From URL” box, and “http://http://” results, can we just auto-remove the extra http:// with JS?
- When I asked her to embed a video from a URL, she clicked the “Add Media” button, and tried to embed the Vimeo video URL through “Embed From URL”. I think that’s pretty logical seeing as a video is “media”. How difficult would it be to parse “Embed From URL” for the video embed URL’s, and then treat them different (so that instead of a link being added, the video embed magically happens for them)?
John Blackbourn (johnbillion) 10:13 pm on November 14, 2012 Permalink
I think these are two good arguments toward doing an AJAX call to insert this data into the post content instead of just inserting it with JavaScript. That way we can, for example, run
esc_url()on the embed URL and change the behaviour for oEmbed-supported URLs.John Blackbourn (johnbillion) 10:17 pm on November 14, 2012 Permalink
The “Embed From URL” button text is also misleading, as it doesn’t actually embed anything. It just inserts a link. This is especially noticeable (and especially poor behaviour) if you try to “embed” an image from a URL and end up with just a link to it.
sanchothefat 2:38 am on November 15, 2012 Permalink
Hi, this might be of interest – I’ve written a plugin that extends the functionality of the ‘Upload/Embed from URL’ tab.
It runs the URL through the oEmbed class and if there’s a hit it treats the embed like an attachment which when inserted into the post is inserted as the link within an shortcode so it has a fallback and CSS hook rather than just a plain text URL. Maybe that approach would help with the kind of confusion described?
The code is fairly straightforward using existing filters/actions.
karmatosed 10:13 am on November 16, 2012 Permalink
That makes me think of the avatars you have of people in conversation on github. May be a nightmare to do but some area showing thumbnails would make galleries less hidden.