Archive for February, 2011

Chico Homem de Melo escreveu artigos para a Associação dos Designers Gráficos do Brasil (ADG) e pra revista Arc Design entre 1999 e 2002 e esse interessante volume das Coleção textosdesign são, basicamente, uma boa seleção desses artigos. Como de costume dessa coleção, os textos propõem discussões e reflexões a respeito da produção do design e do cotidiano do designer, passando por 50 anos de marcas criadas no Brasil, tipografia, arquitetura, relação de criatividade versus o uso do computador e como eles se influenciam, processos criativos e outros.

O sumário do livro:
- Apresentação
- Marcas do Brasil
- O passado, o presente e o futuro do livro
- Impressões digitais
- Travestismo tipográfico
- O legislador e o artesão
- Niemeyer gráfico
- Os desafios do designer
- Brasil+500

O capítulo que deu o título à essa publicação compreende 14 frases que foram utilizadas na Mostra Seletiva da V Bienal de Design Gráfico da ADG, em 2000, relacionadas literalmente aos desafios de criar cada tipo de projeto.

Entre os artigos, tem um inédito (pra mim o melhor deles), que é sobre o BRASIL+500 – Mostra do Redescobrimento, que Chico Homem de Mello conta o projeto desde o começo, das primeiras ideias. Aí entram os detalhes de como os trés pavilhões do Parque do Ibirapuera foram ocupados com essa mostra e tudo a partir de uma visão do designer como interlocutor do projeto, que tem que se “dar bem” com todos e não é o dono exclusivo de tudo que se tem por lá. Embora totalmente verdadeiro, esse tipo de posicionamento é meio difícil de encontrar gente falando em livros (alguém tem dicas de livros ou links disso?).

Embalado pelo título do livro e seu capítulo de desfecho fenomenal, deixo a pergunta:
Pra você, qual é o maior desafio do designer?

Me conta nos comentários, tá?

Por diversas vezes paro pra pensar como poucos anos de idade fazem diferença na relação com a tecnologia e o que ela interfere no cotidiano de cada um. E as vezes nem precisa de diferença de idade pra isso. Tenho amigos que ficam em instant messengers enquanto estão na praia, tomando Sol e bebendo uma caipirinha com os amigos. Pra mim praia é pra fazer outras coisas. Reparo no número de pessoas que, na mesa dum bar, estão de cabeça baixa mandando SMS pra sei lá quem enquanto os outros amigos (caso não estejam fazendo o mesmo), conversam ou aguardam terminar. Pra mim isso tudo é estranho demais, pros outros é normal e cada um segue do jeito que gosta. E como será fazer produtos editoriais (sejam em qualquer suporte) pra um determinado público, com a mesma idade, que mora em regiões próximas, com bagagem cultural semelhante mas que tem hábitos de leitura que podem ser tão diferentes? Meu primo, 9 anos mais novo, lê histórias em quadrinhos na tela do PC dele. Pra mim é impossível. E um Kindle? Satisfaz a sensação de ler? E um iPad, serve pra ler as revistas ou simplesmente brincar com as interações num novo suporte? Bem, quando comecei a reparar e refletir nesses comportamentos, me lembrei de uma “velha leitura”, com ótimas definições de tipos de leitores e como eles se comportam, o que esperam dos textos, estejam eles onde estiverem. Li novamente o conteúdo. São eles:

1. O leitor contemplativo, meditativo

Desde Idade Média, quando se instituiu que a leitura nas bibliotecas seriam feitas em silêncio, uma grande mudança ocorreu no processo de entendimento de um texto: depois de séculos a leitura passaria a ser algo muito mais íntimo e pessoal, sem a presença de um orador, sem interferências extenas e apenas feita pelo movimento dos olhos e o virar das páginas. É nesse momento que nasce o leitor contemplativo. Esse tipo de leitor se isenta de situações mundanas para se concentrar na leitura, numa atividade solitária, que pode ser interrompida para reflexão, retornada, feita novamente por dezenas de vezes até que o endendimento seja feito do modo desejado. É o leitor que procurou o isolamento para absorção do conteúdo, que não se preocupa com quanto tempo faz que está lendo nem tem pressa pra terminar. Da mesma maneira poderiam “ler” quadros ou esculturas numa galeria ou admirar e perceber a arquitetura que o cerca.

