Memorial Descritivo
Faculdade de Tecnologia Senac Goiás
Larissa Rocha Suriani
Produção Multimídia
Introdução
Ao longo do semestre, nos foram apresentadas carga e mais carga de conteúdo relacionado, seja à cor, web design, tipografia, desenho, metodologia, tratamento digital, ou qualquer outra curiosidade relacionado ao mundo da multimídia, que ensinou a cada aluno, a sua
peculiaridade e dinamicidade do assunto, fazendo com que criemos a nossa própria marca e identidade quanto ao início da nossa vida acadêmica e profissional.
O acompanhamento durante as aulas na confecção do portfólio foi crucial para o
aprimoramento e amadurecimento de ideias. Foram muitos os erros, muitas as correções e muito aprendizado, que foram aplicados para desenvolver um bom resultado.
O portfólio nos foi proposto para expor os trabalhos realizados durante as aulas e mostrar a nossa evolução acadêmica.
Cor e Percepção
Professor: Felipe Chalfun
Defesa: As cores escolhidas para serem utilizadas no site estão nos tons avermelhados, seja recaído um pouco pro laranja, ou recaindo pro vermelho mais escuro, quase um magenta mais escuro.
O fato de as cores usadas estarem aquareladas, perde um pouco o brilho e a cor original, mas percebe-se que elas contrastam com o background do site, que simula a textura de um papel, como se realmente estivesse pintado.
A preferência pela diferença de cores no menu vem do fato de que, o “Início” e “Contato” são tópicos totalmente distintos das matérias que devem constar no projeto. A unificação da cor onde está localizada as matérias, deve-se ao fato de que uma não pode se destacar mais do que a outra, fazendo com que todas fiquem no mesmo nível. Concluindo então, a clara definição da hierarquia no menu.
Fica claro também o alinhamento entre as cores, e a perca de brilho desde o primeiro tópico até o último, fazendo com que crie um pequeno degradê horizontal. Também há o fator da hierarquia, onde a logo é a primeira coisa que chama atenção, precedida do menu, e em seguida o conteúdo. A centralização do layout gera um equilíbrio visual, pois os elementos não ficam “soltos” no espaço da página, e sim dispostos em um só ponto, facilitando a navegação e a percepção do leitor.
Como não é um site dinâmico não havia tanta exigência de fazê-lo com esse critério, porém, a dinâmica parte do menu, onde há a interação das manchas de aquarela com a escrita onde os elementos interagem entre si, assim como o fundo interage também com as manchas, que por serem de aquarela, elas estão “pintadas” no papel.
O laranja (#ff8800) geralmente tem a propriedade de aquecer, portanto ele contrasta com o roxo (#a8629b) que é uma cor um pouco fria, além de ajudar a fugir um pouco da monocromia de um site que já tem poucas cores, já que a intenção era fazer um portfólio simples e com poucas variações de cores, onde a frase “menos é mais” se encaixa perfeitamente. A cor vermelha com a perda de brilho, dá um ar mais harmônico e delicado, passando a sensação de calma e feminilidade, fazendo com que o conjunto harmônico não expulse a pessoa,
*Paleta de cores utilizadas, juntamente com suas variações (mais saturadas, com menos brilho)
Referência bibliográfica: GUIMARÃES, Luciano. A Cor como Informação. São Paulo: Ana Blumme, 2008, página 111.
Tipografia
Professor: Marcos Costa
Defesa: A tipografia utilizada nos textos é a Calibri, escolhida pelo fato de ser sem serifa (além de substituir a família Times New Roman e Arial em alguns programas da Microsoft). Além de facilitar a leitura entre uma palavra e outra, sem que haja a confusão e o pular de linhas. Já a do menu, é a fonte “Yanone Kaffeesatz”, um pouco alongada, mas também é sem serifa. A logo (Larissa Suriani) foi feita a mão, o que nesse caso, eu fiz a minha própria assinatura, tratando-a no Photoshop, criando a logo com tipografia única e colocando minha identidade no meu trabalho.
O fato de ter três tipografias diferentes no portfólio vem da base da hierarquia. A logo se destaca não só pelo tamanho, mas também por ser preta e destacar em um background de cor clara, chamando a atenção à primeira vista; o menu, com a tipografia mais alongada
verticalmente e um pouco menor, alinhadas ao centro da mancha de aquarela, para facilitar a leitura e o posicionamento na página; e a tipografia dos textos dos conteúdos, um pouco mais redonda.
Com todo o planejamento e pesquisa, toda a tipografia forma um conjunto harmônico e adequado para o design do portfólio.
Referências bibliográficas: NIEMEYER, Lucy. Tipografia: Uma apresentação. 4. ed. Rio de Janeiro: 2AB, 2000.
Desenho de Observação
Professor: Aurisberg Leite
Defesa: O design do site foi inspirado nas obras feitas com aquarela sob papel. É um gosto particular e já praticado nos métodos de desenho.
O background simula a textura de um papel aquarelável, onde é quase possível “pintar” as manchas que ficam no menu. E na verdade essa foi a intenção: dá um ar mais artístico ao portfólio, talvez até com um jeito de blog, mas não é.
O menu por sua vez, foi construído em linha horizontal começando com o item “Início” e seguindo através das matérias do primeiro módulo e terminando com o item de “Contato”. Segundo Wucius Wong, a linha significa uma trajetória específica a se seguir, e foi justamente esse o conceito do menu.
A logo, que é uma assinatura, contrasta com o ar artístico do portfólio, que foi feito sob intenção de ligar todo o conjunto como se fosse uma obra de arte assinada pela própria artista.
Referências bibliográficas: WONG, Wucius. Princípios de Forma e Desenho. 2. ed. São Paulo, Martins Fontes, 2010. 23 p.
Tratamento de Imagem Digital
Professor: Cloves
Defesa: O site contém parte cruciais de tratamento de imagem, a começar pela logo. A logo foi feita a partir da minha própria assinatura, que após escrita à mão no papel, foi scaneada e editada no Photoshop. A partir da ferramenta de Seleção, selecionei apenas a assinatura, e logo em seguida, usei um brushe (pincel de pintura) para preencher as imperfeições, mas ainda sim continuar com a impressão de assinatura, por isso diminui a opacidade do pincel, para que não cobrisse muito o trabalho da caneta da assinatura. Outro trabalho realizado com tratamento digital foram as manchas de aquarelas, que na verdade são brushes na forma de pincel de aquarela, que dão um efeito bem realista quando utilizados. Utilizando pelo menos 5 camadas sobrepostas sobre cada mancha (pois com a opacidade diminuída, ficaria muito transparente e não daria contraste com o background), as cores ficam mais vivas e sobressaltadas, mas ainda assim, não chamam mais atenção do que está escrito no menu.
Outro fato de tratamento digital utilizado no design do site foi o background. Quando o encontrei, ele era um pouco mais escuro, então tratei a imagem do papel para ficar um pouco mais clara, para justamente causar conforto visual no site.
Referências bibliográficas: ANDRADE, Marcos Serafim de. Abode Photoshop. Ed. Senac São Paulo, 2010.
Web Design
Professor: Diogo Maia
Defesa: A parte crucial do projeto é o design do website para o Portfólio Acadêmico. A montagem da estrutura do site demorou a ser construída pois foram 4 layouts até chegar nesse. Não foi por falta de objetivo, mas sim, dificuldade de colocar minha identidade no site. Basicamente me inspirei no site “SuperZiper (http://www.superziper.com/)”, onde as donas fazem todo o uso do trabalho delas (que é customização) para construir o site sob esse conceito (background com textura de pano, imagens de botões espalhados no topo do site,linhas em forma de costura, etc.), e baseado nisso foi onde resolvi aplicar esse mesmo conceito, porém voltado para a área artística.
A estrutura toda em Tableless e PHP, que são critérios impostos para o projeto, e que foram executados devidamente. O portfólio poderia sim ser feito somente em HTML, utilizando-se tabela, porém não ficaria de fácil manuseio na construção e modificações futuras, por isso a maneira mais fácil seria fazer um site em Tableless e PHP.
Todo o conteúdo da página (menu, logo, e o próprio conteúdo adicionado por matéria) está centralizado, para facilitar a leitura e ficar mais agradável visualmente, e consequentemente aumentando a usabilidade do site. O menu abaixo da logo, indica a hierarquia de leitura (primeiro o que chama mais atenção, a logo, depois o menu, e em terceiro o conteúdo) aplicada no design do website. Todos os trabalhos e conceitos das outras matéria do primeiro módulo foram aproveitadas e aplicadas no site, bem como cor, desenho, tipografia, e
tratamento digital.
O links (menu e arquivos em PDF) estão todos em hover (a cor do link muda no momento em que se passa o mouse sobre a palavra), mas é quase imperceptível pelo motivo de a cor do hover ser um cinza bem escuro.
Além de toda a estrutura, há o trabalho com a tipografia. São três tipografias diferentes: vem da base da hierarquia. A logo se destaca não só pelo tamanho, mas também por ser preta e destacar em um background de cor clara, chamando a atenção à primeira vista; o menu, com a tipografia mais alongada verticalmente e um pouco menor, alinhadas ao centro da mancha de aquarela, para facilitar a leitura e o posicionamento na página; e a tipografia dos textos dos conteúdos, um pouco mais redonda, com a fonte Calibri, que provoca um “agrado” visual quanto aos textos.
Os links para os trabalhos das matérias se referem à um arquivo em PDF aberto em uma outra janela do navegador, para que não passe a impressão de que saiu do site.
Referências bibliográficas:GOMES, Ana Laura. Adobe Dreamweaver CS. São Paulo: Ed. Senac São Paulo, 2011.
Metodologia
Professora: Giovanna Tavares
Defesa: A matéria de Metodologia seria, teoricamente, mais aplicada no memorial, porém ela aplica-se na organização do website tanto quanto no memorial.
A organização do site gerou toda uma pesquisa em relação à layouts artísticos, PHP, e
consultas com outros professores. Foi traçado um mapa mental do que fazer e do que retocar nos trabalhos. Desde quando o projeto foi lançado, até o dia de entrega, até mesmo o
memorial descritivo, tiveram apoio e orientação metodológica para que fosse realizado, fazendo com que o trabalho não ficasse “cego”, ou seja, sem nenhuma opinião profissional e educacional.
Referências bibliográficas: MARTINS, Gilberto de Andrade; THEÓPHILO, Carlos
Renato. Metodologia da investigação científica para ciências sociais aplicadas. 2. ed. São Paulo: Atlas, 2009.
