Tecnologias Básicas da Web 2.0: Tutorial Luis Felipe Duarte Flores Dineu Henrique Luís Tiago C. Eterovick
Cadastro <ul><li>O primeiro passo é acessar o site  http://sproutbuilder.com/  e se cadastrar </li></ul><ul><li>Não é obri...
Criando um Widget
Criando um Widget <ul><li>http://sproutbuilder.com/getstarted </li></ul><ul><li>Clicar em “Start Building Now” para inicia...
Novo Projeto
Novo Projeto <ul><li>O novo projeto pode ser em branco ou utilizar um template do site </li></ul><ul><li>Se for em branco,...
Descrição do projeto
Descrição do projeto <ul><li>Nessa tela, especifica-se o nome do projeto e sua descrição. Para confirmar, clique em Create...
Ambiente de Edição
Ambiente de Edição <ul><li>Após a escolha do template, o usuário preenche o nome e a descrição do projeto e segue para o a...
Tools (Ferramentas) <ul><li>Este menu lembra muito um editor de imagens básico </li></ul><ul><li>O usuário pode adicionar ...
Pages (Páginas) <ul><li>Este menu permite a manipulação das páginas do widget. </li></ul><ul><li>O usuário pode adicionar ...
Video <ul><li>Para adicionar video, bastam 2 cliques na área especificada e, em seguida, colar o endereço (ex: YouTube). <...
RSS <ul><li>Para adicionar um feed RSS, basta um clique na área especificada e, em seguida, colar o endereço no espaço des...
Menu <ul><li>O menu contém 6 botões, com as respectivas funcionalidades: novo/abrir, salvar, salvar como, visualizar widge...
Publicando widget <ul><li>Clicando em Publish (Publicar), será exigido o cadastro </li></ul>
Publicando widget 1/3 <ul><li>Após o cadastro, será enviado um email com o código de confirmação. Digite o código na tela ...
Publicando widget 2/3 <ul><li>Após o cadastro, será enviado um email com o código de confirmação. Digite o código na tela ...
Publicando widget 3/3 <ul><li>Pronto! O site disponibilizará códigos <embed> para que o usuário coloque o Widget onde quis...
Sites de referência técnica 1/2 http://www.widgipedia.com/
Sites de referência técnica 2/2 http://widgets.yahoo.com/
Referências Bibliográficas http://www.readwriteweb.com/archives/world_wide_web_of_widgets.php http://widgets-gadgets.com/i...
Próximos SlideShares
Carregando em…5
×

Tutorial SproutBuilder

644 visualizações

Publicada em

Tutorial de como publicar um Widget

Publicada em: Tecnologia
0 comentários
0 gostaram
Estatísticas
Notas
  • Seja o primeiro a comentar

  • Seja a primeira pessoa a gostar disto

Sem downloads
Visualizações
Visualizações totais
644
No SlideShare
0
A partir de incorporações
0
Número de incorporações
21
Ações
Compartilhamentos
0
Downloads
2
Comentários
0
Gostaram
0
Incorporações 0
Nenhuma incorporação

Nenhuma nota no slide

Tutorial SproutBuilder

  1. 1. Tecnologias Básicas da Web 2.0: Tutorial Luis Felipe Duarte Flores Dineu Henrique Luís Tiago C. Eterovick
  2. 2. Cadastro <ul><li>O primeiro passo é acessar o site http://sproutbuilder.com/ e se cadastrar </li></ul><ul><li>Não é obrigatório realizar o cadastro para utilizar a ferramenta, mas é recomendável </li></ul><ul><li>Uma vez cadastrado (ou não!) o usuário já pode começar a criar ou editar os seus widgets </li></ul>
  3. 3. Criando um Widget
  4. 4. Criando um Widget <ul><li>http://sproutbuilder.com/getstarted </li></ul><ul><li>Clicar em “Start Building Now” para iniciar </li></ul><ul><li>Na página que virá, há a opção de iniciar um novo projeto </li></ul>
  5. 5. Novo Projeto
  6. 6. Novo Projeto <ul><li>O novo projeto pode ser em branco ou utilizar um template do site </li></ul><ul><li>Se for em branco, o usuário poderá começar a sua criação desde o início </li></ul><ul><li>Supondo, que o usuário escolha o template de política, continuemos </li></ul>
  7. 7. Descrição do projeto
  8. 8. Descrição do projeto <ul><li>Nessa tela, especifica-se o nome do projeto e sua descrição. Para confirmar, clique em Create Project </li></ul><ul><li>Após confirmado, o programa será carregado: </li></ul>
  9. 9. Ambiente de Edição
  10. 10. Ambiente de Edição <ul><li>Após a escolha do template, o usuário preenche o nome e a descrição do projeto e segue para o ambiente de edição </li></ul><ul><li>Esta é a parte mais ampla da ferramenta </li></ul><ul><li>Há vários recursos disponíveis em janelas, como o usuário pode perceber </li></ul><ul><li>Há também abas com outros recursos </li></ul>
  11. 11. Tools (Ferramentas) <ul><li>Este menu lembra muito um editor de imagens básico </li></ul><ul><li>O usuário pode adicionar objetos e manipulá-los </li></ul><ul><li>Altamente intuitivo </li></ul>
  12. 12. Pages (Páginas) <ul><li>Este menu permite a manipulação das páginas do widget. </li></ul><ul><li>O usuário pode adicionar e remover páginas, papéis de fundo, efeitos etc. </li></ul><ul><li>Altamente intuitivo </li></ul>
  13. 13. Video <ul><li>Para adicionar video, bastam 2 cliques na área especificada e, em seguida, colar o endereço (ex: YouTube). </li></ul>
  14. 14. RSS <ul><li>Para adicionar um feed RSS, basta um clique na área especificada e, em seguida, colar o endereço no espaço destinado. </li></ul>
  15. 15. Menu <ul><li>O menu contém 6 botões, com as respectivas funcionalidades: novo/abrir, salvar, salvar como, visualizar widget, publicar widget, ajuda. </li></ul><ul><li>Em cima dos botões, é possível registrar uma conta ou cancelar a conta de teste. </li></ul><ul><li>Altamente intuitivo. </li></ul>
  16. 16. Publicando widget <ul><li>Clicando em Publish (Publicar), será exigido o cadastro </li></ul>
  17. 17. Publicando widget 1/3 <ul><li>Após o cadastro, será enviado um email com o código de confirmação. Digite o código na tela seguinte e clique em Confirm Account </li></ul>
  18. 18. Publicando widget 2/3 <ul><li>Após o cadastro, será enviado um email com o código de confirmação. Digite o código na tela seguinte e clique em Confirm Account </li></ul>
  19. 19. Publicando widget 3/3 <ul><li>Pronto! O site disponibilizará códigos <embed> para que o usuário coloque o Widget onde quiser – na web! (Seu blog, ou em outras páginas) </li></ul>
  20. 20. Sites de referência técnica 1/2 http://www.widgipedia.com/
  21. 21. Sites de referência técnica 2/2 http://widgets.yahoo.com/
  22. 22. Referências Bibliográficas http://www.readwriteweb.com/archives/world_wide_web_of_widgets.php http://widgets-gadgets.com/index.htm http://www.widgetbox.com/ http://wnews.uol.com.br/site/noticias/materia.php?id_secao=4&id_conteudo=11046 http://webtrends.about.com/od/widgets/a/widgetgadget.htm

×