2. O leitor movente, fragmentado

É o leitor que surge pós Revolução Industrial, aquele que viu as locomotivas trazendo esperanças em formato de produtos produzidos em grande escala, que ganharam horários rígidos nas fábricas e que tudo isso, junto com o cinema, a luz elétrica, o telégrafo, depois os jornais, revistas e tudo que poderia cercar as pessoas com informações. Todos os lugares tinham textos que acendiam e apagavam nos luminosos dos estabelecimentos comerciais dos mais diversos tipos, além de cartazes de propaganda, rótulos de produtos, fachadas, automóveis, placas de sinalização. Médicos, veterinários e advogados viraram produtos também. Os centros comerciais, as ruas e os boulevards passaram a ser grandes vitrines com todo tipo de informação, que é lida rapidamente e sem intimidade, numa batida de olhos, onde pessoas passam a todo momento praticamente que despercebidas entre o leitor e elas, que também podem ser leitores desse tipo. Imagens e textos que seduzem e fazem produtos serem vendidos ou simplesmente desejados. Todo mundo (leitores moventes) lendo tudo ao redor, rapidamente e com menos concentração e com a pressa que a vida pós Revolução Industrial foi emprestando pra todos. É o leitor intermediário entre o contemplativo e o imersivo.

3. O leitor imersivo, virtual

Com todos os aparatos digitais e possibilidades, não é difícil de imaginar como é esse tipo de leitor. Nada de rolos de papel como na Antiguidade, nem de grandes blocos de papel, nem objetos que o fazem tropeçar em diversos elementos que podem ser lidos e notados, como na letra de “Alegria, alegria”, de Caetano Veloso. Nada de ordem para ler. O leitor imersivo está a todo tempo em prontidão para receber e ler novas informações, traça seu próprio caminho em navegações alineares ou multilineares. É o leitor que passeia por várias dimensões de conteúdos através dos nós que as une, que pode ter uma leitura que não tem fim, que entrecruza os dados com outros textos, os compara e gera um terceiro ou um quarto conteúdo.

Essas informações que postei aqui sobre os tipos de leitores são rápidos pareceres sobre minhas interpretações sobre um dos capítulos desse maravilhoso livro, indicação dos professores de Hipermídia da época faculdade. O título é Navegar no Ciberespaço – O perfil cognitivo do leitor imersivo, da Lucia Santaella, Editora Paulus, 2004. Bem bacana notar como as ideias mudam e o bom e velho livra ganha diferentes valores com o passar do tempo. E você, pra qual desses tipos de leitor você trabalha? Você acha que esses tipos de leitores são excludentes entre eles ou em momentos temos que ser imervisos, noutros contemplativos enquanto estamos cercados e agindo como leitores moventes? Deixe tua opinião aí nos comentários

A primeira vez que vi o livro achei que fosse mais um desses convencionais de fundamento do design. Feliz engano! Nada contra (MUITO pelo contrário) os convencionais livros de fundamentos, é que essa edição da Bookman Editora vai bem além de conceitos básicos e explica e ilustra 125 princípios do design, interdisciplinares e que podem ser lidos de maneira não linear. Nesses princípios estão alguns que vão ajudar na hora de fazer uma composição visual, outro na hora de escolher e editar uma fotografia, outros para grids, para harmonização de um projeto, torná-lo mais usável, dicas de posicionamento, razão áurea e muitos outros. Adorei aprender princípios quando vi que desconhecia totalmente, como Wabi-Sabi, Viés de Rosto de Bebê, Lei de Hick, Falácia da Escalabilidade entre outros. Bem interessante é como as páginas são montadas:

