segunda-feira, 1 de novembro de 2010

Famílias dos tipos







Verdana é uma família tipográfica sem-serifa concebida pelo designer Matthew Carter para a Microsoft Corporation, com colaboração no hinting manual (hand-hinting) de Tom Rickner da Agfa Monotype.

A Verdana foi publicada em 1996 pela Microsoft e passou a ser distribuída em cada edição do sistema operativo Windows, no Microsoft Office e com o Internet Explorer (desta forma a fonte está difundida tanto em Windows quanto em Mac OS).

Além disso, uma versão reduzida da Verdana (com menos glifos que a versão original), denominada e inserida no pacote Core fonts for the Web, esteve disponível para download gratuito no sítio oficial da Microsoft durante bastante tempo, de forma a que pudesse ser utilizada em qualquer sistema que suportasse fontes TrueType.

Consequentemente, hoje em dia, a Verdana está instalada na maioria dos computadores, mesmo em Unix e Linux.

A versão Core fonts for the Web da verdana ainda está disponível para download em sites externos

A fonte foi inspirada em tipografias famosas, como a Frutiger. Entretanto, existem algumas diferenças intencionais, pois a Verdana foi desenhada com o intuito principal de ser lida em ecrãs de baixa resolução (especialmente em tamanhos pequenos, de forma a adaptar-se bem aos textos corridos).

Uma das diferenças mais marcantes são as pseudo-serifas em letras como o "J" e o "I". Em 1999 foi publicada a fonte Tahoma, similar à Verdana, mas mais compacta quanto ao desenho.

A fonte Bitstream Vera também é similar à Verdana.

Tahoma é uma família tipográfica sem-serifa de grande legibilidade, comissionada pela Microsoft e desenhada por Matthew Carter.


Foi publicada em 1996 e é instalada por padrão em todos os sistemas Macintosh e Windows. Uma vez que é parte do pacote de "fontes web" e que esteve disponível para download gratuito a partir do site da Microsoft por muitos anos, muitas distribuições de Linux e Unix também a utilizam.

Frequentemente é considerada uma excelente fonte tipográfica para a leitura na tela do monitor, para o qual ela foi concebida. Já que é instalada na maioria dos computadores do mundo, é muito usual encontrá-la como fonte no texto principal de uma página web. Esta fonte tem muita semelhança com a fonte Verdana.

sexta-feira, 22 de outubro de 2010

Criar um digitalstorytelling...


Criar uma história em grupo é bem interessante. Primeiro surgem as ideias, que são combinadas, estas transformam-se em storyboards que se tornam um projeto belo. Esse foi a história da Elisa. A Katrine escreveu um texto para a cadeira de Narrativas e decidiu criar a nossa história a partir dele. Logo no início, gostamos da personagem e do desenrolar de sua vida.
Utilizamos o princípio da composição visual do contraste, que, além de dar um tom mais interessante à obra, nos faz lembrar da condição física da Elisa, personagem fictícia, que só enxergava em tons de cinza. A partir daí, construímos o storyboard, cheio de observações que doaram ao trabalho características que beiravam a feminilidade(culpa da Katrine), tudo planejado para agradar a quem vê a história.
A personagem, em desenho, foi criada pelo Boro(José Moreira), uma surpresa pra mim, o desenho é simples, mas muito bom; a personagem é fofa e meiga, apaixonante, é muito fácil gostar dela. A história da Katrine foi bastante interessante de se trabalhar e eu ajudei na construção do roteiro, oferecendo umas ideias em determinados pontos. Por fim, o resultado se mostrou interessante pelo cuidado ao fazê-lo, gostei da personagem, gostei da história, gostei de realizar este trabalho.

sexta-feira, 8 de outubro de 2010

Digital storytelling

O link do youtube é: este

O pdf é este este

terça-feira, 5 de outubro de 2010

Princípios do design gráfico

Para cada princípio, um exemplo. Alguns atenderam a mais de um princípio, mas darei o exemplo pela característica predominante. Tentarei exemplificar com sites que utilizo.

Proximidade
Um bom exemplo é o Xixi no banho, www.xixinobanho.org.com, quando se está na sua página, você pode notar que os elementos estão agrupados, principalmente no centro, causando um atrativo no conteúdo. Notamos coesão; o site não fica visualmente cansativos, pois espaços em branco mais atrativos foram criados.

