Tag Archives: Ergonomia e Usabilidade

Arte

O Design afeta o Código ou o Código afeta o Design?

8 Comments

E por que não os dois? Sim isso mesmo. E sei que você já se perguntou ou já até mesmo afirmou isso. Seja designer ou seja programador client side, todos já falaram isso. E é verdade, claro.

Mas por que Dulcetti?

Antes de mais nada, deixa eu me apresentar aqui, pois já comecei falando e você nem sabe quem sou eu. Meu nome é Bruno Dulcetti, Programador Client Side da Globo.com e Sênior do Portal Videolog.tv. Tenho um blog que leva meu próprio nome, Bruno Dulcetti. sim, não quis inventar nomes, pode falar que eu não tenho criatividade, eu não ligo. Só quis divulgar mais meu nome mesmo. E consegui.

E não vou ficar me extendendo por aqui, deixo isso para uma próxima oportunidade.

Beleza Brunão. Então continua seu pensamento…

Vamos pegar as duas situações, as duas profissões: Designer e Programador e comparar isso tudo.

O Designer. Layouts mirabolantes e afins.

Você, designer, que mexe bem pra caramba no Photoshop ou Fireworks da vida, tem várias idéias mirabolantes, já pensa em algo ultra-mega-meteórica-fuderosa-bombástica para o layout solicitado pelo cliente. Mas na verdade ele não quis nada tão mirabolante, afinal eles querem sempre algo simples e sucinto não é verdade?

Mas você que mostrar trabalho e tem capacidade pra isso, então pensa em algo bem bizarro para um programador implementar no HTML e CSS. Não liga muito para Acessibilidade e Usabilidade e muito menos para os kbytes que aquele layout vai ter. Vai na base do “se fode ae”.

Até que chega no programador…

O programador olha aquele layout e pensa: “Designer fdp! Só quer me f**er”. Mas relaxem. Eles não querem isso na verdade. Mas isso fica para um discussão paralela que não vem ao caso neste momento.

O programador verifica a possibilidade de poder concluir o trabalho, como pode fazer aquilo, isso, aquiloutro, etc. Chega sempre na mesma conclusão: “É né… Gambiarras”. Sim. Elas, as malditas gambiarras, que os designers conhecem, mas não entendem muitas vezes (quando não possuem conhecimento de programação), por isso, acabam não ligando muito.

Tá Bruno… Mas e aí?

E aí que o programador vai ter que se virar e modificar seu código de uma forma que consiga agilizar aquele layout. E dependendo do layout, o código pode ser alterado (gambiarrizado) em até 30% ou 40%. E chegamos numa conclusão: “É verdade! O Layout, design de um site, modifica a estrutura de um código para podermos deixá-lo da forma que o designer enviou.”.

Agora vamos para outro caso.

O programador. Códigos semânticos e bem organizados (nem sempre)

Agora temos a situação meio que inversa. Vou pegar o exemplo anterior para ficar mais rápido.

Depois de chegar aquele layout mirabolante e rolado os xingamentos do programador, ele cria um documento com algumas modificações e melhorias no layout (melhorias pra ele, mas pro designer seria algo como arrancar um dedo da mão dele), para um bom resultado nos indexadores, um bom resultado no tamanho final do site, carregamento, entre outras melhorias, tanto na usabilidade, quanto de acessibilidade.

O designer recebe aquilo e modifica tudo o que o programador pediu (seria algo como deixar os cantos retos ao invés de arredondados, imagem de fundo menos pesadas e com menos gradientes, entre outros) e retorna o layout para o programador.

O programador analisa e aceita a segunda opção, concluindo que ficou melhor e mais adequado para o ambiente web proposto pelo cliente ou pelo seu chefe.

Hmmm… Entendi Dulcetti… Aí o layout foi modificado…

Exatamente. Chegamos no segundo ponto, onde o design do site teve que ser modificado devido as alterações solicitadas pelo programador, para melhorar o desempenho do site.

Tá Bruno, entendi. Mas quando que acontece um e quando acontece o outro?

É um belíssima pergunta. Isso varia de empresa pra empresa, de projeto pra projeto, entre outros fatores importantes. Por exemplo, se você está numa Agência de Publicidade e ela possui um cliente gigante, que precisa de um projeto magnífico em relação a design, pode ter certeza, o programador vai sofrer ou vai pedir pelo amor de Deus que aquele site seja feito em Flash.

Então o Flash é mais tranquilo?

Depende do ponto de vista. Da parte estrutural sim, mas parte server nem um pouco. Mas isso a gente deixa pra outro artigo.

Onde eu estava mesmo? Ah sim…