Cada princípio é explicado em uma página dupla, onde o texto principal fica na página par, junto com hipertextos na direita sobre as bibliografias de cada princípio. No final da página (no “Ver também”) tem outros princípios relacionados com o que você acabou de ler, pode voltar ao sumário e não linearmente partir para outro. Aliás essa foi a maneira que li o livro.

Na página ímpar tem o do princípio da página par, com texto explicativo que evidencia e comenta a aplicação.

O livro estrategicamente tem dois sumários, um com todos os princípios separados (as vezes eles se repetem pelas categorias) pelos temas:
- Como posso influenciar a maneira que o design é percebido?
- Como posso ajudas as pessoas a aprender com design?
- Como posso melhorar a usabilidade do design?
- Como posso aumentar o apelo do design?
- Como posso melhorar as decisões de design?

E também em alfabética:

Acessibilidade
Affordance
Alinhamento
Alinhamento de Área
Antropomorfismo
Arquétipos
Autossemelhança

Biofilia
Boa Continuidade

Camadas
Carga de Desempenho
Cegueira por Desatenção
Ciclo de Desenvolvimento
Ciclo de Feedback
Ciclo de Vida
Cinco Cabides
Comparação
Compensação entre Flexibilidade e Usabilidade
Condescendência
Condicionamento Clássico
Condicionamento Operante
Conectividade Uniforme
Confirmação
Congelamento/Fuga/Luta/Entrega
Consistência
Constância
Controle
Convergência
Cor
Custo/Benefício

Densidade Proposicional
Desempenho versus Preferência
Design por Comitê
Destaque
Destino Comum
Detecção de Ameaças
Diagrama de Gutenberg
Dissonância Cognitiva
Distribuição Normal

Efeito Catedral
Efeito da Aparência Facial Mais Próxima da Média
Efeito da Superioridade da Imagem
Efeito de Expectativas
Efeito de Mera Exposição
Efeito Estética/Usabilidade
Efeito Veblen
Efeito Vermelho
Efeito von Restorff
Efeitos da Posição Serial
Efeitos de Interferência
Elo Mais Fraco
Enquadramento
Entra Lixo, Sai Lixo
Erros
Escassez
Espaço Defensável

Facilidade de Leitura
Falácia da Escalabilidade
Fator de Fixação
Fator de Segurança
Fechamento
Fixação de Caçador/Criador
Forma Segue a Função
Formas Estruturais

Hierarquia
Hierarquia de Necessidades
Horror ao Vácuo

Imersão
Iteração

Legibilidade
Lei da Pregnância
Lei de Fitts
Lei de Hick
Linha do Desejo

Mais Avançado Embora Aceitável
Mapeamento
Mimetismo
Mnemônica
Modelagem
Modelo Mental
Modularidade

Não Inventado Aqui
Narração
Navalha de Occam
Nudge

Organizador Prévio

Pedra de Roseta
Personas
Perspectiva/Refúgio
Pirâmide Invertida
Ponto de Entrada
Preferência pela Savana
Preferência pelo Contorno
Princípio da Incerteza
Profundidade de Processamento
Projeção Tridimensional
Proporção Áurea
Protótipos
Proximidade

Razão Entre Rosto e Corpo
Reconhecimento versus Lembrança
Redundância
Regra 80/20
Regra dos Terços
Relação Cintura/Quadril
Relação Figura/Fundo
Relação Sinal/Ruído
Representação Icônica
Ressonância Visuoespacial
Restrição
Revelação Progressiva

Satisfação
Segmentação
Semelhança
Sensibilidade à Orientação
Sequência de Fibonacci
Simetria
Sugestão Subliminar

Uncanny Valley

Viés da Iluminação de Cima para Baixo
Viés do Rosto de Bebê
Viés Estético
Visibilidade

