Joomla 3.0 - Novidades sobre a versão

4,049 views
3,924 views

Published on

Palestra do Joomla! Day Brasil 2012 sobre a nova versão do Joomla!, versão Beta.

4 Comments
3 Likes
Statistics
Notes
No Downloads
Views
Total views
4,049
On SlideShare
0
From Embeds
0
Number of Embeds
328
Actions
Shares
0
Downloads
102
Comments
4
Likes
3
Embeds 0
No embeds

No notes for slide

Joomla 3.0 - Novidades sobre a versão

  1. 1. Joomla! 3.0Uma versão que está dando o que falar.
  2. 2. Nadir Alves Publicitário, formado pelaUniversidade Metodista de São Pauloem 2005, pós-graduado em Consultoriae Tecnologia Web pela Impacta.É socio-diretor da Bule Comunicação,empresa que atua ha 6 anos nomercado e que tem como foco odesenvolvimento de sites em Joomla!.
  3. 3. Joomla User eXperience - JUXUm time criado para melhorar a experiência deuso do Joomla: ➔ Design de interação ➔ Requisitos de Usabilidade ➔ Arquitetura da Informação ➔ Acessibilidade ➔ Design visual ➔ Conteúdo móvel http://ux.joomla.org/ http://ux.joomla.org/projects/
  4. 4. Os 3 pontos chave:1. Qual a maior novidade sobre o Joomla?Mobile. Joomla será o primeiro grande CMS mobile.
  5. 5. Os 3 pontos chave:2. Para quem é o Joomla 3?Early adopters. Você poderá ser capaz de criar sites emJoomla 3 assim que for lançado. No entando, assim comotodo novo software, não precisamos sair correndo parausar a primeira versão.
  6. 6. Os 3 pontos chave:3. Estou no Joomla 2.5. O que eu faço?Pode ficar exatamente onde está, por enquanto. Joomla2.5 é uma versão maravilhosa e será suportada até 2014.
  7. 7. 10 principais novidades:1. O primeiro grande CMS mobile2. Instalação em 10 segundos3. Área administrativa melhorada4. Área administrativa amigável para mobile5. Tela de artigos ampliada6. Drag-and-drop7. Configuração unificada8. Seleção rápida com autocompletar9. Template frontend voltado para mobile10. Escolhas para updates do Joomla
  8. 8. Entendendo asatualizações do Joomla!
  9. 9. ➔ Joomla 3 está sendo esperado para setembro➔ Existirá uma série de atualizações, começando com 3.1➔ A versão long term, Joomla 3.5, será lançada em 2013
  10. 10. O que há de melhor em UX em cada CMS?
  11. 11. BootstrapPorque usar o Bootstrap?
  12. 12. jQuery x Mootools Bootstrap➔ Moderno e minimalista➔ Prevê todo tipo de UI➔ Continuamente testado emelhorado➔ Facilidade para integrar com oJoomla!
  13. 13. Bootstrap➔ HTML➔ CSS➔ JavaScript http://twitter.github.com/bootstrap/
  14. 14. jQuery x Mootools Bibliotecas ➔ Adoção do jQuery ➔ Less
  15. 15. JUI – Joomla User Interface➔ Bootstrap➔ Bootstrap estendida para Joomla➔ jQuery➔ jQuery UI➔ Fonte ícones Icomoon➔ Escolha de JS na caixa de seleção
  16. 16. Arquivosbootstrap.min.css - 82kbbootstrap-responsive.min.css - 11kbbootstrap.min.js - 22kbglyphicons-halflings.png - 14kbglyphicons-halflings-white.png - 9kb
  17. 17. Padronização UI➔ Será usado em todo lugar➔ Instalação➔ Interface Administrativa➔ Interface de Templates Frontend➔ Views de extensões Backend➔ Views de extensões Frontend
  18. 18. Padronização UI➔ Estilos para elementos que você nãohavia pensado➔ Tudo ficará parecido, mas pode sermelhorado com estilos exclusivos➔ Compatibilidade entre templates➔ Elementos UI podem serreaproveitados
  19. 19. Benefícios Dev➔ Desenvolvedores e designers irão tirarproveito. Cada um na sua especialidade.➔ Desenvolvimento rápido de extensões.Não é preciso se preocupar comelementos UI.➔ Preocupação somente comprogramação da experiência do usuário.
  20. 20. Benefícios Design➔ Uso de CSS somente para o tema.Layout e UI fornecidos pelo JUI.➔ Não será preciso editar o CSS de cadaextensão para adequar ao tema.➔ Usar os elementos disponíveis da JUIpoupa grande trabalho do designer.
  21. 21. Benefícios Usuário➔ Excelente experiência do usuário,constantemente testada.➔ A interface será padronizada para a áreaadministrativa, não sendo necessárioreaprender a interface utilizada por umaextensão específica.➔ Manuais de treinamento serão maisgenéricos, aplicados a todas as extensões.
  22. 22. Responsive Web Design➔ Redimensionamento do layout para cadaresolução de dispositivo.➔ Bootstrap tem uma excelente adaptaçãopara dispositivos mobile.
  23. 23. Frontend
  24. 24. Backend
  25. 25. Estendendo o Bootstrap bootstrap-extended.css➔ Elementos UI adicionais➔ Criação de elementos UI sem alterar o coredo Bootstrap
  26. 26. InstalaçãoMuito rápida, em 4 passos:
  27. 27. FrontendNovo template responsivo
  28. 28. AdministraçãoNova interface
  29. 29. Login Administrativo
  30. 30. Dashboard
  31. 31. Article Manager
  32. 32. Article Manager – Edit Article
  33. 33. ExemplosEstilos para componentes http://www.kyleledbetter.com/j3ux/site/
  34. 34. Blog
  35. 35. Rede Social
  36. 36. Galeria
  37. 37. Produto
  38. 38. Calendário
  39. 39. Contato
  40. 40. Pense diferenteNovas perspectivas,a mesma base.
  41. 41. Bootswatch - Amelia http://bootswatch.com/amelia/
  42. 42. Bootswatch - Simplex http://bootswatch.com/simplex/
  43. 43. Algumas novidades da versão Beta:➔ Extenso trabalho sobre a padronização do código deestilo e consistência➔ Melhorias para a Busca Inteligente➔ Atualização para a versão 3.5.6 do TinyMCE➔ Permissão para salvamento de arquivos em branco➔ Instalação de pacotes de idiomas diretamente dogerenciador de idiomas➔ Driver PostgreSQL para executar Joomla 3,0 sitesusando o banco de dados PostgreSQL.➔ A versão beta do CMS inclui a versão atual do Joomla!Plataform, que inclui um grande número de pacotes denovas e melhorias.
  44. 44. Lista de desejos da equipe JUX➔ Marcação JHTML para Bootstrap➔ Upgrades no Jtoolbar (Admin)➔ Gerenciamento de Menu Administrativo➔ Edição Frontend
  45. 45. Referências
  46. 46. JUX http://ux.joomla.org/ Test Joomla 3.0 http://community.joomla.org/blogs/community/1672-help-us- test-joomla-3.htmlReferências Brian Teeman: http://brian.teeman.net/joomla/788-joomla-ui-jui-and-bootstrap Blank Template / Twitter Bootstrap http://blank.vc/blog/19-blank-template-and-twitter-bootstrap- tutorial-for-joomla.html Bootswatch http://bootswatch.com/
  47. 47. Joomla Magazine http://magazine.joomla.org/issues/Issue-Aug-2012/item/818- Using-the-Twitter-Bootstrap-Framework-to-build-a-responsive- Joomla-Template-from-Scratch Less Plataform http://lesscss.org/Referências Savvy Panda http://savvypanda.com/blog/what-is-twitter-bootstrap-and- how-will-it-change-joomla.html Tuts Plus Bootstrap http://webdesign.tutsplus.com/tutorials/complete- websites/twitter-bootstrap-101-introduction/ Joomla 3.0 Usability Feedback http://www.surveymonkey.com/s/F83SZ3C
  48. 48. Project Fork JUX http://ux.joomla.org/projects/ http://ux.joomla.org/projects/2-joomla-3-0-ux/tasks JUX Repo https://github.com/Joomla3-Admin-template/joomla- cms/tree/templateReferências Frontend Mockup – Kyle Ledbetter http://www.kyleledbetter.com/j3ux/site/ Admin Mockup – Kyle Ledbetter http://www.kyleledbetter.com/j3ux/admin/ Joomla 3.0 UX http://www.slideshare.net/pixelpraise/joomla-30-ux-jab-2012
  49. 49. Nadir Alves@nadiralves

×