concurso widgets da tmn

Download Concurso widgets da TMN

If you can't read please download the document

Upload: josemataf

Post on 16-Apr-2017

2.423 views

Category:

Technology


0 download

TRANSCRIPT

Portal SAPO Widget

Como desenvolver um widget...

e ganhar prmios e passar um bom bocado

Jos da Mata [email protected]

Programa

Concurso de widgets da TMN

O que um widget Web

Portal SAPO Widgets

Concurso de widgets TMN

http://developers.tmn.pt/

Prmios!

Computadores Macintosh

Guitarras elctricas

Telemveis

Muitos outros...

Como participar

Cumprir as regras do concurso

Desenvolver widgets para telemvelNokia WRT Widgets, Samsung Widgets, Windows Mobile 6.5 Widgets

No portal SAPO Widgets ou utilizando os SDKs dos fabricantes

Utilizar o portal SAPO Widgets para submeter o widget a concurso

Cross your fingers!

Como participar

Ter uma grande ideia

Arranjar coragem... vontade de aprender

Desenvolver o Widget

Submeter para concurso

Exemplos de widgets

UtilidadesConversor de moedas; calculadoras; informaes sobre tempo, trnsito, mercados financeiros; ToDo lists.

MapasPontos de interesse; guias da cidade.

Notcias, jornalAgregador de jornais online, blog e outras fontes de media social.

PessoalAs minhas fotos/vdeos, alertas de email/mensagem privada, os meus tweets

Jogos

Coisas sem sentido (nonsense!)... mas que de alguma forma as pessoas gostam de instalar

Exemplos de widgets

Para mais informaes

Portal do concurso de widgets da TMNhttp://developers.tmn.pt/[email protected]

Widgets Web

O que um Widget Web

Widget Web

No so widgets Web:Componente de interface grfica (GUI Widget)

Portlet, fragmento para composio de portais empresariais:Cdigo gerado no servidor, especificaes abertas, repositrios de widget

Widget Web

Tambm no so widgets Web:Java applets, componentes Flash, ActiveX control

Mobile AppsAplicaes para iPhone, Android ou Blackberry

Widgets Web

Widgets em customized startup-pagesEx: Netvibes, iGoogle.

Widgets Web

Widgets para desktopEx: Opera Widgets, iGoogle gadgets, Windows Live! gadgets, Yahoo! widgets, Apple Dashboard widgets.

Widgets Web

Widgets para telemvelEx: Nokia WRT Widgets (1.0 e 1.1), Samsung TouchWiz Widgets, Windows Mobile 6.5 Widgets.

Widgets Web

Tecnicamente, um widget Web uma pequena pgina Web...X?HTML[4|5], JavaScript, CSS[2|3], resources

AJAX, APIs DOM, Eventos

Host Runtime EnvironmentHTTPURIUnicodeURIDOMXMLHTTPRequestJSON, XML, HTMLCSSResources

Widgets Web

em algumas plataformas, so fornecidas APIs adicionais...APIs para acesso lista de contacto, cmera, Geolocalizao, etc;

Componentes UI para menus de contexto ou docking

Mecanismo de proxy para operaes desligadas.

Host Runtime EnvironmentHTTPURIResourcesUnicodeURIDOMXMLHTTPRequestJSON, XML, HTMLCSSCaching / ProxyWidget APIUI ControlsMetadata APIPackaging

Widgets Web

Propriedades desejveisSimplicidade, User engagement, Cross platform, Performance.

Facilidade em serem encontradasApp stores, catlogos

Widgets Web

Componentes do widgetDocumento (XHTML, HTML4, HTML5)

Templating

Widgets Web

Componentes do widgetEstilos (CSS2, CSS3)

Apresentao do widget

Widgets Web

Componentes do widgetCdigo (JavaScript)

Motor do widgetWidget load

Widget configuration

Widget data (AJAX)

Widget render (HTML DOM API)

Widget lifecycle (HTML DOM Events)Eventos de UI, setTimeout, AJAX

Frameworks JavaScriptUWA, jQuery, Prototype.js

