sexta-feira, 20 de maio de 2016

AVALIAÇÃO


AVALIAÇÃO



PROJETO FINAL
Informações do Projeto CLIQUE AQUI
Data de Entrega: 03 de Junho - sexta
Impresso
APENAS ENTREGA NÃO É PRECISO APRESENTAÇÃO

VOUCHERS
Data de Entrega: 03 de Junho - sexta
Impressos coloridos em A4
Acompanha folha de rosto e postagem no dropbox CLIQUE AQUI
Relação de Vouchers: [valem de 0 à 1 e devem ser bem feitos]
1_ Resenha de um dos livros sugeridos online - clique aqui
2_ Análise de Site - clique aqui - clique aqui
3_ Camiseta [estampa acompanhada do desenho da camiseta]
4_ Redesenho [Foto + vetor desta foto - não é rastrear/trace]
5_ Desenho livre criação com anotações de ferramentas/comandos/efeitos utilizados.

quinta-feira, 12 de maio de 2016

PROJETO FINAL | AVALIATIVO SEGUNDO BIMESTRE

PROJETO FINAL AVALIATIVO | LAYOUT DE SITE RESPONSIVO

DOWNLOAD DE CONTEÚDO CLIQUE AQUI


Nota: 0 à 10 - Segundo Bimestre

_Individual ou em dupla ou em trio

O que fazer:
_ Recriar a página de capa de um layout de algum site utilizando illustrator ou indesign [photoshop]
_ Aplicar em formato tela de computador e para Dispositivo Móvel [Celular e Tablet]


Formato ver modelos possíveis abaixo:





_ Conferir o tamanho de uma tela em pixels [pesquisar]
_ Prancheta no tamanho da tela.



Nome do arquivo:
_Nome dos[as] acadêmicos[as]


INFORMAÇÕES QUE DEVE CONTER NA CAPA DA INTERFACE DO SITE
_ As mesmas informações do site de pesquisa
_ Apenas redesenhar [recriar]

Data de Entrega:
_03 de JUNHO

Como Entregar:
_Impresso em folha A3
_ Colocar o nome do autor[res] do projeto
_ Imagem Original em uma folha separada A4
_ Imagem Recriada [tela de computador] Tablet + Celular
_ Apresentar a imagem do computador | Tablet | Celular - o redesenho estara dentro desta imagem.


POSTAR NO DROPBOX
PASTA: AVALIAÇÃO SEGUNDO BIMESTRE

- Criar uma pasta com o[s] nome[s] do[s] acadêmicos.
_Dentro da pasta com seu nome [acima] COLOCAR OS ARQUIVOS:
. AI [Arquivo em Illustrator - arquivo do site responsivo] PRANCHAS SEPARADAS [site - tablet - celular]
AS TRES PRANCHAS NO MESMO ARQUIVO - em tamanho original

.PDF do A3 FINAL


Exemplos de imagens de sites responsivos



O QUE É SITE RESPONSIVO
Sites responsivos, ou flexíveis, tem como função se adaptar a qualquer tamanho de tela, permitindo que o site seja visualizado com eficiência em computadores, tablets e celulares. Criar sites responsivos fornece uma ótima experiência de visualização, fácil leitura e navegação com um mínimo de redimensionamento.


O papel da Criação de sites responsivos na evolução do mundo digital
Com a evolução do mundo digital e das tecnologias o acesso a internet passou a ser feito por meio de diferentes dispositivos, como tablets e smartphones. Para evitar o desenvolvimento de sites específicos para cada um deles, a melhor solução é utilizar os sites responsivos que respondem de acordo com o tamanho e a resolução de cada tela acessada.

Veja os sites abaixo e abra em seu celular:

http://www.kingshillcars.com/

http://lynnandtonic.com/

quinta-feira, 5 de maio de 2016

ILLUSTRATOR

DETALHES IMPORTANTES
_MANIA SEMPRE: PONTEIRO PRETO - VAZIO [não deixe nada selecionado];
_IMPORTAR: Crtl + Shift + P;
_Shift faz formas perfeitas;
_Algumas ferramentas que apresentam uma SETA NO CANTO, esconde outras ferramentas;
_PARA FRENTE e PARA TRÁS: clicar com o direito do Mouse sobre o objeto ORGANIZAR [arrange] - ENVIAR PARA TRÁS ou ENVIAR PARA FRENTE [Send to back - ou - Sent to front];
_Salvar o arquivo