Voltando ao “quando acontece”. Agora, se você trabalha numa empresa onde o conteúdo, semântica, código bem feito, SEO bem trabalhado, pode ter certeza que os designers ficarão de cara feia e xingando todas as gerações dos seus superiores.

É Dulcetti… Difícil isso hein.

A realidade é que sabemos que os designers não manjam o suficiente sobre SEO, usabilidade e qualidade de código, pois não é (será?) obrigação deles e os programadores não manjam e não dão tanto valor ao design, a qualidade de um layout bem feito e planejado.

Mas sabemos também que podemos chegar num ponto, num meio termo, sim. Podemos ter layouts muito bonitos feitos com um código digno de um programador, o CSS Zen Garden comprova isso, basta um esforço das duas partes:

Programador:

Para de reclamar um pouco de um layout um pouco diferente do habitual e se esforçar para conseguir um bom resultado. Tem como, eu garanto.

Designer

Não ser tão xiita e abrir mão, às vezes quando necessário, de alguns detalhes que possam prejudicar demais o código de um site/portal. E se possível, usar mais textos nos títulos do que imagens, principalmente quando as fontes forem parecidas com fontes padrões. Essa pra mim é uma das principais reclamações dos programadores, fora os gradientes. 😀

Finalizando…

Bom, vou ficando por aqui e espero que tenham gostado dessa minha primeira contribuição para o Design. Aquele abraço.

Arte

O Cinema Nacional e a Usabilidade na Web

7 Comments

Atualmente grande parte das agências web desenvolvem para o próprio umbigo, o mesmo ocorre com o cinema nacional cujo foco está na satisfação dos produtores e suga anualmente de nossos bolsos 800 milhões de reais, estes que poderiam ser melhor investidos se os interesses dos “cinespectadores” fossem levados em consideração.

Ipojuca Pontes, ex-Secretário Nacional da Cultura afirma:

Engana-se redondamente quem imagina que o cinema nacional, custando perto de R$ 800 milhões anuais ao bolso do contribuinte, tem algum compromisso com o desenvolvimento industrial e a auto-sustentação da atividade.

E por que a sétima arte brasileira não consegue se auto-sustentar? Que ponto a metodologia de desenvolvimento web mais utilizada tem em comum com a metodologia de produção de filmes nacionais?

Pode ser que Rodrigo Constantino, autor do livro “Prisioneiros da liberdade” clareie as coisas:

Muitos reclamam que Hollywood domina a indústria do cinema. Falam que os filmes americanos são “empurrados” para os consumidores, pela montanha de dinheiro gasta pelos estúdios. Mentira. A relação é inversa. Hollywood tem tanto dinheiro assim para gastar com filmes justamente porque agrada os consumidores. Cada novo filme é uma espécie de project finance, um empreendimento próprio. São milhares de alternativas, todos disputando a verba privada de financiamento. E a lógica vigente é a do livre mercado, onde o cliente final que seleciona os vencedores. Quem agrada o público, conhece o sucesso. E por isso vemos todo tipo de filme sendo produzido lá, para a satisfação de inúmeros nichos de mercado.

Já no Brasil, em estilo semelhante ao francês, são os produtores que buscam satisfação nos filmes, sem muita preocupação com o público. Ora, esta é a receita certa para o fracasso de bilheteria, e a concomitante verba minguada. Resta apelar para o “paizão”, o Estado. Assim, o dinheiro do público é usado na marra para o financiamento justamente de filmes que o público não quer. Para piorar a situação, o governo ainda cria as “cotas de tela”, uma reserva de mercado, impondo determinado número de dias mínimos para a exposição dos filmes nacionais. É a mesma “lógica” da fatídica Lei da Informática, onde, para “proteger” a indústria nacional, os consumidores são obrigados a comprar gato por lebre.

Já passou da hora dos produtores – de sites, filmes ou qualquer outra coisa – sairem do âmbito do achismo e começarem a atender os interesses de quem indiretamente financia seus serviços: os usuários, o público.

–

Ipojuca Pontes: Cineasta, jornalista, escritor e ex-Secretário Nacional da Cultura.

Rodrigo Constantino: Economista pela PUC-RJ, com MBA de Finanças pelo IBMEC. Trabalha no mercado financeiro desde 1997. É autor dos livros “Prisioneiros da Liberdade” e “Estrela Cadente: As Contradições e Trapalhadas do PT”, ambos pela editora Soler.

Referências: Cinema Trash, O cinema da mentira.

Sem categoria

Hierarquia das Necessidades no Design

7 Comments

Para o design ter sucesso ele deve primeiro atender as necessidades básicas das pessoas antes de tentar satisfazer necessidades de níveis mais altos. Os 5 elementos chave na hierarquia das necessidades no design são os seguintes (seguindo o padrão de Maslow)