Contraste
Twitter, www.twitter.com. O contraste presente no site é o contraste de tom. Na parte de cor branca do site, localizam-se os twites, o mais importante do conteúdo. E no outro lado, ficam o conteúdo complementar. Esta opção de contraste oferece um atrativo visual ao twitter, além de melhorar a usabilidade.

Repetição
Um site cheio de repetições é o Omelete, um site de cinema, jogos, tv, etc; www.omelete.com.br. À esquerda, aparecem as notícias, que estão agrupadas por marcadores coloridos que são equivalentes a cada classe de assunto: cinema, quadrinhos, games, etc. No meio, estão as notícias principais, que chamam a atenção; elas são colocadas repetidas uma abaixo da outra, com títulos com formatação repetida em negrito. Tudo isso deixa o design consistente.

Alinhamento
Um bom exemplo do uso do alinhamento é o site do jornal O Povo, www.opovo.com.br. O alinhamento principal utilizado é o à esquerda. A maioria dos títulos e notícias utilizam-se deste alinhamento; isto cria unidade ao conteúdo do jornal.

quinta-feira, 23 de setembro de 2010

Equilíbrio e desequilíbrio




A primeira imagem, cartaz do filme "O último mestre do ar", é um exemplo de equilíbrio. Não notamos a presença da simetria, mas o cartaz não perde com isso, pois a atenção foi voltada para o personagem com a criação da tensão visual. O personagem principal fica em cima dos dois pontos de interesse à esquerda, o que também chama a atenção para ele. Posso também destacar a função positivo/negativo, que não é tão precisa, devido ao desfoque das cores preta e branca, mas podemos notar a diferença entre claro e escuro em ambos os lados, esquerdo e direito, da imagem. Enfim, penso que o objetivo da imagem, destacar o personagem, foi alcançado e o equilíbrio foi estabelecido.

Já, na segunda, há um belo desequilíbrio. Não há simetria, mas também não há nada que tente equilibrar a ausência dela. A parte mais densa da imagem fica do lado direito, algo que não é balanceado do outro lado. Não há nivelamento e a preferência pelo ângulo esquerdo da imagem não foi respeitada. O observador é quase obrigado a olhar para a parte com mais detalhes da imagem, o lado direito. Mas a imagem não é feia. Causa tensão, mas não desconforto. Noto que tudo foi propositado e o trabalho ficou ótimo.

segunda-feira, 6 de setembro de 2010

Logo



Seguindo as explicações dos capítulos 2 e 3 do livro “Sintaxe da Linguagem Visual”, pude fazer algumas observações mais 'técnicas', após ter criado a logo da 'Tv Gourmet'.
Mesmo sem ter o conhecimento do texto, criei a logo. E depois de ler, quase pensei que foi coincidência. O "equilíbrio" foi estabelecido pois a parte mais 'maciça' da imagem se encontra no eixo vertical(do nome na logo ao ápice da 'fumaça') e com o referente secundário horizontal no nome da tv logo abaixo. O "nivelamento e o aguçamento" encontram-se na imagem pois, ironicamente, a ambiguidade foi evitada pois tudo concentra no centro e se expande para os lados . O nome da tv segue a regra da
"preferência pelo ângulo inferior esquerdo". O elemento básico da comunicação visual mais utilizado foi a linha (fato evidenciado principalmente na 'fumaça'). A "Direção" mais utilizada foi a curva que é associada à abrangência, repetição e a calidez (muito irônico) adjetivos muito relacionados, por mim, à comida. E por fim quero destacar a falsa idéia de perspectiva, colocada, de forma simples, no desenho, feito como se a tigela estivesse sendo vista com um ângulo um pouco superior, podendo até ver o 'conteúdo' da tigela.

segunda-feira, 30 de agosto de 2010

Iludindo nossos olhos.

Muitos dizem que a visão nos engana. E em alguns casos isso é verdade. Uma boa perspectiva, o ângulo correto e uma imagem em duas dimensões, nos engana e se transforma em 3D ou ilusão de ótica.


Essas abaixo são boas. Na página a seguir, há vídeos com boas ilusões, vale a pena conferir também:
http://www.noticiasgeek.com.br/ilusoes-de-otica/