Closed Bug 737296 Opened 12 years ago Closed 11 years ago

[Demo Studio] User experience enhancements

Categories

(developer.mozilla.org Graveyard :: Demo Studio / Dev Derby, defect)

defect
Not set
normal

Tracking

(Not tracked)

RESOLVED INVALID

People

(Reporter: info, Unassigned)

References

Details

User Agent: Mozilla/5.0 (X11; Linux x86_64; rv:11.0) Gecko/20120312 Firefox/11.0 SeaMonkey/2.8
Build ID: 20120312215601

Steps to reproduce:

1. Go to https://developer.mozilla.org/en-US/demos/ in a recent Mozilla desktop browser.
2. Cycle through the carousel, roll over each demo.
3. Click the big [Launch] button for each.


Actual results:

The first demo "Pinball" does nothing.
The second demo "Help UFO" does nothing unless you guess and try the W-A-S-D keys.
The third demo "IndexedDB Editor" shows no database fields, I think because of an obsolete setVersion() call.
Umm, I'll go somewhere else to learn about cool HTML.


Expected results:

Several things
a) All demos need to do feature detection and warn if required or important features like device motion and orientation aren't detected. Mozilla evangelists like Chris Heilmann harp on this, but demos rarely walk the walk.
b) Basic prerequisites like "This uses the orientation and motion APIs, hence it isn't interesting in a desktop browser" and "You can use the W-A-S-D keys" need to be in the demo-details div on the carousel.  ... and/or:
c)Each demo has a page with important details and a place to comment on it, but it's not very discoverable, it's only if you click on the title of the demo. Maybe there should be a [Important info] button next to [Launch], or better yet remove the [Launch] button and make people to go to the demo's page where they can learn enough to work the demo.
d) If demos like IndexedDB don't work and you don't make people go through the demo details page where comments can say so, they you need to be aggressive in culling or warning about broken demos.

I filed bug bug 736685 about IndexedDB Editor and it was marked WONTFIX "we don't edit author's demos on MDN".  That's understandable, but without tending your audience will come to think of Demo Studio as a dumping ground for cool things that might have worked once, but don't work for me.

I don't mean to be needlessly harsh, and I appreciate the thinking and effort behind Demo Studio.
Pinball - requires mobile device with orientation events.
Help UFO - bad UX
IndexedDB Editor - WorksForSome

John, do you remember if we have bugs like any of the following to address what skierpage mentions:

A. Many/most demo's are tagged with technology tags - e.g., Pinball has JavaScript, HTML5, Canvas, Mobile, and Device. We could add feature-detection for the tagged technologies to the launch bar and display a notice in the bar for unsupported features.

B. Show a similar notice in the carousel display for a demo

C is addressed by A & B

D. Improve the "Report a broken demo" feature - automatically detect user agent and unsupported features. Syndicate the notice to the demo author.

If we have some of these bugs already, let's make them blockers to this one. If we don't let's create blocker bugs to this one and call this one the "Improve Demo Studio browser support" tracking bug.
Status: UNCONFIRMED → NEW
Ever confirmed: true
Target Milestone: --- → 2.7
+ Craig, our interface guru.

Luke: I'm not aware of any other bugs like this. I'll do some research and create some blockers later in the week.

Hey skierpage. Thank you for the well thought out comments. There is room for improvement (as with any product) and I love that you are thinking along the lines of interface fixes. Right on.

> Help UFO - bad UX

Partially, at least for desktop. However, it's primarily a mobile demo like Pinball is.

> a) All demos need to do feature detection and warn if required or important features like device motion and orientation aren't detected... Basic prerequisites like "This uses the orientation and motion APIs, hence it isn't interesting in a desktop browser" need to be in the demo-details div on the carousel.

I agree that something like this would be helpful. If we don't want to do detection, we could just ask submitters to check a box like "This is a mobile demo".

> b) "You can use the W-A-S-D keys" need to be in the demo-details div on the carousel.

Sort of. I think it should be up to the author to explain how the demo works (I didn't realize that demo used WASD until just now), but your point is right. Maybe we could have the author write some basic "Usage instructions" and have those instructions show up in the preview.

> c)Each demo has a page with important details and a place to comment on it, but it's not very discoverable, it's only if you click on the title of the demo. Maybe there should be a [Important info] button next to [Launch], or better yet remove the [Launch] button and make people to go to the demo's page where they can learn enough to work the demo.

As I mention above, it's possible we could list some important info in the preview. I also like the idea of forcing people to click through to the full demo detail. Yes it would ad a click, but it may be worth it.

> d) If demos like IndexedDB don't work and you don't make people go through the demo details page where comments can say so, they you need to be aggressive in culling or warning about broken demos.

Forcing people to go through the full detail page might help. Warnings about broken demos would be nice, and the "Report a broken demo" feature Luke mentions might do it.
Er, +Craig.

Also, sorry about the long lines. I always forget that Bugzilla doesn't auto wrap. Maybe I should open a bug about adding a "preview" mode for Bugzilla. :-P
Depends on: 742117
Depends on: 742121
Depends on: 742123
Depends on: 742126
Hey skierpage. I have opened bug reports for each of the issues you mentioned. This page links to them in the "Depends on" section near the top. Please feel free to share any additional thoughts you have in these individual bug reports.

The MDN development team is currently very busy with Kuma (https://wiki.mozilla.org/MDN/Kuma), but we will be sure to keep these issues in mind over the coming months. I wish we could get to work on these immediately (trust me, I'm a UX junkie), but our resources are unfortunately limited at the moment.

By the way, I hope you stick with us for learning about HTML. All products have usability blemishes, but not all companies are willing to work with users to make things better like Mozilla is. :-)
Summary: [Demo Studio] various demos fail with no feedback → [Demo Studio] User experience enhancements
Depends on: 746815
No longer depends on: 742126
Depends on: 746819
Version: MDN → unspecified
Component: Demos → Demo Studio / Dev Derby
Potentially getting back to improving the Demo Studio. Marking this bug as INVALID -- not because it's not important, but because all of the requests have been broken down into individual bugs (see "Dependencies") already.
Status: NEW → RESOLVED
Closed: 11 years ago
Resolution: --- → INVALID
Product: developer.mozilla.org → developer.mozilla.org Graveyard
You need to log in before you can comment on or make changes to this bug.