1,926
edits
MDN/Archives/DemoRoom: Difference between revisions
→Hosting Demos
| Line 19: | Line 19: | ||
** integrate a cloud editor like [https://mozillalabs.com/skywriter/ skywriter (formerly bespin)] or [http://jsfiddle.net jsfiddle] to make the code interactive. | ** integrate a cloud editor like [https://mozillalabs.com/skywriter/ skywriter (formerly bespin)] or [http://jsfiddle.net jsfiddle] to make the code interactive. | ||
== | == Requirements == | ||
We need setup the infrastructure for submitting, storing, updating, sharing and serving out demos. The idea being that we have all the demos in one place and multiple sites/galleries can access them for display... with the Firefox 4 demo microsite and the MDN Demo Room being the first two to use it. | We need setup the infrastructure for submitting, storing, updating, sharing and serving out demos. The idea being that we have all the demos in one place and multiple sites/galleries can access them for display... with the Firefox 4 demo microsite and the MDN Demo Room being the first two to use it. | ||
| Line 27: | Line 27: | ||
*** Links to discussion, docs, blog posts, or other related external resources | *** Links to discussion, docs, blog posts, or other related external resources | ||
*** Files needed to run demo | *** Files needed to run demo | ||
* Demo storage | |||
** We need to figure out the best way to collect the necessary files in order to serve them for viewing. | |||
*** Define a standardized directory structure for html, css and javascript files | |||
*** Require all demo developers to follow a set of guidelines and check against them before submission | |||
*** Develop an API to allow for websites to access both the content and data associated with each demo | |||
* Demo viewing | * Demo viewing | ||
** | ** A simple viewer will be sufficient for the MDN Demo Room and should include the following features: | ||
*** Thumbnail and list views with search and filtering by tags | |||
*** Allow toggle between desktop and mobile CSS templates for optimal viewing (auto-detection would be ideal) | |||
*** Search as a primary action to encourage discoverability | |||
* Demo engagement | |||
** Demos should be a gateway to discussions and learning with features like: | |||
*** Comments for each demo (or create a new forum thread for each demo, link to it and display the most recent comments on the demo page) | |||
*** Integrate videos, tutorials and relevant documentation on MDN to allow anyone to dig deeper into each demo and the technologies behind it. | |||
** Enable social interactions on demos for gauging interest and tracking viewership | |||
*** A "like" or "thumbs up" button so anyone can quickly vote for their favorite demos | |||
*** Allow anyone to share a demo via direct link or tweet | |||
*** Possibly provide a demo preview button/widget for each demo that people can post their blogs or embed demos in content. | |||
* Demo marketing | |||
** Encourage developers to write blogs posts or tutorials on their demos | |||
** Create a points or badge system to provide incentive to top developers | |||
** Round-up the top demos by category and blog about them on Hacks | |||
** Hold demo challenges based on features we want to highlight to populate the gallery with community contributions; give away MDN t-shirts and other swag. | |||