FUNCIONALIDADE (fisiologia): significa atender os requisitos mais básicos do design. Exemplo: um aparelho de DVD deve, pelo menos, ser capaz de gravar e reproduzir vídeos.
Valor agregado pelo design é muito baixo.

Os 5 elementos chave na hierarquia das necessidades no design
ESTABILIDADE (Segurança): significa estabelecer uma performance estável e consistente. Exemplo: um aparelho de DVD deve reproduzir vídeos com qualidade e o mecanismo (software/hardware) não deve apresentar defeitos.
Valor agregado pelo design é baixo.

USABILIDADE (relacionamento): significa disponibilizar uma interface simples, fácil de ser usada e que perdoe erros do usuário. Exemplo: programar um aparelho de DVD para começar a gravar um filme a uma determinada hora deve ser fácil e o sistema deve ser tolerante em relação a erros cometidos pelo usuário.
Valor agregado pelo design é moderado.

PROFICIÊNCIA (estima): significa disponibilizar recursos para melhorar o modo como os usuários fazem as coisas. Exemplo: um aparelho de DVD que consiga pesquisar e gravar programas baseado em palavras chave escolhidas pelo usuário.
Valor agregado pelo design é alto.

CRIATIVIDADE (realização pessoal): é o nível na hierarquia onde todas as necessidades foram atendidas e onde as pessoas começam a interagir com o design de formas inovadoras. O design passa a ser usado para criar e explorar áreas que estendam a experiência do usuário.
Valor agregado pelo design é muito alto.

De acordo com a teoria de Maslow, as necessidades fisiológicas, as necessidades de segurança e algumas das necessidades sociais (funcionalidade, confiabilidade e usabilidade se aplicado ao design) são fatores de desmotivação. A Teoria de Maslow diz que a satisfação destas necessidades é básica; já a ausência da satisfação destas necessidades não motiva ninguém, pelo contrário, desmotiva.

Já as necessidades sociais, as necessidades de “status” e de estima e as necessidades de auto-realização são fortes fatores motivacionais, ou seja, na ausência dessas necessidades satisfeitas as pessoas batalham para tê-las satisfeitas, motiva as pessoas a alcançar a satisfação destas necessidades.

Quando se fala em design agregando valor a algum produto, serviço, interface, é preciso ter a clareza que ele terá o efeito desejado quando passar a atender os níveis mais altos da pirâmide (proficiência e criatividade). Mas até chegar a estes níveis, os primeiros devem necessariamente ser atendidos.

este material faz parte de minha palestra no WUD (World Usability Day, edição do Rio Grande do Sul)

Arte

Lei de Fitts no web design

1 Comment

Na ergonomia, a lei de Fitts (“Fitts’ law“) é um modelo de movimento humano que prevê o tempo necessário para rapidamente mover a uma área designada com base na distância e tamanho desta área. Publicado por Paul Fitts em 1954, a lei de Fitts é usado como modelo para o ato de apontar no mundo real (por exemplo, com uma mão ou dedo) e no mundo virtual (em computadores, como por exemplo com um mouse). Afinal de contas, o que diz a lei de Fitt e por que ele está sendo usado muito hoje em dia na web?

Continue reading Lei de Fitts no web design →

Arte

Experimentação no Design

8 Comments

Estava eu ajudando a montar um palco para a apresentação das crianças do colégio onde minha namorada trabalha. Crianças de no máximo 5 anos iam subir no palco e mostrar aos pais como conseguem, todas juntas, fazzer a mesma coisa.

Na hora isso me veio como um pano que limpa a lente do óculos. Como eu não vi isso antes? Desde pequenos somos moldados a seguir um padrão. E agora o que o design tem haver com isso? Ora, uma coisa que eu já tinha escutado, é como as instituições não deixam seus aluno “pirar”. Por mais que alguns não concordem, todo material produzido já é formatado para o mercado.

Nas instituições pagas o projeto sempre é voltado para o mercado e nas federais, voltadas para atender (teoricamente) a sociedade em retribuição do aprendizado oferecido.

Tendo como comparação as maiores e melhores instituições do mundo, os projetos lá apresentados (em pelo menos uma parte do curso) fogem de qualquer paradigma. Vejam, não estou dizendo que deveríamos deixar livre a criação para sempre, mas que ela devia ser promovida uma vez que no decorrer da carreira do designer ele vai encontrar milhares de barreiras.

Digo isso, analisando muito projeto “novo” também.

A experimentação é um processo de qualquer ser vivo em desenvolvimento. É natural. Muita coisa, aqui no Brasil em relação a profissão de designer, tem que ser administrada mas a criatividade (nata de quem nasce por essas bandas) deve ser “focada a ser solta”.

