Design Adequado

O que significa adequado?

O design é uma representação formal e portanto, costuma ser o primeiro ponto de contato entre a pessoa e o produto / serviço / pessoa.

Para que um design seja adequado deve dispor da informação necessária para conhecer ao cliente, mercado, consumidores, produto / serviço.
Com esta informação deve-se realizar os protótipos necessários.
Desenvolver o design final.

Estilos Vs. Adequação

Há designers / consultores / "gurus" que defendem um estilo frente à adequação do design à necessidade.

O estilo seja "neutro", "barroco", "limpo", "alemão", "americano" não passa de um estilo e portanto, não pode ser o ponto de partida para o desenvolvimento do design.

O ponto de partida deve ser o entendimento da necessidade do cliente.

As necessidades do cliente podem depender de uma infinidade de fatores e não se pode generalizar. Cada momento, cada região, cada canal, cada preço, cada consumidor, faz com que a necessidade seja diferente.

A melhor ferramenta que o designer pode demonstrar é a compreensão e o entendimento para poder realizar a solução gráfica.

Design

A adequação do design frente ao estilo faz com que os valores do mesmo sejam algo mais universais e duradouros.

Ou seja, se alguém defende um estilo (neutro, barroco) pode-se ver comprometido pela realidade do ambiente.

Os valores do design com os me sinto identificado costumam ser do estilo:
•Ajuda.
•Cumprimento.
•Duradouro.
•Integração (com as pessoas, sistemas, usuários).
O design deve ajudar às pessoas.
A ajuda pode ser de muitos tipos, pode ajudar às pessoas a ganhar mais dinheiro, a ler com mais facilidade, a navegar mais rápido, a desfrutar o momento.

O design cumpre sua função
O design deve cumprir a função atribuída. O design é uma "utilidade" para chegar a um fim.

Duradouro.
O efêmero nos leva ao consumismo desmedido. Tender a que o design sirva hoje, amanhã, dentro de 10 anos. Esta lição eu levei tempo para aprendê-la.

Integração
Este conceito faz referência a que o design há de se integrar nos processos naturais das pessoas. Não há que criar novos obstáculos, e sim, dotar às pessoas de melhores ferramentas.

Design não é o design gráfico e não é o design industrial

Em muitas conversas cita-se "design" aplicando-o sem muito critério às disciplinas que passam pelo design industrial, gráfico, identidade...

Visto desde fora não há problema, porém, desde dentro é como se falamos de esportes e citamos o futebol, as barras paralelas e a natação como se fossem a mesma coisa. Suponho que uma coisa é ser espectador de sofá e outra é subir em uma barra paralela e dar dois mortais.

Design gráfico. Comunicação
Cor. Forma. Tipografía. Imagens.

Design industrial. Produto.
Processos industriais. Ergonomia. Materiais.

"Design". Processo "criativo".
O processo criativo de resolver um problema pode-se chamar de "design", mas é um termo tão vago que em geral não quer dizer nada.

Buscar soluções sem ataduras

O design deve se adequar à resolução do problema, evitando que um estilo nos condicione uma forma de pensar ou buscar soluções.
Extraído de criarweb.com

Definições de tela

Quando se trabalha com distintas definições, como na web, devemos escolher o público objetivo da página e construí-la para que esse público a veja bem, mas não devemos nos esquecer dos demais, de modo que estes também a visualizem, sendo possível sem nenhum problema.

Por regra geral, a maioria dos internautas dispõe de uma definição de 800x600 ou superior. Por isso, o habitual é desenhar a web para que esse grupo de usuários a veja corretamente. Também existem pessoas que acessam a Internet com definições menores, a 640x480, mas cada vez são menos. Para o caso de 1024x780, esta definição é bastante grande e somente os usuários com telas boas, configuradas de maneira correta, a usam. A definição de 1024x780 deixa muita gente de fora, por isso ainda não devemos utilizá-la, ademais, estes usuários poderão ver também a página com uma definição menor sem muito prejuízo. Por outro lado, a definição de 640x480 é muito pequena e já muito poucos usuários a utilizam, por isso é melhor desenhar utilizando um espaço maior. No entanto, se a página a desenvolver é muito corporativa, porque pertence a uma empresa importante e tem de ser bem vista em todas as máquinas possíveis, seria razoável utilizar a definição de 640x480, pois esta nos assegura que todo mundo poderá ver bem o web.

Uma vez escolhido o público objetivo, devemos compor as páginas e as imagens para que sejam bem vistas na definição de tela que estes utilizarem, de modo que nunca saiam as feias barras de deslocamento horizontais. Para isso, calcularemos o tamanho dos elementos da página conscientemente.

