design de interfaces i
DESCRIPTION
Design de interfaces ITRANSCRIPT
Design de Interfaces
Profa. Carolina Toledo IED – Projeto Digital e Virtual II
Gestalt Apesar das diferentes atuações e suas par?cularidades, o obje?vo do design é sempre o mesmo: projetar conceitos, equilibrando esté?ca e funcionalidade. Para isso, é fundamental o entendimento dos conceitos gerais da percepção visual. A gestalt é considerada pelos mais conceituados profissionais da área a gramá?ca subliminar da alfabe?zação visual.
O movimento • O movimento gestal?sta teve início na Viena do século XIX,
através dos estudos do filósofo Von Ehrenfels. A Gestalt firmou-‐se como a primeira Escola de Psicologia Experimental e atuou principalmente no campo da teoria da forma, com contribuição relevante aos estudos da percepção, linguagem, inteligência, aprendizagem, memória, mo?vação, conduta exploratória e dinâmica de grupos sociais.
• O termo Gestalt, no seu sen?do mais amplo, significa uma integração de partes em oposição à soma do “todo”. É comumente traduzido para o inglês, espanhol e português como estrutura, figura, forma.
O movimento • A teoria da Gestalt, gerada através de grande pesquisa e experimentação, sugere uma resposta ao porque de umas formas agradarem mais e outras não. Ela afirma também que o cérebro só consegue perceber, decodificar e assimilar uma imagem ou um conceito pela sua totalidade e não pelas partes separadas que formam este todo.
• Sendo assim, existem algumas leis básicas da Gestalt que explicam o processo psicológico de captação e entendimento de alguma imagem ou idéia.
Leis da Gestalt
• Pregnância da forma: Este é um dos conceitos mais importantes da Gestalt. Ele demonstra que todas as formas tendem a ser percebidas em seu caráter mais simples: uma espada e um escudo podem tornar-‐se uma reta e um círculo. Quanto melhor for a organização visual da forma do objeto, em termos de facilidade de compreensão, rapidez de leitura e interpretação, melhor será o seu grau de pregnância.
Leis da Gestalt
• Unidade:
As unidades formais são percebidas através da relação dos elementos que as cons?tuem. Uma ou mais unidades podem ser percebidas dentro de um todo pela percepção isolada e combinação dos elementos como: pontos, linhas, planos, volume, cores, brilho, sombra, textura etc.
Leis da Gestalt
• Segregação:
Este conceito demonstra a capacidade percep?va de separar, iden?ficar, evidenciar e destacar unidades formais em uma composição.
Leis da Gestalt
• Unificação:
Consiste na semelhança e igualdade produzidos pelo campo visual. A unificação também acontece por fatores como harmonia, coerência da linguagem e organização.
Leis da Gestalt
• Semelhança:
Os objetos similares tendem a se agrupar. A similaridade pode acontecer na cor dos objetos, na textura. Estas caracterís?cas podem ser exploradas quando desejamos criar relações ou agrupar elementos na composição de um layout.
Leis da Gestalt
• Proximidade:
Os elementos são agrupados de acordo com a distância a que se encontram uns dos outros. Assim, elementos próximos entre si tendem a ser percebidos como um grupo.
Leis da Gestalt
• Con?nuidade:
Se vários elementos de um quadro apontam para o mesmo canto, por exemplo, o resultado final “fluira” mais naturalmente.
Leis da Gestalt • Clausura:
Ou “fechamento”, o princípio de que a boa forma se completa, se fecha sobre si mesma, formando uma figura delimitada. O conceito de clausura relaciona-‐se ao fechamento visual, como se completássemos visualmente um objeto incompleto. Ocorre geralmente quando o desenho do elemento sugere alguma extensão lógica, como um arco de quase 360o sugere um círculo. O conceito de boa con?nuidade esta ligado ao alinhamento, pois dois elementos alinhados passam a impressão de estarem relacionados.
Conceituação da Forma A forma pode ser definida como a imagem visual. Ela informa sobre o aspecto estrutural do objeto. A forma é o resultado de interação entre o objeto e o meio.
A conceituação da forma acontece em seis princípios: • Forma ponto – unidade mais simples existente na comunicação visual. • Forma linha – uma sucessão de pontos ou ponto em movimento. • Forma plano – uma sucessão de linhas que se expressa nas duas
dimensões do espaço. • Forma volume – algo que se expressa por projeção nas três dimensões do
espaço. • Forma – configuração real – Demonstra a captação real da imagem, como
numa fotografia. • Forma – configuração esquemá?ca – Demonstra a percepção do objeto
real num conceito estrutural.
Conceituação da Forma
Certas formas só podem ser compreendidas se ja a conhecermos, ou se ?vermos consciência prévia de sua existência. Da mesma maneira, a experiência passada fa-‐ vorece a compreensão: se ja ?vermos visto a forma inteira de um elemento, ao visualizarmos somente uma parte dele reproduziremos esta forma inteira na memória.
Categorias Conceituais
Técnicas visuais aplicadas
Estas técnicas visuais podem fornecer informações valiosas no processo de criação, gerando conceitos e agregando significados para a produção visual. Porém, devem ser u?lizadas de acordo com a necessidade conceitual do projeto.
Categorias Conceituais • Clareza – manifestação visual bem organizada, unificada,
harmoniosa e equilibrada.
• Simplicidade – esta aplicação é caracterizada pela organização, harmonia e síntese visual, gerando boa pregnância da forma.
• Complexidade – complicação visual por numerosos elementos. Se organizado pode gerar harmonia e interesse.
• Minimidade – simplicidade, naturalidade, gerando boa
pregnância pela economia de elementos.
Categorias Conceituais • Profusão – manifestação visual muito carregada com
excesso de detalhes e ornamentos.
• Coerência – resultado de uma aplicação visual integrada e harmoniosa e diretamente vinculada ao conceito.
• Exageração – técnica que recorre a configurações extravagantes para uma expressão visual intensa.
• Arredondamento – suavidade e maciez transmi?das geralmente por formas orgânicas.
Categorias Conceituais • Transparência – transmite a sensação de profundidade e
de realidade.
• Redundância – enfa?zar ou chamar atenção através da repe?ção.
• Ambigüidade – concorrência por indefinição geométrica ou orgânica da forma induzindo a mais de uma interpretação.
• Espontaneidade – aparente falta de planejamento visual.
Categorias Conceituais • Aleatoriedade – disposição rítmica e não seqüencial.
• Fragmentação -‐ decomposição dos elementos em peças separadas
• Su?leza – transmite delicadeza através de acabamentos elegantes e refinados.
• Difusidade – transmite a sensação de diluição da imagem, re?rando dela precisão e transportando o observador a um ambiente subje?vo.
Categorias Conceituais • Distorção – drama?zação com o propósito de
sensibilizar.
• Profundidade – técnica com obje?vo de gerar uma perspec?va tridimensional.
• Seqüencialidade – elementos organizados e dispostos de modo congnuo.
• Ruído – interferências que perturbam a harmonia ou a ordem a fim de criar pontos de interesse.
Conceito Para começar a projetar deve-‐se estar sempre atento aos princípios do design, como: • conceito • originalidade • simplicidade • pregnância • legibilidade Eles são importantes para a fundamentação dos seus projetos.
Observe as figuras acima... Você notou algo de estranho?
Conceito Em um supermercado, os produtos são facilmente iden?ficados pela sua embalagem. Mesmo à distância, consegue-‐se reconhecer, sem ler os nomes, o que é sabão em po, cerveja ou pasta de dentes. Isso acontece quase intui?vamente, porque você ja tem uma imagem pré-‐ estabelecida desses produtos. Ja se sabe, por exemplo, que a pasta de dentes vem em tubo, e o sabão em po, em caixa. Além disso, nota-‐se que, na maioria das vezes, adotam uma esté?ca bastante similar.
Conceito Cada categoria de produtos tem um conceito, uma imagem a transmi?r. É isso: o conceito nada mais é do que um conjunto de informações representadas por elementos gráficos (como cor, ?pografia, imagens etc.) e que, juntos, transmitem uma idéia. Agora, você deve estar se perguntando: mas o que isso tem a ver com criação de sites? Tudo! Os sites também devem transmi?r conceitos, de acordo com a sua categoria.
Categorias de Sites Todo site tem que transmi?r um conceito, isto é, uma idéia do que se trata. No caso de um site para o público infan?l, por exemplo, é adequada a u?lização de cores alegres, fontes diver?das, muitas ilustrações e desenhos, animações, joguinhos intera?vos, criando um ambiente lúdico. Além disso, o site deve condizer com a categoria à qual pertence. Um portal infan?l deve possuir diversos links para outras áreas de interesse que atraiam a criança.
Algumas Categorias de Sites Portais – apresentam conteúdo vasto, dividido por seções de temas variados e atualizados diariamente, na maioria dos casos.
Categorias de Sites Portais
Categorias de Sites Sites ins,tucionais -‐ sites de empresas ou ins?tuições que apresentam seus serviços e produtos. É o contato direto da empresa com seus clientes.
Categorias de Sites Sites ins,tucionais
Categorias de Sites Sites de comércio eletrônico – sites que disponibilizam produ-‐ tos a serem comprados pela internet.
Categorias de Sites Sites de comércio eletrônico
Categorias de Sites Sites de ins,tuições financeiras -‐ agências virtuais, que disponibiliza serviços como, acesso a sua conta e pode realizar transações.
Categorias de Sites Sites pessoais ou por8ólios -‐ apresentam trabalhos já realizados, mostrando sua experiência profissional, currículo etc. Esses sites não se restringem a profissionais do design, também podem divulgar ar?stas, músicos, es?listas ou qualquer profissional liberal.
Categorias de Sites Blogs (por8ólios) -‐ uma tendência, onde designers ou qualquer profissional expõem seus projetos em blogs porpólios. Assim, há muita intera?vidade com os leitores e mais rapidez para a atualização.
Categorias de Sites Sites de entretenimento -‐ sites desenvolvidos para o lazer do usuário. Voltados para o público-‐alvo, onde o entretenimento expõe o produto ou conceitualiza a marca.
Categorias de Sites Sites de no>cias – são sites direcionados a informar, com atualização intensa e conteúdo, além da u?lização de tecnolo-‐ gias, como RSS, e informa?vos via e-‐mail, disponibilizando aos usuários informações com mais rapidez.
Categorias de Sites Hotsites -‐ são sites desenvolvidos para um curto prazo de exposi-‐ ção, onde são divulgados novos produtos. Nesta modalidade de site, a criação tem a oportunidade de reforçar o conceito da marca e vender uma a?tude.
Categorias de Sites Sites de rede social -‐ esta modalidade de site entrou como uma febre no mercado e hoje demonstra claramente sua função. O que parecia um simples site de relacionamento demonstrou com a formação de comunidades que pode servir de medida para empresas e uma resposta direta do público aos produtos lançados.
Categorias de Sites Site de exibição de vídeos -‐ o nascimento do YouTube marca a revolução na veiculação de vídeos na web, tornando-‐os acessíveis para qualquer pessoa, em qualquer lugar.
Tendências Foco no público-‐alvo. Esta é uma das principais tendências do mercado digital. Direcionando ao público os produtos, as idéias, os conceitos e todo o nicho de informações, as empresas podem ganhar cada vez mais o mercado, ja que com a alta intera?vidade, comunidades e métricas, o retorno do público é mais intensificado.