Joomla! 3.0

Uma verso que est dando o que falar.

Publicitrio, formado pela Universidade Metodista de So Paulo em 2005, ps-graduado em Consultoria e Tecnologia Web pela Impacta.
socio-diretor da Bule Comunicao, empresa que atua ha 6 anos no mercado e que tem como foco o desenvolvimento de sites em Joomla!.

Nadir Alves

Design de interao

Requisitos de Usabilidade

Arquitetura da Informao

Acessibilidade

Design visual

Contedo mvel

Um time criado para melhorar a experincia de uso do Joomla:

Joomla User eXperience - JUX

http://ux.joomla.org/projects/

http://ux.joomla.org/

Qual a maior novidade sobre o Joomla?

Mobile. Joomla ser o primeiro grande CMS mobile.

Os 3 pontos chave:

Para quem o Joomla 3?

Early adopters. Voc poder ser capaz de criar sites em Joomla 3 assim que for lanado. No entando, assim como todo novo software, no precisamos sair correndo para usar a primeira verso.

Os 3 pontos chave:

Estou no Joomla 2.5. O que eu fao?

Pode ficar exatamente onde est, por enquanto. Joomla 2.5 uma verso maravilhosa e ser suportada at 2014.

Os 3 pontos chave:

O primeiro grande CMS mobile

Instalao em 10 segundos

rea administrativa melhorada

rea administrativa amigvel para mobile

Tela de artigos ampliada

Drag-and-drop

Configurao unificada

Seleo rpida com autocompletar

Template frontend voltado para mobile

Escolhas para updates do Joomla

10 principais novidades:

Entendendo as atualizaes do Joomla!

Joomla 3 est sendo esperado para setembro

Existir uma srie de atualizaes, comeando com 3.1

A verso long term, Joomla 3.5, ser lanada em 2013

O que h de melhor em UX em cada CMS?

Bootstrap

Porque usar o Bootstrap?

Moderno e minimalista

Prev todo tipo de UI

Continuamente testado e melhorado

Facilidade para integrar com o Joomla!

jQuery x Mootools

Bootstrap

HTML

CSS

JavaScript

http://twitter.github.com/bootstrap/

Bootstrap

Adoo do jQuery

Less

jQuery x Mootools

Bibliotecas

Bootstrap

Bootstrap estendida para Joomla

jQuery

jQuery UI

Fonte cones Icomoon

Escolha de JS na caixa de seleo

JUI Joomla User Interface

bootstrap.min.css - 82kbbootstrap-responsive.min.css - 11kbbootstrap.min.js - 22kbglyphicons-halflings.png - 14kbglyphicons-halflings-white.png - 9kb

Arquivos

Padronizao UI

Ser usado em todo lugar

Instalao

Interface Administrativa

Interface de Templates Frontend

Views de extenses Backend

Views de extenses Frontend

Padronizao UI

Estilos para elementos que voc no havia pensado

Tudo ficar parecido, mas pode ser melhorado com estilos exclusivos

Compatibilidade entre templates

Elementos UI podem ser reaproveitados

Benefcios Dev

Desenvolvedores e designers iro tirar proveito. Cada um na sua especialidade.

Desenvolvimento rpido de extenses. No preciso se preocupar com elementos UI.

Preocupao somente com programao da experincia do usurio.

Benefcios Design

Uso de CSS somente para o tema. Layout e UI fornecidos pelo JUI.

No ser preciso editar o CSS de cada extenso para adequar ao tema.

Usar os elementos disponveis da JUI poupa grande trabalho do designer.

Benefcios Usurio

Excelente experincia do usurio, constantemente testada.

A interface ser padronizada para a rea administrativa, no sendo necessrio reaprender a interface utilizada por uma extenso especfica.

Manuais de treinamento sero mais genricos, aplicados a todas as extenses.

Responsive Web Design

Redimensionamento do layout para cada resoluo de dispositivo.

Bootstrap tem uma excelente adaptao para dispositivos mobile.

Frontend

Backend

Estendendo o Bootstrap

bootstrap-extended.css

Elementos UI adicionais

Criao de elementos UI sem alterar o core do Bootstrap

Instalao

Muito rpida, em 4 passos:

Frontend

Novo template responsivo

Administrao

Nova interface

Login Administrativo

Dashboard

Article Manager

Article Manager Edit Article

Exemplos

Estilos para componentes

http://www.kyleledbetter.com/j3ux/site/

Blog

Rede Social

Galeria

Produto

Calendrio

Contato

Pense diferente

Novas perspectivas,
a mesma base.

http://bootswatch.com/amelia/

Bootswatch - Amelia

http://bootswatch.com/simplex/

Bootswatch - Simplex

Extenso trabalho sobre a padronizao do cdigo de estilo e consistncia

Melhorias para a Busca Inteligente

Atualizao para a verso 3.5.6 do TinyMCE

Permisso para salvamento de arquivos em branco

Instalao de pacotes de idiomas diretamente do gerenciador de idiomas

Driver PostgreSQL para executar Joomla 3,0 sites usando o banco de dados PostgreSQL.

A verso beta do CMS inclui a verso atual do Joomla! Plataform, que inclui um grande nmero de pacotes de novas e melhorias.

Algumas novidades da verso Beta:

Lista de desejos da equipe JUX

Marcao JHTML para Bootstrap

Upgrades no Jtoolbar (Admin)

Gerenciamento de Menu Administrativo

Edio Frontend

Referncias

JUXhttp://ux.joomla.org/

Test Joomla 3.0http://community.joomla.org/blogs/community/1672-help-us-test-joomla-3.html

Brian Teeman:http://brian.teeman.net/joomla/788-joomla-ui-jui-and-bootstrap

Blank Template / Twitter Bootstraphttp://blank.vc/blog/19-blank-template-and-twitter-bootstrap-tutorial-for-joomla.html

Bootswatchhttp://bootswatch.com/

Referncias

Joomla Magazinehttp://magazine.joomla.org/issues/Issue-Aug-2012/item/818-Using-the-Twitter-Bootstrap-Framework-to-build-a-responsive-Joomla-Template-from-Scratch

Less Plataformhttp://lesscss.org/

Savvy Pandahttp://savvypanda.com/blog/what-is-twitter-bootstrap-and-how-will-it-change-joomla.html

Tuts Plus Bootstraphttp://webdesign.tutsplus.com/tutorials/complete-websites/twitter-bootstrap-101-introduction/

Joomla 3.0 Usability Feedbackhttp://www.surveymonkey.com/s/F83SZ3C

Referncias

Project Fork JUXhttp://ux.joomla.org/projects/http://ux.joomla.org/projects/2-joomla-3-0-ux/tasks

JUX Repohttps://github.com/Joomla3-Admin-template/joomla-cms/tree/template

Frontend Mockup Kyle Ledbetterhttp://www.kyleledbetter.com/j3ux/site/

Admin Mockup Kyle Ledbetterhttp://www.kyleledbetter.com/j3ux/admin/

Joomla 3.0 UXhttp://www.slideshare.net/pixelpraise/joomla-30-ux-jab-2012

Referncias

Nadir Alves
@nadiralves