arte do design para plone
DESCRIPTION
Palestra de André Nogueira, apresentada durante o Plone Symposium South America de 2009, em São Paulo - BrasilTRANSCRIPT
André Nogueira
Um pouco sobre a história da Simples...
Simples Consultoria
• Usabilidade• Arquitetura da Informação• Gestão de Conteúdo
Simples Consultoria
• Busca por um CMS:– Fácil de usar– Acessível– Foco na organização de conteúdo– Aderente aos padrões web
Simples Consultoria
• Testamos vários CMS• Iniciamos o desenvolvimento de um
CMS próprio.
Até que um dia...
Simples Consultoria + Plone =
• + 500 projetos em Plone• + 200 pessoas treinadas em Plone e
CSS• Diversos produtos desenvolvidos e
disponibilizado a comunidade
A arte do design para Plone
Ou em outras palavras...
Como fazer qualquer coisa com o Plonee garantir que fique bonito e funcional.
4 histórias rápidas:
História 1
World Usability Day
Feito em poucas horasBaseado em layout existente
World Usability Day
Um deficiente visual elogiou o site,pois conseguiu fazer sua inscrição
História 2
AbraspeAssociação Brasileira de PedestresMantido por usuário com mais de 70 anos
Abraspe
Maior problema enfrentado:• Configurar o Outlook
História 3
Simples “Estacionamentos”Nosso antigo site indicava qual o
estacionamento mais próximo denossos eventos
Simples “Estacionamentos”
Éramos um dos primeiros resultado noGoogle para a tag “estacionamento”
História 4
ECA 18 anos
Website ColaborativoVárias pessoas adicionando conteúdo
ECA 18 anos
Depois de receber muita informaçãoO site virou um livro
Todos esses sites foram feitosapenas com alterações de CSS...
...usando o melhor “framework”para desenvolver um Plone site:
O próprio Plone
Características do Plone “out of the box”
• Fácil de usar e colaborar• Alto nível de acessibilidade• SEO• Separação de conteúdo, estrutura e
apresentação
Regras para criar um Plone Site de sucesso:
Regra #1
Pense primeiro, faça depois
Pense primeiro, faça depois
• Plone é uma ferramenta fantástica• Mas não faz tudo sozinho• Não basta instalar o site e pronto
Pense primeiro, faça depois
• Também precisa de passos básicos:– Levantamento de informações– Briefing– Análise dos usuários– Análise da concorrência e mercado– Arquitetura da informação
Regra #2
Faça o design para o seu site,não para um Plone site.
Design do seu site
• Um bom design é bom no Plone, no Drupal, no Joomla, Wordpress, HTML...
• Pense apenas nos padrões de design, de usabilidade, consistência da interface...
• Respeite todos os dados levantados na regra anterior
Design do seu site
• A estrutura do Plone não foi criada ao acaso.• Um bom design “encaixa” no Plone.• Se não, pode ter algo errado com seu design.
Regra #3
Design não é CSS
Design não é CSS
• Lugar para fazer layout é no Photoshop, Gimp, ou na sua ferramenta preferida
• Nunca implemtente um sitesem um layout
Regra #4
Não estrague as coisas
• A instalação Padrão cobre 90% das necessidades de sites
• Não altere as coisas sem necessidade
Não estrague as coisas!
Não estrague as coisas!
• Não mude templates apenas para alterar a aparência.
• Consistência da interface.• Acessibilidade.
Não estrague as coisas!
• Deliverance é uma ferramenta incrível,mas pode criar vários problemas– Acessibilidade– Padrões web– Facilidade de uso– SEO
• Só deve ser utilizado por pessoas habilitadas
Regra #5
Vire um Ninja CSS
• Toda apresentação precisa estar na CSS.
• Não misture Apresentação e Estrutura.
• Com conhecimento avançado de CSS dá pra implementar qualquer layout
CSS Ninja
• Não é possivel implementar um bom layout em qualquer sistema sem CSS
• Ou melhor, sem um bom CSS
CSS Ninja
Regra #6
Livre-se do desnecessário
• Elimine tudo o que não estiver usando:– CSS– JS– KSS– IMG
Livre-se do desnecessário
• Use CSS Sprites– Todas as imagens num único arquivo
Livre-se do desnecessário
Regra #7
Tome cuidado com Acessibilidade
• Garanta que tudo o que você desenvolver vai seguir os padrões
• Nunca esqueça de coisas básicas:– Alt das imagens– Atalhos– Cuidado com o contraste– Cuidado com scripts
<p class="hiddenStructure">
<a accesskey="2" href="documentContent">Ir para o conteúdo.</a> |
<a accesskey="6" href="portlet-navigation-tree">Ir para a navegação</a>
</p>
Acessibilidade
Regra #8
Cuide bem do seu usuário
• Ensine seu usuário a usar o sistema.• Ensine os conceitos do Plone.• Ofereça material de apoio.
Cuide do seu usuário
Regra #9
Não complique as coisas
• Mantenha as coisas simples:– Para seu usuário.– Para você.
• De nada adianta uma ferramenta poderosa se ela não for fácil de usar
Não complique as coisas
“Simplicity is the ultimate sophistication”Leonardo Davinci
André Nogueira – Plone Symposium South America [email protected]
http://www.simplesconsultoria.com.br