TAG | design

Quem trabalha desenvolvendo intefaces para a Web sabe a complicação que é acertar um script JavaScript ou CSS para funcionar bem nos diversos navegadores, para ser mais especÃfico, as diferenças entre Firefox e Chrome são mÃnimas, mas a situação é bem diferente no caso do Internet Explorer, que não segue os padrões Web.
Mesmo a Microsoft tendo trabalhado para reverter esta situação e de fato a última versão do Internet Explorer estar bem melhor, reverter este legado é algo que vai demorar um pouco mais para acontecer, mas o que fazer quando um CSS não funciona como deveria para o Internet Explorer?
Fazer dois arquivos CSS e integra-los ao HTML conforme o browser é algo funcional, porém é de difÃcil manutenção, mas não entre em pânico (pelo menos por agora), temos uma solução que vai permitir que você utilize somente um arquivo CSS e que dentro deste arquivo seja especificado quando utilizar o seletor e para que browser.
Veja um exemplo abaixo:
#idObjeto {width: 100%} * html #idObjeto {width: 80%} /* IE */ |
Nem é preciso explicar muito, mas vejamos, temos um caso fictÃcio de que em todos os browsers o width de uma DIV fica ótimo em 100%, menos para o Internet Explorer que fica melhor em 80%, então o script acima vai fazer duas chamadas para o mesmo seletor e o *HTML irá exemplificar que para os browsers padronizados será um caminho, neste caso o 100% e para o Internet Explorer será 80%.
Simples, funcional e de fácil manutenção, pois fica tudo bem acessÃvel dentro de um único arquivo em um único local.
Leia mais:
Chrome · design · firefox · internet · Internet Explorer · Microsoft
Design de interfaces: a simplicidade
Sem comentários · Post por Petter Rafael em Apple, Clientes, Google, Linux, Microsoft
O design de intefaces em sistemas operacionais é realmente algo interessante, pois é a partir do sistema operacional que a interface é propagada a diversos outros software aplicativos, há cerca de 5 anos atrás o auge do momento era incrementar o sistema operacional como um todo com muita transparência, efeitos de transição, sombras e modelagem 3D.
Todo esse apetrecho gráfico tinha um custo e muitas vezes o custo era alto, já que naquela época o desempenho das placas de vÃdeo on-board e até mesmo das placas mais básicas off-board eram fracos demais para tanta exigência, pois apesar de suprir a demanda de processamento gráfico do sistema operacional era preciso suprir os demais elementos executados no sistema, como software aplicativos e jogos.
A solução era comprar cada vez mais hardware gráfico de ponta e o custo para isso era alto, foi neste ambiente que surgiu o Windows Vista e a interface Aero da Microsoft, aliás, este Windows é considerado o pior Windows da história e boa parte desta culpa é devido a alta demanda de hardware, principalmente hardware gráfico para suprir as exigências do Aero que por estar vinculado ao DirectX era um verdadeiro glutão de recursos, tudo por uma interface da área de trabalho.
Neste quesito o Linux sempre teve larga vantagem sobre o Windows, devido ao seu caráter open-source ele implementa OpenGL e está livre do DirectX, o projeto Compiz surgiu e provou que com menos hardware era possÃvel implementar muito mais no Linux e o sistema operacional no final ainda ficava muito mais fluÃdo e responsivo do que o Windows Vista.
Como a exigência de placas gráficas cada vez mais potentes para a execução de softwares além de jogos a indústria de deste segmento de hardware sorria sozinha, notadamente a nVidia e a ATI (hoje AMD), afinal a demanda por seus produtos cresceu consideravelmente.
Mas sinceramente, uma interface rebuscada de tantos artefatos visuais era bonita e só, era boa para impressionar colegas e amigos, mas no trabalho diário, além de consumir recursos de hardware toda aquela profusão visual era cansativa, estressante e enjoava.
Com a chegada do Windows 7, embora ainda utilizar a interface Aero, a Microsoft dava sinais de uma mudança, assim como outros grandes players, toda esta lógica ilógica visual parecia deixar de fazer sentido, e quando éramos brindados com hardware gráfico cada vez mais potentes e a excelente novidade de placas gráficas on-board com excelente desempenho a exemplo do vÃdeo on-board fornecido pela ATI-AMD.
Então projetos da Apple em seu iOS, Google com o Android e Chrome OS (sim, ele existe) e a Microsoft com o seu novÃssimo Windows 8 trouxeram ao grande público sistemas minimalistas, sem artefatos visuais, planos, cores sólidas e linhas retas, estava lançado um design de interface, enfim, um design limpo, direto e extremamente objetivo que auxilia muito na produtividade e usabilidade do sistema como um todo e que em tempos de boom mobile é uma interface muito bem trabalhada para para smartphones e tablets.
Para quem notou a ironia fica por conta de que quanto mais recursos de hardware nós temos menos iremos exigir, caso esta escola de design decole e se perpetue por mais alguns anos.
Leia mais:
Apple · Clientes · design · Google · Linux · Microsoft · windows
É Ubuntu trocando a interface (o que está causando uma verdadeira Guerra Santa na comunidade), Windows trocando a interface e porque o Google ficaria de fora?
O primeiro produto foi o buscador que teve a sua página principal remodelada e na sequencia vários outros produtos foram sendo alterados.
Agora foi a vez do Gmail.
Nova tela de logon do Gmail
A sua tela de logon está utilizando a nova identidade visual do Google e também podemos notar algumas melhorias, principalmente em termos de segurança, pois o controle de phising está mais pró-ativo e interage mais com o usuário.
Dentro em breve todos os produtos do Google já estarão sob a nova identidade visual e padronizados. Se isso é parte de uma estratégia maior ninguém tem certeza, mas para uma alteração global deste porte provavelmente algum benefÃcio o Google irá obter.
Leia mais:
Sim, é isso mesmo que você acabou de ler no tÃtulo.
O layout é 90% da informação, não só falando de sistemas de informação, mas de qualquer informação que você absorve no meio em que está.
Quem aqui nunca se rendeu a um produto com um rótulo bonitinho (mesmo que o produto não fosse tão bom), quem aqui nunca acho lindo um relatório cheio de gráficos (mesmo que outro relatório tinha informações de maior qualidade sem os gráficos).
De pouco adianta se você fornece informações de altÃssima qualidade, mas sem nenhuma regra de layout, com a disposição e formatação das informações totalmente desgrenhada. Se o seu concorrente fornecer um nÃvel menor de informações, porém com alta acuracidade visual o projeto será fechado com ele.
Quer atingir a perfeição, ou pelo menos chegar perto?
EquilÃbrio.
Isso mesmo equilibre o nÃvel de informação com a apresentação adicionando um bom impacto visual. Você será imbatÃvel, ou só se deixará abater se usarem criptonita.
Leia mais:
Realmente foi-se o tempo que a interface do Linux era sinônimo de mal gosto de meia dúzia de nerds que sabiam somente de programação e nada de usabilidade e demais recursos gráficos, o Ubuntu 11.04 está com a interface totalmente reformulada.
Com a adoção do Unity o Ubuntu reformula a interação com o conceito de desktop e aproveitando os recursos avançados da implementação do Compiz irá causar muito hype. Dentre as novidades destacamos:
- Funções especiais para cada software utilizando o botão direito do mouse;
- Acionando a tecla super mais alguma outra tecla o software equivalente será maximizado;
- Arrastando um arquivo para a barra de tarefas automaticamente o software utilizando para executa-lo será invocado;
- Novo forma de organizar Ãcones, barra de tarefas e execuções de software;
- Barra superior como menu de contexto;
- As mais novas versões do Firefox 4 e LibreOffice também já estão incluÃdas no pacote.
Como já é de praxe (e bem diferente do Windows) todos esses recursos gráficos não fazem grandes exigências com relação ao hardware e são executados de maneira rápida e sem gargalos, embora segundo conste para hardwares não compatÃveis com o Unity a interface padrão utilizada hoje deverá tomar o lugar.
Com certeza a versão 11.04 do Ubuntu irá causar uma revolução no modo como utilizamos e entendemos a semântica no uso de um computador e pelo rumo tomado pela Canonical há anos atrás quando iniciou o processo de melhoria na interface, abandono da cansativa cor marrom e na contratação de profissionais especializados em design e interface.
Estaria nascendo um novo sistema operacional? Um sistema operacional que possa rivalizar e até mesmo superar a semântica de uso de um MAC OSx?
Leia mais:
Tipografia na Web, agora existe sim
Sem comentários · Post por Petter Rafael em Imagem & Criação, Webdesign
Muitos designers, geralmente os que possuem pouca experiência, trocam blocos de texto por imagens, pelo simples fato que não podem garantir que o usuário que acessar o site terá determinado tipo de fonte utilizado.
Agora esse problema está praticamente solucionado, com suporte para o Internet Explorer versões 7, 8 e 9 com fontes EOT e Firefox, Opera, Chrome e Safari para fontes TTF e OTF agora é possÃvel definir uma fonte remota para ser utilizada no site.
A funcionalidade @font-face do CSS é empregada para esse fim, porém em conexões lentas o designer do site se primeiro renderizado para depois a fonte ser carregada (lembre-se que a fonte agora é remota) o que pode frustar um pouco, mas também podemos contornar esse problema (e economizar banda) definindo para que primeiro a fonte seja utilizada local e somente se não existir que seja utilizada a fonte remota.
Observe o código abaixo:
@font-face { font-family: nome_familia_fonte; src: local(sua_fonte.otf), url(sua_fonte.otf); } |
Note que primeiro definimos a fonte local, para depois definirmos a fonte remota.
Veja também um exemplo de como utilizar o @font-face criado:
p { font:36px helveticaneue, Arial, Tahoma, Sans-serif; } |
Fonte: Tableless
Leia mais:
Essa é uma pergunta que move multidões e ambos os adeptos de um ou outro software sempre defendem com unhas e dentes a sua escolha.
Mas afinal de contas, qual é o melhor? Photoshop ou o Gimp?
A grande maioria dos designers gráficos respondem a pergunta acima sem nem pensar: Photoshop.
Mas precisamos avaliar melhor e ver se realmente as vantagens do Photoshop frente ao Gimp são realmente justificáveis em cada caso.
Digo, com total convicção, de que boa parte dos profissionais seriam mais beneficiados pelo Gimp se resolvecem dar um chance ao Gimp em detrimento ao Photoshop e é aà que encontramos o maior problema na adoção do Gimp, a sua curva de aprendizado. Não que o Gimp seja de utilização complexa se comparado ao Photoshop, o fato é que o Photoshop por estar a anos no mercado já deixou sua metodologia de uso carimbada em muitos profissionais e ditou até agora as normas de como e quando determinado recurso deve ser implementado na editoração gráfica.
Então quando for editar sua foto ou ainda se você é um usuário iniciante tente dar uma chance ao Gimp, sei que em determinadas situações ele não será tão bom quanto o Photoshop, mas levando em consideração essa lista de vantagens do Gimp frente ao Photoshop digo que vale realmente a pena tentar utiliza-lo, afinal, você pode se surpreender.
Leia mais:
Essa é uma pergunta estratégica, se o Opera tem se mostrado tão bom em testes (inclusive no Acid2) por que então ele é tão pouco utilizado pelo usuário comum?
E para piorar, uma simples busca pela Internet revela uma verdadeira legião de usuários que fizeram o download, instalaram e simplesmente após alguns dias de uso abandonaram o Opera em um canto qualquer do HD ou pior ainda, desinstalaram ele.
A resposta apesar de complexa é simples: a interface não fala a linguagem do usuário.
A regra é clara, se um software qualquer por melhor que seja não se comunicar de forma clara e objetiva através de sua interface com o usuário, esse software estará fadado ao fracasso.
Vejam o nascimento do Firefox, apesar de não ser uma cópia descarada do então reinante absoluto e sozinho Internet Explorer o mesmo tinha uma interface que o usuário identificava facilmente os recursos disponÃveis e a forma de aplicação de tais recursos era tão ou mais simples que a sua localização na interface.
Era simples para qualquer usuário do Internet Explorer começar a utilizar o Firefox, não havia segredos na metodologia de uso e a interface era intuitiva.
Quer um exemplo mais hardcore?
Veja o caso do Google Chrome, a sua interface minimalista é radicalmente diferente dos lÃderes Internet Explorer e Firefox, porém a comunicação do software via interface com o usuário é simples e direta. O usuário rapidamente se identifica e assume de forma simples o comando do Google Chrome.
Agora instale o Opera e tente utiliza-lo.
Percebe como o usuário facilmente se perde no meio da interface?
Parece que o Opera faz questão de querer reinventar a roda e pensa que conseguirá fazer a Internet se render aos seus encantos.
Opera, não adianta, você não tem força para fazer isso com a mente dos usuários. Ou o Opera muda os seus conceitos de interface ou o seu futuro será ainda mais obscuro como um simples melhor browser que ninguém utiliza.
Leia mais:
Muita gente está em uma sinuca de bico, quer usufruir de toda a gama de recursos e complementos que o Firefox oferece porém quer também aproveitar a interface minimalista do Google Chrome (o browser, não o sistema operacional).
Para azar do Google e sorte de muita gente é possÃvel deixar o Firefox com a cara e trajeitos do Chrome, basta saber quais complementos utilizar. Para facilitar a vida de todo mundo abaixo vou listar alguns complementos que funcionando em conjunto fazem o Firefox ser quase que idêntico ao Chrome (em aparência, pois em recursos possui muito mais).
- Chromin Frame: Vai ajustar alguns detalhes no posicionamento da janela do Firefox no sistema operacional;
- Chromifox Companion: Recursos adicionais para configuração do tema igual ao Chrome;
- Download Statusbar: Para deixar a janela de downloads no rodapé do Firefox;
- Locationbar²: Para dar realce nos domÃnios na barra de endereços do Firefox;
- Crystal Chrome: um ótimo tema para Firefox realmente muito próximo do Google Chrome.
Pronto, é só reiniciar o seu Firefox que ele terá a semelhança visual com o Google Chrome, herdará também os principais recursos de usabilidade do Chrome que o Firefox ainda não tem e manterá o seu bom e velho Firefox de sempre.
Leia mais:
design · Diversos · firefox · Tecnologia
A mudança drástica de visual do Ubuntu que nunca acontece
2 comentários · Post por Petter Rafael em Imagem & Criação, Linux
A cada 6 meses o Ubuntu lança uma nova versão e toda vez acontece a mesma coisa, um monte de gente fica alardeando que desta vez o Ubuntu vai revolucionar a interface e lançar um visual totalmente novo e revolucionário.
E toda vez ninguém acerta, o Ubuntu melhora o visual e a usabilidade, adiciona novos efeitos e recursos gráficos mas nada tão reacionário quanto a torcida fica agitando, mas isso é bom para o Ubuntu e para o usuário.
Já notaram como toda vez que uma nova versão do Windows é lançada é um Deus nos acuda para utilizarmos e acostumarmos com a gritante diferença visual?
É isso que o pessoal do design da interface do Ubuntu deve pensar, melhorar o visual é lógico e saudável, tanto que tem sido feito a cada nova versão do Ubuntu lançada, mas ficar trocando toda a identidade visual a cada nova versão é algo ruim para o usuário que terá um esforço extra para reaprender a utilizar a nova interface.
Para o pessoal que torce para que a próxima versão do Ubuntu se pareça com a interface do Mac: compre um Mac e seja feliz!
