Desenho global da interface.

No estudo do aspecto gráfico das interfaces, a caraterização de elementos como o movimento, o espaço, a aparência, a textura e o som, constituiem um ponto central. No entanto, como grande parte destes elementos já estão claramente definidos nas orientações da Apple para a interface do iOS (HIG), grande parte das funcionalidades da aplicação TCRIO dependem dos mesmos princípios de design largamente documentados em estudos técnicos como o de Layon (2011). A metáfora da interface do iOS da Apple tem ganho popularidade pelo elevado cuidado despendido no estudo dos elementos de design de interação ligados ao movimento do gesto humano e às caraterísticas espaciais do contexto gráfico onde se interligam conceitos de interação digitais e simulação de conceitos reais do mundo analógico (como por exemplo interruptores físicos de aparelhos eletrónicos).

A Apple tem tido um papel revelevante na atual tendência de simplificação das interfaces das aplicações móveis, este fato contribui para que a gestão do tempo de interação tenha sido consolidada na lógica imprimida pelas regras definidas pelo HIG da Apple. Mesmo no que diz respeito à utilização de sons, a Apple já disponibiliza informações para desenvolvimento de aplicações consoante o tipo de contexto de interação.

Hoje os designers de aplicações para o iOS podem centrar toda a sua atenção na lógica de interação e na aparência das interfaces, porque grande parte da interação terá de respeitar as regras definidas pela Apple. Grande parte destas regras estão em constante melhoramento no sentido de aumentar a consistência da interação, reduzir o esforço cognitivo, minimizar funcionalidades, aumentar o envolvimento, prevenir erros técnicos, aumentar a sensação de controlo e de satisfação.

Dada a variabilidade de contextos em que os sistemas tecnológicos de comunicação móvel podem ser utilizados, no design de interfaces para estes dispositivos a aparência é um aspeto não- negligenciável. Dan Saffer enfatiza que “o aspecto oferece pistas em como a interface se comporta e como se deve interagir com ela” (Saffer, 2007 - p.48).

Segundo Saffer (2007, p.49), para além do potencial da “aparência para transmitir conteúdos emocionais” (por exemplo, se a interface é harmoniosa ou berrante? se é útil ou obsoleta?), o “aspeto também pode transmitir outros atributos que podem ser significativos” (por exemplo, se é uma interface complexa ou intuitiva? se é apropriada ou descontextualizada?).

Aproveitando as recomendações deste especialista definimos as seguintes variáveis na determinação da aparência geral da interface da aplicação TCRIO: Proporção, Estrutura, Tamanho, Forma e Cor (Saffer, 2007, p.49).

Proporção

A aplicação móvel TCRIO enquadra-se na categoria de aplicações mais ligadas à produtividade e à gestão de interações sociais entre alunos e professores. E tal como a maioria das aplicações deste tipo, a interface favorece uma experiência de utilização que se pretende prática, rápida e eficiente.

Algumas aplicações como o Linkedin e o Foursquare apresentam apenas uma interface única para diferentes proporções de ecrã, seja um iPhone ou um iPad (ver figura 95). Dada a quantidade de informação a disponibilizar, a frequência de utilização e o tipo de contexto em que são utilizadas estas aplicações, por vezes não há necessidade de desenvolver aplicações distintas.

Figura 95 – Exemplo de aplicações que mantém o foco no pequeno ecrã do iPhone.

Tal como se pode observar na figura anterior, o iOS da Apple permite “ampliar” a proporção da imagem, numa aplicação desenvolvida originalmente para dispositivos mais pequenos, preservando a qualidade.

As regras de desenvolvimento estabelecidas pelas orientações da Apple para a interface do iOS (HIG) garantem a qualidade do aspeto gráfico assim como a mesma lógica de interação.

Este aspeto revelou-se muito importante no desenvolvimento da aplicação TCRIO, porque esta foi desenhada para funcionar de forma estável e coerente, independentemente do tamanho do ecrã.

Contudo a interface da aplicação móvel TCRIO foi especificamente desenhado para garantir a integridade gráfica nos ecrãs mais pequenos, estando sempre acessível em qualquer lugar e em qualquer dispositivo de comunicação móvel como o iOS da Apple.

Na figura 96 (ver na página seguinte) é possível compreender a forma como a interface da aplicação TCRIO se ajusta nos dois tamanhos de ecrã:

Figura 96 – Proporção da interface no iPad e no iPhone.

Estrutura

Toda a estrutura da interface se desenvolve como uma natural extensão da metáfora gráfica do iOS da Apple, recorrendo com frequência a grelhas de tabelas e à linguagem iconográfica para gerar maior valor comunicacional e equilíbrio entre os diversos elementos gráficos.

