Área de
Criação Edição 1 - Ano 1 | Setembro/Outubro 2012
Design integral para comunicação
visual
Nesta edição: Editoração e diagramação | Design de superfície | Design de interação | Critérios de validação de sites e blogs | E muito mais!
CRÉDITO: SXC (BANCO DE IMAGEM)
GRÁFICA Serimaster Comunicação Visual Planalto | Belo Horizonte | MG (31) 3494-7170
E
Ilustração PAGINA 6 Design Editorial PAGINA 8 De Superfície PAGINA 10 De Interação PAGINA 12 Tecnologia PAGINA 14 Portfólio PAGINA 16 Fotografia PAGINA 18 Identidade Visual PAGINA 20 Impressão PAGINA 22
Expediente
EDITORIAL
Tipografia PAGINA 4
Apuração
O conteúdo desta revista teve como fontes: - aulas do Bruno Assad na disciplina Hipermídias (Oficina Gráfica 4) do curso Técnico em Comunicação Visual do Cecoteg/Senai- MG (2°/2012); - aulas do Rangel Sales na disciplina Diagramação do curso Técnico em Comunicação Visual do Cecoteg/Senai-MG (2°/2012); - livro Design de Interação - Além da interação homem-computador, de Jennifer Preece, Yvonne Rogers e Helen Sharp, Editora Bookman; - sites, em especial design.blog.br, que virou referência em conteúdo de planejamento visual e demais temas importantes do design.
Projeto elaborado para a disciplina Diagramação do curso Técnico em Comunicação Visual, do Centro de Formação Profissional ‘Sérgio de Freitas Pacheco’ - Cecoteg, do Senai-MG. Aluno: Jamerson Costa Turma: TCV-58-Noite Período: 2° semestre de 2012 A diagramação está baseada em conceitos e técnicas apredidos nas aulas de Rangel Sales. O conteúdo foi apurado em aulas anteriores, livro e sites. As fotos foram retiradas de banco de imagens gratuitos ou sites, e neste último caso permanecerão publicadas apenas na fase inicial e acadêmica da revista.
Revista Área de Criação | Setembro-Outubro de 2012 - PÁGINA 3
CAPA: ILUSTRAÇÃO JAMERSON COSTA
Sumário
sta revista que você tem em mãos e/ou diante dos olhos foi projetada como trabalho final da disciplina Diagramação do curso Técnico em Comunicação Visual do Cecoteg/Senai-MG. A proposta era desenvolver habilidades no software Adobe InDesign e técnicas de diagramação, com a preparação de uma publicação editorial impressa, dividida em seções que contemplassem conceitos básicos de Design Gráfico, como você vê no Sumário ao lado. Após uma pesquisa em fontes diversas, como aulas do curso e sites (destaque para design. blog.br), os temas foram aplicados em uma primeira versão da revista. Assim que começou uma nova disciplina, Hipermídias, e dado o interesse do editor, a proposta mudou para uma abordagem dos mesmos temas, mas com aplicação específica para o Design de Interação, aplicado em mídias digitais. Eis o resultado, a criação da InBox!
TIPOGRAFIA
D e q u e
T I P O
v D a i s e r ?
Por Jamerson Costa
ois pontos principais. Um, existe uma diferença entre “tipografia” e “tipologia”. A tipografia é o uso dos tipos, como são conhecidas as “fontes” ou “estilos de letra”, escolhidos para formatar um texto. A tipologia, como indica o final “logia”, de logos, ou conhecimento, trata do estudo dos tipos (ou fontes ou então estilos, termos de uso mais comum). Ou seja, se dedica ao conhecimento de quais famílias tipográficas mais indicadas para determinados projetos, além da elaboração de novos formatos de letras. Em segundo lugar: o termo tipografia veio de uma época distante da atual era digital e surgiu do uso dos “tipos” móveis, peças usadas na impressão gráfica das máquinas de prensa usada há séculos. A “prensa”, como indica o nome, prensa a tinta no papel, por meio de uma mecânica de bobinas com borrachas na superfície, que tomavam contato com o papel ou qualquer suporte plano semelhante. A impressão com tipos está sendo substituída há tempos e sua aposentadoria foi decretada com os sistemas informatizados. A criação de tipos, no entanto, continua a todo o vapor e proporciona ao designer de tipos trabalho para clientes que querem, a cada dia, melhorarem as características visuais e funcionais das letras usadas em seus projetos. Afinal, o mundo cada vez mais visual precisa de novos formatos para apresentar suas palavras ao mundo - o que inclui de um logotipo comercial até textos. A diferença é que, agora, está o processo criativo está qua-
PÁGINA 4 - Revista Área de Criação | Setembro-Outubro de 2012
se que todo sendo feito no meio digital, em computador. Além do uso se destinar em grande parte das vezes aos meios eletrônicos. O que, por si só, se torna um tema de destaque para estar aqui, na REVISTA ÁREA DE CRIAÇÃO Design integral para comunicação visual.
Em todos os cantos possíveis e imagináveis
Existem vários tipos de letras e eles são facilmente encontrados em qualquer software que permita a edição de textos no computador. O mais usado é o Microsoft Word, que tem um conjunto de estilos para serem usados. Ao formatar o texto para um alinhamento justificado, um tamanho (chamado de “corpo”) 10 ou 12 e uma letra Arial ou Times New Roman, está-se formatando a fonte. Arial e Times, aliás, são as mais conhecidas dos usuários do software de edição de textos da Microsoft (o Word), mas um clique na seta que aponta para baixo, ao lado dos estilos, mostra uma variedade de opções: Verdana, Futura e muitas outras. Em geral, textos para trabalhos de faculdade ou documentos burocráticos padronizaram o Times. Para outros, como relatórios domésticos, postagem de conteúdo na internet (quando o site permite a edição da fonte) e diferentes situações, uma busca por tipos variados pode resultar em uma peça esteticamente mais atraente - ou seja, mais bonito.
Apenas três observações
A escolha pela fonte ideal para o trabalho funciona basicamente no sistema de tentati-
Homem-Aranha) e a DC Comics (do Super-Homem e Batman) são as maiores editoras de quadrinhos do mundo e usam Comic Sans nos balões de fala dos personagens. A letra surgiu para ser jovem, alegre e divertida, o que prova que as fontes têm personalidade. O uso nos HQs (sigla para histórias em quadrinhos, ou comics, se preferir) é notável: mas seu rapto para um documento sério (a escritura de uma casa), um relatório que suscite respeito (o parecer de um juíz) ou uma marca que busca mostrar idoneidade no mercado. O alerta é tanto que, entre designers e demais comunicadores visuais, dizem que “se quer ser levado a sério, não use Comic Sans”. Em geral, o dito vem acompanhado de imagens de empresas e arquivos oficiais em que a fonte foi usada, ao redor do mundo, o que mostra que muita gente se confunde na escolha da letra adequada. Portanto, evite!
referente ao uso de letras com serifa ou sem serifa. Basicamente, serifas são as hastes continuações das extremidades das letras, como a base do “L” e as pontas do “H”. Elas existem em determinadas fontes, o que as distinguem das sem serifa. A divisão cria a principal separação em dois grupos. Mais uma vez, vamos lembrar das duas fontes mais usadas, Arial e Times New Roman. A Arial é exemplo de letra sem serifa: mais arredondada, suave e, principalmente, sem hastes. São ideais para internet, pois são mais agradáveis - o que precisa ser levado em conta, já que a tela do computador cansa a visão mais rapidamente, pois emite luminosidade diretamente nos nossos olhos. A Times, por outro lado, tem serifa (as hastes), o que melhora a leitura de textos impressos e longos, como jornais e livros.
Abaixo, conjunto de tipos móveis (que, na imagem, formam a palavra type, em inglês). Os tipos móveis foram usados nas máquinas de prensa mecânica, sistema que possibilitou o surgimento da imprensa e a publicação de livros em larga escala. A partir deles que se criou a ideia de forjar letras de formas diferentes.
Com serifa ou sem serifa?
Não, a pergunta não é feita na fila de um fast food de sanduíche natural ou algo assim. A questão tem natureza na tipografia (uso dos tipos, ou letras, nos trabalhos gráficos) e na tipologia (estudo dos tipos, ou letras, mais apropriados, das suas origens e do surgimento de estilos novos). O terceiro ponto é
Aqui, tratamos “tipos”, “fontes” e “estilos” com o mesmo significado, por ser este o uso comum, de fácil assimilação. Em Design Gráfico, cada termo tem uma função específica e aparece também o conceito de “família tipográfica”.
Revista Área de Criação | Setembro-Outubro de 2012 - PÁGINA 5
CRÉDITO: SXC (BANCO DE IMAGEM)
va e erro: seleciona-se a palavra, frase ou parágrafo, clica-se nos estilos e vai-se alterando uma a uma, até encontrar uma interessante. Certas observações, entretando, podem ser levadas em consideração. A primeira, os nomes das fontes têm a ver com sua natureza, criação ou utilidade. O que isso quer dizer é que a Times New Roman tem mesmo uma proximidade com Roma: ela foi criada a partir do modelo romano de letra - e por extensão de todo o modo romano de comunicação visual, como arte ou como arquitetura. Assim, uma fonte Candida pode sim ser usada no convite para o culto na sua igreja. Se ficou bonita, combinou com o visual da peça (um cartaz, por exemplo) e pareceu uma boa escolha, o nome pesa a favor. Neste caso, basta lembrar que os nomes geralmente estão em inglês, mas muitos deles se aproximam de um mesmo significado em português, como nos casos de Times Roman e Candida. O segundo ponto é exatamente quando a fonte não combina, é para evitar uma gafe, é preciso basicamente prestar atenção ao nome. A fonte mais crucifixada é a Comic Sans. É bonitinha, agradável e também muito alegre. Essa é exatamente sua falha e o que a impede de ser usada em todo e qualquer documento. Pelo menos, evitada. A Comic Sans surgiu dos “comics”, como são chamados os quadrinhos nos Estados Unidos. A Marvel Comics (dona do
ILUSTRAÇÃO
Elementos básicos para ilustrar Para o meio digital ou para o meio gráfico, a ilustração segue certos parâmetros e compreende determinados elementos. O desenho, de qualquer forma, existe antes de haver um meio virtual - não físico. O conhecimento de pelo menos um pouco de artes plásticas e conceitos básicos ajuda na realização de um trabalho de melhor qualidade. Em um artigo no site design.blog.br, Robson Godoy explica esses elementos. “É de vital importância conhecer e compreender todos os elementos da forma, para que possamos usá-los a nosso favor. Neste caso, estou usando como base a classificação de Wucius Wong (Princípios de forma e desenho)”, destaca Robson Godoy. Confira um resumo.
Wucius Wong classifica os elementos do desenho em 4 grupos: Elementos conceituais: Ponto - Linha - Plano - Volume Elementos visuais: Formato - Tamanho - Cor - Textura Elementos relacionais: Direção - Posição - Espaço - Gravidade Elementos práticos: Representação - Significado - FunçãoW
PÁGINA 6 - Revista Área de Criação | Setembro-Outubro de 2012
Ilustração sobre fotos (da folha e da mão) de Jamerson Costa, trabalhadas no Photoshop.
Para conferir os detalhes de cada elemento da ilustração (e válidos para desenhos à mão ou digitais), divididos nos quatro grandes grupos destacados por Robson Godoy citando Wucius Wong - confira o post “Teoria Básica do Design” em design.blog.br.
Revista Área de Criação | Setembro-Outubro de 2012 - PÁGINA 7
DESIGN EDITORIAL CRÉDITO: SXC (BANCO DE IMAGEM)
Mais uma possibilidade Najara Lopes Do site design.blog.br Quem nunca passou por uma situação dessas? Ou viu uma capa de livro ou revista que você pensou “como um diretor de arte deixou que isso saísse?”. Pois é, tudo isso é design editorial. Desde a escolha do formato, grid, tipografia, cores etc., de uma publicação, faz parte do design editorial, além de ter em vista fatores como público, porque não podemos fazer uma diagramação super despojada, com neons piscantes, por exemplo, em um livro de medicina. E é claro, as famosas, limitações técnicas e econômicas da produção. Mas para quem imagina
que nesse mercado só tem espaço para diagramadores ou capistas, está bem enganado, essa é uma área bem abrangente do design. Que busca desde ilustradores até programadores, agora com a vinda dos e-books, e não só para trabalhos internos, como freelas também. Esse nicho vem se tornando maior e mais independente, na medida em que cresce a demanda de materiais editoriais, como livros e revistas, além dos processos de redesign de vários materiais tradicionais. Bom pessoal, espero que tenha dado para mostrar um pouquinho do que é o de-
PÁGINA 8 - Revista Área de Criação | Setembro-Outubro de 2012
sign editorial e aberto mais uma porta em um mercado tão amplo e competitivo quanto o nosso. E para reforçar deixo um trechinho do livro Jornalismo de revista, escrito por Marília Scalzo. Design de revista não é arte [...] Design em revista é comunicação, é informação, é arma para tornar a revista e as reportagens mais atrativas, mais fáceis de ler. Tanto quantos aos jornalistas, os designers devem estar preocupados o tempo todo com a melhor maneira – a mais legível.
Dicas de editoração e diagramação
Por Rangel Sales Do site rangelsales.com.br/blog
Documentos com páginas de formatos variados no ID CS5
Olá! Essa dúvida veio do leitor José Carlos, o ZeKa, e acredito que deve ser compartilhada por vários: Como redimensionar as páginas de um mesmo documento no ID CS5? Para responder, mostrarei o exemplo de sua utilização, pois muitos também não veem utilidade nisso. Na diagramação da capa de um livro com lombada, por exemplo, a página de formato diferente pode ser a lombada, a guarda, a orelha e assim por diante: Primeiro passo: Na paleta pages, no menu pop-up, desmarcar a opção “Allow document pages to shuffle”. Isso permite que as diversas páginas do documento sejam perfiladas, uma ao lado da outra. A seguir, utilize a nova ferramenta “Page tool”. Clique sobre a página e no menu de contexto e nsira a dimensão desejada. Pronto! Clique sobre a página com a ferramenta “Page tool” e redimensione-a. Para ganrantir que o PDF de seu documento seja gerado da maneira correta, marque a opção “Spread” ao imprimir ou exportar seu documento para PDF. O “Spread”, ou espelhamento, garante que o layout seja preservado e que as páginas
permaneçam lado a lado e seu layout seja preservado.
Editoração na era das revistas digitais
A mídia digital tem linguagem, dinâmica e aspectos estruturais e ergonômicos próprios. Um exemplo de projeto editorial desenvolvido em função da nova mídia é a versão digital da revista Wired. Em parceria com a Adobe, toda a estrutura da publicação foi adaptada ao novo meio, potencializando os recursos digitais e explorando-os em função dos leitores.
Guias e Linhas de Base no InDesign
A diagramação começa e depara-se com o maior desafio: a página em braco. Distribuir os elementos em uma página pode ser uma tarefa complicada caso não se utilize um conjunto de guias. Imagine distribuir de maneira uniforme as 32 peças do jogo de xadrez sobre um tabuleiro sem as 64 casas. Portanto, as guias servem para garantir uniformidade e ergonomia à diagramação, além de facilitar funções de alinhamento e distribuição dos elementos gráficos. Depois de definidas as margens, quantidades de colunas e a distância entre elas - na criação de um novo documento - é possível criar guias com valores específicos no menu “Layout” e “Create guides”. É
possivel ainda definir se a origem das linhas será a página ou a área interna das margens e, por fim, em quantas colunas será dividida a página, assim como é feito na criação do documento. A distribuição dos elementos do projeto gráfico é simplificada, além da possibilidade de alinhar objetos sem a necessidade da ferramenta “Allign”. Uma outra opção de guias é a “Baseline grid”, Linhas de Base. Esta função habilita um conjunto de linhas semelhantes às pautas de um caderno, e possibilita o alinhamento vertical do texto. Com elas, mesmo que a caixa de texto mude de posição na página, os textos permanecerão alinhados. Em primeiro lugar, é necessário visualizar tais linhas, no menu “View”, “Grids and Guides” e “Show baseline grid”. Agora que seu documento possui “pautas”, os próximos passos são: alinhar o texto à Baseline Grid e configurá-lo de acordo com seu projeto. Primeiro, seleciona-se o texto e ativa-se as opções de parágrafo na barra de controle e, a seguir habilita-se a opção “Allign to base”. Para configurar a Baseline grid, de acordo com as necessidades do projeto gráfico, o caminho é o menu “Edit”, “Preferences” e “Grids”. As guias oferecerão maior uniformidade ao processo de diagramação, com a função automática de alinhamento.
Revista Área de Criação | Setembro-Outubro de 2012 - PÁGINA 9
DESIGN DE SUPERFÍCIE
Aplicações e restrições Estampas, rapports, módulos, telas. Você conhece essa área do design?
Robson Godoy Do site design.blog.br
De uma forma bem simples, o design de superfície engloba a criação de imagens para superfícies, que são criadas de forma que possam ser repetidas indefinidamente no suporte. O design de superfície é uma das áreas mais vastas do design, uma vez que pode ser aplicado sobre praticamente qualquer formato, de inúmeras maneiras. No entanto, ainda existem poucas referencias bibliográficas sobre o assunto. A Prof. Evelise Ruthschiling coordena uma linha de pesquisa na UFRGS (Universidade Federal do Rio Grande do Sul) sobre design de superfície, e é uma das melhores fontes de informação sobre o assunto. As principais representantes desta área do design, são as estampas, figuras com possibilidade de infinitas repetições. Além delas também temos as texturas. Estampa e textura são elementos semelhantes, e é comum haver uma confusão para diferenciar as duas. A maior
diferença entre elas, é que na textura, os componentes constituem um unidade visual muito grande, ou seja, nenhum elemento se sobrepõe aos outros.
Aplicações
Uma estampa pode ser reproduzida sobre praticamente qualquer material. Embora a
associação com moda seja quase que imediata, estamparia é uma técnica largamente utilizada no design gráfico em geral e também em web design (o próprio
fundo do Design.Blog tem uma textura). Outra aplicação bem vasta é na cerâmica. Não só em utensílios, mas em cerâmicas de revestimento. Hoje em dia existe uma variedade gigantesca de cerâmicas e porcelanatos no mercado, sendo essa uma área interessante de ser explorada por designers. O design de superfície em projeto cerâmico é uma das melhores praças de trabalho para quem quer trabalhar com superfície. Embora não existam muitos cursos profissionalizantes na área, o mercado cerâmico é mais fácil de ingressar que o concorrido mundo da moda, e é muito mais valorizado que os demais ramos da estamparia. Uma grande exigência das empresas que trabalham com estamparia, principalmente em papel, é a escassez de profissionais que conheçam não apenas o processo de criação de uma estampa, mas principalmente a parte técnica do projeto, restrições físicas, etc.
Evelise Ruthschilling, um dos principais nomes no estudo de Design de Superfície no Brasil hoje, define a área da seguinte forma: Design de Superfície é uma atividade técnica e criativa cujo objetivo é a criação de imagens bidimensionais (texturas visuais e tácteis), projetadas especificamente para a constituição e/ou tratamento de superfícies, apresentando soluções estéticas e funcionais adequadas aos diferentes materiais e processos de fabricação artesanal e industrial (RÜTHSCHILLING, 2006)
PÁGINA 10 - Revista Área de Criação | Setembro-Outubro de 2012
Nesta página, um ‘rapport’, que representa a repetição de um módulo (no caso, as flores vermelhas com detalhes azuis). Este trabalho foi confeccionado por Jameson e Fernanda em Oficina Gráfica 3 - Design de Superfície , no primeiro semestre de 2012. Na página ao lado, módulo baseado no mesmo modelo, mas com efeito de textura.
Revista Área de Criação | Setembro-Outubro de 2012 - PÁGINA 11
DESIGN DE INTERAÇÃO
O que é design de Interação? As interfaces digitais estão a cada dia mais presentes em nosso cotidiano O mercado atual se baseia a tempos em tecnologia computacional e nas últimas décadas isso tem aumentado de maneira excepcional, gerando demandas funcionais e emocionais dos usuários e consumidores. A variedade de novas interfaces abriu uma nova lacuna no nosso modo de pensar: “como os usuários se relacionam com os produtos e serviços digitais sob o ponto de vista da experiência?” O design de experiência de usuário é o estudo da teoria do projeto de serviços, produtos e comunicação visual em seus aspectos subjetivos no uso, na comunicação e principalmente nas áreas cognitivas e psicológicas. É uma área de trabalho em plena expansão e com uma crescente demanda pelo desenvolvimento de interfaces e serviços digitais que consideram não apenas a execução funcional da ferramenta, mas também a identidade visual e a experiência que o usuário terá junto a interface que foi desenvolvida. Dada a variedade de aplicações do design digital, conclui-se que desenvolver uma metodologia ou um processo rígido de projetar interfaces é
Thiago Roberto Kolodge Do site design.blog.br
inviável. Cada tipo de produto, negócio, serviço tem uma demanda diferenciada, e estas necessitam de técnicas diferentes de pesquisas e projetos para que
A variedade de novas interfaces abriu uma lacuna: “como os usuários se relacionam com os produtos e serviços digitais?”
seja criado um vinculo significativo entre o usuário, a interface e o serviço, assim criando uma melhor experiência junto a estes.
PÁGINA 12 - Revista Área de Criação | Setembro-Outubro de 2012
Usabilidade na web
Usabilidade refere-se ao grau em que o usuário final consegue realizar uma tarefa em uma interface tangível ou intangível. Baseia-se em funcionalidade correta, eficiência de uso, facilidade de aprendizagem, tolerância a erros de usuários e satisfação subjetiva. Porque Usabilidade na web? Com uma enorme oferta de alternativas, o usuário tem uma notável impaciência e insistência em gratificação imediata. Uma vez que o usuário tenha um preceito em relação a interface, ele não mudara facilmente de ideia. Por exemplo, se o cliente não encontra informação ou produto desejado em site de compras, provavelmente não comprará. Deve ser levado em consideração que “quem clica no mouse decide tudo” e é muito fácil ir a outro site e comprar com um concorrente direto. Sendo assim, o papel da usabilidade em um site de comprar afetaria direta e indiretamente na economia do serviço e deve se levar em consideração que em produtos e softwares tradicionais, o usuário paga antes e experimenta depois, na interface digital.
Arquitetura de informação para meios digitais
Clareza na arquitetura da informação É essencial que o usuário consiga diferenciar o que é prioritário e o que é secundário na interface. O site deve constar com um arranjo adequado de informação e com uma hierarquia pré-definida e trabalhada, informações estruturadas e previamente localizadas.
A simplificada troca de informações e exposição de conteúdo objetivo ao site. O Enfoque editorial, que inclui o planejamento da experiência do usuário e o modo como a informação será passada. A Antecipação dos padrões de conduta do usuário em relação a navegação. Relação adequada quanto a profundidade das áreas de informação. Modo como as informações fluem dentro de uma organização simples tornando a assimilação adequada aos usuários. Uma estrutura de informação de linguagem simples e organizada, estabelecendo canais de comunicação com os usuários individualizados, procurando antecipar os assuntos mais procurados, e criando ponto de acessos visíveis a estes.
Revista Área de Criação | Setembro-Outubro de 2012 - PÁGINA 13
CRÉDITO: SXC (BANCO DE IMAGEM)
A concepção detalhada de caminhos prédefinidos para o usuário chegar facilmente a informações se baseia em modelos conceituais como os que são apresentados aqui ao lado, nesta página
TECNOLOGIA
Critérios para c Parâmetros para analisar a validade de um site ou blog é fundamental para quem está entrando no mercado de web design
Por Jamerson Costa Com informações do site analiseblog.com
Você tem um professor de Hipermídias que pede para a turma criar uma site? Tudo bem, mas e quando 95% da turma nunca criou um site, quais os parâmetros a seguir? Nos próximos parágrafos, você encontrará uma avaliação feita pelo portal analiseblog.com, que revela critérios para testar a validade de um site ou blog. No caso, a página verificada doi a do portal O Gestor (ogestor.eti.br), considerado por eles “um dos melhores blogs de tecnologia do Brasil”. Os critérios usados neste exemplo podem ajudar você a definir tanto uma boa página para visitar, quando se seu projeto está ficando bom, precisa melhorar em determinado aspecto ou, melhor ainda, balizar seu trabalho antes de começar o projeto.
Avaliação
CRÉDITO: SXC (BANCO DE IMAGEM)
Um dos melhores blogs de tecnologia do Brasil e com quase tudo que se precisa saber sobre TI, O Gestor tem todo potencial para ser referência nessa área. Layout: Uma prova de que um bom layout não precisa de ser bastante complexo, apenas original e único. O diferencial se
encontra em quase tudo, desde o simples jogo de cores aos ícones que apontam para as principais páginas. O pequeno probleminha do layout é que não basta um ícone para chamar atenção: atualmente, a caixa de fãs é indinspensável em blogs, por mais pequena e discreta que seja. Conteúdo: Com certeza, este é o forte do blog, que segue à risca o ditado que diz que o conteúdo é rei. Muito bem escrito, destacado, espaçado e detalhado, com links que apontam para outras paginas do blog. No entanto, algumas imagens estão em péssima resolução e isso tem um impato negativo para os leitores. Tráfego: O numero de artigos e seguidores com certeza ajuda no tráfego que é razoável, comparado com a média dos blogs. O usuário poucas vezes vai além da página em que cai, e o tempo de permanência é de mais de um minuto, o que é bom, considerando que a média é de 33 segundos. Mas, se quer monetizar, tem que manter mais os leitores no blog. Impacto Social: A página de fãs está crescendo, mas pelo tempo na blogosfera e pela qualidade do blog, isso poderia ser maior. O trabalho no Facebook ainda deve melhorar bastante,
PÁGINA 14 - Revista Área de Criação | Setembro-Outubro de 2012
para que consiga mais fãs. No Twitter, tem um bom número de seguidores e frequência de postagens, mas precisa responder mais a tweets individuais e conseguir alguma citação (alguém mencionar seu blog) para aumentar a popularidade por lá. A caixa de assinantes, como disse pode melhorar e tornar mais atraente. Navegação: O blog é fantástico no quesito compatibilidade, com plugins e CSS móvel e um botão Apple, que torna ele bastante amigável. A acessibilidade também é muito boa, mas o tempo de carregamento ainda pode melhorar bastante. SEO: Para começar, vou complementar o assunto das imagens, alertando que menos de metade está corretamente descrita. Olhando para o tamanho do blog, o importante agora seria atualizar o conteúdo antigo, editando e mudando as palavras-chave, bem como as imagens, que trazem boa percentagem de tráfego. O Twitter e Facebook também devem ser trabalhados: note que um “like” pode trazer 20 ou mais visitas, então cuide da página de fãs e de seguidores e, ainda, responda a tweets individuais para ser mais social. Se apresente também no Google Plus (G+), que facilita pesquisas.
CRÉDITO: SXC (BANCO
DE IMAGEM)
licar em um blog
Revista Área de Criação | Setembro-Outubro de 2012 - PÁGINA 15
PORTFÓLIO
Como fortalecer Ter relações profissionais fortes é de suma importância para abrir portas
Robson Godoy Do site design.blog.br O primeiro passo é: entenda o cliente e faça aquilo que ele precisa. Se “apaixonar” por alguns projetos, e querer fazer um trabalho para o nosso portfólio, e não para o cliente, é comum no Design. No entanto, sempre devemos nos lembrar que não somos artistas e, logo, não devemos imprimir um estilo em nossos projetos. Entender o que o cliente realmente precisa e projetar para atender a estes requerimentos é o caminho. Realmente, projetar pensando na exposição do trabalho permite ao projetista (ou ao escritório) uma ótima fonte de publicidade, afinal, todos os trabalhos serão feitos visando promover os serviços. Em contrapartida, é provável que a empresa que está lhe pagando para fazer esse serviço tenha apenas prejuízo, afinal, as reais necessidades do cliente não foram levadas em consideração, sendo assim o projeto provavelmente não funcionará.
Manter uma relação ética e profissional
Esta talvez seja uma das piores coisas em qualquer profissão: se relacionar de forma profissional com os clientes. Quem trabalha como frelancer ou tem um escritório, sabe que
sempre que um parente ou amigo próximo pede um trabalho, é mais complicado cobrar um valor justo pelo trabalho, além de que laços de amizade e proximidade maior dificultam o andamento do projeto. Quando a relação com o cliente é muito grande, muitas vezes pode ser melhor não aceitar o projeto, pois misturar relações pessoais com profissionais pode acabar acarretando desavenças. Também é interessante manter uma relação profissional com os demais clientes, ou seja, manter contato com todos os clientes, mesmo depois de entregues, mas de preferência não criar laços que vão além do profissional (fazer grandes amizades com clientes pode não ser uma boa ideia). Manter uma relação ética com todos os seus clientes facilita a criação de laços de confiança, tão importantes no mercado de trabalho. A confiança do cliente em uma empresa, ou profissional, não se constrói da noite para o dia, mas se perde facilmente; por isso, nunca cometa faltas éticas com seu cliente, e sempre fale a verdade. Mentiras no ambiente corporativo não só corroem a confiança, como também podem acarretar punições legais.
PÁGINA 16 - Revista Área de Criação | Setembro-Outubro de 2012
Ninguém conhece melhor o público do seu cliente do que ele
Desenvolver um projeto exige conhecimento acerca do público de seu cliente, e ninguém conhece melhor esse público do que o próprio cliente. Seja humilde e converse sinceramente com o contratante de seus serviços, questione-o sobre o público do projeto, peça que ele lhe dê o maior número possível de informações a respeito do público alvo do projeto, de grande ajuda em projetos.
Manter relações duráveis
Como já mencionei em um post anterior, manter uma relação duradoura com os clientes, sem nunca perder o contato, podem lhe render vários outros trabalhos, além de um canal de divulgação de seu próprio trabalho. Por exemplo, você projetou um logo para a loja X, mas mesmo depois de entregue o projeto, continuou mantendo o contato com quem lhe pediu o logo. Digamos que o dono da loja X tenha um amigo que vai começar um novo negócio e precisa de alguém para desenvolver o material gráfico, quem você acha que provavelmente será recomendado?
CRÉDITO: SXC (BANCO DE IMAGEM)
laços com cliente
Manter uma relação duradoura com os clientes, sem perder o contato, pode render vários outros trabalhos, além de ser um canal de divulgação de seu próprio trabalho. Para ler o post completo, acesse o texto “Como fortalecer a relação entre cliente e Designer” no site design. blog.br.
Revista Área de Criação | Setembro-Outubro de 2012 - PÁGINA 17
FOTOGRAFIA
A foto fora do lugar comum Três dicas para suas fotos se destacarem da multidão Sempre comento que se destacar como fotógrafo hoje em dia é um desafio enorme. Encontrar informações de aprendizado gratuitamente na internet e comprar equipamentos cada vez mais baratos é uma vantagem para todos nós que não conseguiriam ser fotógrafos quando tudo era caro e difícil, mas também é uma desvantagem pois temos que competir com milhões de imagens criadas todos os dias. Somente no Flickr, são postadas mais de 4 milhões de fotos por dia! Muitas delas são tecnicamente perfeitas. Mas fazer uma foto com a fotometria correta e o foco cravado não é mais o suficiente. É o mínimo necessário! Separei 3 dicas que podem te ajudar nesta tarefa de criar fotos que se destaquem:
1. Mude o ângulo
Henri Cartier-Bresson buscava sempre fazer fotos na altura do olho e com uma lente normal (50mm) buscando assim o registro mais real de uma cena. Só que Bresson não “competia” com bilhões de fotos por dia. Hoje em dia ângulos menos
Claudia Regina Do site dicasdefotografia.com.br
utilizados vão, naturalmente, chamar mais atenção do que um ângulo na altura do olho. Sua tia faz fotos na altura do olho. Seu priminho faz fotos na altura do olho – todo mundo faz fotos na altura do olho por padrão, seja com o celular ou com a reflex. Se jogue no chão, suba na árvore ou chegue super perto. Fazer uma foto com ângulos menos conservadores pode te ajudar a criar uma imagem mais memorável.
2. Arrisque ideias maluquetes
Às vezes a gente tem ideias que parecem bobas mas que resultariam em fotos legais. Mas aí vem o medo de arriscar: o risco de sair uma foto não tão boa e precisar explicar pro cliente. O risco de perder tempo com uma ideia que não valia a pena. Sou muito a favor de planejamento mas às vezes ideias (planejadas ou não) precisam ser testadas para sabermos se funcionam. Em um ensaio recente eu tive a ideia de fotografar os noivos com as galinhas do sítio aonde estávamos. Arrisquei a foto e saiu um resul-
PÁGINA 18 - Revista Área de Criação | Setembro-Outubro de 2012
tado legal (não tão espetacular quanto eu esperava, mas valeu o exercício!).
3. Aposte nas emoções
Quando falamos de retratos uma foto pode ser muito especial mesmo que a composição seja conservadora e a situação não seja maluca. Para que isso seja possível é importante que façamos com que o observador se conecte com quem está na foto e isso só é possível com emoções. Fotos que transmitem emoções verdadeiras e especiais para o observador são mais interessantes do que fotos tecnicamente perfeitas em que o retratado está com “cara de bunda”.
Revista Área de Criação | Setembro-Outubro de 2012 - PÁGINA 19 CRÉDITO: SXC (BANCO DE IMAGEM) E INTERVENS’AO DE JAMERSON COSTA
IDENTIDADE VISUAL
Hierarquia visual de elementos
Uma das maiores frustações de leitores e internautas é quando o projeto não leva em direção a informação que precisam Fernando Rossetto Do site design.blog.br * adaptado Normalmente, problemas de visualização ou navegação, em sites, acontecem quando o volume da informação é grande. Para definir melhor o problema, a partir de agora o chamaremos de falta de heirarquia visual. Em outras oportunidades, já falei (no site design. blog.br) um pouco sobre isso. Mas, agora, pretendo aprofundar um pouco mais no assunto. A heirarquia visual propõe um caminho para a visua-
lização do conteúdo de acordo com a sua importância, comparada com as demais. Algumas palavras ou trechos são essenciais para o entendimento do contexto, ou seja, existem palavras que devem ser vistas primeiro, outras em segundo e assim por diante. Alguns elementos pesam graficamente mais que outros. Assim, a heirarquia visual tem um forte apelo para o design gráfico, os elementos com maior destaque guiam leitores e usuários para o resto das informações, de acordo com a sua evolução. Quando essa heirarquia visual é evidente e direta, o usuário navega pelo site, por exemplo, com grande clareza e objetividade, de
PÁGINA 20 - Revista Área de Criação | Setembro-Outubro de 2012
certa forma, isso é criar meios coerentes para que os usuários tenham uma boa experiencia durante a navegação.
Peso Visual
O peso visual dos elementos reforçam a heirarquia dos mesmos. Criando contrastes de cores, posicionamento e tamanho dos elementos, podemos atribuir mais importância para alguns objetos, como eu já citei em outro artigo, o UX bem feito se parece com uma conversa, flui naturalmente. No caso da heirarquia visual partimos do mesmo princípio, o conjunto visual é como se fosse uma narativa, se conseguirmos explicar bem os pontos chaves da história, ela é facilmente entendida e passada adiante. Por exemplo, não deixando espaço suficiente entre as linhas de texto, você pode criar uma seção visualmente densa.
CRÉDITO: SXC (BANCO DE IMAGEM)
Ao lado e na outra página, hierarquia de cores e tipos. Em geral, tipos com corpo maior chamam mais atenção - e são usados em temas mais relevantes. Nas cores, apesas siga a hierarquia usada na paleta de cores do seu projeto: se usa um determinada tom de cor para identificar uma editoria ou seção do site, mantenha isso durante todo o projeto.
O design de uma geração Por Jamerson Costa Da disciplina História do Design É evidente ao longo do filme Meu tio, do diretor Jacques Tatti, das apresentações de slides em sala de aula (no curso Técnico em Comunicação Visual do Senai-MG em Belo Horizonte, Módulo 2, no segundo semestre de 2012) e do texto “Indústria e sociedade no pós-guerra” - do livro Uma introdução à História do Design - a grande presença do design na vida da sociedade do pós-guerra. É evidente a presença do design de 1945 em diante. Obviamente, trata-se da sociedade dos países vencedores, desenvolvidos e industrializados e não qualquer sociedade. Mas isso vai além e é outra história. O que é importante salientar é como o design,
a tecnologia e o comportamento evidenciam uma geração, na França de Jacques Tatti ou nos Estados Unidos das primeiras peças da chamada Pop Art. O fato tem explicação. A vitória dos Aliados sobre os nazistas fez fortalecer o capitalismo. A sensação de se sair vivo de uma grande guerra contribuiu. O consumismo, a ode à tecnologia e o reforço dos modos de vida das sociedades vitoriosas foram cativados: curtidos e compartilhados, como se diz por aqui, hoje em dia. Formas e cores que lembrassem uma avançada e tecnológica sociedade consumista, na qual os negócios vão bem e satisfaz-se os desejos, são valorizados e chegam aos lares das famílias daquele período. Ao
mesmo tempo, a arte se inspira cada vez mais nos produtos de consumo em massa - filmes hollywoodianos, histórias em quadrinhos e sabão em pó. Tudo lembra o capitalismo, tudo lembra o consumo, tudo lembra a prosperidade. É possível dizer que o design, nessa época, vive uma revolução. É uma segunda onda, comparável à Revolução Industrial para o desenvolvimento da área. Mas, dessa vez, é a revolução do consumo, em que toda a técnica se apresenta mais às pessoas, às famílias, à sociedade. Casas modernas, desenhos coloridos, objetos de consumo transformados em arte: esse é o retrato da geração do pós-guerra.
Revista Área de Criação | Setembro-Outubro de 2012 - PÁGINA 21
Escolha do papel ideal é fundamental para que todo o trabalho possa ficar perfeito para o cliente Por Canha Do site design.blog.br Quem trabalha com design está acostumado com as diferenças entre os tipos de papéis e sabe muito bem qual a melhor aplicação deles. A escolha do papel ideal é fundamental para que todo o trabalho de criação e desenvolvimento possa ficar perfeito para o cliente, e para que a escolha seja a correta é preciso pensar no tipo de acabamento, na gramatura e tipo do papel bem como a tinta que será impressa. Se você possui alguma dúvida sobre os tipos de papéis disponíveis, confira:
Gramatura
Qualquer papel é identificado através da gramatura que varia entre 50 a 350 gramas e quanto maior a gramatura, mais caro custa o papel.
Cor
A cor, o grau de alvura bem como a opacidade do papel vai determinar para qual tipo de impressão ele será aplicado. Por exemplo, as tintas off-set possuem transparência e assim a cor do papel escolhido
por sofrer uma alteração de cor. Recomenda-se sempre usar um papel branco, pois assim você consegue obter a cor desejada.
Textura
A textura do papel é o aspecto dele como liso, telado, calandrados, etc. A textura vai depender da criatividade do designer, para saber qual é a melhor opção. Considerando a impressão off-set podemos dizer que quanto mais liso o papel, mais nítida será a impressão.
Tipos de Papéis
Off-set: Esta é a melhor opção de papel para quem busca uma impressão com cores vivas, nítidas e uniformes. Este papel possui bastante cola e sua superfície é uniforme, ou seja, é livre de felpas além de ser preparado para resistir à umidade. Agramatura trabalhada neste papel é de 90 gramas, se tornando uma excelente opção para quem busca uma impressão de qualidade com custo baixo. Aplicações: receituário, folhetos e miolo de livros e revistas.
PÁGINA 22 - Revista Área de Criação | Setembro-Outubro de 2012
Papel Sulfite: É o papel comum, aquele conhecido como folha de ofício. Pode ter várias cores e tamanhos, mas o mais comum é o A4. Aplicações: impressão em impressoras jato de tinta e laser e trabalhos escolares. Duplex: É um papel composto por 4 camadas: Uma é a celulose branca, duas internas de uma pasta não branqueada e a última de celulose possui dupla aplicação de couchê em apenas um dos lados. Possui uma alta resistência e sua gramatura trabalhada é de 250 a 400 gramas. É o famoso papelão. Aplicações: caixas, sacolas e embalagens. Couchê: É um papel mais caro, mais resistente (dependendo da gramatura escolhida) e sua principal característica é o revestimento brilhante em ambos os lados. A gramatura pode ser 90, 120, 150 e 250 gramas. Aplicações: cartão de visitas, folders, postais e encartes. No post “Tipos de papel” existem mais tipos disponíveis no mercado.
CRÉDITOS: SXC (BANCO DE IMAGEM)
PROCESSOS DE IMPRESSÃO
Conheça os tipos de papel
Aumente seu poder de compra. Faรงa um curso no Senai e cresรงa profissionalmente.
CRÉDITO: SXC (BANCO DE IMAGEM)
O que achou da sua próxima revista de design, criação e interação?
Curtiu? Então comente e compartilhe entre os amigos da internet, da escola e do trabalho ;-)