Websites/De Todos Para Todos

From MozillaWiki
Jump to: navigation, search
Ambox outdated.png THIS PAGE MAY BE OUTDATED
This article is in parts, or in its entirety, outdated. Hence, the information presented on this page may be incorrect, and should be treated with due caution until this flag has been lifted. Help by editing the article, or discuss its contents on the talk page.
SOS THIS PAGE NEEDS HELP
Somebody asks you for help with with PAGE. Here is needed: {{{2}}}

This page contains all of the important details for De Todos Para Todos.

Elevator Pitch

De Todos Para Todos (From All To All) is an engagement effort to extend the Firefox brand campaign (https://wiki.mozilla.org/Brand/Firefox) efforts to LATAM. Initial focus will be Brasil and Argentina - key countries from a marketshare and internet penetration standpoint. DTPT aims to spread the message that Mozilla is a non profit organization, interested only in maintaining the internet as an open space, where everyone can participate. The campaign will useonline and offline activities, asking people to join the Mozilla Firefox cause for a better internet for all in a variety of simple, fun and collaborative ways.

Overview

  • Code name: DTPT
  • Prod URL: detodosparatodos.org
  • Dev URL: detodosparatodos-dev.allizom.org
  • Stage URL: detodosparatodos.allizom.org
  • Code Repo: github.com/Nobox/Mozilla-DeTodosParaTodos-Site
  • L10N Repo: n/a
  • Code: PHP, no framework
  • Product Owner: Engagement, Mary Colvig
  • Dev Team: Nobox (external vendor)
  • IRC channel: #detodos on Mozilla IRC Server
  • Team Email: n/a

Team

The primary and secondary contacts for each role of this project:

  • Product owner - Mary Colvig (mary)
  • TPM - Christie Koehler (ckoehler)
  • Web Project Manager - Nobox
  • Developers - Nobox
  • L10N - Nobox
  • Designer - Nobox
  • IT - Jason Crow (jd)
  • QA - n/a (temp rbilligs)
  • UX - Nobox
  • Security - tbd
  • Legal - tbd

Goals and Measurements

Meetings

Considerations

Designs

Mockups

Wireframes

User Stories

Functional Description

Phase 1 mechanics

Phase 1 of the site is mostly a static, informational website. Users go in to the website and perform the following actions:

  • Watch videos. Users can watch an intro video, as well as various interview videos with local Internet personalities.
    • All videos will be hosted in Mozilla's CDN and each will be available in three formats (MP4 for HTML5 and Flash, WEBM and OGV).o
    • All videos will be manually embedded and will stay the same for the duration of phase 1.
    • Videos will play using JW Player (http://www.longtailvideo.com/players/). Fallback order is as follows: MP4 in HTML5, WEBM in HTML5, OGV in HTML5, Flash.
    • There is a simple carousel component (done in jQuery) underneath the video player that lets users select the video to play from a list of thumbnails.
  • Like on Facebook. Users can choose to like Mozilla on Facebook by clicking the like button.
    • To comply with Mozilla security guidelines, we are not loading the Facebook like button when the page loads. Instead, users must click a button named "Load Facebook/Twitter Content" that will load the following components dynamically: facebook like button, Facebook "Facepile", Tweet button and real-time Twitter feed (in right column)
  • Tweet this. Users can click a Twitter button to post a message to their Twitter account linking to the site.
    • This instance of the Twitter button is provided directly by Twitter (for the counter functionality) and thus it is not loaded by deafult. It will show only after the user has clicked the "Load Facebook/Twitter Content" button.
  • Support the cause. Users can click on the "Support the cause" call to action to see other ways to spread the word:
    • Like on Facebook (in case they didn't click on the like button outside). Here too the like button is not enabled until the user has clicked the "Load Facebook/Twitter Content" button.
    • Share on Facebook. Users can click here to post a message to their Facebook wall which their friends can see. As requested by Mozilla, this was implemented using a simple link to a Facebook page (like https://developer.mozilla.org/en-US/demos/detail/front-invaders)
    • Share on Twitter. Users can click here to post a message to their Twitter account linking to the site. This instance of the Twitter button is implemented as a simple link (like https://developer.mozilla.org/en-US/demos/detail/front-invaders)
    • Put a banner on your page. Here we give users various banner images (and a corresponding HTML snippet) which they can insert on their own website.
  • Other notes:
    • Phase 1 also includes a Facebook Page Tab that will be hosted on the main domain.
    • Mobile website. A javascript code will detect if the user is accessing the site through a mobile browser and redirect to a mobile version. This version lives in a subdirectory of the site. The mobile version works pretty much the same as the full site, except that we removed some features.
    • PHP code is only used for setting some very simple configuration options (i.e. URL paths as variables)
    • All JS scripts are local.

Facebook Tab Phase II mechanics

Phase II of the FB Tab will allow users to share a message on their FB Wall/Timeline.
The Process goes as follows:
1.    Users register (allow app)
2.    Users make and customize their “De todos Para todos” message choosing an image and a pre-written text.
3.    They post it to their wall with a message that they are participating in the movement and prompt their friends to help them reach the common goal: unlock the artist’s wallpaper from Arte Fora do Museu (Brazil) or Coleccionarte (Argentina). Wallpapers unlock after every 10,000 shares.
4.    The wall image is posted on the timeline!

Project Management

Bugs

Bugs should be filed with normal visibility; Security bugs should be filed with private visibility.

End of Life

Other