Widgets Web

Componentes do widgetDescrio do widgetTtulo, descrio, verso, autor, Icon,

Ficheiros do widgetImagens, flash, vdeo, documentos,

Widgets Web

W3C Widgets 1.0 - http://www.w3.org/TR/widgets/ Utilizado como base para o modelo de widget de vrias plataformas:Opera Widgets, Nokia WRT Widgets, Samsung Widgets, Windows Mobile Widget

Define:Packaging

Configuration Document (confix.xml)

Localization

widget API

Widgets Web

W3C Widgets 1.0

SAPO Widgets

Portalhttp://widgets.sapo.pt/

SAPO Widgets

Catlogo (App Store)

Developers

Pgina de Widgets

SAPO Widgets Catlogo

Listagem de widgetsWidgets em destaque

Widgets por plataformasNokia WRT (1.0 e 1.1), Samsung, Windows Mobile 6.5, Opera Widgets, Netvibes e Web

Widgets por categoriasteis, desporto, entretenimento, finanas, notcias, social & comunicao, outras

Widgets a concurso (TMN)

SAPO Widgets Catlogo

Instalao de WidgetsMobileDownload e envio por SMS (para TMN)

WebInstalar na pgina e colocar no blog (snippet)

OperaLink

SAPO Widgets Developer

A minha contaAlguns dados pessoaisNickname, Nome completo e email de contacto

SAPO Widgets - Developer

Adicionar WidgetsImportar widget j desenvolvido e empacotado segundo a plataformaNokia WRT, Samsung e Windows Mobile 6.5

Verificao e importao automtica de metadata do widgetTtulo, descrio, verso, Icon, etc

Podem ser utilizados os SDK (emulador) dos fabricantes e mais tarde importar o widget na plataforma

Criar novo widgetWidget vazio pode ser totalmente construdo na plataforma

SAPO Widgets Developer

Os meus widgetsListagem de widgets desenvolvidos pelo programador

Eliminar, Editar, Instalar (semelhante ao catlogo)

Submeter para catlogoSujeito a workflow de aprovao

Submeter para o concurso da TMN

SAPO Widgets Developer

Editar WidgetInformao bsicaTtulo, descrio, verso, actualizaes, Icon, RichIcon, Thumbnail, categorias, plataformas.Testado em para cada plataforma mvel

Parmetros de configuraoPassar variveis para dentro do cdigo do widget

XHTML (ou HTML[4|5])

CSS Externos e editor de cdigo

SAPO Widgets Developer

Editar WidgetJavaScriptExternos, editor de cdigo e framework

Podem ser utilizados frameworks JavaScript, ex: jQuery, prototype.js, MooTools, outros

JavaScript compilers?Script# (C#), Google GWT (Java), RubyJS (Ruby)

Ficheiros (Resources)Painel de upload de ficheirosUp to 3072Kb

Listagem de ficheiros (com token {__WIDGET_BASE__})

SAPO Widgets Developer

Ferramentas de desenvolvimento (IDE)Editor de cdigo com syntax highlight e identaoE substituio de tokens {__TOKEN_NAME__}

Preview no Browser

Outras que podem ser utilizadas:Utilizao do JSLint para verificao de qualidade do JavaScript

Utilizao do Firebug, com Yslow (anlise de cdigo)

HTML Tidy e validation. CSS Validation

Utilizao de emuladores dos fabricantes

SAPO Widget Developer

Documentao

Exemplos instalveis

Referncia para FAQ do concurso

Exemplo

Whack-em-All SAPO

Links teis

Concurso TMN Widgets: http://developers.tmn.pt/

http://widgets.sapo.pt/

SDKs/Emuladores:Nokia WRT Widgets: http://3155.sl.pt

Samsung Widgets: http://3156.sl.pt

Windows Mobile Widgets: http://3157.sl.pt

DesenvolvimentoJSLint: http://www.jslint.com/

Firebug: http://getfirebug.com/

YSlow: http://developer.yahoo.com/yslow/

W3C Validator: http://validator.w3.org/

Fim

Questes?