1.
Design na mídia impressa e digital Diferença entre diagramação e interface

2.
Atenção !!! Esta apresentação faz parte de minhas aulas e seu conteúdo foi elaborado com base na minha experiência profissional que, em algum momento, pode contradizer o que é explicado na maioria dos livros. Suas informações são limitadas e superficiais, sendo que o conteúdo completo é dano durante a aula. Fique a vontade para utilizá-lo se precisa, mas tome cuidado para não copiar conteúdo incompleto. Odair Cavichioli Júnior http://www.odaircavichioli.com.br

3.
Van Gogh - 1880 <ul><li>&quot;Há leis de proporção, de luz, de sombra e de perspectiva, que é preciso conhecer para desenhar um motivo; se essa ciência nos falha, arriscamos travar eternamente uma luta estéril e não conseguimos nunca criar.&quot; </li></ul>

4.
O que é design ? <ul><li>Termo derivado do latim designare (traçar um desenho, delinear, caracterizar, representar). </li></ul><ul><li>Na semiótica, Design significa: </li></ul><ul><ul><li>De: Referente a alguma coisa </li></ul></ul><ul><ul><li>Sign: Signo, representação gráfica ou linguística </li></ul></ul><ul><li>É um esforço criativo para solucionar um problema; </li></ul><ul><li>Estrutura conceitual com elementos que cumprem uma função específica, ajudando o leitor a interpretar o conteúdo de forma direcionada e intuitiva; </li></ul><ul><li>“ Domínio no qual se estrutura a interação entre usuário e produto, para facilitar ações efetivas” - Gui Bonsiepe. </li></ul>

5.
Tipos de design <ul><li>Design de comunicação </li></ul><ul><ul><li>Design gráfico </li></ul></ul><ul><ul><li>Design editorial </li></ul></ul><ul><ul><li>Design de hipermídia </li></ul></ul><ul><ul><li>Design de interação </li></ul></ul><ul><ul><ul><li>Webdesign </li></ul></ul></ul><ul><ul><ul><li>Design de jogos </li></ul></ul></ul><ul><li>Design de produto </li></ul><ul><ul><li>Design automobilístico </li></ul></ul><ul><ul><li>Design de embalagem </li></ul></ul><ul><ul><li>Merchandising </li></ul></ul><ul><ul><li>Design de mobiliário </li></ul></ul><ul><li>Design de moda </li></ul><ul><li>Design de jóias </li></ul><ul><li>Design de ambientes </li></ul><ul><ul><li>Design de feiras, eventos, e stands </li></ul></ul><ul><ul><li>Design de interiores </li></ul></ul><ul><ul><li>Design de iluminação de palco </li></ul></ul>

6.
Quais os conhecimentos de um designer ? <ul><li>Artes Plásticas; </li></ul><ul><li>História da arte; </li></ul><ul><li>Movimentos de design; </li></ul><ul><li>Linguagem de comunicação; </li></ul><ul><li>Estética; </li></ul><ul><li>Estrutura, equilíbrio e massa; </li></ul><ul><li>Tipos de mídias (impressa, digital, audiovisual, etc); </li></ul><ul><li>Psicologia; </li></ul><ul><li>Neurolingüística; </li></ul><ul><li>Semiótica; </li></ul><ul><li>Métricas; </li></ul><ul><li>ETC... </li></ul>

7.
Conceito base <ul><li>Os recursos da mídia digital tem origem na mídia impressa e seus conceitos básicos são os mesmos. </li></ul><ul><li>Isso significa que o conceito de diagramação não muda entre as mídias. </li></ul><ul><li>Diferença entre as mídias impressa e digital: </li></ul>