Wabi-Sabi
Wayfinding

É o típico título que deveria ser como “livro adotado” pelas faculdade de design.
Obrigado, Elisa, pela indicação do livro, adorei
E você? Quais são os princípios que tem curiosidade de saber mais a respeito? Deixa aí nos comentários!

Mais um experimento da série Trocadilhos Tipográficos. Dessa vez fiz tipos Futura com ferrugem, em negativo e em positivo, com o verso de uma lata de tinta de 18 litros.

Como foi feito

1 – Bons estiletes, uma base de corte, um grid áureo e a palavra FUTURA, com a fonte Futura, impresso em A3:

2 – Fiz uma máscara com o texto:

3 – Apliquei spray para demarcar a palavra FUTURA em duas chapas de metal, uma para fazer em positivo e outra em negativo:

4 – Chapa com a tinta aplicada na máscara:

5 – Com uma chave de fenda usada como lápis, fui contornando cada letra e raspando os locais desejados em cada chapa. Ao fundo, minha tia Eliana perguntava:
- O que tá fazendo, meu sobrinho?
- Tô fazendo letras com ferrugem, tia…
- Ah, bom…

6 – Com a raspagem, a película que protege a chapa de enferrujar sai. Essa, no caso, era a FUTURA com a ferrugem em negativo:

7 – Desenvolvimento da FUTURA em positivo:

8 – Exemplo das chapas finalizadas e detalhes:

9 – Com água e sal, agilizei o processo da ferrugem. Essa sequência é foto pela manhã e outra pela noite da versão em negativo:

10 – Por fim as chapas finalizadas:

Agradecimentos especiais para o meu irmão e fotógrafo Marco Moreira (@ximarquinho), do Magelstudio, pelas fotos bacanas que ele gentilmente tirou pra mim das chapas e ao Seu Rodolfo, também conhecido como meu pai, que cortou na tesoura cada uma dessas chapas, depois de conseguir uma lata de tinta e limpá-la toda pra mim.

6 meses depois…

Seis meses depois fui pegar as chapas novamente. Quero ver fazer esses ruídos no Photoshop!

Informação importante antes de ler o post: Eu sou a favor dos grids. Totalmente a favor, a aliás. E viva o Swiss Style!

Tenho visto diversos projetos de web que seguem o “bom e velho padrão do grid de 960px“.  Afinal de contas dá pra ter 6 ou 12 pequenas colunas devidamente espaçadas que, como são divisíveis tanto por 2, como por 3 e 4, permitem uma grande gama de combinações, como 3 colunas de 300px ou 6 de 150, mais os espaçamentos. E tem também uma infinidade de sites que disponibilizam gratuitamente modelos prontos pra você, é só baixar os códigos limpinhos e se divertir a valer com seu grid multi-uso. Todos usam esse padrão e o serviço fica mais rápido, inclusive para dos desenvolvedores. Parece um sonho, né? Pra mim é um pecado e um pesadelo.

As limitações do design na internet

Que tal se todas as revistas do mundo tivessem o mesmo tamanho? E o projeto tipográfico, como seria? Tudo igual também? Pois é, assim vejo o design para internet atualmente. Calma, não estou falando de (hot)sites promocionais, nem dos que vão pro Festival de Cannes. Estou falando de portais ou sites de conteúdo e/ou serviços. Faça um teste: Abra uns dois ou três sites desse tipo, numa página de texto, desça a rolagem até esconder o topo e veja se algum deles tem uma identidade forte, sólida, que possa ser reconhecida. Não, não tem. Pelo menos não na grande maioria das vezes. Isso vale tanto pra nacionais quanto pra sites gringos. E o design aí, como fica?