1. Abrir novo Arquivo
MENU>ARQUIVO>NOVO  [menu>file>new]
Verificar:
_Nome [name];
_Perfil [profile];
_Número de Pranchetas [number of artboards];
_Tamanho [size];
_Unidades [Units] sugestão: mudar para cm;




2. Pranchetas
_Atenção, caso não encontre a ferramenta vá em:
MENU>JANELA>PRANCHETAS [Menu>windows>artbords]

Verificar:
_Criar Prancheta;
_Deletar Prancheta;
_Alterar tamanho das Pranchetas;
_Posição das Pranchetas: lado a lado, acima e abaixo;
_ATENÇÃO AOS DESENHOS DOS ÍCONES DE CRIAÇÃO DAS PRANCHETAS:

























3. Formas Básicas:
_Ferramentas: RETÂNGULO | CIRCULO | POLÍGONOS | ESTRELA ...

Atenção:
_Ferramenta estrela muda ao pressionar o ALT e muda se usar as SETAS DO TECLADO.


4. Caneta
_Atenção: Fechar o nó [aquele quadradinho que desenha cada linha];
_Use as setas preta e branca para movimentar os nós;
_Use as opções de ferramenta caneta para CRIAR, DELETAR e CURVAR nós;
_Possível modificar e aumentar as bordas [contornos];


Opções de Traçado: Clique na palavra TRAÇADO > LINHA TRACEJADA
STROKE>DASHED LINE


5. Cor
_Atenção à COR DE CONTORNO e à COR DE PREENCHIMENTO;
_A Ferramenta CONTA GOTA seleciona uma cor da fotografia se desejar;

ATENÇÃO: ALGUMAS IMAGENS QUE ESTÃO EM TONS DE CINZA [geralmente ao transformar uma foto em vetor]. Estas irão colorir qaundo selecionadas e aplicadas pela ferramenta SWATCHES [FERRAMENTA QUADRICULADO] ao lado direito da interface.






6. Opacidade
_Oferece transparência ao objeto;
_Há opções de opacidade se clicar na palavra em laranja que se apresenta no menu;



7. Visualizar Contornos [aramado]
_MENU >EXIBIR> CONTORNAR [menu>view>OUTLINE]
   [Para voltar clique no mesmo caminho e veja normalmente a imagem - GPU PREVIEW];

8. Rastrear | Trace
a_ Trazer uma foto para a prancheta [CTrl + Shift + P]
b_ Manter a foto Selecionada;
d_ Clicar em RASTREAR [TRAÇADO DA IMAGEM]
IMAGE TRACE | EXPAND
e_ATENÇÃO ÀS DIFERENTES OPÇÕES DE TRAÇADO [clique na seta para expandir a caixa]
f_Em seguida clique em EXPANDIR
g_Segue: clicar com o direito do MOUSE e DESAGRUPAR
h_ Clique no VAZIO e volte a selecionar partes para separar se desejar
ATENÇÃO: sempre verificar em aramado pois pode ter uma imagem branca sobre fundo branco E SÓ É POSSÍVEL VER EM ARAMADO.


9 Pathfinder
MENU> JANELA>PATHFINDER [Menu>window>pathfinder]
_Selecionar objetos desejados para CORTAR | SOLDAR | ...



10. Ferramenta Pintura
_Atenção às opções de tamanho e cor do traço


11. Alinhar
Selecione mais de um objeto
MENU>JANELA>ALINHAR [menu>window>align]

12. Duplicar - CRTL+D
_Além da tecla ALT para duplicar você pode:
_Aplicar o CTRL+D para reproduzir a última ação
_Alt + SHIF = duplica arrastando alinhado


13. Power Clip [colocar a foto dentro da forma]
a_Crie uma forma;
b. Coloque uma imagem atras
c. SELECIONE OS DOIS E PRESSIONE > CTRL+ 7


14.Texto
_Selecionar a ferramenta e escrever.
_Opções de fontes e tamanhos
_ Opções de acompanhar a linha [DEPENDE DE COMO FOI FEITO A LINHA]
Converter em CURVAS [desenho] CTRL+SHIFT+O [ó]

15. Rotacionar Objeto
_Clique para escolher a ANCORA - posição de ROTAÇÃO


16.Gradiente
_A Ferramenta Gradiente está em ambos os lados da interface;
_Clique para criar novas cores ou manipular as posições das cores;
_ Opção: LINEAR e RADIAL






17_3D
MENU>EFEITO>3D [Menu>effect>3D]
_Verificar diferentes opções de 3D:
Extrusão e Bisel | Extredu & Bevel
Revolução | Revolve