Como se pode observar na figura 97, os pictogramas surgem sempre do lado esquerdo, respeitando o sentido de leitura ocidental.

Figura 97 – Exemplo de uma célula da tabela que constitui a listagem de notificações.

Os pictogramas assumem bastante destaque nesta interface não só por diminuírem o esforço cognitivo durante a consulta de informação na aplicação, mas também por constituírem um suporte bastante eficaz para todo o mecanismo de alertas acionado pelo sistema.

Tamanho

Graças às normas estabelecidas pelo HIG do iOS da Apple, a interface da aplicação TCRIO assume um grau de flexibilidade suficiente para ser apresentado em diferentes dispositivos com ecrãs de diferentes dimensões e resoluções, tal como se mostra na tabela 12:

Tabela 13 – Resolução do ecrã dos dispositivos móveis com o iOS da Apple.

Dispositivos Largura Altura PPP

iPhone 320 480 153,600

iPhone 4s 640 960 3,145,728

iPad 2 768 1024 786,432

No estudo do tamanho dos diversos elementos gráficos, como os pictogramas e botões, seguimos as orientações da Apple que, obedecendo à Lei de Fitts, sugere que a “dificuldade para atingir um alvo depende da relação entre a distância do alvo e o seu tamanho” (Fitts, 1992). Desenvolvemos então estes elementos tendo em conta que quanto maior o alvo e mais perto da origem do movimento, mais fácil é de acertar, tornando a interface muito mais confortável.

Forma

Os cantos redondos em quase todos os elementos visuais do iOS da Apple tornaram-se uma imagem de marca quase incontornável deste tipo de aplicações móveis, como demostra a figura 98:

Figura 98 – Elementos gráficos que caraterizam a metáfora da interface do iOS da Apple.

Para tornar o design da interface da aplicação TCRIO o mais coerente possível com a metáfora sugerida pela Apple, também recorremos ao mesmo princípio formal suavizando os cantos da maioria dos botões, caixas de texto e pictogramas, tal como transparece na imagem 99 (ver na página seguinte):

Preservando a uniformidade da interface foi utilizado o mesmo tipo de pictogramas de navegação, tipos de letra e sinais de contagem de novas mensagens que já vêm por omissão no SDK do iOS da Apple.

O formato das tabelas e das células que estruturam os campos de listagem das notificações também mantêm os cantos redondos.

A alteração mais expressiva que fizemos aos objetos da Apple foi transformar a popular barra de pesquisa numa barra de separadores destinados a filtrar a listagem das diferentes categorias das notificações, tal como se observa na figura 100:

Figura 100 – Adaptação de objetos da Apple a novas funcionalidades da interface.

Apesar das vantagens de utilizar objetos da biblioteca do SDK da Apple, que já têm muitos comportamentos e funcionalidades atribuídas de raiz, a introdução de novos elementos gráficos tornou-se bastante difícil dada a complexidade e a reduzida flexibilidade das normas HIG impostas pela Apple para a interface do iOS.

O SDK disponibiliza um emulador (ver figura 101) que permite pré-visualizar as alterações gráficas introduzidas, contudo todos os ajustes tiveram de ser feitos em linha de código, o que dificultou ainda mais todo o processo de posicionamento, redimensionamento e alteração das propriedades dos novos elementos que foram sendo criados.

Cor

Um aspeto que também faz parte da imagem de marca da interface do iOS da Apple é a utilização de cores planas e com um número muito reduzido de tons. Da mesma forma optámos por uma cor predominantemente azul claro e plano, que contrasta quer com a cor viva dos pictogramas das diferentes categorias das notificações, quer com as áreas brancas que assinalam os campos destinados ao texto das informações. Foram utilizadas no total 5 cores diferentes na interface, com funções comunicacionais distintas, tal como se observa na figura 102 (ver na página seguinte):

Figura 102 – Cores utilizadas na interface da aplicação TCRIO (ver versão colorida no anexo VII).

A temperatura das cores foi estudada para acompanhar o processo enfático do sistema de alertas, sendo as cores quentes utilizadas nos pictogramas e sinais de alerta mais importantes: cor vermelha no ícone da categoria de agendamentos e a bola que assinala as novas notificações, e a cor laranja no ícone da categoria dos avisos. As cores frias, apesar de assinalarem informações que disponibilizam um maior tempo de resposta, também foram escolhidas com uma simbologia própria: a cor verde no ícone da categoria do projeto assinala de forma subtil a afirmação positiva ao livre percurso implícito aos projetos, enquanto a cor violeta da categoria dos documentos reforça a tranquilidade transmitida pela confiança necessária à partilha de documentos que requerem responsabilidade conjunta.