Tipografia
Sabemos que cada navegador se comporta de um jeito com as fontes que usamos. Mais suavizada aqui, menos acolá. E se falarmos entre sistemas operacionais então, aí que a coisa muda total mesmo. Os PCs utilizam fontes pequenas sem suavizar nada. Pros fãs de Mac, as letras são suavizadas. Não estou falando que um ou outro é melhor. São diferentes e nada podemos fazer a respeito. E quando o usuário dá um CTRL + no browser e tudo aumenta? E quando usamos fontes compradas pra web que essas variações são maiores ainda (e em alguns casos nem funcionam)? Fora que o tamanho dos textos pode varia pacas por serem dinâmicos, como num portal de notícias. E isso vai depender do repórter, porque o designer não terá como ver 3500 páginas por dia pra saber se estão todas ok. Ou seja, NÃO temos pleno controle total da tipografia nos nossos projetos digitais.

Cor
Dezenas (ou cententas?) de tipos diferentes de monitor. LCD, LED e até alguns remanacentes com tubo. De 15, 17, 21, 30 polegadas. Notebooks, netbooks, Macbooks, PCs e MACs. Tudo isso com uma grande quantidade de ajustes em brilho, contraste, matiz e afins. A luz do ambiente onde estão usando o computador. O número de fatores também define: também NÃO temos controle total de como os usuários verão as cores que usamos.

Pausa breve 1: concordo que temos que levar em conta nosso público alvo. Mas as variações são tantas que, se fecharmos muito o leque (e o site precisa de pageviews) a audiência que verá o projeto como se deve será de 10 ou 15% do total.

Enfim, o que quero dizer com isso até agora é que ferramentas do design não podem ser tão exploradas como deveriam ser quando as utilizamos em projetos de web. O grid é uma ferramenta interessante, que sofre nada ou quase nada com essas variações. Ou seja, o designer pode fazer um BAITA grid planejadinho, certinho e tudo a ver com o projeto. Mas não. Vai lá o fulano e pega a desgraça pronta dum grid de 960px e pronto. Vamos para a próxima etapa. Não e não!

Pausa breve 2: Claro, eu prefiro que se use um grid de 960px do que não se use nada. Pelo menos fica mais fácil de organizar e outra pessoa que for mexer no projeto pode ter menos dificuldade pra entender as regras visuais.

Num grid de 960px e 6 colunas, por exemplo, teremos 150px em cada coluna e um espaçamento de 12px entre elas. Por que 12px? Qual o tamanho da fonte de corpo de texto que será usada? Então como o espaçamento pode estar errado. E certamente estará. E os títulos? Imagens? E a relação grid + tipografia vai pra onde? Será que 12px resolve TODOS os problemas do planeta Terra em grids? E se não tiver wallpaper add nessa página, pra que o espaço entre as margens do navegador e a página? Essas e outras várias questões me fazem ter certeza: usar um grid de 960px faz com que o projeto web já comece sem projeto. “Mas Rogério, esse blog tem 960px! O que me diz disso?” Sim, tem. Essa foi uma medida que cheguei através de cálculos e projeto. Veio do número de palavras que eu queria na parte do post versus o tamanho base de elementos que eu colocaria na coluna da direita. O novo lay que estou fazendo é um pouco mais largo. Nada contra a medida de 960px. Ela pode ser usada. E é disso que estou falando. Usar a medida de grid que for, contanto que tenha sido planejada, não baixada dum site qualquer e levada como verdade absoluta.

Usa? Gosta? Odeia? Concorda? Discorda? Deixa aí nos comentários, então!

“O design é divertido e funcional. Utilize-o para anunciar um bazar no quintal de casa, convidar pessoas para uma festa ou dar nome à sua banda. Ponha sua marca em camisetas, ímãs, pulseiras, bolsas e capas de livros. Compartilhe seus produtos com parentes e amigos. Ao invés de comprar ou usar as marcas que você encontra nas lojas, crie a sua própria, por meio da arte do design” – Ellen Lupton e Julia Lupton, no livro Eu Que Fiz, da Cosac Naify.