Outra coisa que se pode fazer é aplicar aos elementos da página os tamanhos (atributo width) utilizando porcentagem, deste modo, se ajustarão ao tamanho da definição do usuário automaticamente. Entretanto, as imagens não suportam o tamanho em porcentagens, ou seja, não podemos ajustá-las assim automaticamente, e em qualquer caso, não desejaremos que a imagem se deforme ao alterar artificialmente seus tamanhos através desses atributos. Sendo assim, para o caso das imagens seguiremos com a necessidade de criá-las sem ultrapassar o espaço disponível na definição horizontal do público objetivo.

Vamos ver qual seria a forma de trabalho para planejar uma página com tabelas.


1.Falamos de um desenho com tabelas porque quase sempre é mais adequado do que um desenho com frames ou camadas, mas isto é outra discussão.
2.Criar uma tabela ao princípio da página, que inclua toda a página, e lhe atribuímos o tamanho em pixels. Dependendo da resolução do tipo de audiência, o tamanho da tabela variará, mas sempre serão 21 pixels menos que a definição do objetivo. Estes pixels restantes se utilizam para as barras de deslocamento verticais. Por exemplo, se desenhamos para uma resolução de tela de 800x600, o tamanho da tabela será de 779 pixels. Em Windows XP as barras de deslocamento ocupam um pouco mais que em sistemas anteriores. Antes da aparição de Winwdos XP, reservar 20 pixels para as barras de deslocamento já era suficiente. Também se podem criar as tabelas em porcentagens, mas isto fará com que a página se estique e se encolha dependendo da definição. Não é um efeito muito desejável para os web designers, porque o efeito de ver a página mais esticada ou encolhida de como a desenhamos, costuma ser contra-producente, além de significar um esforço extraordinário.
3.Incluimos na etiqueta BODY da página os atributos: topmargin=0 leftmargin=0 marginheight=0 marginwidth=0. Estes atributos servem para eliminar as margens da página e que as tabelas se situem ocupando todo o espaço da página. Os dois primeiros atributos são para Internet Explorer, os dois seguintes são para Netscape Navigator, temos que colocar os quatro atributos para assegurarmos que se veja bem em todos os navegadores mais importantes.
4.Se desejarmos incluir margens nas páginas, podemos jogar com os atributos cellspacing e cellpadding, na tabela principal, para conseguí-los. No caso de que não gostemos deste método, podemos incluir células adicionais na tabela principal, que sejam transparentes (não colocar conteúdo), às que lhes atribuímos os tamanhos desejados para as margens. O método que utilizo habitualmente é este último e quase sempre ponho os atributos cellspacing e cellpadding a zero.
O código de uma página seguindo estes conselhos seria o seguinte:

Isso é tudo, lembre-se que você sempre poderá ver o código fonte das páginas web que gosta, para ver como fizeram os outros web designers.

Então Você Quer Ser Um Webdesigner?

Desde que o orkut surgiu, aqueles que trabalham na área de web design encontram nas comunidades relacionadas um lugar para tirar dúvidas, trocar experiências e divulgar seus trabalhos. A mesma coisa aconteceu com quem ainda não está na profissão, mas pretende.

Mas no meio de tanta gente, podemos perceber o despreparo da grande maioria. Muitos cursos de web design hoje em dia ensinam as ferramentas, mas não ensinam conceitos fundamentais; aí surgem as dúvidas, muitas vezes bobas aos olhos de quem já está na profissão.

A maior dificuldade que eu tenho percebido é na hora de começar a carreira. Como publicar seu primeiro site, montar um portfólio, saber quanto cobrar de um cliente... Tudo o que as escolas deveriam ensinar, mas que a gente acaba tendo que aprender na base da tentativa e erro.

Por isso, resolvi escrever essa série de artigos, baseados nas minhas experiências pessoais e nas opiniões de profissionais da área.

Cinco coisas que você deve saber antes de começar
Aprender HTML e CSS

Seus sites vão ficar mais leves, sem os códigos desnecessários dos editores. Além disso, você terá muito mais facilidade para programar dominando as tags do HTML, e será muito mais fácil entender como funcionam as novas tecnologias, como XHTML e XML.

Investir num domínio próprio e numa hospedagem paga

Além de evitar propagandas desagradáveis, que tiram seu layout do lugar e podem até trazer spywares para o computador do usuário, os hosts pagos oferecem muito mais ferramentas para melhorar seu site. Além disso, um domínio próprio mostra muito mais profissionalismo (ver mais no tópico sobre portfólio).

Aprender teoria das cores, usabilidade e tipografia

O básico do básico. Assim você garante que seus sites vão ser visualmente agradáveis, a navegação será mais fácil para o usuário e a leitura dos textos não ficará cansativa.

Cuidar da acessibilidade

Não é o usuário que tem que adaptar seu computador ao seu site, e sim o contrário. Portanto, esqueça o "este site é melhor visualizado em 800x600" e prepare seus sites para todos os tipos de usuários, resoluções, navegadores e, de preferência, dispositivos possíveis.

Estudar, estudar, estudar

