Websites/Snippets/Meetings/2011-06-02: Difference between revisions

From MozillaWiki
Jump to navigation Jump to search
 
(31 intermediate revisions by 7 users not shown)
Line 1: Line 1:
== What's are Snippets? ==
== What are Snippets? ==


Traditionally, Snippets are a chunk of text and associated icon as seen below on the about:home Firefox start page.
=== Overview: ===


[[Image:snippets-screenshot.png|600px]]
Between Firefox 4 internally hosted snippets and the launch of Firefox's amazing support of HTML5 goodness we've got the perfect opportunity to launch more creative, compelling, and interactive snippet content to the '''BILLIONS''' of visitors to the About:Home page.


Why are Snippets so important? Because they are in front of the eyes of 6 BILLION people per month. It is a chance to say or do something that will be mutually beneficial to the end user and Mozilla. Currently, they are just static text, but we want to use HTML5 to showcase a modern browser like Firefox 4+. It is also a place to tell Mozilla's story and use the real estate strategically.
=== Objective:  ===


If you still want to read more, check out the [https://wiki.mozilla.org/Firefox/Projects/Firefox_Start/Snippet_Service Snippets wiki page]
Stop telling, start showing, the awesomeness of Fx4+ to our users through interactive snippet experiences. Move the needle on feature adoption.  


== What Kind of Awesome? ==
[[Image:Snippets-screenshot.png|600px|Snippets-screenshot.png]]


== Get Connected ==
If you still want to read more, check out the [https://wiki.mozilla.org/Firefox/Projects/Firefox_Start/Snippet_Service Snippets wiki page] or [https://intranet.mozilla.org/Marketing/StartPageSnippets/Awesomeness more inspiration] here


* IRC channel: #snippets
== Getting Started  ==
* Wiki: https://intranet.mozilla.org/Marketing/StartPageSnippets/Awesomeness
* Tracking {{bug|653784}}


== HTML5 Awesomeness Snippets Gallery ==
=== Examples Ideas  ===


Have you created something cool during this hackathon or another time? Create a link below to the Snippet idea.
*Persona Previews from within snippet
*Complete Add-on install
*Mini Video-like series (html5) of UI in action: Tabbed browsing, Panorama, App Tab, more
*Web 'o Wonder in bite-size format
*MDN Demo Studio in bite-size format
*Game


* John Doe's ACME Snippet
=== Challenge  ===
 
Create library of at least 5 interactive compelling snippets in Q2 to be used the rest of the 2011.
 
=== Parameters  ===
 
*Width: preferable liquid (572px max width)
*Height: variable, but it should be more panoramic.
*Background: transparent or white
*Image sizes: optimized, but no limitation (within reason)
*Code size: no limitation
*L10n: Yes, strings must be able to be localized.
 
=== Constraints  ===
 
*Snippets are HTML document fragments injected into the about:home document -- not complete documents themselves.
*All HTML content must also be well-formed XML.
*All images must use [http://software.hixie.ch/utilities/cgi/data/data data URI scheme]
*JavaScript must be embedded into the HTML -- no external references.
*All CSS must be embedded into the HTML -- no external references.
*The snippet content should be compelling, but not distract from the overall "search" purpose of the page
 
== Get Connected  ==
 
*Video: [http://air.mozilla.org Air Mozilla]
*IRC channel: #snippets
*[https://intranet.mozilla.org/Marketing/StartPageSnippets/Awesomeness Wiki]
*Tracking {{bug|653784}}
 
== Get Started<br> ==
 
* [https://github.com/lmorchard/home-snippets-server Snippet Server] -- to simulate the about:home locally.
* [https://github.com/lmorchard/home-snippets-switcher Snippet Switcher Add-on] -- allow you to switch your Firefox to a different URL to fetch new Snippets.
 
For help on getting this set up, please contact [mailto:mkelly@mozilla.com Mike Kelly].
 
== HTML5 Awesomeness Snippets Gallery  ==
 
Have you created something cool during this hackathon or another time? Create a link below to the Snippet idea.
 
*[http://jlongster.com/s/dom3d/ dom3d]: rendering 3d with CSS3 (James Long)
* [http://jsfiddle.net/N5Avm/ custom font embedded as data URI]: (Lonnen)
 
If you don't have access to this wiki, please contact [mailto:cmore@mozilla.com Chris More] to contribute to the project. Thanks!!
 
== Session Notes ==
 
Brainstorming thoughts:
 
* 3D video?
* Keep it in terms of the end users who may not know technology.
* Can we link to or call up a specific snippet?
* Survey: Does Firefox make you happy? yes/no
* One issue is that it is difficult to share about:home
* Mozilla Firefox favorite tweets
* Stories of how Firefox changed your life
* Can we support multi-touch with a trackpad?
* Firefox features (app tabs)
* Add-ons feature: Twitter add on, awesome screenshot, copy short URL
* Website Time Machine: Pull a scroll bar back and forth 1995, 2000, 2005, 2010 to make websites look like they did then.
* Glow live counter

Latest revision as of 17:12, 7 July 2011

What are Snippets?

Overview:

Between Firefox 4 internally hosted snippets and the launch of Firefox's amazing support of HTML5 goodness we've got the perfect opportunity to launch more creative, compelling, and interactive snippet content to the BILLIONS of visitors to the About:Home page.

Objective:

Stop telling, start showing, the awesomeness of Fx4+ to our users through interactive snippet experiences. Move the needle on feature adoption.

Snippets-screenshot.png

If you still want to read more, check out the Snippets wiki page or more inspiration here

Getting Started

Examples Ideas

  • Persona Previews from within snippet
  • Complete Add-on install
  • Mini Video-like series (html5) of UI in action: Tabbed browsing, Panorama, App Tab, more
  • Web 'o Wonder in bite-size format
  • MDN Demo Studio in bite-size format
  • Game

Challenge

Create library of at least 5 interactive compelling snippets in Q2 to be used the rest of the 2011.

Parameters

  • Width: preferable liquid (572px max width)
  • Height: variable, but it should be more panoramic.
  • Background: transparent or white
  • Image sizes: optimized, but no limitation (within reason)
  • Code size: no limitation
  • L10n: Yes, strings must be able to be localized.

Constraints

  • Snippets are HTML document fragments injected into the about:home document -- not complete documents themselves.
  • All HTML content must also be well-formed XML.
  • All images must use data URI scheme
  • JavaScript must be embedded into the HTML -- no external references.
  • All CSS must be embedded into the HTML -- no external references.
  • The snippet content should be compelling, but not distract from the overall "search" purpose of the page

Get Connected

Get Started

For help on getting this set up, please contact Mike Kelly.

HTML5 Awesomeness Snippets Gallery

Have you created something cool during this hackathon or another time? Create a link below to the Snippet idea.

If you don't have access to this wiki, please contact Chris More to contribute to the project. Thanks!!

Session Notes

Brainstorming thoughts:

  • 3D video?
  • Keep it in terms of the end users who may not know technology.
  • Can we link to or call up a specific snippet?
  • Survey: Does Firefox make you happy? yes/no
  • One issue is that it is difficult to share about:home
  • Mozilla Firefox favorite tweets
  • Stories of how Firefox changed your life
  • Can we support multi-touch with a trackpad?
  • Firefox features (app tabs)
  • Add-ons feature: Twitter add on, awesome screenshot, copy short URL
  • Website Time Machine: Pull a scroll bar back and forth 1995, 2000, 2005, 2010 to make websites look like they did then.
  • Glow live counter
Retrieved from "https://wiki.allizom.org/index.php?title=Websites/Snippets/Meetings/2011-06-02&oldid=326330"