Uma coisa que sempre complica essa história é o dinheiro. Se não for rentável até um período de tempo, pode esquecer. Verdade, mas eu acho que o valor de idéias podem ser mais rentáveis. Ou não.

Arte

Onde está o Design? – PARTE 1

6 Comments

Me animei com a idéia e por isso começo aqui uma série de textos falando de objetos do nosso dia-a-dia. Pretendo falar bem e mal, ok?

Deixo também aberto o título para qualquer um fazer uma análise do que quiser.

Bom, vamos lá.

Comecei com algo do meu cotidiano direto. Meu perfume. “HOJE” da Natura.

Eu não sei ao certo qual foi a intenção. Acho que devem ter ocorrido várias reclamações sobre “o dispositivo dosador de emissão da solução” ou alguém pediu um modelo novo sem tampa.

perfume.jpg

Na Posição 1, o sistema fica “destravado” e então você aperta e se perfuma. Na posição 2 fica travado, portanto não abaixa e não sai nada.

Até aqui tudo bem, mas o problema é que o material, que é feito e esse formato totalmente redondo, faz com que, na hora de usarmos o produto, o sistema gire e você não consegue usar porque trava.

O seu procedimento seguinte é: fazer voltar para a posição 1 e usá-lo. Eu sei que a foto está ruim, mas ela mostra uma realidade comum. A falta de pesquisa. Ninguém testou isso para notar que girava e travava na hora de usar?

A economia da tampa, na minha opinião, não trouxe melhoria estética nem funcional. Mas se trouxe uma economia na produção, é outra história. Ainda nem sabemos se esse material novo é reciclável!

Sou muito mais o modelo antigo, mas que a inovação venha no formato do vidro.

Arte

A preferência dos cliques dos internautas

2 Comments

Para quem se interessa em pesquisas sobre o ambiente WEB, segue abaixo um resumo da 4ª edição da pesquisa que a WBI Brasil realiza sobre a preferência dos cliques nas pesquisas feitas nos mecanimos de busca.

Resultados espontâneos lideram cliques nas pesquisas em mecanismos de busca.
Pesquisa da WBI Brasil mostra que 100% dos usuários da Internet usam mecanismos de busca e os resultados espontâneos ganham disparado dos links patrocinados na preferência dos cliques.

Do universo pesquisado, 60% clica nos três primeiros resultados da busca, enquanto 80% não vão para a segunda página dos resultados.
Os usuários também preferem os resultados espontâneos em lugar dos links
patrocinados.

Os dados completos e os gráficos da pesquisa podem ser acessados neste link.
Contribuição: Vanda Araújo – [email protected]

Arte

Dia Mundial da Usabilidade

4 Comments

Nos dias 07, 08 e 09 de novembro acontece , no Rio de Janeiro, o “World Usability Day” (Dia Mundial da Usabilidade), com o objetivo de divulgar a importância da engenharia da usabilidade e do design centrado no usuário.

O evento tem caráter global, e é organizado por voluntários de diversos países. No Brasil, os eventos ocorrem no Rio em três datas, nos seguintes locais: ESPM, SENAC e UERJ. Recife (Livraria Cultura) e Curitiba (auditório da UNINDUS) também tomarão parte nos dias 08 e 09, respectivamente.

Oficinas e palestras fazem parte da programação. As inscrições são gratuitas. Informações detalhadas encontram-se no site: www.wudrj.com.br

Fonte: www.wudrj.com.br

Sem categoria

usando&começando

3 Comments

Como estou começando junto com o blog, lembrei de um fato que aconteceu recentemente, dois amigos e eu estávamos em um bar em Curitiba, de repente chegou uns caras bem estranhos, fantasiados e tirando fotos, após algumas fotos no bar ele entregou o cartão com o site que estavam inaugurando na cidade, hoje resolvi entrar nesse site ver como tinham ficado essas tais fotos, me deparei com um site com um conteúdo excepcional, mas com uma usabilidade horrível, não consegui encontrar as tais fotos, em lugar algum do site.

Então como pude constatar eles fizeram todo o layout do site, desenvolveram os sistemas e até correram atrás para divulgar o mesmo, porém esqueceram do Design de Interação, que deve ser utilizados em grandes portais, para facilitar a interação do usuário com o site, facilitando o acesso ao que o mesmo quer.

Como resultado, vários visitantes a menos, porque quem não encontra o que quer na primeira vez não volta para procurar outra, nos próximos artigos ajudarei como corrigir este tipo de problema em grandes portais, para você que pretende ter um ou que deseja aprofundar seu conhecimento em design de interação.