18. GRADE [grid] | Réguas [rulers]
MENU>EXIBIR>GRADE [menu>view>Show Gride]



19.Enviar para Gráfica | Salvar em PDF
_Salvar em PDF
_Aplicar marcas






NOVO VOUCHER | VOUCHER NR 5



CRIE UM DESENHO LIVRE E ESCREVA OS ITENS > FERRAMENTAS APLICADAS
SALVE NA PASTA DE VOUCHER NR 5
CRIE UMA PASTA COM SEU NOME OU DA SUA DUPLA
SALVE EM ILLUSTRATOR e PDF COM MARCAS DE CORTE

quinta-feira, 28 de abril de 2016

EXERCÍCIO de REDESENHO - ILLUSTRATOR



Nesta aula um único EXERCÍCIO de REDESENHO - ILLUSTRATOR


Individual | Em dupla | Ou Trio

De acordo com as aulas até então já sabemos:
Abrir e configurar pranchetas.
Importar arquivos.
Visualizar em aramado.
Aplicar cores
Criar figuras
Configurar figuras: formatos, linhas,  posição, soldagem, corte....
Salvar na pasta correspondente no DROPBOX

Assim, nesta aula o/a [s] acadêmico/a [os/as] irão:

Criar duas novas pranchetas
Em uma prancheta ter uma imagem: fotografia
Em outra prancheta um REDESENHO desta ilustração.
Não pode ser RASTREADO [Trace].

Salvar o arquivo como um novo VOUCHER na pasta correspondente:
Criar a pasta com o nome da equipe [ou individual]
Salvar o arquivo em Illustrator com o nome da equipe [ou individual]



sexta-feira, 8 de abril de 2016

VOUCHERS

TODOS OS VOUCHERS SÃO PONTOS EXTRAS
Podem ou não ser feitos pelos acadêmicos[as];
E serão acrescentados na nota da avaliação.

_ Alguns vouchers irão valer:  0,2 ou 0,5 pontos completos;
_ Outros irão valer de 0 | 0,5 ou 1 ponto completo - de acordo com a qualidade apresentada do exercício;
_ Esta pontuação será apresentada no momento que o exercício for solicitado em sala;

1. SALVAR O DOCUMENTO
Salvos no DROPBOX [www.dropbox.com]
NA PASTA CORRETA [arquivos salvos em pasta errada não serão aceitos]
_ O professor apresenta a pasta no dia;

1.1 LOGIN e SENHA
Login: interfacegraficadigital@gmail.com
senha: mimicrocro

2. DATA DE POSTAGEM
- Alguns exercícios não tem data definida de postagem no DROPBOX. Podendo ser feito até mesmo um dia antes da avaliação
- Alguns exercícios TEM DATA de encerramento, geralmente no mesmo dia da aula. Estes serão informados pelo professor; DATA DE ENTREGA DA MAIORIA 03 DE JUNHO. Outros serão entregues no MESMO DIA EM QUE FOR PROPOSTO O EXERCÍCIO.

3. IMPRESSOS
- Imprimir em A4 seus vouchers. INDIVIDUALMENTE | mesmo sendo em grupo.
- Os arquivos serão IMPRESSOS e entregues no dia da avaliação [nem antes | nem depois].
Só serão aceitas impressões PRONTAS e ENTREGUES NO DIA ANTES OU DURANTE A AVALIAÇÃO e não APÓS A AVALIAÇÃO. Ou seja: venha para a aula com a impressão já pronta;
DATA DE ENTREGA 03 de JUNHO.

4. FOLHA DE ROSTO
Para organização do seu arquivo preencha e imprima a folha de rosto abaixo a ser entregue junto do seu arquivo;
Para DOWNLOAD do arquivo CLIQUE AQUI



ORGANIZAÇÃO DO SITE | VOUCHER NR 02

Muitos elementos estão presentes na construção de uma página WEB [linguagem HTML] que podem ou não ser limitados por seu suporte e linguagem com textos ou hipertexto [Protocolo HTTP] ou mesmo para o público que se destina. Alguns pontos que podemos observar que estão em evidência na construção da maioria dos websites. São eles:

1. ESTRUTURA:
_ Tem origem na mídia de massa para o segmento informativo: livro | jornal | revista;
_ Um site deve ser estruturado por segmentação de informação;
_ Deve se apropriar de conceitos específicos para transmitir uma mensagem adequada para seu público.

UOL
FOLHA
ESTADÃO
O GLOBO