Não é porque você concluiu aquele super curso de web design que está livre da aprendizagem. A web é uma área em constante mudança, por isso procure conhecer todas as novas tecnologias, ferramentas e conceitos que surgem a cada dia. Não se aprofunde somente nas que você mais gosta: procure ter uma noção geral de cada uma delas, porque você nunca sabe quando pode surgir um trabalho que precise justamente daquilo que você não domina.

Todo esse conhecimento está cada vez ao seu alcance. Pra começar, use o Google, o melhor lugar para encontrar dicas e tutoriais. Apenas lembre-se de que aprendendo inglês, suas chances de encontrar o que procura são infinitamente melhores.

Montando seu portfólio
Seu portfólio é a reunião de todos os seus trabalhos, uma vitrine da sua capacidade e imaginação, e principalmente a primeira impressão sobre seu profissionalismo. Por isso, você precisa tomar muito cuidado com os pequenos detalhes, pra não manchar a sua imagem logo de cara:

Se você quer mesmo investir na carreira, considere mesmo a possibilidade de adquirir um domínio .com.br, .com ou .net, além de um bom plano de hospedagem. Endereços como o .cjb.net mostram falta de profissionalismo - "se este trabalho não vale o investimento de um endereço pago, por que devo contratá-lo?". Além do mais, hosts gratuitos ficam fora do ar muito mais tempo do que deveriam - e se o seu portfólio não abrir, existem outros na fila esperando pelo seu lugar.

Cuidado com o português. Chega a ser desnecessário dizer isso, mas revise seu texto, peça para um amigo ler e procurar pelos erros que você possa ter deixado passar, ou mesmo use o Word para corrigir a grafia das palavras. Nada, nada queima mais o seu filme do que um erro grave.

Nem pense em começar sem nenhum trabalho pra mostrar. Vá para o computador e crie um site sobre algum assunto que você gosta - exercite toda a sua capacidade, abuse das novas ferramentas, teste novos conceitos. É o momento em que você está livre, sem depender da opinião de quem está te pagando pra trabalhar, e mostrando tudo o que você é capaz de fazer. Nada mais amador do que encontrar num portfólio uma mensagem "em breve meus trabalhos".

E se você ainda não tem muito trabalho para mostrar, nem pense em fazer volume enchendo seu site de textos. Ninguém tem paciência para ler, e o cliente não está preocupado com a sua metodologia de trabalho ou com aquele trecho da sua apostila do cursinho que diz que "a Internet é um mercado em expansão bla bla bla". E nunca, jamais, sob hipótese alguma diga que seu preço é mais baixo, por qualquer razão que passe pela sua cabeça. Isso soa "estou desesperado por isso topo tudo".

Se você quiser listar suas habilidades nos programas e recursos da área, monte um mini currículo. Assim, essa informação será direcionada a um possível contratador, enquanto o usuário comum e cliente em potencial não recebe informações desnecessárias (se ele quiser saber das suas habilidades, saberá onde encontrá-las). Mas não se esqueça que Windows, Office e Internet você tem obrigação de saber, não é mérito nenhum.

E quando o desespero por falta de trabalho bate, a gente tem vontade de sair fazendo sites de graça, só pra exercitar e ter o que mostrar, não é mesmo? Não, não é. Aceitar um site por um preço muito abaixo do mercado é errado - muitos novatos têm feito isso sem se preocupar com as conseqüências que isso traz para a nossa carreira. Se você quer um cliente e ele não pode te pagar, faça uma permuta: você monta um site e ele te dá cinco aulas na auto-escola, quatro jantares no restaurante ou o que puder oferecer. É muito mais ético e vantajoso pros dois lados.

Em contra-partida, existem instituições sem fins lucrativos que adorariam contar com um voluntário para criar seu site. Procure a instituição mais perto de você e ofereça seu trabalho - se for para trabalhar de graça, que seja por uma causa nobre.

Se todos os seus sites devem funcionar em todas as resoluções de tela, como eu disse anteriormente, imagine seu portfólio! Um "escolha aqui a sua resolução" logo na cara do site mostra que você não tem nenhuma flexibilidade; algumas pessoas nem mesmo sabem o que isso significa! É você que tem que se adaptar ao computador do usuário, e não o contrário. O mesmo vale para quantidade de cores na tela, navegador ou sistema operacional.

Quando se fala de navegador, muita gente acha que se 95% das pessoas que acessam um site usam Internet Explorer, é pra essa maioria que o site deve funcionar. Isso é um grande erro – e se no meio dos outros 5% estiver justamente aquela pessoa que entra no seu portfólio querendo te contratar? Se o seu site não funcionar, você perdeu a chance. Por isso, teste todos os seus sites pelo menos nos navegadores mais conhecidos, em várias resoluções, sistemas operacionais e processadores diferentes. Evite surpresas desagradáveis.
http://www.infowester.com