8.
Diferenças básicas entre as mídias Aspecto Mídia Impressa Mídia Digital Acesso É uma questão cultural É uma questão de inclusão Leitura Visão e tato (textura) Visão Suporte Matérias-prima industriais Monitor Tempo de leitura Longo Curto Visualização Sempre a mesma Muda de acordo com o sistema Inovação Produção Gráfica (industria) Novas Técnicas (tecnologia) Qualidade Sempre boa Depende do equipamento

9.
O que é um layout ? <ul><li>Um plano ou peça com elementos organizados para transmitir uma mensagem (princípios de design); </li></ul><ul><li>O processo de criação dividi-se em: </li></ul><ul><ul><li>Identificação </li></ul></ul><ul><ul><li>Seleção </li></ul></ul><ul><ul><li>Natureza dos elementos </li></ul></ul><ul><ul><li>Posicionamento dos elementos </li></ul></ul>

10.
Processo de interpretação da informação <ul><li>O cérebro interpreta um layout realizando a leitura na seguinte ordem: </li></ul><ul><ul><li>Registro visual </li></ul></ul><ul><ul><li>Registro gráfico </li></ul></ul><ul><ul><li>Registro escrito </li></ul></ul><ul><li>Textos e ilustrações (fotos ou desenhos) devem ser elementos de destaque; </li></ul>

11.
Registro visual <ul><li>As páginas são lidas como grandes massas de formatos e cores, com elementos do primeiro plano contrastando com a área de fundo. </li></ul>

12.
Registro gráfico <ul><li>A leitura identifica as informações específicas, iniciando pelos gráficos. </li></ul>

13.
Registro escrito <ul><li>Depois é realizada uma analise gramatical do texto e leitura das frases. </li></ul>

14.
Um layout deve abortar <ul><li>Segurança; </li></ul><ul><li>Comodidade; </li></ul><ul><li>Solidez; </li></ul><ul><li>Refletir o comportamento social e cultural; </li></ul><ul><li>Mensagem (semiótica); </li></ul><ul><li>Persuasão; </li></ul><ul><li>Encanto; </li></ul><ul><li>Design da informação; </li></ul><ul><li>Acessibilidade. </li></ul>

15.
O que é uma interface ? <ul><li>O conceito original vem da mídia impressa e é aplicada mesma forma na mídia digital. </li></ul><ul><li>Além de orientar, a interface deve prover uma interação entre as informações e o público. </li></ul><ul><li>De forma intuitiva, a pessoa deve olhar para a interface e saber como ela funciona. </li></ul><ul><li>Utiliza recursos de hipermídia. </li></ul>

16.
Cuidados com a interface <ul><li>Estrutura que organiza informações dentro de um determinado contexto, promovendo interação entre o usuário e a informação. </li></ul><ul><li>Deve ser intuitiva, utilizando convenções de navegação; </li></ul><ul><li>Deve respeitar os princípios de acessibilidade; </li></ul><ul><li>Não se deve criar obstáculos para o usuário; </li></ul><ul><li>Não tem como criar uma interface para uma pessoa em que se desconhece a sua necessidade. </li></ul>

17.
Referência bibliográfica <ul><li>Existem algumas informações que são encontradas na Wikipédia. Porém, como seu conteúdo pode ser alterado por qualquer pessoa, sua credibilidade é questionável. Só utilize informações da Wikipédia se você já conhece o assunto e concorda com as definições. </li></ul><ul><li>Guia de estilo da Web </li></ul><ul><ul><li>Patrick J. Lynch e Sarah Horton </li></ul></ul><ul><ul><li>Editora Gustavo Gili </li></ul></ul><ul><ul><li>2004 </li></ul></ul>

18.
Para pesquisa <ul><li>Gestalt </li></ul><ul><li>Arquétipos </li></ul><ul><li>Semiótica </li></ul><ul><li>Saul Bass </li></ul><ul><li>Minimalismo </li></ul><ul><li>Quarto poder </li></ul>

19.
Design na mídia impressa e digital Diferença entre diagramação e interface Odair Cavichioli Júnior www.odaircavichioli.com.br