Arquitetura de Informação - 7
|
|
- Ivan Penha Borba
- 8 Há anos
- Visualizações:
Transcrição
1 Arquitetura de Informação - 7 Ferramentas para Web Design Prof. Ricardo Ferramentas para Web Design 1
2 Ícone Imagem Banner Logotipo Título 1 Título 2 Tabela Disclaimer Título 1 Título 2 Ícone Ícone Imagem Banner Logo Qual é o objetivo da etapa de Especificação? Biblioteca Básica - Texto Biblioteca Básica.vsd - pág. 1 de 2 Projeto: Biblioteca Site: Autor: Guilhermo Reis Última Atualização: 27/10/03 Chamada de Texto Texto de Corpo Biblioteca Básica - Texto Biblioteca Básica.vsd - pág. 1 de 2 Projeto: Biblioteca Site: Autor: Guilhermo Reis Última Atualização: 27/10/03 Chamada de Texto Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean vel sapien vitae orci sodales ornare. Ut ornare sapien ac leo. Duis diam. Cras quis lacus. Nulla facilisi. Morbi tellus tortor, viverra sit amet, aliquam ut, aliquam at, nibh. Sed adipiscing dui sed risus. Sed pharetra, enim et condimentum tincidunt, metus metus cursus lorem, at venenatis enim nisl vel est. Duis imperdiet lorem non nibh adipiscing pellentesque. Nam vestibulum dictum arcu. Aliquam at dui. Nam mauris orci, aliquet et, condimentum non, commodo vel, nisl. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Duis a diam ac wisi scelerisque sollicitudin. Integer at augue vitae odio elementum volutpat. Nam sit amet sapien sit amet lectus iaculis porta. Donec vitae augue vulputate metus viverra convallis. 1- Lorem ipsum dolor sit amet, consectetuer adipiscing elit. 2- Duis a diam ac wisi scelerisque sollicitudin. 3- Integer at augue vitae odio elementum volutpat. 4- Nam sit amet sapien sit amet lectus iaculis porta. 5- Donec vitae augue vulputate metus viverra convallis. Lista com marcador Lista numerada Download de Arquivo Nota de Rodapé Este wireframe não tem nenhum compromisso com fontes, cores ou disposição dos elementos na página. Sua função é indicar o conteúdo de cada página do site. Nome do Arquivo.xxx (em arquivo xxx) 100 Kb 1- Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Vivamus sed est. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Fusce eget sapien. Ut eros metus, ornare et, vehicula facilisis, congue a, libero. Curabitur facilisis diam a nibh. Nulla facilisi. Vivamus nulla mauris, consectetuer eu. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Vivamus sed est. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Fusce eget sapien. Ut eros metus, ornare et, vehicula facilisis, congue a, libero. Curabitur facilisis diam a nibh. Nulla facilisi. Vivamus nulla mauris, consectetuer eu. Este wireframe não tem nenhum compromisso com fontes, cores ou disposição dos elementos na página. Sua função é indicar o conteúdo de cada página do site. PRnet/2012 Ferramentas para Web Design 2 Ferramentas para Web Design 2
3 Objetivo da etapa de Especificação na metodologia de projeto de Arquitetura de Informação: Detalhar e documentar toda a especificação do website para ele ser implementado. PRnet/2012 Ferramentas Ferramentas para para Web Web Design Design 3 3 Ferramentas para Web Design 3
4 Ícone Imagem Banner Logotipo Título 1 Título 2 Tabela Disclaimer Título 1 Título 2 Ícone Ícone Imagem Banner Logo Quais são as funções da etapa de Especificação? Biblioteca Básica - Texto Biblioteca Básica.vsd - pág. 1 de 2 Projeto: Biblioteca Site: Autor: Guilhermo Reis Última Atualização: 27/10/03 Chamada de Texto Texto de Corpo Biblioteca Básica - Texto Biblioteca Básica.vsd - pág. 1 de 2 Projeto: Biblioteca Site: Autor: Guilhermo Reis Última Atualização: 27/10/03 Chamada de Texto Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean vel sapien vitae orci sodales ornare. Ut ornare sapien ac leo. Duis diam. Cras quis lacus. Nulla facilisi. Morbi tellus tortor, viverra sit amet, aliquam ut, aliquam at, nibh. Sed adipiscing dui sed risus. Sed pharetra, enim et condimentum tincidunt, metus metus cursus lorem, at venenatis enim nisl vel est. Duis imperdiet lorem non nibh adipiscing pellentesque. Nam vestibulum dictum arcu. Aliquam at dui. Nam mauris orci, aliquet et, condimentum non, commodo vel, nisl. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Duis a diam ac wisi scelerisque sollicitudin. Integer at augue vitae odio elementum volutpat. Nam sit amet sapien sit amet lectus iaculis porta. Donec vitae augue vulputate metus viverra convallis. 1- Lorem ipsum dolor sit amet, consectetuer adipiscing elit. 2- Duis a diam ac wisi scelerisque sollicitudin. 3- Integer at augue vitae odio elementum volutpat. 4- Nam sit amet sapien sit amet lectus iaculis porta. 5- Donec vitae augue vulputate metus viverra convallis. Lista com marcador Lista numerada Download de Arquivo Nota de Rodapé Este wireframe não tem nenhum compromisso com fontes, cores ou disposição dos elementos na página. Sua função é indicar o conteúdo de cada página do site. Nome do Arquivo.xxx (em arquivo xxx) 100 Kb 1- Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Vivamus sed est. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Fusce eget sapien. Ut eros metus, ornare et, vehicula facilisis, congue a, libero. Curabitur facilisis diam a nibh. Nulla facilisi. Vivamus nulla mauris, consectetuer eu. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Vivamus sed est. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Fusce eget sapien. Ut eros metus, ornare et, vehicula facilisis, congue a, libero. Curabitur facilisis diam a nibh. Nulla facilisi. Vivamus nulla mauris, consectetuer eu. Este wireframe não tem nenhum compromisso com fontes, cores ou disposição dos elementos na página. Sua função é indicar o conteúdo de cada página do site. PRnet/2012 Ferramentas para Web Design 4 Ferramentas para Web Design 4
5 Funções da etapa de Especificação Criar um modelo do website para prever seu comportamento. Validar se ele atende aos requisitos do projeto. Especificar detalhadamente como ele deve ser implementado. Estabelecer uma comunicação formal entre o arquiteto e os demais membros da equipe de projeto (webdesigners, redatores, programadores, cliente, etc.). PRnet/2012 Ferramentas Ferramentas para para Web Web Design Design 5 5 Ferramentas para Web Design 5
6 Ícone Imagem Banner Logotipo Título 1 Título 2 Tabela Disclaimer Título 1 Título 2 Ícone Ícone Imagem Banner Logo Quais são os tipos de documentos da especificação na Arquitetura de Informação? Biblioteca Básica - Texto Biblioteca Básica.vsd - pág. 1 de 2 Projeto: Biblioteca Site: Autor: Guilhermo Reis Última Atualização: 27/10/03 Chamada de Texto Texto de Corpo Biblioteca Básica - Texto Biblioteca Básica.vsd - pág. 1 de 2 Projeto: Biblioteca Site: Autor: Guilhermo Reis Última Atualização: 27/10/03 Chamada de Texto Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean vel sapien vitae orci sodales ornare. Ut ornare sapien ac leo. Duis diam. Cras quis lacus. Nulla facilisi. Morbi tellus tortor, viverra sit amet, aliquam ut, aliquam at, nibh. Sed adipiscing dui sed risus. Sed pharetra, enim et condimentum tincidunt, metus metus cursus lorem, at venenatis enim nisl vel est. Duis imperdiet lorem non nibh adipiscing pellentesque. Nam vestibulum dictum arcu. Aliquam at dui. Nam mauris orci, aliquet et, condimentum non, commodo vel, nisl. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Duis a diam ac wisi scelerisque sollicitudin. Integer at augue vitae odio elementum volutpat. Nam sit amet sapien sit amet lectus iaculis porta. Donec vitae augue vulputate metus viverra convallis. 1- Lorem ipsum dolor sit amet, consectetuer adipiscing elit. 2- Duis a diam ac wisi scelerisque sollicitudin. 3- Integer at augue vitae odio elementum volutpat. 4- Nam sit amet sapien sit amet lectus iaculis porta. 5- Donec vitae augue vulputate metus viverra convallis. Lista com marcador Lista numerada Download de Arquivo Nota de Rodapé Este wireframe não tem nenhum compromisso com fontes, cores ou disposição dos elementos na página. Sua função é indicar o conteúdo de cada página do site. Nome do Arquivo.xxx (em arquivo xxx) 100 Kb 1- Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Vivamus sed est. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Fusce eget sapien. Ut eros metus, ornare et, vehicula facilisis, congue a, libero. Curabitur facilisis diam a nibh. Nulla facilisi. Vivamus nulla mauris, consectetuer eu. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Vivamus sed est. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Fusce eget sapien. Ut eros metus, ornare et, vehicula facilisis, congue a, libero. Curabitur facilisis diam a nibh. Nulla facilisi. Vivamus nulla mauris, consectetuer eu. Este wireframe não tem nenhum compromisso com fontes, cores ou disposição dos elementos na página. Sua função é indicar o conteúdo de cada página do site. PRnet/2012 Ferramentas para Web Design 6 Ferramentas para Web Design 6
7 Existem quatro tipos de documentos que são elaborados para a especificação da Arquitetura de Informação de um website: Sitegrama Fluxo das Transações Wireframes Vocabulário Controlado PRnet/2012 Ferramentas Ferramentas para para Web Web Design Design 7 7 Ferramentas para Web Design 7
8 Cada tipo documento especifica características diferentes do website. Assim, em um projeto, nem sempre todos eles são necessários. Cabe ao arquiteto de informação decidir se deve ou não elaborar cada um desses documentos conforme a necessidade das pessoas que utilizarão as suas especificações. PRnet/2012 Ferramentas Ferramentas para para Web Web Design Design 8 8 Ferramentas para Web Design 8
9 Tipos de documentos de especificação na Arquitetura de Informação Sitegrama Diagrama que representa a organização hierárquica de um website. Contém todas as páginas de conteúdo e a entrada de todas as transações. Para representar a hierarquia, utiliza diagramas em árvore. PRnet/2012 Ferramentas Ferramentas para para Web Web Design Design 9 9 Ferramentas para Web Design 9
10 Tipos de documentos de especificação na Arquitetura de Informação Fluxo das Transações PRnet/2012 Diagrama que representa o modelo de interação do usuário com as transações do website. Contém todas as páginas das transações, incluindo mensagens de erro e sucesso. Para representar o modelo de interação utiliza fluxogramas indicando como ocorrem as transições entre as páginas. Ferramentas para Web Design 10 Ferramentas Ferramentas para para Web Web Design Design 10 10
11 Tipos de documentos de especificação na Arquitetura de Informação Wireframes Diagrama que representa todos os elementos de uma página, definindo esses elementos, a hierarquia entre eles, agrupamentos e suas importâncias relativas. Para representar os elementos utilizam-se esboços das páginas. PRnet/2012 Ferramentas Ferramentas para para Web Web Design Design Ferramentas para Web Design 11
12 Tipos de documentos de especificação na Arquitetura de Informação Wireframes Seu objetivo é comunicar o conteúdo e as funções de cada página para discussão com a equipe de projeto e para orientar a implementação. O wireframe não representa o projeto gráfico do website, ele apenas apresenta uma versão simplificada da página sem elementos distrativos. PRnet/2012 Ferramentas Ferramentas para para Web Web Design Design Ferramentas para Web Design 12
13 Tipos de documentos de especificação na Arquitetura de Informação Vocabulário Controlado Subconjunto definido da linguagem natural construído com base em um conjunto de regras prescritivas destinado a especificar os rótulos utilizados no website e os meta-dados utilizados na indexação dos conteúdos. PRnet/2012 Ferramentas para Web Design 13 Ferramentas Ferramentas para para Web Web Design Design 13 13
14 Os documentos de especificação são um contrato O sitegrama, o fluxo das transações/navegação e os wireframes são os documentos que especificam como será o trabalho das demais equipes envolvidas no projeto do website: Designers gráficos Programadores Redatores etc. Ferramentas para Web Design 14 Ferramentas para Web Design 14
15 Os documentos de especificação são um contrato Por isso trate esses documentos como um contrato: Evite ambigüidades. Seja detalhista. Não deixe nada subentendido. Não de margem a interpretação. Especifique o que está dentro do escopo e o que está fora. Tenha certeza que todos os documentos foram compreendidos completamente. Ferramentas para Web Design 15 Ferramentas para Web Design 15
16 O que é um Diagrama de Árvore? Ferramentas para Web Design 16 Ferramentas para Web Design 16
17 Diagrama de Árvore Diagrama de árvore é uma forma gráfica de representar organizações de maneira hierárquica. Ferramentas para Web Design 17 Ferramentas para Web Design 17
18 Diagrama de Árvore A Raiz Nível 0 Nó pai de E e F B C D Nível 1 E F G H I Nível 2 Nós filhos de B J K Nível 3 Sub-árvores Ferramentas para Web Design 18 Ferramentas para Web Design 18
19 Diagramas de Árvore Uma árvore é definida como um conjunto finito de nós com as seguintes características: Existe um nó especial chamado raiz (normalmente representa a Home-Page do site). Os demais nós são particionados em estruturas separadas de árvores, denominadas sub-árvores. Como são estruturas separadas um nó não aparecerá em mais de uma sub-árvore. A Raiz Nível 0 Nó pai de E e F B C D Nível 1 E F G H I Nível 2 Nós filhos de B J K Nível 3 Sub-árvores Ferramentas para Web Design 19 Ferramentas para Web Design 19
20 Diagramas de Árvore Nós filhos são definidos como as raízes das sub-árvores de um nó, que é o pai deles. Nós irmãos são os nós filhos que possuem o mesmo pai. Nível de um nó é a sua distância em relação a raiz da árvore. A Raiz Nível 0 Nó pai de E e F B C D Nível 1 E F G H I Nível 2 Nós filhos de B J K Nível 3 Sub-árvores Ferramentas para Web Design 20 Ferramentas para Web Design 20
21 O que é um Fluxograma? Ferramentas para Web Design 21 Ferramentas para Web Design 21
22 Fluxogramas Fluxograma é uma forma gráfica de representar atividades que devem ser executadas em seqüência, como em um processo. Um fluxograma é composto por símbolos que representam atividades (normalmente retângulos), símbolos que representam decisões (normalmente losângulos) e símbolos que representam o fluxo, a seqüência de execução das atividades (normalmente setas). Ferramentas para Web Design 22 Ferramentas para Web Design 22
23 Fluxogramas No fluxo das transações os símbolos atividades (retângulos) representam as páginas do website, como os nós do diagrama de árvore. Os símbolos decisões representam as decisões do sistema para escolher qual página apresentar e os símbolos de seqüência representam a passagem de uma página para outra. Ferramentas para Web Design 23 Ferramentas para Web Design 23
24 Fluxogramas Menu Fluxo Botão Cancelar Botão Cancelar Dados Senha Botão Formulário corretos Botão Sim Confirmação válida Sim Sucesso OK OK?? Não Não Decisão Páginas Ferramentas para Web Design 24 Ferramentas para Web Design 24
25 Público-alvo Vários públicos utilizam o sitegrama, o fluxo das transações e o wireframe para entender a organização, ter uma visão geral do website, dos elementos e funcionalidades das páginas do website, porém com propósitos diferentes. Ferramentas para Web Design 25 Ferramentas para Web Design 25
26 Quem é o Público-alvo do Sitegrama e do Fluxo das Transações? Ferramentas para Web Design 26 Ferramentas para Web Design 26
27 Público-alvo do Sitegrama e do Fluxo das Transações Arquitetos de Informação: usam para organizar as informações e especificar as páginas do website. Diretores de Arte: usam para definir o número de telas únicas (telas-tipo) e para desenhar o sistema de navegação do website. Redatores e produtores de conteúdo: usam para definir os requisitos de conteúdos do website. Programadores e Analistas: usam para definir os requisitos técnicos do projeto. Ferramentas para Web Design 27 Ferramentas para Web Design 27
28 Quem é o Público-alvo do Wireframe? Ferramentas para Web Design 28 Ferramentas para Web Design 28
29 Público-Alvo dos Wireframes Arquitetos de Informação: usam para especificar as páginas do website. Diretores de Arte: usam para definir a linha gráfica do website, o layout de cada página. Redatores e produtores de conteúdo: usam para especificar os conteúdos das páginas. Programadores e Analistas: usam para implementar as funcionalidades das aplicações. Clientes contratantes: usam para validar se o conteúdo das páginas está de acordo com os requisitos do projeto. Usuários: usam para simular o funcionamento do website em testes de usabilidade. Ferramentas para Web Design 29 Ferramentas para Web Design 29
30 Especificação do Wireframe A especificação completa de um wireframe é composta por três partes (camadas) diferentes: Identificação Camada que apresenta a identificação dos elementos, seus agrupamentos e a sua priorização. Representação Camada que apresenta exemplos de conteúdos ou exemplos das funcionalidades Descrição Especificação detalhada dos elementos e suas funcionalidades. Menu Lateral Logotipo Caixa de busca Cabeçalho Barra de navegação institucional Bread Crumb Título da Página Versão para impressão Envie para um amigo Área de Conteúdo Cross Content Logo Meus Artigos e Apresentações Útimas Atualizações Biblioteca Inserir nova referência GUILHERMO.com Página Inicial > Página Título Imagem Busca: OK Quem é Guilhermo Entre em Contato Versão para impressão Envie para um amigo Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Mauris sit amet arcu at lectus feugiat sollicitudin. Etiam et libero eu magna facilisis consequat. Phasellus luctus pede quis turpis. Ut mi. Cras porttitor. Maecenas id mi. Suspendisse id diam id magna elementum sagittis. Cras semper tortor in magna. Título Cross Content Lorem ipsum dolor Lorem ipsum dolor Lorem ipsum dolor Lorem ipsum dolor Descrição do wireframe Página Interna (Modelo de Moldura) 6.1. Cross Content Definição: Lista com links para páginas com conteúdo relacionado ao apresentado. Deve ser usado Definição: Modelo para as páginas internas do website. apenas se houver conteúdo relacionado. Elemento Opcional: Sim Relação dos Elementos Observações: Verifique o cross content de cada página na planilha de descrição do sitegrama e fluxo de navegação. 1. Cabeçalho Definição: Cabeçalho de identificação do website. Deve estar presente em todas as páginas. 7. Menu Lateral Elemento Opcional: Não Definição: Contém links para as principais seções do website. Deve estar presente em todas as páginas internas Barra de navegação institucional Elemento Opcional: Não Definição: Contém os links para as seções institucionais do website. 8. Rodapé Elemento Opcional: Não Definição: Rodapé da página identificando o website e o copyright de diretos autorais. Deve estar 1.2. Caixa de busca presente em todas as páginas. Definição: Interface do sistema de busca do website. Elemento Opcional: Não Funcionalidade: Usuário digita uma ou mais palavras chaves e aperta o botão OK. São apresentadas todas as referências que contém a(s) palavra(s) digitada(s). Elemento Opcional: Não 1.3. Logotipo Definição: Logotipo para identificação do website. Funcionalidade: Contém link para a Home-Page. Elemento Opcional: Não 2. Bread Crumb Definição: Indica a página atual e todas as páginas hierarquicamente superiores. Deve estar presente em todas as páginas. Funcionalidade: Possui link para as páginas hierarquicamente superiores. Elemento Opcional: Não Observações: Verifique o bread crumb de cada página na planilha de descrição do sitegrama e fluxo de navegação. 3. Título da Página Definição: Título explicando o conteúdo da página. Elemento Opcional: Não 4. Versão para impressão Definição: Ao clicar no link apresenta uma versão da página preparada para impressão. Elemento Opcional: Sim Observações: A versão para impressão da página deve ser apresentada em uma nova janela popup. 5. Envie para um amigo Definição: Ao clicar no link apresenta um formulário para se enviar a página para um amigo por e- mail. Elemento Opcional: Sim 6. Área de Conteúdo Definição: Contém o conteúdo da página (texto, imagem, formulário, etc.). Elemento Opcional: Não Suspendisse sed est. Fusce mi enim, sollicitudin nec, pretium eu, tincidunt a, dolor. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Cras a sapien at wisi vehicula placerat. Vivamus mattis. Pellentesque eu tellus mattis enim mollis porta. Quisque turpis lacus, adipiscing tincidunt, bibendum ut, tincidunt non, ante. Sed at est dignissim tellus suscipit porta. Nullam turpis arcu, lacinia at, volutpat non, rutrum non, quam. Aliquam consectetuer iaculis sem. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Etiam in neque. Nunc lorem. Integer sed ante. PRnet/2012 Rodapé Quisque pretium dolor vehicula nisl. Sed sodales, lorem vitae placerat congue, dolor mauris nonummy massa, placerat blandit ligula diam eget nulla. Etiam ultricies magna ut mi. Nam ut nulla. Proin pellentesque, neque id scelerisque pretium, leo urna pulvinar urna, a convallis quam libero eget odio. Ut non neque. Ferramentas para Web Design 30 (c) GUILHERMO.com Ferramentas para Web Design 30
31 Grau de detalhamento da especificação Outras formas especificar um wireframe Outras formas de especificar um wireframe podem ser utilizadas conforme as características do projeto. Estas outras formas diminuem o grau de detalhamento da especificação do wireframe, porém são mais fáceis de elaborar. Cabe ao arquiteto responsável pelo projeto definir qual forma de especificação utilizar em cada wireframe. Formas de especificar um wireframe Especificação Completa (Identificação, Representação e Descrição) Identificação e Representação Representação com observações Esboço do wireframe Print Screen com observações Indicação no Sitegrama ou Fluxo das Transações Facilidade de elaboração PRnet/2012 Ferramentas para Web Design 31 Ferramentas para Web Design 31
32 Alta Fidelidade X Baixa Fidelidade Wireframes podem ter a camada de Representação com diferentes graus de fidelidade. Quanto maior o grau de fidelidade mais o wireframe se aproxima do layout final da página, porém é mais trabalhoso para elaborá-lo. Proximidade do layout final da página Visão Abstrata Baixa Fidelidade Média Fidelidade Alta Fidelidade PRnet/2012 Esforço para elaborar o wireframe Ferramentas para Web Design 32 Ferramentas para Web Design 32 Toub, S. Evaluating Information Architecture: A practical guide to assessing web site organization, Argus,
33 Alta Fidelidade X Baixa Fidelidade No projeto de um website o designer é o profissional responsável por definir o layout final da página (posição dos elementos, cores, fontes, etc.). Por isso para se elaborar wireframes com alta fidelidade é preciso que o designer gráfico e o arquiteto de informação trabalhem juntos. Ferramentas para Web Design 33 Ferramentas para Web Design 33
34 Alta Fidelidade X Baixa Fidelidade Independente do grau de fidelidade, o arquiteto de informação precisa informar a prioridade dos elementos na página, qual elemento precisa ter mais destaque. A priorização pode ser feita através da posição do elemento do desenho da camada de Representação, obedecendo a linha de leitura diagonal de uma página. Elementos situados no canto superior esquerdo são mais prioritários que os elementos situados no canto inferior direito. Essa regra de prioridade deve ser utilizada com critério, elementos como barras de navegação, menu e logotipos entre outros mesmo que não sejam prioritários podem possuir uma posição fixa no canto superior esquerdo da página. Ferramentas para para Web Web Design Design 34 34
35 Alta Fidelidade X Baixa Fidelidade Linha de prioridade dos elementos no wireframe Mais prioritário Menos prioritário Ferramentas para Web Design 35
36 Técnicas para elaboração de wireframes Técnicas para elaborar wireframes de produtos web. Verifique a resolução de tela a ser utilizada como referência Utilize como base o mapa estrutural Escolha a melhor forma para apresentar cada tipo de informação Menus Bread Crumb Trails Textos (títulos, sub-títulos, corpo de texto... Listas e tabelas Imagens (thumbnails, fotos, legendas, ícones, banners) Formulários Ferramenta de busca Ferramentas para Web Design 36 Ferramentas para Web Design 36
37 Resolução de Tela Verifique a resolução de tela mínima a qual o produto deve atender. Menus Com base na estrutura definida na fase anterior, devese analisar e definir a melhor forma de apresentar os diversos níveis de informação na tela. Existem algumas estruturas comuns, que podem ser tomadas como referência: Ferramentas para Web Design 37 Ferramentas para Web Design 37
38 Resolução de Tela Menu horizontal X Menu vertical O menu horizontal pode ser interessante quando existem poucos itens de menu e/ou se deseja liberar área útil para apresentação de conteúdo. O menu vertical oferece, em contrapartida, maior escalabilidade. Menus de segundo nível podem ser apresentados também na horizontal.ou na vertical, utilizando recursos como dhtmi ou flash. A mesma solução pode ser aplicada em menus verticais de primeiro nível. Existe ainda o recurso conhecido como "colapse menu", que apresenta os itens de níveis inferiores, empurrando os demais itens do menu. Ferramentas para Web Design 38 Ferramentas para Web Design 38
39 Bread Crumb Trails Apresenta a estrutura do site até a pagina atual Home Institucional Histórico Palavra do Presidente Diferente de histórico/tracking de navegação Ferramentas para Web Design 39 Ferramentas para Web Design 39
40 É preciso definir padrões para a apresentação de: Títulos Sub-títulos Textos Corpo de texto Textos longos? 0 que tem mais sentido? Rolar a página (scroll) ou criar paginação? Faz sentido imprimir o texto? Neste caso, deve-se prever uma versão específica para impressão? Links Destaques de conteúdo (highlights no corpo do texto) Nesta fase, não se deve definir fonte e cores. 0 importante é que sejam definidas as proporções e pesos que cada um dos elementos acima possui, bem como os comportamentos de interação. Ferramentas para Web Design 40 Ferramentas para Web Design 40
41 Listas e tabelas As informações vêm de banco de dados? Estudar o pior caso (número de caracteres, caixa alta/baixa, quantidade de informações) Priorizar informações a serem apresentadas Utilizar conceito drill-down (mostra detalhes em outra página/layer/pop) Prever paginação Alternar cores das linhas para facilitar leitura Ferramentas para Web Design 41 Ferramentas para Web Design 41
42 Imagens Prever a inclusão de imagens que têm a função de comunicar algo: fotos de produtos, mapas... Thumbnail X Imagem ampliada Verificar necessidade de inclusão de legenda Usar sempre ALT + Text (para permitir a leitura por softwares específicos para deficientes visuais) Ferramentas para Web Design 42 Ferramentas para Web Design 42
43 Thumbnails são versões reduzidas de imagens, usadas para tornar mais fácil o processo de procurar e reconhecer. - - Os motores de busca de imagem e programas de organização destas usam esta técnica, tal como alguns sistemas operacionais e ambientes de trabalho modernos, tais como o Windows XP, KDE e o GNOME. - Os thumbnails automáticos reduzem imagens grandes para um tamanho menor, o resultado pode não ter uma elevada qualidade, o que resulta de um redimensionamento da imagem. Ferramentas para Web Design 43 Ferramentas para Web Design 43
44 Formulários Oferecer indicações sobre preenchimento do campo. Em caso de erro de preenchimento, trazer de volta o formulário com campos pré-preenchidos e indicar o erro ao usuário. Prever erros de sistema e, caso ocorram, mostrar mensagem explicativa ao usuário. Ferramentas para Web Design 44 Ferramentas para Web Design 44
45 Banners e outros anúncios Têm formato padrão? Expand banner: como funciona nos diferentes browsers? Ferramentas para Web Design 45 Ferramentas para Web Design 45
46 Wireframe do site FOX Sports PRnet/2012 Ferramentas para Web Design 46 Ferramentas para Web Design 46
47 Versão final do site FOX Sports Ferramentas para Web Design 47 Ferramentas para Web Design 47
48 Comparação entre wireframe e resultado final Ferramentas para Web Design 48 Ferramentas para Web Design 48
Wireframes. Definição. Wireframes
Wireframes Guilhermo Reis www.guilhermo.com 2 Definição Wireframes Diagrama que representa todos os elementos de uma página, definindo esses elementos, a hierarquia entre eles, agrupamentos e suas importâncias
Leia maisWireframes. 2006 Guilhermo Reis www.guilhermo.com
Wireframes 2006 Guilhermo Reis www.guilhermo.com 2 Definição Wireframes Diagrama que representa todos os elementos de uma página, definindo esses elementos, a hierarquia entre eles, agrupamentos e suas
Leia maisatividade florestal não-madeireira título da categoria com opção de uso de icone
buscar no site OK Página inicial links rápidos a fazenda santa maria nononononono não- título em destaque texto complementar Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent vestibulum
Leia maiswireframe do novo site
wireframe do novo site home METRÔ PAINÉIS S ANUNCIE QUEM SOMOS Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam imperdiet sed eros ut luctus. Suspendisse eu vulputate massa. Nullam dignissim,
Leia maisModelo Canônico de Relatório Técnico e/ou Científico com abntex2
Equipe abntex2 Modelo Canônico de Relatório Técnico e/ou Científico com abntex2 Brasil 2013, v-1.7.1 Equipe abntex2 Modelo Canônico de Relatório Técnico e/ou Científico com abntex2 Modelo canônico de
Leia maisPROPOSTA DE DESENVOLVIMENTO INTERNET PARA CARTÃO SUL
PROPOSTA DE DESENVOLVIMENTO INTERNET PARA CARTÃO SUL I. Objetivos e Descrição Redesign do website que a empresa possui, acrescentando novos recursos, informações mais detalhadas dos produtos e serviços,
Leia maisd ce R E V I S T A D I G I TA L
d ce R E V I S T A D I G I TA L Doce Revista Digital Há 25 anos no mercado, a imagem da Doce Revista é marcada pelo jornalismo ágil e independente. É a única publicação nacional voltada exclusivamente
Leia maisSOCALOR saunas Manual de Identidade Visual
Manual de Identidade Visual Normas padrão para construção e uso correto da marca. Comunicação institucional padrão Apresentação 3 Envelope 36 18 Conceito da marca 4 Envelope 34 19 Marca 5 Envelope 32 20
Leia maisR.Boquino Manual de Identidade Visual
R.Boquino Manual de Identidade Visual Normas padrão para construção e uso correto da marca. Comunicação institucional padrão Apresentação 3 Envelope 36 18 Conceito da marca 4 Envelope 34 19 Marca 5 Envelope
Leia maisMANUAL DE REGRAS BÁSICAS. CAPAS MESTRADO Instituto Politécnico de Viana do Castelo
INSTITUTO POLITÉCNICO MANUAL DE REGRAS BÁSICAS CAPAS MESTRADO Instituto Politécnico de Viana do Castelo Capa Tese de Mestrado INSTITUTO POLITÉCNICO Dimensões da capa: A4+lombada variável+a4 Papel: Coché
Leia maisT12design MÓVEIS DE ALTO PADRÃO. Manual de Identidade Visual T12 Design
Índice Capítulo Apresentação... O logo e seus elementos... Variações cromáticas... Reduções e reservas... Aplicação em fundos de cor... Tipografias de apoio... Usos indevidos... Cartão de Visita... Pág.
Leia maisArquitetura de Informação para Web
Arquitetura de Informação para Web Aula introdutória sobre Arquitetura de Informação para Web na ECA - USP Guilhermo Almeida dos Reis reis@guilhermo.com www.guilhermo.com Novembro / 2004 Agenda Definições
Leia maisEMBRACE THE FUTURE SERVIÇO PÓS-VENDA ONDE ESTAMOS NEGÓCIO ÁREAS DE EDIFÍCIO PLATINUM MOÇAMBIQUE
MENU EMBRACE THE FUTURE ÁREAS DE NEGÓCIO SERVIÇO PÓS-VENDA ONDE ESTAMOS EM DESTAQUE PORTUGAL MARROCOS ARGÉLIA EDIFÍCIO PLATINUM GANA ANGOLA ARGENTINA O Grupo Ramos Ferreira vai ser responsável, em parceria
Leia maiswireframe homepage Onde buscar ajuda para animais carentes onde denunciar maus tratos Feiras de doação por todo o Brasil Apadrinhe um cão
wireframe homepage tipo Quem somos Doações em dinheiro Onde r ajuda para animais carentes equipe Doações em mantimentos onde denunciar maus tratos banner 720 álbum x 160 de fotos Doaçòes medicinais Feiras
Leia maisSorriso. Metálico. Ponto de Vista. A Saúde bucal infantil. Entrevista. Comportamento
Sorriso Entrevista Dr Alisson explica as vantagens dos aparelhos Autoligados Comportamento O que te faz feliz? Fique Ligado Participe, curta, compartilhe e ganhe brindes especiais Escova de dentes: A maior
Leia maisFulano de Tal. Exemplo de livro produzido com. Publicações Acadêmicas Ltda. abntex2 v-1.9.5
Fulano de Tal Exemplo de livro produzido com abntex2 Publicações Acadêmicas Ltda. abntex2 v-1.9.5 Fulano de Tal Exemplo de livro produzido com abntex2 Publicações Acadêmicas Ltda. abntex2 v-1.9.5 2015
Leia maisFederação do Comércio de Bens, Serviços e Turismo do Estado de Mato Grosso do Sul. Manual de Marca NORMAS GRÁFICAS E APLICAÇÕES
Manual de Marca NORMAS GRÁFICAS E APLICAÇÕES Federação do Comércio de Bens e de Serviços do Estado do Mato Grosso do Sul aguardamos envio de uma imagem de mato grosso do sul Manual de Marca NORMAS GRÁFICAS
Leia maisEquipe abntex2. Modelo Canônico de Relatório Técnico e/ou Científico com abntex2
Equipe abntex2 Modelo Canônico de Relatório Técnico e/ou Científico com abntex2 Brasil 2013 Equipe abntex2 Modelo Canônico de Relatório Técnico e/ou Científico com abntex2 Modelo canônico de Relatório
Leia maisDesign Guilhermo Reis
Design 2006 Guilhermo Reis www.guilhermo.com 2 Qual a importância da modelagem? Você compraria um apartamento em um prédio em construção sem ver a planta? www.mermier.com.br 3 Qual a importância da modelagem?
Leia maisRecursos Naturais. Cores quentes, energia, países de clima tropical, desigualdade social. Conceito: mover para somar. Projeção de cinema
Ven.ti.la.dor adj (ventilar+dor2) Que ventila; ventilante. sm 1 Aparelho que renova o ar de ambientes fechados ou que o põe em circulação; aparelho que produz corrente de ar. Recursos Naturais { Cores
Leia maisNormas para envio de artigos:
NORMAS PARA ENVIO DE ARTIGOS Formatação da página: recuo superior e da lateral esquerda de 3 cm. Recuo inferior e da lateral direita de 2,5 cm, conforme a formatação deste documento. Título: fonte Arial,
Leia maisOlá! Vamos conhecer todas as aplicações e usos da sua Marca e de todos os elementos que formam sua identidade?
Olá! Vamos conhecer todas as aplicações e usos da sua Marca e de todos os elementos que formam sua identidade? Índice O que é a Marca? Conceito 4 Personalidade da Marca 5 Como ela é? Marca Principal Versão
Leia maisMANUAL DE IDENTIDADE VISUAL ECOBRAZ
Sumário Sumário 1. Apresentação 2. O logo e seus elementos...... 3. Variações Cromáticas 4. Reduções e Reservas 5. Aplicação em fundo de cor 6. Tipografias de apoio 7. Usos indevidos..................
Leia maisTÍTULO DO ARTIGO EM PORTUGUÊS TÍTULO DO ARTIGO EM INGLÊS
TÍTULO DO ARTIGO EM PORTUGUÊS TÍTULO DO ARTIGO EM INGLÊS Nome completo (sem abreviações) do Autor 1, última titulação, endereço profissional Nome completo (sem abreviações) do Autor 2, última titulação,
Leia maisO ALUNO SURDO E OS PROCESSOS DE INTERAÇÃO NA COMPREENSÃO DO ENUNCIADO MATEMÁTICO
O ALUNO SURDO E OS PROCESSOS DE INTERAÇÃO NA COMPREENSÃO DO ENUNCIADO MATEMÁTICO Ludmyla Sathler Aguiar do Nascimento 1 GD12 Educação Matemática e Inclusão A leitura e compreensão textual expõem o quanto
Leia maisMANUAL DE USO DA MARCA INSTITUTO NACIONAL DO SEMIÁRIDO
MANUAL DE USO DA MARCA INSTITUTO NACIONAL DO SEMIÁRIDO SUMÁRIO 1.1 1.2 1.3 1.4 1.5 1.6 1.7 1.8 1.9 1.10 1.11 1.12 1.13 1.14 1.15 1.16 Introdução Assinatura institucional Malha de construção Assinatura
Leia maisHUGO QUEIROZ ABONIZIO A IMPORTÂNCIA DO PDTI NA IMPLANTAÇÃO DA GOVERNANÇA DE TI NAS PREFEITURAS BRASILEIRAS
HUGO QUEIROZ ABONIZIO A IMPORTÂNCIA DO PDTI NA IMPLANTAÇÃO DA GOVERNANÇA DE TI NAS PREFEITURAS BRASILEIRAS LONDRINA PR 2015 HUGO QUEIROZ ABONIZIO A IMPORTÂNCIA DO PDTI NA IMPLANTAÇÃO DA GOVERNANÇA DE
Leia maisMANUAL DE USO DE MARCA
MANUAL DE USO DE MARCA INTRODUÇÃO A MARCA FAPEU A marca é um dos bens mais preciosos de uma empresa. Ela existe para ser vista e lembrada pelos consumidores, identificando-se com os produtos, serviços
Leia maisOS CAMINHOS PARA UMA APOSENTADORIA PLANEJADA
CAPITANIA MULTI CRÉDITO PRIVADO OS CAMINHOS PARA UMA Apresentação de Produto 2º Tri 2009 APOSENTADORIA PLANEJADA Capitânia Asset & Risk Management www.capitania.net Rua Dona Leopoldina, 48 São João -Porto
Leia maisAssociação Nacional de Fabricantes de Esquadrias de Alumínio Manual de Identidade Corporativa
Associação Nacional de Fabricantes de Esquadrias de Alumínio Manual de Identidade Corporativa 1 Associação Nacional de Fabricantes de Esquadrias de Alumínio A Identidade Visual da Afeal é um de seus principais
Leia maisMANUAL DE IDENTIDADE VISUAL CENTEIAS
MANUAL DE IDENTIDADE VISUAL Introdução A Marca Versões Cores Fonte Padrão Papelaria Template de Apresentações 4 5 6 7 8 9 18 ÍNDICE Este manual tem a função de estabelecer os parâmetros corretos para
Leia maisCCM002 Metodologia de Pesquisa em Ciência da Computação. Apresentações. Prof. Jesús P. Mena-Chalco 3Q-2016
1 CCM002 Metodologia de Pesquisa em Ciência da Computação Prof. Jesús P. Mena-Chalco jesus.mena@ufabc.edu.br 3Q-2016 2 Pratique, pratique, pratique,. Pode inovar, não ha regra apenas sugestões. Pode falar
Leia maisComo gerenciar com sucesso o seu empreendimento
GRANDE ARACAJU SERGIPE Ano I Edição 1 Março/Abril 2018 ADMINISTRAÇÃO Como gerenciar com sucesso o seu empreendimento Entrevista com Dr. ANTONIO JOSÉ DA SILVA Administrador da SET & Cia. EXPEDIENTE EDITORIAL
Leia maisIntro. Índice. Um teste do L Y X. Contents. efeefe. Sexta-feira, 13 de agosto de I O primeiro capítulo 1. II O segundo capítulo 3.
Um teste do L Y X efeefe Sexta-feira, 13 de agosto de 2010 Abstract Esse texto é teste do software L Y X para a diagramação de publicações online. Também vou utilizá-lo como base para converter para diversos
Leia maisUNIVERSIDADE TECNOLÓGICA FEDERAL DO PARANÁ DEPARTAMENTO ACADÊMICO DE ENGENHARIA MECÂNICA
UNIVERSIDADE TECNOLÓGICA FEDERAL DO PARANÁ DEPARTAMENTO ACADÊMICO DE ENGENHARIA MECÂNICA PRIMEIRO AUTOR SEGUNDO AUTOR TERCEIRO AUTOR QUARTO AUTOR QUINTO AUTOR SEXTO AUTOR TÍTULO COMPLETO DO PROJETO PROJETO
Leia maisUm teste do L Y X. efeefe
Um teste do L Y X efeefe Sexta-feira, 13 de agosto de 2010 Esse texto é teste do software L Y X para a diagramação de publicações online. Também vou utilizá-lo como base para converter para diversos formatos
Leia maisGUIA SIMPLIFICADO DA LOGOMARCA
GUIA SIMPLIFICADO DA LOGOMARCA 1 2 Introdução 04 A logomarca 05 Variantes de cor 06 Dimensões mínimas 07 Área de não-interferência 08 Usos incorretos 09 Cores institucionais 10 Tipografia Grafismo 11 12
Leia maisISEL Instituto Superior de Engenharia de Lisboa ADEETC Área Departamental de Engenharia de Electrónica e Teleconumicações e de Computadores
ISEL Instituto Superior de Engenharia de Lisboa ADEETC Área Departamental de Engenharia de Electrónica e Teleconumicações e de Computadores MERCM Mestrado em Eng. de Redes de Comunicação e Multimédia Dissertação
Leia maisEDITAL 03/2019 DISCIPLINA ESPECIAL: DIPLOMACIA MULTILATERAL E LIDERANÇA
EDITAL 03/2019 DISCIPLINA ESPECIAL: DIPLOMACIA MULTILATERAL E LIDERANÇA O presente documento versa sobre os requisitos para a submissão da inscrição na Disciplina Diplomacia Multilateral e Liderança, ofertada
Leia maisUm exemplo de projeto feito em L A TEX: Procure um título suficientemente claro
Um exemplo de projeto feito em L A TEX: Procure um título suficientemente claro Projeto de Pesquisa - Nome da Instituição/Agência de fomento Proponente: Jesús P. Mena-Chalco Centro de Matemática, Computação
Leia maisBRAND GUIDELINES RTP MÚSICA
RTP MÚSICA VERSÃO VERTICAL GRELHA / EIXOS BRAND GUIDELINES GRELHA / EIXOS VERSÃO VERTICAL VERSÃO HORIZONTAL BRAND GUIDELINES VERSÃO MOSCA COMPORTAMENTOS CROMÁTICOS (VERSÃO HORIZONTAL E VERTICAL) Cor Directa
Leia maisManual de Normas Gráficas. CASES - Cooperativa António Sérgio para a Economia Social
Manual de Normas Gráficas CASES - Cooperativa António Sérgio para a Economia Social CASES 2015 Assinatura CASES Versões da assinatura CASES v1 v3 v5 Positivo v2 v4 v5 Negativo v1. Esta assinatura deverá
Leia maisAMAZÔNIA PARA SEMPRE. Inclusão Digital. Acessibilidade. País do Futebol. Sustentabilidade & Gestão Social
www.revistaresponsa.com.br Sustentabilidade & Gestão Social Inclusão Digital A internet sobe a favela Pág. 09 Acessibilidade Adaptação por todos os lados Pág. 15 País do Futebol Como a Copa do Mundo no
Leia maisSelos de Certificação. Guia de Uso - Anexo 2 Elaborado em 28.07.2010
Selos de Certificação Guia de Uso - Anexo 2 Elaborado em 28.07.2010 Sumário 01. Abertura 02. Versões Cromáticas 03. Regras de Uso 04. Exemplos de Aplicações 05. Arquivos 2 01. Abertura Os Selos de Certifi
Leia maisEste é o Título do TCC
Faculdade do Piauí Curso de Bacharelado em Ciências da Computação Este é o Título do TCC Autores Teresina-PI, Xxxx de 20XX Autores Este é o Título do TCC Trabalho de Conclusão de Curso Monografia apresentada
Leia maisModelo Canônico de Trabalho Acadêmico com abntex2
Equipe abntex2 Modelo Canônico de Trabalho Acadêmico com abntex2 Brasil 2013, v Equipe abntex2 Modelo Canônico de Trabalho Acadêmico com abntex2 Modelo canônico de trabalho monográfico acadêmico
Leia maisMANUAL DE NORMAS Normas Normas.indd indd :09:36 12:09:36
MANUAL DE NORMAS Universo cromático Pantone 470 C C M Y K 0% 58% 100% 33% Black 50% Black Família Tipográfica Barmeno Regular utilizado nas palavras municipal de lisboa abcdefghijklmnopqrstuvxz ABCDEFGHIJKLMNOPQRSTUVXZ
Leia maisUniversidade Estadual de Campinas Faculdade de Tecnologia. Nome do Autor. Título da Dissertação ou Tese em Português
Universidade Estadual de Campinas Faculdade de Tecnologia Nome do Autor Título da Dissertação ou Tese em Português Limeira, 2017 Nome do Autor Título da Dissertação ou Tese em Português Dissertação apresentada
Leia maisManual de Identidade Visual
Manual de Identidade Visual Capítulo 1 Normatização Geral 1. Conceito de Marca 1.1. Identidade de Foz do Iguaçu 1.2. Pôster Conceitual 2. Assinaturas Padrão 2.1. Assinaturas em Português 2.2. Assinaturas
Leia maisFórum Metodologias Ativas MetA 2015
Fórum Metodologias Ativas MetA 2015 Professor, venha compartilhar suas experiências diferenciadas e inovadoras de ensino! Participe dessa onda Saberes da Universidade - Metodologias Ativas http://www.pucsp.br/reunindo-saberes-da-universidade
Leia maisSUPER LOGO EXEPLO DE APRESENTAÇÂO
SUPER LOGO EXEPLO DE APRESENTAÇÂO Capa com titulo da apresentação com sub-titulo ou texto de apoio, ou outras informações muito sumárias, caso necessário Lorem ipsum dolor sit amet, consectetur adipiscing
Leia maisManual de Normas Gráficas Março 2017
Manual de Normas Gráficas Março 2017 1 Introdução A Frusantos é uma empresa familiar, com aspiração comum, visão de crescimento e compromisso com o senso de legado, de geração em geração. Visão Ser empresa
Leia maisMODELO PARA EDITORAÇÃO DE LIVRO Guia do Usuário
MODELO PARA EDITORAÇÃO DE LIVRO Guia do Usuário 2016 Esta página ficará em branco. LOREM IPSUM (título) dolor (subtítulo) Falsa folha de rosto. Nesta folha conterá apenas o título e o subtítulo (se necessário)
Leia maisDIRETRIZES PARA ELABORAÇÃO DE MONOGRAFIA
UNIVERSIDADE FEDERAL DE OURO PRETO PRÓ-REITORIA DE GRADUAÇÃO DEPARTAMENTO DE CIÊNCIAS SOCIAIS, JORNALISMO E SERVIÇO SOCIAL COLEGIADO DE JORNALISMO PROJETOS EXPERIMENTAIS DIRETRIZES PARA ELABORAÇÃO DE MONOGRAFIA
Leia maisMANUAL DE IDENTIDADE VISUAL ATUALIZAÇÃO: MARÇO/2017
MANUAL DE IDENTIDADE VISUAL ATUALIZAÇÃO: MARÇO/2017 INTRODUÇÃO Neste manual de identidade visual da Comissão de Graduação do Instituto de Física da Universidade de São Paulo serão oferecidas soluções e
Leia maisArte Sacra é destaque no Salão de Negócios do Minas Trend 2013. Frutacor lança coleção Inverno 2014. Confira o festival de Jazz no CCCP
Arte Sacra é destaque no Salão de Negócios do Minas Trend 2013 Frutacor lança coleção Inverno 2014 Fashion City Brasil participará da Fenim Confira o festival de Jazz no CCCP Bodytech loren ipsum ad vitor
Leia maisModelo Canônico de Projeto de pesquisa com abntex2
Equipe abntex2 Modelo Canônico de Projeto de pesquisa com abntex2 Brasil 2013, v-1.7.1 Equipe abntex2 Modelo Canônico de Projeto de pesquisa com abntex2 Modelo canônico de Projeto de pesquisa em conformidade
Leia maisModelo Canônico de Trabalho Acadêmico com abntex2
Equipe abntex2 Modelo Canônico de Trabalho Acadêmico com abntex2 Brasil 2015, v-1.9.3 Equipe abntex2 Modelo Canônico de Trabalho Acadêmico com abntex2 Modelo canônico de trabalho monográfico acadêmico
Leia maisModelo Canônico de Trabalho Acadêmico com abntex2
Equipe abntex2 Modelo Canônico de Trabalho Acadêmico com abntex2 Brasil 2014, v-1.9.2 Equipe abntex2 Modelo Canônico de Trabalho Acadêmico com abntex2 Modelo canônico de trabalho monográfico acadêmico
Leia maisMarca. Depto. de Marketing do Pirâmide Natal Resort & Convention - V. 01 - Revisado em 28/05/2008.
Marca Esta é a Marca que deve ser utilizada prioritariamente. Existe uma relação única entre tipologia, corpo, forma e cores que deve ser rigorosamente respeitada. Qualquer alteração modifica totalmente
Leia maisModelo Canônico de Trabalho Acadêmico com abntex2
Equipe abntex2 Modelo Canônico de Trabalho Acadêmico com abntex2 Brasil 2015, v-1.9.5 Equipe abntex2 Modelo Canônico de Trabalho Acadêmico com abntex2 Modelo canônico de trabalho monográfico acadêmico
Leia maisD I G I TA L ATENÇÃO NAS MÍDIAS DIGITAIS, OS DESCONTOS DIFEREM DOS PRATICADOS NA MÍDIA IMPRESSA. CONSULTE-NOS.
D I G I TA L ATENÇÃO NAS MÍDIAS DIGITAIS, OS DESCONTOS DIFEREM DOS PRATICADOS NA MÍDIA IMPRESSA. CONSULTE-NOS. Plásticos em Revista Digital Plásticos em Revista é a mais antiga publicação de seu segmento,
Leia maisKIT DE NORMAS GRAFICAS
KIT DE NORMAS GRAFICAS ÍNDICE 1 2 3 4 5 6 7 8 9 10 11 INTRODUÇÃO CONCEÇÃO DO SELO CORES DO SELO SELO MONOCROMÁTICO REFERÊNCIAS DE COR OUTRAS CORES FUNDOS FOTOGRÁFICOS ÁREA DE PROTEÇÃO REDUÇÃO TIPOGRAFIA
Leia maisIFDR, IP MANUAL DE NORMAS
IFDR, IP MANUAL DE NORMAS Este guia de normas representa, no seu conteúdo, o conjunto das regras básicas de utilização da marca, bem como das suas declinações e complementos visuais. A utilização dos elementos
Leia maisPOCH MANUAL DE NORMAS
POCH MANUAL DE NORMAS 2015 A MARCA A marca é o elemento mais identificativo da identidade corporativa. A normalização da mesma é essencial para preservar a sua legibilidade e percepção. Por esse motivo,
Leia maisd ce D I G I TA L ATENÇÃO NAS MÍDIAS DIGITAIS, OS DESCONTOS DIFEREM DOS PRATICADOS NA MÍDIA IMPRESSA. CONSULTE-NOS. R E V I S T A
d ce R E V I S T A D I G I TA L ATENÇÃO NAS MÍDIAS DIGITAIS, OS DESCONTOS DIFEREM DOS PRATICADOS NA MÍDIA IMPRESSA. CONSULTE-NOS. Doce Revista Digital Há 31 anos no mercado, a imagem da Doce Revista é
Leia maisApós Renato acelerar tramitação, Senado vota hoje PEC do teto
Dourados-MS, 12 de Janeiro de 2020. Digite e pressione enter... MS BRASIL MUNDO POLÍTICA ESPORTES FESTAS&EVENTOS ENTREVISTAS ARTIGOS COLUNAS + EDITORIAS Full banner capa 1 (728x90px) FULL BANNER DESKTOP
Leia maisMELHOR TURISMO2020. Manual de Normas Gráficas ESTE MANUAL ESTABELECE AS NORMAS DE UTILIZAÇÃO DA MARCA.
MELHOR Manual de Normas Gráficas ESTE MANUAL ESTABELECE AS NORMAS DE UTILIZAÇÃO DA MARCA. by ESTE MANUAL É UM INSTRUMENTO DE TRABALHO, ILUSTRANDO E DEFININDO AS UTILIZAÇÕES DA IDENTIDADE GRÁFICA E ESCLARECENDO
Leia maisA construção do logótipo (relações entre os diferentes elementos);
Manual Normas Este manual de normas gráficas é um instrumento de trabalho que visa definir um conjunto de regras e recomendações que garantam a aplicação correcta da identidade gráfica da ANI. As várias
Leia maisModelo Canônico de Relatório Técnico e/ou Científico com abntex2
Equipe abntex2 Modelo Canônico de Relatório Técnico e/ou Científico com abntex2 Brasil 2015, v-1.9.5 Equipe abntex2 Modelo Canônico de Relatório Técnico e/ou Científico com abntex2 Modelo canônico de
Leia maisMANUAL NORMAS GRÁFICAS
MANUAL DE NORMAS GRÁFICAS NOVEMBRO 2016 MIGUEL GATA INTRODUÇÃO 2 MANUAL DE NORMAS GRÁFICAS BEM-VINDO ao Manual de Normas Gráficas da ESCOLA PROFISSIONAL PRÁTICA UNIVERSAL BRAGANÇA Dada a importância que
Leia maisColoque aqui seu nome
Universidade Federal do Triângulo Mineiro - UFTM Mestrado Profissional em Matemática em Rede Nacional - PROFMAT Dissertação de Mestrado Coloque aqui o título da sua dissertação Coloque aqui seu nome Uberaba
Leia maisManual de Normas Gráficas
Manual de Normas Gráficas A criação da identidade visual da Proxira, tem por base um sistema de aplicações coerente, organizado e bem definido. O manual de identidade visual apresentado reúne os elementos
Leia maisPreparação de um trabalho de pesquisa: - Citações e Referências bibliográficas
CCM002 Metodologia de Pesquisa em Ciência da Computação Apresentações Preparação de um trabalho de pesquisa: - Citações e Referências bibliográficas Prof. Jesús P. Mena-Chalco jesus.mena@ufabc.edu.br 3Q-2017
Leia maisUNIVERSIDADE DO VALE DO RIO DOS SINOS - UNISINOS UNIDADE ACADÊMICA DE PESQUISA E PÓS-GRADUAÇÃO PROGRAMA DE PÓS-GRADUAÇÃO EM ENGENHARIA ELÉTRICA
Todo list o exemplo de comentário para auxiliar na lista de tarefas e correções.......... 13 o Alguns manuais de pacotes latex foram adicionados na pasta manuals......... 13 o Procure se informar a respeito
Leia maisMANUAL DE NORMAS GRÁFICAS
MANUAL DE NORMAS GRÁFICAS 01 03 APRESENTAÇÃO Este guia de identidade uniformiza a utilização da marca Fundação Bienal de Cerveira. Estas normas devem ser cumpridas de modo rigoroso para que a imagem da
Leia maisespaço publicitário SEJA FELIZ o poder da alegria dentário? pág.9 tratá-la? pág.9 saúde? pág.9 TEM IDADE CERTA para uso do aparelho
edição 01 ano 01 Fevereiro de 2015 Publicação bimestral com distribuição gratuita no Circuito das Águas Paulista www.circuitosaude.com.br SEJA FELIZ o poder da alegria pág.7 TEM IDADE CERTA para uso do
Leia maisO PROJETO PROMOVER A IMPORTÂNCIA DE UMA EDUCAÇÃO ACOMPANHADA E INTERVENTORA PROMOVER RELAÇÕES DE INTERAÇÃO COM A NATUREZA E OS ANIMAIS
FONTE BOA O PROJETO PROMOVER A IMPORTÂNCIA DE UMA EDUCAÇÃO ACOMPANHADA E INTERVENTORA PROMOVER RELAÇÕES DE INTERAÇÃO COM A NATUREZA E OS ANIMAIS missão A MISSÃO DA FONTE BOA JUNTA DOIS UNIVERSOS DIFERENTES.
Leia maisModelo Canônico de Projeto de pesquisa com abntex2
Equipe abntex2 Modelo Canônico de Projeto de pesquisa com abntex2 Brasil 2015, v-1.9.3 Equipe abntex2 Modelo Canônico de Projeto de pesquisa com abntex2 Modelo canônico de Projeto de pesquisa em conformidade
Leia maisMATHEUS SEREZANI NICOLOSI BALANCEAMENTO EM TABELAS HASH DISTRIBUÍDAS PARA CONSULTAS POR SIMILARIDADE USANDO FUNÇÕES DE HASH SENSÍVEIS À LOCALIDADE
MATHEUS SEREZANI NICOLOSI BALANCEAMENTO EM TABELAS HASH DISTRIBUÍDAS PARA CONSULTAS POR SIMILARIDADE USANDO FUNÇÕES DE HASH SENSÍVEIS À LOCALIDADE LONDRINA PR 2015 MATHEUS SEREZANI NICOLOSI BALANCEAMENTO
Leia mais12 Set SEGUNDA-FEIRA ÀS 19:30PM
SUPER BANNER PERSONALIZADO (960X200px) Pec do Teto Após Renato acelerar tramitação, Senado vota hoje PEC do teto Fábio Assunção comenta cena do primeiro encontro entre Arthur e Eliza: Bem bonito Ator fala
Leia maisMonografia Índice Completo
Monografia Definição: dissertação a respeito de um assunto único; estudo minucioso a fim de esgotar determinado tema relativamente restrito. Monografia é uma dissertação sobre um ponto particular de uma
Leia maisECA-USP. Manual Simplificado de Identidade Visual. Estudio K Arquitetura e Comunicação Visual Dorinho Bastos Juliana Baracat
ECA-USP Manual Simplificado de Identidade Visual Estudio K Arquitetura e Comunicação Visual Dorinho Bastos Juliana Baracat Logotipo Grade de Construção Identidade Visual/Cor Grade de Construção Identidade
Leia maisLOREM IPSUM DOLOR SIT AMET
LOREM IPSUM DOLOR SIT AMET Capa com titulo da apresentação com sub-titulo ou texto de apoio, ou outras informações muito sumárias, caso necessário OMEULOGO Lorem ipsum dolor sit amet, consectetur adipiscing
Leia maisA maior plataforma de relacionamento da América Latina entre consumidores e empresas
PLANOS PLUS & TOP A maior plataforma de relacionamento da América Latina entre consumidores e empresas Pesquisar Reclamar Comparar Responder Replicar Resolver Consumidores ReclameAQUI Empresas O ReclameAQUI
Leia maisMANUAL DE IDENTIDADE VISUAL
MANUAL DE IDENTIDADE VISUAL CCDRC comissão de coordenação e desenvolvimento regional do centro Comissão de Coordenação e Desenvolvimento Regional do Centro Rua Bernardim Ribeiro, 80. 3000-069 Coimbra,
Leia maisTrabalho 2. Jorge Barreto Faculdade de Ciências e Tecnologias. 10 de Fevereiro de 2013
Trabalho 2 Jorge Barreto Faculdade de Ciências e Tecnologias 10 de Fevereiro de 2013 Resumo Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Etiam lobortis facilisis sem. Nullam nec mi et neque
Leia maisFulano de Tal. Exemplo de livro produzido com. abntex2 v-1.9.7
Fulano de Tal Exemplo de livro produzido com abntex2 Publicações Acadêmicas Ltda. abntex2 v-1.9.7 Fulano de Tal Exemplo de livro produzido com abntex2 Publicações Acadêmicas Ltda. abntex2 v-1.9.7 2017
Leia maisMANUAL DE NORMAS GRÁFICAS MOD02_PR02_V03 1
MANUAL DE NORMAS GRÁFICAS MOD02_PR02_V03 1 DATA: Outubro 2016 ELABORADO: Laura Santos EDITADO: Bruno Filipe APROVADO: Manuel Serejo ASSUNTO: Normas para apresentação de documentos Normas e apresentação
Leia maisMANUAL DE NORMAS GRÁFICAS MOD02_PR02_V05 1
MANUAL DE NORMAS GRÁFICAS MOD02_PR02_V05 1 DATA: Outubro 2018 ELABORADO: Laura Santos EDITADO: Bruno Filipe APROVADO: Manuel Serejo ASSUNTO: Normas para apresentação de documentos Normas e apresentação
Leia maisTítulo do artigo. 1,5cm. Nome completo do AUTOR 1. 2,5cm. 1,2cm
Título do artigo Formatação Título 1: fonte tamanho 16, negrito, Inicial maiúscula, espaçamento de 1,5 linhas, alinhado à esquerda. Nome completo do AUTOR 1 Resumo: Lorem ipsum dolor sit amet, consectetur
Leia maiswww.in-lex.pt ESPECIFICAÇÕES TÉCNICAS DO ANUÁRIO 2015 CANAIS DE DISTRIBUIÇÃO EDIÇÕES E DIVULGAÇÃO CONTACTOS IN-LEX
www.in-lex.pt Para mais informação consulte o nosso site ESPECIFICAÇÕES TÉCNICAS DO ANUÁRIO 2015 Data da Publicação Dimensões Papel Capa Papel Miolo Hardcover Início de 2015 230 (largura) x 297 (altura)
Leia maisNORMAS GRÀFICAS - INSTITUTO POLITÉCNICO DE LEIRIA
NORMAS GRÀFICAS - INSTITUTO POLITÉCNICO DE LEIRIA CONSTRUÇÃO HORIZONTAL CONSTRUÇÃO VERTICAL LOGÓTIPO de artes e design de artes e design de tecnologia do mar de tecnologia do mar de saúde de tecnologia
Leia maisNORMAS PARA PUBLICAÇÃO - TECCOGS ISSN:
Normas para publicação Formatação da página (margens): Topo: 3,3 cm Inferior: 3 cm Esquerda: 2,3 cm Direita: 2 cm Título: Fonte: Arial, 14 Alinhamento do texto: à esquerda Norma para publicação Autoria:
Leia maisSUPER BANNER PERSONALIZADO 01 (960X200px) Fábio Assunção comenta cena do primeiro encontro entre Arthur e Eliza: Bem bonito
SUPER PERSONALIZADO 01 Pec do Teto Após Renato acelerar tramitação, Senado vota hoje PEC do teto CAPA 1 EUGÊNIO FALCÃO RINGSON TOLEDO MATEUS RODRIGUES CAPA 2 INTEGER amet, consectetur adipiscing elit.
Leia maisModelo Canônico de Trabalho Acadêmico com abntex2
Equipe abntex2 Modelo Canônico de Trabalho Acadêmico com abntex2 Brasil 2013, v-1.7.1 Equipe abntex2 Modelo Canônico de Trabalho Acadêmico com abntex2 Modelo canônico de trabalho monográfico acadêmico
Leia maisManual de Identidade Visual. Abril de 2014
Manual de Identidade Visual Abril de 2014 ÍNDICE 03 Para que serve este manual? 04 O logotipo 06 Variações do logotipo 07 Escala cromática 08 Fundos preferenciais 09 Malha construtiva 10 Área de não-interferência
Leia maisTítulo UNIVERSIDADE FEDERAL DO RIO DE JANEIRO INSTITUTO DE MATEMÁTICA NOME COMPLETO ALUNO 1. Prof. Nome do orientador, M.Sc.
UNIVERSIDADE FEDERAL DO RIO DE JANEIRO INSTITUTO DE MATEMÁTICA NOME COMPLETO ALUNO 1 Título Prof. Nome do orientador, M.Sc. Orientador Prof. Nome do co-orientador, M.Sc. Co-orientador Rio de Janeiro, Janeiro
Leia mais