ERIC MYER é um fotógrafo dono da Eric Myer Photography, Inc, sedeada na Califórnia. Especialista em fotografias de “retratos” e “paisagens”, tem como principais clientes empresas na área da publicidade, editorial e corporativa.
Tecnologias utilizadas pelo site
O site utiliza como tecnologia base o HTML. Recorre também a Folhas de estilo internas (CSS).
Na estrutura HTML também está embebido um ficheiro Flash (700x400px) para a animação da página inicial. Recorre também a JavaScript.
Interface e Navegação
A navegação no site é feita através da movimentação do rato pelos botões apresentados ao longo das páginas. Os botões são claros e coerentes, o que nos permite uma navegação simples e previsível.
De uma forma geral todas as páginas têm ligação umas com as outras, isto é, em qualquer página que nos encontremos podemos “saltar” para qualquer uma das outras, visto todas elas possuírem a mesma barra que apresenta sempre os links básicos. Existe também sempre presente um vínculo para a página inicial (página de apresentação).
Os “links básicos” são apresentados numa barra superior que encabeça todas as páginas – acaba por funcionar como identidade gráfica do site – e faz com que nenhuma página se torne um “beco sem saída”.
Em cada página, referente a cada link básico, são colocados sublinks numa coluna vertical, que nos permite navegar pelos conteúdos de cada uma das páginas correspondentes.
Toda a navegação é feita “internamente” com a excepção de um link – no separador Bio/News – News – Communication Arts Interactive Annual 9 –, que faz com que se abra uma nova página (http://www.commarts.com/ca/interactive/cai03/22_ia03.html).
Como podemos verificar a navegação é muito directa, sem grandes perdas de tempo e com a mínima quantidade de passos para chegar ao que pretendemos.
Existe também uma área reservada ao feedback – contact – que se faz directamente por email para o fotógrafo ou então enviando um comentário directamente da página. É importante referir que não existe nenhuma referência – sem ser na source – para o webdesigner.
3. Layout / Design
Percebemos nitidamente que neste site o conteúdo está dividido em unidades lógicas dada pela composição muito objectiva da página.
Existem inconfundivelmente três campos básicos, que se repetem em todas as páginas:
Uma barra de navegação horizontal superior que funciona como identidade e que consoante a nossa navegação pelos botões vai assumindo novas formas, passa de tipografia de caixa alta, corpo pequeno, não serifada para um corpo maior em caixa baixa e serifada, a cor continua sendo a mesma.
Uma campo à esquerda onde aparecem os links referentes a esse separador. Os links quando se encontram no seu estado “normal” apresentam texto em caixa alta serifada, e o cinzento como cor base. Quando o rato passa por cima ou é clicado muda de cor, para a cor assumida de início pelo browser, mantendo a tipografia.
Um terceiro campo do lado direito, onde são apresentadas as informações relacionadas com os sublinks.
As informações dos sublinks Editorial, Corporate, Advertising e Exhibition, são percorridas por links que se encontram no campo correspondente – o da direita.
Estes links são organizados por ordem numérica e quando o rato passa por cima fica destacado com a cor assumida pelo browser no inicio, mas quando clicado não acontece nada, não muda de cor nem de forma.
Além de organizados numericamente pode-se observar um pormenor da imagem num quadrado que se encontra ao lado, mas isto só acontece quando o rato passa por cima do respectivo número, já que quando é clicada a imagem do quadrado fica a preto, não mostrando nada.
As imagens seleccionadas são visualizadas do lado direito desta lista e também podem ser mudadas ao clicar nas setinhas que se encontram por baixo, mas neste caso ficaremos sem ter conhecimento do número a que correspondem na lista ao lado. Todas as imagens possuem legendas.
É importante destacar que todos estes links são imagens e quando o usuário optar por desactivar as mesmas a página deixa de ser inteligível e navegável, embora utilize em alguns casos – poucos – o elemento “ALT” a cor da tipografia é preta, isto é, da mesma cor do fundo, logo fundem-se fazendo com que não seja perceptível a sua presença.
A colocação dos elementos – imagens, por exemplo – é feita através de tabelas, mas tendo em conta que o site recorre a CSS poderia ter aproveitado esta tecnologia para fazer esta configuração de uma forma mais coesa.
Tipograficamente temos a utilização de tipos com e sem serifa, e caixa alta e caixa baixa. Em termos cromáticos, temos sem dúvida a predominância do preto – como fundo – e mais quatro cores: o cinza, o branco, o “amarelo” e a cor que por defeito a página assume ao submeter o URL, que pode variar entre: o red, orange, blue, green, e purple. Esta cor é assumida aleatoriamente através de um script do tipo javascript embebido no código html e que depende da hora a que o URL é acedido.
Outra característica a destacar é o blur utilizado nos lados da barra de navegação superior, semelhante ao que acontece na animação da página inicial.
Duma forma geral temos uma hierarquia funcional e equilibrada que garante o acesso rápido às informações, embora pudesse ser mais cuidada e muito melhor definida, para que transmitisse maior coesão gráfica.
4. Estrutura do site / Arquitectura da informação
A estrutura do site apresenta a informação numa ordem lógica, definida através de uma grelha ortogonal. É uma estrutura em teia, que permite que todas as páginas tenham ligação umas com as outras, independentemente da página que nos encontremos podemos direccionar-nos para qualquer uma das outras.
Sendo assim temos uma página inicial que funciona como pagina de introdução/apresentação, esta página direcciona-nos para o resto do conteúdo do site. O mesmo acontece nas restantes páginas, de qualquer uma podemos voltar para a página inicial.
Nesta primeira página é-nos apresentado o nome do fotógrafo e da empresa, juntamente com uma animação em flash6 de um dos seus trabalhos. Para os usuários mais impacientes tem um link – enter – para saltar a introdução e passar ao site propriamente dito. Para aqueles que manifestem algum interesse pela animação resta esperar alguns segundos (50/60 segs.) que a passagem será feita automaticamente.
A seguir entramos no separador “Stereotypes” que apresenta mais pormenorizadamente o trabalho exposto na animação da página inicial e onde o usuário pode interagir directamente seleccionando os pares de fotos que quer usar para compor a fotografia ou pode simplesmente clicar no botão e isso acontecer automática e aleatoriamente.
As restantes páginas são menos interactivas, embora seja o utilizador responsável pela navegação.
5. Adequação ao público-alvo
Não me parece que exista um público-alvo muito definido e restrito. No entanto penso que se dirige mais a pessoas que se interessem por esta área ou empresas que andem a procura deste tipo de serviços. Desta forma, o site adequa-se ao público, embora pense que poderia ser mais arrojado, pensado e cuidado.
Também não podemos esquecer a necessidade do plug-in (para o flash6) para poder ver a animação da página inicial, isso poderá fazer com que o público se torne mais limitado, embora hoje em dia quase todas as “máquinas” já tenham este plug-in instalado, agravado pelo facto de não existir nenhuma referência para tal necessidade. É importante referir que o usuário que não tenha instalado o plug-in do flash e visite o site, não conseguirá passar além da página de apresentação já que nesta não é apresentado absolutamente nada.
Também é importante referir que o site foi construído para ser visto num ecrã com resolução mínima 1024x768px. Quando utilizada uma resolução 800x600px os conteúdos saem fora dos limites da janela, obrigando-nos a utilizar o scroll – horizontal e vertical. [topo]
http://www.ericmyer.com/