2. LINGUAGEM EMOCIONAL:
_ Identificar o grupo emocional associado a categoria do site;
_ Imagem Arquétipa; [figura da mulher | figura do médico | figura paternal]
_ Definição de estilo e espírito;
_ Relação entre forma e pensamento;
_ Relação entre Criador e Consumidor;

ARQUÉTIPOS
CHANEL
VALENTINO
MARC JACOBS



3. LINGUAGEM RACIONAL:
_ Identificação da Necessidade;
_ Identificação ou geração de desejo do consumidor;
_ Definição do desejo competitivo;

BELAS ARTES
USP
UFMS



4. CAPA
_ Tem a função de apresentar o estilo | tema do site para seu público alvo;
_ Busca o decorativo e não um desenvolvimento tipológico com finalidade de legibilidade
_ Utilização para públicos específicos, basicamente que apresentam tendências visuais;
_ Poder ser: ilustrativa; Informativa; Indicar restrições, limitar acesso;

CARTOON NETWORK
VICE
MINHA VIDA



5. PÁGINA PRINCIPAL
_ É a página onde o usuário será ambientado, se familiarizando com o ambiente e conduzido à informação que procura;
_ Deve fornecer condições de navegação ao usuário, tanto para acessar o serviço, quanto para entrar em contato;
_ Tem que ser direto, apresentando apenas o necessário para atingir sua meta;

UPDATE OR DIE


6. CABEÇALHO
_ Permite dar mais visibilidade à identidade visual da empresa ou do próprio site;
_ Reforça a ação de ênfase, continuidade e unidade;
_Características comuns: Assinatura, Navegação, Links Administrativos, Títulos e Temas;

FILE


7. RODAPÉ
_ Além de reforçar a visibilidade da identidade visual, possibilita criar um vínculo com a origem da empresa ou do próprio site;
_ Características comuns: Assinatura, Dados da Empresa, Complementos de Informação e Acessibilidade

RADIO MEC



8. NAVEGAÇÃO
_ Deve ser segmentada por assunto ou tipo de informação, podendo apresentar vários níveis;
_ Pode ser linear ou não;
_ TEM QUE TER condições para o usuário retornar para a seção anterior ou para a página principal;

LIKECOOL



9. LINKS ADMINISTRATIVOS
_ Criam um canal de comunicação entre o usuário e o site;



10. INFORMAÇÕES COMUNS
_ Sobre o Site ou Empresa;
_ Acesso restrito;
_ Contato;
_ Atendimento - Dúvidas;
_ Endereço Físico;
_ Mapa do Site;
_ Parceiros;
_ Credenciais;


11. CONTEÚDO
_ Material que será exibido ao público do site;
_ Deve ser segmentado de acordo com o tipo da natureza de informação, sendo apresentado de forma específica;
_ Tem que ser direto, lógico e intuitivo;
_ Organize a arquitetura das informações:
   - divida o conteúdo em unidades lógicas
   - relacione uma hierarquia de importância
   - verifique o padrão funcional e estético do site


12. DOCUMENTOS ELETRÔNICOS
_ Toda informação disponível na internet é um documento pontual e, perante a lei, pode ser utilizado como uma evidência;
_ Para garantir a veracidade do conteúdo, devem ser fornecidas as seguintes informações:
- Endereço do site;
- Origem da informação [menu de navegação]
- Autor na informação;
- Data da publicação;
- Condições para emitir uma versão impressa;
- Condições para retornar a seção principal;

CAIXA




13. ATUALIZAÇÕES
_ Permite que o usuário saiba que há novas informações no site;

POP




14. MAPA DO SITE
_ Permite que o usuário tenha uma visão geral do conteúdo disponibilizado;
_ Deve facilitar a localização de uma informação, agrupando o conteúdo por temas;
_ Pode assumir a forma de um índice ou sumário;

EXAME


15. ERRO 404 | ARQUIVO NÃO ENCONTRADO
_ São páginas retornadas do servidor indicando que não localizou o arquivo na URL indicada;
_ Um bom projeto deve prever essa situação, preparando canais para redirecionamento;
_ Podem conter:
   - Explicações sobre o erro;
   - Sugestão para alternativas;
   - Acesso para outras páginas sobre o mesmo assunto;
   - Recursos de busca por palavras chave;
   - Canal de contato;

TATI BERNARDI




VOUCHER | NR 02  | SALVAR NA PASTA - ANÁLISE SITE | SEM DATA LIMITE

