Relatório de Estágio realizado no âmbito do curso Comunicação e Design Multimédia.
Escola Escola Superior de Educação de Coimbra
Orientador de Estágio Dr. Professor João Orvalho
Ano Lectivo 2015/2016
Orientando Pedro Manuel Pereira Drumond
Curso Comunicação e Design Multimédia
Orientador de Estágio na empresa Alberto Sánchez González
Unidade Curricular Projecto
Empresa MUT Design SC
Regime Estágio Académico
Número de aluno 2013402
Os trabalhos aqui apresentados seguem os direitos de autor da empresa de acolhimento. Qualquer reprodução dos mesmos é expressamente proibida. MUT DESIGN SC - Valência
II
Resumo / Abstract
Português Para a unidade curricular ‘Projecto’ do terceiro ano da licenciatura em Comunicação e Design Multimédia, escolhi desenvolver um estágio académico na empresa MUT Design, situada em Valência, Espanha. Este estágio teve a duração de três meses (02 de Fevereiro a 02 de Maio) e ajudou-me, não só a crescer como designer mas também a desenvolver um sentido crítico e estético mais apurado. Descrevo neste relatório os projectos por mim desenvolvidos nas diferentes áreas como design gráfico, editorial, web design e fotografia / edição de fotografia.
English For the curricular unit ‘Project’ from the third course year of the Communication and Multimedia Design degree, I choose to do an intenrship at MUT Design, located in Valência, Spain. This intenrship lasted for three months (02 February until 02 May) and it help me to, no only grow has a designer but also to develop a stronger critical and aesthetic sense. In this report I descrive all the project developed by me in different areas, such as graphic design, editorial, web design and photography / photo editting.
Palavras Chave
Key Words
Design Gráfico; Design Editorial; Web Design; Fotografia / Edição de fotografias;
Graphic Design; Editorial Design; Web Design; Photography / photo editting
IV
Agradecimentos
Coimbra, Momentos que passam, Saudades que ficam... Durantes três anos de curso, foram muitas as pessoas e os momentos que marcaram a minha vida académica. Primeiramente, quero agradecer à minha família que, sem eles não teria a oportunidade de experimentar esta importantíssima etapa da minha vida. Aos meus pais e irmão, por todo o que se esforçaram e sacrificaram para que eu pudesse estudar em Coimbra e ao apoio e motivação que me deram, apesar da distância enorme entre nós. Por toda a ajuda prestada e incentivos, quero agradecer aos meus avós mas, mais importante que isso, também ao apoio dado entre os meus pais e eles. À minha tia que também me ajudou e se esforçou para que eu conseguisse alcançar sempre o sucesso. O seu apoio foi também muito importante nesta fase. Quero agradecer aos amigos que fiz em Coimbra por todo o apoio e por todos os momentos passados juntos. São as boas e más situações, aos dias e às noites nesta maravilhosa cidade que me fazem dizer que, se cresci tanto foi com o vosso auxílio. Foram bastante importantes nestes três anos em Coimbra e um ponto fulcral no meu sucesso, tanto pessoal como profissional. Aos professores que deram o seu melhor para ver, não só a mim mas também todo o curso a ter sucesso. Agradeço a paciência e empenho que tiveram em nós. Por último mas não menos importante, um muito obrigado à equipa da empresa MUT Design por me acolherem durante três meses e me fazerem crescer. Por todo o apoio que me deram, as críticas construtivas, ao conhecimento que me forneceram e por me terem recebido de braços abertos e sempre com um sorriso na cara, um muito obrigado.
Introdução
01
Referência Bibliográficas
03
Capítulo 1 Design Gráfico
04 e 05
Design Editorial
06 e 07
Fotografia digital / edição
08 e 09
Web design
10 e 11
Capítulo 2 Projectos desenvolvidos no âmbito do estágio na empresa
13
Projecto número 1: “Delta”
14 a 17
Projecto número 2: “Rótulos dos vinhos”
18 a 21
Projecto número 3: “Catálogos”
22 a 25
Projecto número 4: “Novo design da página Web”
26 a 29
Projecto número 5: “Duplex”
30 a 35
Projecto número 6: “Caixas Harmony”
36 a 39
Projecto número 7: 8º Encontro de CMD
40 a 43
Capítulo 3 Conclusão
45
Bibliografia / Webgrafia
47 e 48
Anexos
51 a 53
Glossário
55
1
Introdução
No terceiro ano do curso Comunicação e Design Multimédia, a mobilidade que escolhi na unidade curricular de projecto foi fazer um estágio académico. De todas as opções, esta foi a que me pareceu mais interessante para ganhar experiência a nível profissional e não só. Este estágio teve a duração de três meses e serviu como uma introdução ao mercado de trabalho. Fazer parte de uma equipa de designers que lidam com clientes todos os dias, que têm datas a cumprir e pressão do trabalho é uma preparação a nível profissional importante. Trabalhar com uma equipa que nos auxiliam e guiam durante o processo de crição e execução das tarefas, é uma mais valia enorme. Isto trouxe-me vantagens tanto a nível profissional como pessoal e mudou completamente a minha maneira de encarar o mercado de trabalho. O meu estágio teve lugar na empresa MUT Design, em Valência, Espanha. Depois de ver o portfólio da empresa, cheguei à conclusão que seria uma boa opção realizar lá o estágio. Pareceu ser uma equipa unida e onde poderia aprofundar áreas de interesse. Os temas principais deste relatório estão divididos em duas partes, as referências bibliográficas e os trabalhos desenvolvidos durante o estágio. Nas Referências Bibliográficas, são abordadas as temáticas mais trabalhadas durante os três meses, o design gráfico, design editorial, web design e fotografia / edição. Na segunda parte são descritos os projectos realizados, briefings, recursos utilizados, metadologia, resultados obtidos e também uma análise crítica.
3
Capítulo 1: Referências Bibliográficas
Durante o tempo de estágio na entidade de acolhimento, foram abordados vários projectos de diferentes áreas. As áreas em que mais se trabalhou foi o design gráfico, fotografia e ediçao de imagem. Também se trabalhou em design editorial, Web design e design de producto. Neste capítulo do relatório, explica-se algumas influências, modos de criação, pesquisas e referências para as devidas áreas trabalhadas.
4
Design Gráfico
Fundamentação Teórica / Influências Design gráfico é a prática, planeamento e projecção de ideias e experiências recorrendo a conteúdos visuais e textuais. Tem como principal objectivo resolver um problema visualmente e assim, comunicar algo a um público alvo. Para isto, são utilizados vários elementos como ilustrações, textos, símbolos, cores, ect.. Com estes recursos, o designer tenta chamar à atenção do público, tanto em suporte impresso ou em suporte digital. Isto faz com que o design gráfico tenha uma grande presença no nosso quotidiano, influênciando assim, o público. De acordo com Wucius Wong (“Princípios de forma e desenho”), o design gráfico tem vários elementos que servem como base para a realização de um projecto, são eles a forma, cor, textura, espaço, massa e a linha. Forma: (Figura 1 dos anexos) Este é um elemento mais utilizado no design. Considera-se uma forma, um agregado de linhas que resulta num novo elemento, como um rectângulo, triângulo, quadrado, círculo ou trapézio. As formas também podem ser associadas ao movimento, como as linhas. Cor: (Figura 2 dos anexos) A cor é um dos elementos mais importante dos design. Geram contrastes, são chamativas, dão noção de profundidade e podem mudar a maneira como nos relacionamos com um objecto. Textura: (Figura 3 dos anexos) É uma das características de uma superfície que pode ser tácil ou visual. A textura relaciona-se no contexto inserido reforçando o seu todo. Normalmente age como elemento secundário, sendo só um suporte à imagem principal. Espaço: Espaço também é importante no design. Um maior espaçamento entre elementos cria uma impressão de “leveza” e ajuda a direccionar o olhar para os elementos mais importantes.
5
Massa: (Figura 4 dos anexos) É o tamanho físico ou visual de um elemento. Um ponto pode ser pequeno em comparação com a Terra, mas gigante comparado a um átomo. O mesmo acontece no design. Um cartaz pode parecer mais “leve” se tiver pouco texto e imagens. Por outro lado, um cartão de visita pode ser considerado “pesado” por ter exesso de elementos. Linha: (Figura 5 dos anexos) A linha, é basicamente a movimentação de um ponto no espaço. Podem ter diferentes características como espessura, , estilo do corpo (tracejado, sólidas, finas, grossas), comprimento, curvas ou rectas e diferentes sentidos de orientação (horizontal, diagonal ou vertical). São utilizadas para delimitar uma área / secção ou para causar uma sensação de movimento aos olhos do utilizador.
Para além dos elementos básicos, o design gráfico também conta com alguns princípios que são utlizados para comunicar uma mensagem de modo extruturado e legível. São eles o alinhamento, equilíbrio, contraste e proximidade. Alinhamento: (Figura 6 dos anexos) O alinhamento ajuda à organização de um projecto criativo. Transforma o caos em ordem, criando grupos de elementos que podem ser percepcionadas como “ligados”. Equilíbrio: (Figura 7 dos anexos) Todo o elemento gráfico tem um certo peso e ao conjugar com outros elementos, há a necessidade de criar um equilíbrio visual entre eles. Contraste: (Figura 8 dos anexos) A criação de contraste no design faz-se utilizando elementos de diferentes tamanhos, cores, pesos e formas. Quanto maior for a diferença entre eles, maior será o contraste. Isto ajuda o público a focalizar os elementos mais importantes. Proximidade: (Figura 9 dos anexos) O cérebro Humano está programado para criar ligações entre elementos. Utilizando vários grupos de elementos, pode-se disseminar melhor uma mensagem. Dois elementos juntos sugerem um tipo de relacionamento diferente de dois afastados.
6
Design Editorial
Fundamentação Teórica / Influências Design editorial é uma vertente do design gráfico especializada em design / criação de layouts para revistas, jornais, livros e adjacentes, bem como publicações online. Cada tipo de publicação tem diferentes questões de estética e regras pré-estabelecidas. Uma das características do design editorial é o uso de uma grelha (grid). A grelha é um suporte de organização para os elementos que serão inseridos no layout. Serve também para dar um sentido padrão às páginas e assim, transmitindo uma sensação de unidade. Apesar do seu uso ser quase imprescindivel na realização de um layout, não existe nenhuma regra específica para o seu uso. Para realizar um bom layout há vários aspectos a ter em conta, como a utilização da fonte, o alinhamento, organização das colunas de texto, imagens e o ritmo utilizado.
Fonte: As fontes serifadas são as mais indicadas para o corpo do texto, em textos longos. São melhor utilizadas em suportes impressos por facilitarem a leitura. Já em suportes digitas, o uso de fontes sem serifa é recomendado. Questões como o kerning, tamanho e afastamento entre linhas também deve ser considerado.
Alinhamento: O texto pode ser alinhado de diferentes maneiras. A utilização do texto alinhado à esquerda torna a sua leitura mais fácil enquanto que, à direita o leitor tem mais dificuldade em seguir as linhas de texto. A utilização de texto justificado carece de algum tratamento por criar rios.
Colunas de texto: A utilização de colunas é importante, mas utilizar colunas de texto muito largas torna a leitura mais cansativa.
7
Imagens: Uma boa utilização de imagens e símbolos permite um bom entendimento do texto e torna o layout mais apelativo. Ritmo: Deve manter-se o ritmo base de leitura, da esquerda para a direita. Assim a leitura do texto tornar-se-á mais fácil.
A utilização de tipografia na execução de um layout é fundamental. Deve haver uma forte estrutura tipográfica desde os cabeçalhos até aos corpos de texto. É a tipografia que dá ordem estrutural e forma ao layout. Hierarquizar os diferentes elementos do texto como títulos, sub-títulos, textos, legendas, entre outros, com diferentes pesos e tamanhos de letra ajuda à organização da leitura e torna o layout mais organizado. O tamanho utilizado deve variar entre 8 e 12pt. O tipo de letra escolhido também pode ajudar na leitura do texto. A utilização de duas fontes é aconcelhavel por permitir diferenciar os títulos dos textos.
8
Fotografia digital / edição
Fundamentação Teórica / Influências Fotografia digital é o processo de captação do mundo exterior para registar imagens. As imagens são, de certa forma um conjunto de dados digitais que depois podem ser convertidos. A fotografia digital trouxe várias vantagens sob a fotografia analógica. Um deles é a visualização das imagens momentos depois de serem capturadas. Produz resultados mais rápidos e baratos, maior facilidade para copiar e imprimir, possibilidade de retocar / editar as imagens, entre outras. A resolução das imagens também evoluiu exponencialmente. Quanto maior a resolução, melhor a qualidade da imagem. Outra vantagem da fotografia digital são os formatos disponibilizados para guardar as imagens. Os mais comuns são o RAW, JPEG, GIF e PNG.
RAW: Conjunto dos dados digitais da imagem que não estão comprimidos nem processados. Este formato é mais comum entre os fotografos. JPEG: Este é o formato standart de compressão de imagens. Está projectado para comprimir imagens a cores ou escala de cinzentos. GIF: É um formato de 8bit, que suporta no máximo 256 cores. É recomendado utilizar em logos ou similares porque favorece as áreas de cor uniforme e com arestas definidas. PNG: É um formato bitmap que usa compressão. Tem melhores compressões e suporta milhões de cores, ao contrário dos GIF’S.
9
Uma boa composição numa fotografia é o elemento chave para uma boa imagem. Para isto há vários elementos para criar uma composição
Padrão: Recorrer ao uso de padrões nas imagens cria um equilibrio visual e uma boa composição visual. Simetria: A simetria pode ser uma composição, criando assim uma forte imagem. Textura: Textura pode fazer com que o elemento fotografado sobresaia na imagem e criar um fundo interessante. Cor: É o elemento mais básico das imagens. As cores primárias são o vermelho, azul e amarelo (rgb) criando assim, o círculo cromático. As cores complementares são as que funcionam melhor juntas.
Tal como o processo de captação de imagens tem princípios e elementos base, também a edição das mesmas tem. A edição das imagens tem como função melhorar alguns detalhes e corregir erros feitos no momento da fotografia.
Balanço de brancos: Permite melhorar as cores nas fotos, resultando numa imagem mais realista. Não deve reduzir o contraste.
Redução de ruído: Quando há pouca luz no momento da fotografia, pode causar ruído (grão). Isto reduz a qualidade da imagem. Contraste: Imagens tiradas contra o sol (ou luz) sofrem por ter pouco contraste. Aumentar o contraste pode dar um efeito 3D e, assim melhora-la.
10
Web Design
Fundamentação Teórica / Influências Web design é o processo de criação de layouts com a intensão de partilha-los em web sites. O layout deverá ser feito de acordo com certos princípios de criação, bem como com um sentido estético. Deve garantir ao usuário os princípios base da usabilidade e ser desenhado em prol do utilizador, com um design simples e objectivo de modo a não dificultar a sua navegação e garantir que o mesmo atinja os seus objectivos. Ao criar um layout, há que ter em atenção diversos aspectos como os diferentes navegadores, diferentes tipos de ecrã (computadores, tablets, telemóveis, entre outros).
Layout: É a maneira como são organizados os elementos (gráficos, textos, anúncios) na página. Deve ser consistente.
Cores: O uso das cores na web depende do prepósito da página e dos clientes. Se se utilizar várias cores terão que ser web-safe cores apenas. Gráfios: Podem incluir logos, fotografias ou ícons e, se bem organizados melhoram o layout. Precisam ser posicionados correctamente e ter cuidado com as cores e o conteúdo da web page, de modo a não a tornar muito lenta. Fontes: Terão que ser utilizadas só web-safe-fonts. O uso de várias fontes pode enriquecer a web page. Para maior conveniência, terão que ser utilizadas os mesmos mesmos tipos de letras para os títulos e textos.
11
Texto: O texto deve funcionar em sintonia com o design escolhido. Deve ser relevante e útil para não dificultar a navegação na web page.
Para álem do elementos básicos do web design, um web site terá que ser projectado para ser user-friendly. O Responsive Web Design (RWD) é uma maneira de criar sites que se adaptam a qualquer resolução de ecrã, com a mínima acção do utilizador. Isto é possivel com o uso de fluid grids (grelhas adaptaveis). Elas re-dimencionam um elemento em percentagem, em vez de unidades absolutas, como o ponto ou pixel.
Navegação: A arquitetura do site, os menus e outros elementos de navegação devem ser desenhados pensando na maneira como os utilizadores fazem as suas pesquias e navegam nas páginas. O objectivo é ajudar o utilizador a navegar de maneira fácil e rápida, encontrando a informação que necessita. Tecnologia: Com o surgimento de novas técnicas, os designers têm mais liberdade em adicionar movimentos e a inovar nos seus layouts, permitindo assim que a web page fique sempre actualizada. Interactividade: Usar caixas de texto ou partilha de opiniões permite ao utilizador ser mais participativo e influênte.
13
Capítulo 2: Projectos desenvolvidos no âmbito do estágio na empresa
Durante os três meses de estágio académico na empresa MUT Design, que teve início a dois de Fevereiro e conclusão a dois de Maio, houve a oportunidade de trabalhar em inúmeras áreas como o design gráfico, fotografia e edição de fotografias, design editorial, web design e vídeo. Também houve a oportunidade de trabalhar com empresas que tinham parcerias com o estúdio. Regra geral, eram empresas de productos domésticos, por exemplo azuleijos e cadeiras. A empresa Peronda e a sua sub-marca Harmony eram os principais cliente. Também houve trabalhos para clientes particulares. Isto permitiu alargar os meus conhecimentos não só em design gráfico e adjacentes, mas também em design de producto em que não tinha experiência. Neste relatório escolhi alguns dos trabalhos realizados e apresento o briefing, metadologia, os recursos utilizados, os resultados finais conseguidos e uma análise crítica.
14
De 02 de Fevereiro a 01 de Abril de 2016
Projecto número 1: “Delta”
Delta surgiu com a necessidade de criar um azuleijo com um design mediático, único e inovador com baixos custos a partir de uma técnica antiga de óleo sobre água.
Brienfing Este foi o primeiro trabalho proposto na entidade de acolhimento. “Delta” é o nome de uma coleção de azuleijos feitos de cimento com uma dimensão de 14cm por 28cm e com diferentes esquemas de cor. Na parte superior do azuleijo há um triângulo equilátero pintado com uma técnica antiga de óleo sobre água. As cores disponíveis são o azul e branco, rosa e branco e o cinzento e branco. Pretendia-se realizar vários ensaios fotográficos com os azuleijos onde fosse promovida a sua versatibilidade. Mostrar os diferentes azuleijos e as suas infinitas possibilidades de colocação para depois mostrar o projecto no site da empresa. Seria necessário realizar fotografias de produto, onde só mostrasse o azuleijo, fotografias de ambiente onde tivessem inseridos num ambiente e fotografias de detalhe.
Conceitos Promover os ajuleijos com recurso a fotografias; Expor a sua versatilidade; Possibilidades infinitas de combinações;
Metadologia: Para ter um conceito na maneira de como se iria realizar as fotografias de ambiente, começou-se por fazer uma pesquisa de como se poderia montar as peças e que elementos seriam mais interessantes integrar nas composições. Concluiu-se que seria conveniente inserir algo que transmiti-se a ideia de água, já que o processo de crição utiliza água e a palavra “delta” pode ser remetida ao delta de um rio. Depois de apresentada a ideia à equipa e de ser aprovada, começou-se a pensar como iríamos realizar as fotos de producto. Para estas fotografias era necessário mostrar os diferentes tipos de azuleijos. Como têm uma linha simples e clara, transmitiu-se isso na composição utilizada. A fotografia de detalhe teria que mostrar um pormenor dos azuleijos que se achasse interesante e relevante para o tema e conceito das fotografias. Depois de todas as ideias esclarecidas e claras, começou-se a realizar as fotos aos azuleijos.
15
Escolheu-se fazer as fotografias de producto primeiro porque seria um bom ponto de partida. Para ter as condições necessárias para a exucução das fotografias, foi necessária a criação de um pequeno estúdio dentro da empresa para garantir bons resultados finais. Os azuleijos foram alinhados e dispostos verticalmente para começar a realizar algumas composições com as cores. Depois de conseguidas as fotografias, surgiu a ideia de realizar GIF’S onde se mostra-se algumas composições. Isto facilitava a ideia de transmitir a sua versatibilidade e seria mais interessante para o cliente. Para as fotos de ambiente, os azuleijos foram colocados no chão criando padrões e utilizando diferentes objectos e acções, transmitiu-se uma ideia de escala. Os objectos inseridos nas fotos foram um pote de água, sapatos e um calendário. Também houve elementos humanos, como mãos e cabelos. Para finalizar, o pormenor escolhido para a fotografia de detalhe foram as cores e o grafismos nelas. Foi utilizado um azuleijo colocado verticalmente e outro na horizontal e fotografada a sobreposição dos dois, mostrando assim, as duas cores.
Análise Crítica Com este projecto aprofundei os meus conhecimentos de fotografia e de edição de imagem. Antes não tinha muito à vontade nestas duas áreas mas ao realizar este projecto mudei a minha maneira de trabalhar. Adquiri conhecimentos relativamente à boa elaboração de uma fotografia (composição de elementos, exposição luminosa, elaboração de estúdios fotográficos...) e de como programar a câmara. Relativamente à edição das fotografias no Photoshop, aprendi novas técnicas e maneiras de chegar a um resultado final positivo. Quanto ao comprimento das regras estabelecidas para este projecto, todos os aspectos foram respeitados. Não havia uma data específica para a conclusão do trabalho, pudemos demorar um pouco mais na execução das fotografias e na respectiva edição. Fizemos todas as composições que estavam planeadas e em Abril, este projecto foi adicionado à página de internet do estúdio.
Recursos utilizados Para a realização deste projecto utilizou-se tripé, câmara fotográfica, cartolinas e luzes. Nas fotos foram inseridos vários elementos como um pote de água, sapatos e um calendário. A nível de softwares recorreu-se ao Adobe Photoshop.
16
Resultados obtidos
Figura 10 - Fotografia de ambiente 1
Figura 12 - Fotografia de ambiente 3
Figura 11 - Fotografia de ambiente 2
Figura 13 - Fotografia de ambiente 4
17
Figura 15 - Fotografia de producto 1
Figura 14 - Fotografia de ambiente 5
Figura 16 - Fotografia de producto 2
Figura 17 - Fotografia de detalhe
18
De 25 de Fevereiro a 02 de Maio de 2016
Projecto número 2: “Rótulo de vinho”
Criação de três rótulos para diferentes garrafas e bebidas. Um vinho tinto artesanal, um licor de jemgibre e um vinho branco espumante.
Brienfing A realização de três rótulos de vinhos foi-nos apresentada com o objectivo de criar-mos um trabalho que transmitise a artesania que era impregue na elaboração dos vinhos. É uma coleção limitada que consiste num vinho tinto, um licor de jemgibre e um espumante. Todos eles realizados de maneira ecológica e artesanal. A ideia seria criar três rótulos diferentes mas que depois pudessem ser identificados como parte da mesma coleçao pelo comprador. A marca dos três vinhos era “Sirio”.
Conceitos Realizar três rótulos; Vinho artesanal e ecológico; Transmitir ideia de coleção;
Metadologia: Depois da apresentação da ideia, decidiu-se fazer uma pesquisa para encontrar uma conceito e fez-se um estudo de mercado. Concluímos que seria interessante combinar uma ilustração com um traço mais antigo (gravura) com um layout mais moderno. Assim, a ideia de artesanato conseguia ser transmitida sem que o rótulo tivesse que ser muito trabalhado. Como havia a intensão de tornar este, um rótulo de vinho mais divertido, pensou-se que seria credivel acrescentar um ditado popular sobre vinho no rótulo. A ideia seria escolher um ditado popular espanhol, mas omitir uma parte para que o cliente pudesse escrever o algo e completar o ditado. Com a conclusão do estudo de mercado, apercebemo-nos que a nossa ideia seria única na “prateleira”. Começou-se então a realizar alguns estudos de ilustrações para o rótulo de vinho tinto. A ideia inicial era utilizar um barril de um banco de imagens e então edita-lo para que ficasse de acordo com o que o cliente pedia. A primeira ilustração retratava um barril, cortado a meio com uns pés. Isto ajudava a transmitir a ideia de vinho artesanal e sem suplementos adicionados. Os restantes rótulos seguiriam o mesmo layout mas percebeu-se que não funcionaria tão bem. Assim, decidimos mudar por completo a nossa ideia inicial. Começou-se por atribuir a cada rótulo um tipo de papel diferente. O tinto teria um papel craft, o licor de jemgibre teria um papel com pouca textura e ligeira cor esverdeada. Já o espumante utilizaria um papel negro, liso. Para se entender que seria uma coleção, o layout do texto na parte de trás da garrafa seria igual, mudando apenas a ilustração à frente. O vinho tinto terá uma ilustração de uvas e o licor uma ilustração de jemgibre.
19
Apenas o espumante não tem ilustração para dar um ar mais requintado.
Análise Crítica A realização deste projecto deu-me uma nova perspectiva sobre o uso de medidas e de guias na realização de um novo trabalho. Para a boa projecção dos rótulos de vinho, tinha que utilizar as medidas da circunferência da garrafa e ter em conta a área que a cola iria ocupar no rótulo. Como a disposição dos elementos no rótulo (texto, imagens e símbolos) era regular, o uso de guias e da régua era imprescindível. Isto facilita a organização e o correcto alinhamento de todos os elementos. A utilização destes recursos facilitou a elaboração do rótulo. Aquando da reunião com os clientes, não ficou estipulada nenhuma data de entrega nem limitações a nível de recursos (tipos de papel, tinta, ect.). Tínhamos total liberdade para fazer o trabalho.
Recursos utilizados Neste projecto utilizou-se o sotfware Adobe Ilustrator e Adobe Photoshop, bem como esboços à mão.
20
Estudos e resultados obtidos
SIRIO NUESTRA BODEGA DEL SIGLO XVIII,SITUADA EN UN ENTORNO DE CEPAS CENTENARIAS, TIENE COMO FILOSOFÍA, UN FUERTE RESPETO Y COMPROMISO CON EL ENTORNO NATURAL CARACTERIZADO POR UN PROCESO SIN FILTRADOS NI CLARIFICADOS, DONDE LOS SULFITOS QUE CONTIENE VIENEN DE LA PROPIA FERMENTACIÓN, SIN AÑADIR NI QUITAR NADA A ESA UVA. UN FIEL REFLEJO DE LA TIERRA. UVA Y NADA MAS! BOBAL Y TEMPRANILLO. FERMENTACIÓN ESPORADICA. CONSUMIR PREFERENTEMENTE A 18° SOLO O EN COMPAÑIA CREANDO UN MOMENTO IDONEO. WWW.BODEGASCUEVA.COM
Figura 18 - Estudo rótulo vinho tinto
SIRIO Nuestra bodega del siglo XVIII,situada en un entorno de cepas centenarias, tiene como filosofía, un fuerte respeto y compromiso con el entorno natural caracterizado por un proceso sin filtrados ni clarificados, donde los sulfitos que contiene vienen de la propia fermentación, sin añadir ni quitar nada a esa uva. UN FIEL REFLEJO DE LA TIERRA. Uva y nada mas! BOBAL Y TEMPRANILLO. FERMENTACIÓN ESPORADICA. CONSUMIR PREFERENTEMENTE A 18° SOLO O EN COMPAÑIA CREANDO UN MOMENTO IDONEO. www.bodegascueva.com
Figura 19 - Estudo rótulo vinho tinto 2
21
Rรณtulo Final do vinho tinto
Figura 20 - Rรณtulo Final do licor de jengibre
Figura 21 - Rรณtulo Final do espumante
22
De 11 de Fevereiro a 22 de Fevereiro de 2016
Projecto número 3: “Catálogos”
Realização de três catálogos para azuleijos diferentes onde fosse visivel a sua aplicação e versatilidade.
Brienfing A ideia neste projecto era re-criar um layout para três catálogo de productos diferentes. Este trabalho surgiu a partir de uma colaboração entre uma empresa de productos domésticos, chamada Peronda e a entidade de acolhimento. Era necessária a criação de três catálogos para serem impressos e também utilizados digitalmente por vendedores. Assim, o layout teria que ser algo simples e atractivo, bem como mostrar o producto em questão e a sua versatilidade.
Conceitos Layout simples e atractivo; Para uso impresso e digital;
Metadologia: Após a apresentação do brienfing, começou-se por fazer uma pesquisa de composições que pudessem funcionar bem em diferentes suportes. Depois de partilhar a pesquisa com a equipa, passou-se então à criação de estudos. Quando os textos e imagens foram disponibilizados pela empresa, começou-se a realização do layout. Depois de mostrada a proposta do layout ao designer gráfico da entidade de acolhimento e de ter feito algumas observações, passou-se então à realização final dos catálogos. O layout é simples e objectivo e mostra o producto inserido em vários ambientes diferentes e escalas distintas. Isto permite ao vendedor mostrar ao cliente todos os detalhes do producto. Também foram inseridas várias fotografias onde se vê várias composições do producto. Todos os três catálogos têm um layout similar já que, o produto vendido pertence à mesma empresa, apesar de terem sido feitos por diferentes estúdios. Os catálogos foram finalizados na última semana de Fevereiro e entregues à empresa Peronda nessa mesma semana.
23
Análise Crítica Este foi apenas o segundo trabalho de editorial que realizei e com ele, apronfundei o meu conhecimento nesta área. Com todo o trabalho que realizei (pesquisa, estudos, utilização do software Adobe Indesign, entre outros), tive uma nova noção do que se trata o “design editorial”. Um layout atractivo atrai o cliente enquanto que uma boa forma de apresentar as informações ajuda a empresa a clarificar o producto que vende. O facto de ter regras um tanto restritas, ajudou-me a focalizar no que a empresa pretendia e como poderia fazer um bom layout. As datas de entreguas foram um aspecto menos bom porque havia urgência neste projecto.
Recursos utilizados Para a elaboração deste projecto utilizou-se o Adobe Indesign e Adobe Illustrator.
24
Resultados obtidos
Figura 22 - Layout do catรกlogo Bowl
25
Figura 23 - Layout do catรกlogo Onza
Figura 24 - Layout do catรกlogo Roll
26
De 03 de Março a 11 de Abril de 2016
Projecto número 4: “Novo design da página Web”
Criação de um layout para a página web do estúdio que fosse mais expressivo, contasse com mais grafismos e fosse menos comercial.
Brienfing Este projecto foi apresentado pela equipa do estúdio como sendo um trabalho interno. O antigo layout da página web era simples e pouco trabalhado. Foi utilizada uma “templade” na realização do antigo website mas não foi muito explorado a nível estético. A nova proposta do layout teria que ser mais apelativa a nível gráfico e que torna-se a navegação mais interessante.
Conceitos Layout simples, atractivo e mais expressivo; One page layout;
Metadologia: Depois de apresentado o brienfing e de discutidas algumas ideias, procedeu-se então à realização de uma pesquisa sobre vários layouts de websites e de algumas regras sobre o bom funcionamento dos mesmos. Com a pesquisa, iniciou-se o processo de criação. Os estudos realizados definem vários layout’s com diferentes características e organizações. Foram utilizadas sobreposições entre elementos (numa galeria de imagens) e diferentes maneiras de organizar as páginas. Depois da apresentação destes exemplos à equipa, escolheu-se um layout com um espaçamento diferente entre os elementos gráficos (fotografias, textos e icons). Os textos também partilham esta característica mas com fundos de cor que proporcionam uma fácil leitura. Estas características lembram um pouco design editorial. As cores da proposta apresentada fazem parte de uma paleta monocromática. As diferentes partes em que o site está dividido (studio, works, publications, contact) têm diferentes cores para melhor percepção do visualizador. Tendo isto em mente, concluiu-se que a utilização de um site de página única seria útil por ajudar numa navegação minimalista e simples. A tipografia escolhida foi a Helvética que também assiste neste aspecto. É uma tipografia legível em qualquer suporte e moderna. Depois deste estudo ter sido enviado ao programador e analizado por ele, houve a necessidade de proceder a algumas alterações, nomeadamente a cores de fundo e à tipografia. As cores escolhidas não criavam um contraste sufeciente em todos os diferentes suportes. Quanto à tipografia, foram ajustadas caracteristicas relativas ao “kerning” e ao tamanho da letra. Realizadas as devidas alterações, o projecto foi novamente enviado ao programador
27
e encontra-se neste momento em fase de criação. O resultado final é um site de página única, com uma galeria de imagens na portada onde se pode ver os mais recentes trabalhos do estúdio. Seguidamente, os trabalhos do estúdio são apresentados e quando escolhidos, abrem uma galeria com as devidas informações e várias imagens. Depois vários dados como “Publicações” e os “Contactos” são apresentados aos visitantes do site.
Análise Crítica Em Web design não tinha muita experiência mas com este projecto as minhas capacidades aumentaram. Foi um projecto difícel de trabalhar devido à sua importância e complexidade. Com todo o trabalho realizado, ganhei uma nova sensibilidade em Web design. O cuidado que é necessário ter para que o layout funcione em todos os suportes digitais (diferentes softwares e diferentes dimenções de ecrã) e que consiga ser atractivo e simples para o utilizador é algo difícel de conseguir. Mas como já tinha noções de Web design tornou-se mais simples. Relativamente às datas de conclusão, tínhamos que ter o layout realizado antes da feira do producto de Milão, a dez de Abril.
Recursos utilizados Para a realização deste projecto utilizou-se vários programas como o Adobe Illustrator e o Adobe Photoshop. Também foram realizados alguns estudos à mão.
28
Resultados obtidos
Figura25 - Layout da Pรกgina Home
29
Figura 26 - Layout da galeria de imagens do producto
30
De 04 de Abril a 15 de Abril de 2016
Projecto número 5: “Duplex”
Criação de vários suportes de publicidade a um producto realizado pelo estúdio para a Feira do Producto de Milão.
Brienfing Uma coleção de três mesas produzidas pela equipa do estúdio foi escolhido para participar na Feira do producto em Milão e havia a necessidade de promover a coleção nos meios sociais. A ideia inicial era criar um convite para ser partilhado no Facebook e vários GIF’S que seriam lancados nos três dias de feira no Instagram. Teriam que ser animações curtas e que podessem transmitir a essência do projecto, a versatilidade das três mesas. Esta coleção chama-se Duplex e consiste em três mesas de diferentes tamanhos e alturas e possuem dois pequenos tampos amoviveis. Esta coleção pode ser utilizada em conjunto ou em separado.
Conceitos Promover o conjunto de mesas para a Feira de Milão; Criação de GIF’S;
Metadologia: Iniciou-se este projecto a fazer uns esboços das siluetas das mesas e de como poderiam ser colocadas, mostrando assim as diferentes maneiras de utilização. Também discutiu-se de que maneira iría-mos publicitar este producto para conseguirmos mostrar todos os seus aspectos. Concluíu-se que seria divertido e funcional fazer-mos o convite promocional utilizando artes plásticas em vez de criar algo a partir do computador. Tornava o convite algo mais pessoal. Começou-se então por realizar alguns esboços rápidos, com linhas simples. Para o convite final decidiu-se fazer vários recortes numa cartolina com o formato da maior mesa em que mostrasse algumas perspectivas da mesma. Depois dos devidos recortes feitos (dos dois tampos da mesa, pernas de apoio e sombras), procedeu-se então à colagem / montagem das peças numa folha A3. Feito isto, digitalizouse o trabalho e concluí-mo-lo no computador. Nesta etapa apenas foi realizada pequenas alterações de cor e acrescentada a tipografia. O lettring foi feito à mão pela equipa, fotografada, tratada no computador e então colocada no convite. O trabalho final foi partilhado no Instagram do estúdio. Para a segunda parte do trabalho, tería-mos que criar três GIF’S que fossem partilhados nas redes sociais a cada dia da feira. O primeiro dia mostraria apenas as três mesas da coleção. No segundo dia, várias
31
combinações entre as diferentes mesas e para o último dia, uma mesa com vários objectos inseridos. Para a realização dos GIF’S, utilizou-se ilustrações de todas as mesas e de objectos, com um movimento de reflexo horizontal.
Análise Crítica Este projectou auxiliou-me em diversos aspectos e funcionalidades do programa Adobe Photoshop. Apercebi-me que, para realizar um bom trabalho, o uso do computador e de sotfwares não é essencial. Nunca tinha feito um projecto somente em artes plásticas mas com a participação neste projecto, apercebi-me que isto torna um trabalho mais pessoal. Assim, as minhas capacidades em artes plásticas e maneira de as ver, mudou.
Recursos utilizados Para realizar este projecto, foram utilizados vários suportes em papel e desenhos a caneta. Também utilizou-se o Adobe Photoshop e Adobe Illustrator.
32
Resultados obtidos
Figura 27 - Convite
33
Figura 28 - GIF 1
34
Resultados obtidos
Figura 29 - GIF 2
35
Figura 30 - GIF 3
36
De 15 de Abril a 29 de Abril de 2016
Projecto número 6: “Caixas Harmony”
Criar uma nova imagem gráfica para a caixa de productos da empresa “Harmony”
Brienfing Este projecto foi-nos entregue por uma sub-marca da empresa Peronda, chamada Harmony. Tinha-mos que elaborar uma nova imagem para as caixas de transporte de produtos. Tería-mos que utilizar uma linha mais simples e cores escuras porque, como é uma caixa de transporte de mercadorias é provavel que esteja exposta a mais sujidade e danos físicos. A caixa tem uma dimensão de 32x32cm, com uma altura de 12cm. Este novo layout era necessário porque houve um re-design do logo da marca e decidíu-se também mudar o grafismo da caixa.
Conceitos Criar um grafismo simples e elegante; Cores planas e escuras;
Metadologia: Começou-se a elaboração deste projecto por estudar a antiga caixa da sub-empresa e identificar os aspectos menos bons e que poderiam ser melhorados. Percebeu-se que, a antiga caixa era muito elaborada a nível de cores e grafismos, o que tornava os custos de produção elevados. Após isto, começou-se por elaborar alguns estudos com um layout mais simples e limpo, com o máximo de duas cores básicas. Os estudos iniciais tinham um padrão liniar e fundo branco com apenas os símbolos e informações legais do producto e da caixa. Também elaborou-se outros estudos só com cores planas e uma margem branca nas extremidades. Estes estudos foram enviados à empresa com todas as medidas correctas e devidas identificações das cores. Recebido o feedback, realizou-se pequenas alterações nas informações legais e fez-se mais dois estudos finais, com duas cores distintas. Uma caixa com as molduras brancas e como cor base, cinzento claro e outra com as mesmas bordas mas com azul escuro. Aproveitou-se também para fazer uma nova organização dos elementos (símbolos, textos e logos) para um layout mais limpo e organizado. Depois de enviado estes dois estudos, a empresa escolheu a caixa com a cor mais escura. O projecto foi aprovado e posto em produção.
37
Análise Crítica Com a elaboração neste projecto, consegui aumentar a minha capacidade de síntese e simplificação. O facto de ter de criar um layout simples a partir de um projecto já feito e muito trabalhado, permitiu-me aumentar a minha capacidade de criação. Inicialmente tornou-se um pouco difícel mas depois com todo um trabalho de pesquisa e a realização de vários estudos, tornou-se mais fácil chegar a um trabalho final positivo. Este projecto tinha datas de entrega um pouco apertadas e isto só intensificou a dificuldade na sua realização.
Recursos utilizados Elaborou-se este projecto com o uso do software Adobe Ilustrator.
38
Resultados obtidos
Figura 32 - Evolução do logotipo
Figura 31 - Antigo layout da caixa
39
Figura 33 - Novos layout’s apresentados
40
De 17 de Abril a 24 de Abril de 2016
Projecto número 7: “8º Encontro de CDM”
Criação de um cartaz para o oitavo encontro de CDM
Brienfing Este projecto consistia na realização de um cartaz para o oitavo encontro de CDM, na Escola Superior de Educação. Havia total liberdade na execução do cartaz a nível gráfico e estético.
Conceitos Design atractivo e simples;
Metadologia: Começou-se a elaboração deste projecto por realizar uma pesquisa de cartazes para eventos. Depois de realizadar a pesquisa, começou-se então a fazer esboços à mão para depois, passar à elaboração do cartaz final no computador. Após alguns estudos, concluíu-se o cartaz. O projecto final mostra duas chávenas de café organizadas de modo a criarem um “8”. Os texto foram dispostos discretamente nas extremidades do cartaz.
41
Análise Crítica Com a elaboração neste projecto, as minhas capacidades em design gráfico foram estimuladas. O facto de criar um cartaz sem indicações prévias deume capacidade para desenvolver a minha criativação. Inicialmente tornou-se difícel começar este projecto mas depois de realizada a pesquisa e feitos alguns estudos, tornou-se mais fácil a sua execução. As datas de entrega também foram cumpridas, apesar de haver pouco tempo para a realização do cartaz.
Recursos utilizados Elaborou-se este projecto com o uso do software Adobe Ilustrator.
42
Resultados obtidos
Figura 34 - Cartaz apresentado
45
Capítulo 3: Conclusão
Feitos os três meses de estágio, posso concluir que este período de aprendizagem foi importante para mim porque adquirí novos conhecimentos e permitiu-me aumentar as minhas capacidades em diversas áreas. Ter a oportunidade de estagiar num ambiente de trabalho com profissionais excelentes revelou-se muito enriquecedor. Tive a oportunidade de crescer profissionalmente com diversas situações e isto mudou a minha opinião sobre o mercado de trabalho. Também houve a oportunidade de crescer a nível pessoal por interegir com pessoas novas, num país novo e de diferente língua. Quando começei o estágio houve várias dificuldades a nível pessoal e profissional. O facto de ter de falar um idioma que não dominava e de trabalhar num ambiente desconhecido foi estranho mas com o apoio da equipa, superei as minhas dificuldades. Posso dizer que esta experiência foi importante para a conclusão da minha licenciatura por ensinar-me a lidar com situações fora da minha zona de conforto.
47
Bibliografia / Webgrafia
Wong, Wucius, (1998), Principios de Forma e Desenho, Elementos básicos e aspectos do Design; Keith Bryant, The Principles of Typography: Back to Basics, consultado a 18 de Junho de 2016 em: https://speckyboy.com/2013/06/13/the-principles-of-typography-back-to-basics-2/ Sean Canha, O que é design?, consultado a 18 de Junho de 2016 em: http://criativosfera.com/aula-01-o-que-e-design/ Sean Canha, Processos do design?, consultado a 18 de Junho de 2016 em: http://criativosfera.com/aula-03-processos-do-design/ Sean Canha, Principios dos design, consultado a 18 de Junho de 2016 em: http://criativosfera.com/aula-05-principios-do-design/ Shillington, What is Graphic Design?, consultado a 18 de Junho de 2016 em: http://www.shillingtoncollege.co.uk/graphic-design-course/what-graphic-design Juliette Cezzar, What is graphic design?, consultado a 18 de Junho de 2016 em: http://www.aiga.org/what-is-design/ Gabriele Santana, Áreas do Design Gráfico – Design Editorial, consultado a 19 de Junho de 2016 em: http://www.cardquali.com/areas-design-grafico-design-editorial/ Editorial design, consultado a 19 de Junho de 2016 em: http://www.designishistory.com/design/editorial-design/ Jen Hawkyard, What is Web Design?, consultado a 19 de Junho de 2016 em: https://www.treefrog.ca/what-is-web-design Raw image format, consultado a 23 de Junho de 2016 em: https://en.wikipedia.org/wiki/Raw_image_format
48
Margaret Rouse, JPG File Format, consultado a 23 de Junho de 2016 em: http://whatis.techtarget.com/fileformat/JPG-JPEG-bitmap GIF, consultado a 23 de Junho de 2016 em: https://en.wikipedia.org/wiki/GIF PNG, consultado a 23 de Junho de 2016 em: https://pt.wikipedia.org/wiki/PNG Web template, consultado a 23 de Junho de 2016 em: https://pt.wikipedia.org/wiki/Web_template Kerning, consultado a 23 de Junho de 2016 em: https://en.wikipedia.org/wiki/Kerning
51
Anexos
Figura 1- A forma
Figura 2- A Cor
Figura 3- A Textura
52
Figura 4- A massa
Figura 5- A linha
Figura 6- Alinhamento
53
Figura 7- EquilĂbrio
Figura 8- Contraste
Figura 9- Proximidade
55
Glossário
RAW: Raw image file; JPEG: Joint Photographic Experts Group; GIF: Graphics Interchange Format; PNG: Portable Network Graphics; Templade: Modelo pré-definido, molde que é utilizado para fazer algo; Kerning: Processo de ajustamento do espaço entre os caracteres de um tipo de letra; Responsive Web Design: Forma de projectar sites com optima visualização e intereção em diferentes suportes; Fluid Grids: Forma de re-dimensionar elementos de uma página web em percentagem;