ATENÇÃO: VOUCHERS SÃO IMPRESSOS E ENTREGUES NO DIA DA AVALIAÇÃO. NÃO SERÃO ACEITOS VOUCHERS IMPRESSOS ANTES OU DEPOIS DO DIA DA AVALIAÇÃO. ESTES MESMOS VOUCHERS DEVEM ESTAR NAS PASTAS RESPECTIVAS DO DROPBOX

INDIVIDUAL, EM DUPLA, TRIO ou QUARTETO

A partir DE UM dos itens acima [itens 1 à 15]  busquem por um site e façam uma análise descritiva com  imagem [Print Scrn] deste site. Descreve como os itens se distribuem na imagem, se estes estão ou não representados. Se há itens a mais e quais seriam estes itens.
Salve seu arquivo em WORD. Com o nome do arquivo sendo o nome da equipe. E não deixe de fazer um cabeçalho em word com NOMES COMPLETOS. Suba o documento no DROPBOX.



LOGIN: interfacegraficadigital@gmail.com
SENHA: mimicrocro

sexta-feira, 1 de abril de 2016

CRIATIVIDADE | AUTO AVALIAÇÃO | VOUCHER NR 01

1. CRIATIVIDADE

PARA DOWNLOAD DESTA AULA CLIQUE AQUI




Principais pontos a serem observados:
Reflexão e Ambiente;
O Pedágio de Pensamento;
O gostar é uma tirania;
Linguagens e contextos;
Categorias;
O olhar do outro;
Saturação;
Motivação;


REFERÊNCIAS BIBLIOGRÁFICAS


BERTOMEU, João Vicente Cegato. Criação Visual e Multimídia.São Paulo:
Cengage Learning, 2010.
nº de chamada BIBLIOTECA BA | 659.1 C946
PDF - CAPÍTULO 1 - CRIATIVIDADE - CLIQUE AQUI





KLEON, Austin. Roube como um artista. São Paulo: Rocco, 2014.


2. AUTO AVALIAÇÃO




3. VOUCHER | NR 01 | RESENHA
EM DUPLA ou TRIO [o mesmo grupo pode ser montado]

SEM DATA LIMITE

Veja os diferentes livros abaixo. Eles tratam de diferentes temas relacionados a Jornalismo, tecnologia, Linguagens, Internet, porém todos trazem uma relação com o ambiente DIGITAL- WWW. Escolha um dos livros abaixo e apresente um trecho do livro que julgue interessante.
UM CAPÍTULO, ou UMA PÁGINA, OU TODO O LIVRO... Apresente a citação com "SOBRENOME do autor, Nome. Livro. Página." Coloque o[s] trechos citados entre aspas e apresente sua resenha. [veja formatação sugerida abaixo]

Salve seu arquivo em WORD. Com o nome do arquivo sendo o nome da equipe. E não deixe de fazer um cabeçalho em word com NOMES COMPLETOS. Suba o documento no DROPBOX.

LOGIN: interfacegraficadigital@gmail.com
SENHA: mimicrocro



REFERÊNCIAS ONLINE






CRIAÇÃO, PROTEÇÃO E USO LEGAL DE INFORMAÇÃO EM AMBIENTES WWW

RESENHA
a- Uma leitura global da obra;
b- Segunda leitura, no entanto mais analítica, levantando (selecionando) as idéias e argumentos do autor;
c- Sintetização dos dados selecionados;
d- Posicionamento crítico para construção da resenha;
e- Pesquisa, se necessário, para facilitar as argumentações;
f- Produção do texto propriamente dita.


Dados a serem apresentados em uma resenha:

 Toda resenha deve ser, o mais bem identificada possível, daí, devem constar:
_ O título (ou cabeçalho contendo o nome da instituição de ensino, título da resenha com identificação do texto resenhado, autor/a da resenha, objetivo do trabalho, local e data)

_ A referência bibliográfica da obra (citação completa da fonte, podendo constar alguns dados bibliográficos do autor da obra resenhada ).

_ Texto dissertativo: Síntese do conteúdo caracterizando a área do conhecimento e o objetivo do autor. (Introdução, corpo principal do texto - uma breve análise estrutural, ou seja, apresentação global do conteúdo e conclusão com apreciação crítica).

_A avaliação crítica, argumentativa, fundamentada em pesquisas bibliográficas e/ou na própria obra; posicionamento final quanto ao artigo em si; que deverá levar em consideração os seguintes pontos: - Conteúdo, objetivo(s) e destinatário(s) - Plano estrutural e desenvolvimento lógico da temática. - Linguagem, vocabulário e estilo do autor. - Valor do texto para determinada área de conhecimento.