Composição da Interface

A composição dos elementos criados foi definida por uma necessidade de simetria na barra superior para alojar o título da forma mais harmoniosa possível. Para tal, tiveram de ser selecionados os elementos mais relevantes para serem colocados na barra superior e os mais aptos para a barra inferior. Assim foi definido que a barra superior seria a barra de funçõese a inferior a barra de ferramentas.

Na barra de ferramentas foram colocadas as funções de navegação, visualização, áudio e partilha.

Na barra superior encontra-se o botão de ação para a página inicial, a informação contex- tual, o título, o sistema de procura e o sistema de limpeza da cena para modo contemplativo.

Figura 19: Barra superior de funções e inferior de ferramentas

O sistema de radar foi colocado na posição superior esquerda por comparação com so- luções de outras aplicações, pelo que esta posição parece ser a convencionada para apre- sentação de mini-mapas. A gaveta de legenda ficou na posição imediatamente superior à barra inferior. Esta solução foi adotada para que, quando esta barra se encontrasse fecha- da, fosse visionada como uma ferramenta anexada à barra de ferramentas. Deste modo, quando aberta, pode coexistir com a cena sem grande penalização ao nível da visualização do panorama 360º. A gaveta de mapa foi colocada verticalmente no lado direito do ecrã para equilibrar a cena e para explorar espaço inutilizado. (figura 20)

As funções de acesso recorrente foram posicionadas nos cantos do ecrã por serem zonas de acesso rápido pela forma como os utilizadores seguram fisicamente no dispositivo. As ferramentas foram posicionadas na barra inferior para evitar situações em que a mão pas- sando à frente do ecrã, restringisse a visualização.

Figuras 20 e 21: Captions e Mapa e Manipulação do dispositivo6

6 _{Consultado em: http://www.ausbt.com.au/photos/view/maxsize:467,260/4d43b905dd084974a122481a767f1341-ipa-}

2.3.9 Dificuldades

Após a composição dos protótipos para guia de montagem da interface foi procedida a implementação da interface gráfica. Nesta fase surgiram um conjunto de dificuldades, re- sultantes da especificidade do Unity 3D e de alguns aspetos funcionais, como por exemplo a escalabilidade do programa.

Aquando da importação dos widgets para a cena em Unity 3D, ocorreu um erro grave, originado por problemas com a sua transparência.

A fim de manter a escalabilidade do elemento, foram cortados os cantos, duas áreas do caixilho e um pedaço do fundo do widget, para que esses elementos se combinassem por repetição em mosaico.

Para tal, os fragmentos retirados tiveram de ter o mesmo tamanho e o centro teve de ser posicionado no mesmo ponto para que o encaixe fosse perfeito. (figura 22)

Nesta medida ocorreu um erro que inviabilizou esta abordagem de trabalho. O mosaico estava a criar um efeito nefasto na visualização semelhante ao da figura 23.

Figuras 22 e 23: Pedaços retirados e Efeito de cor nos mosaicos

2.3.9.1 Primeira solução

Decidiu-se assim mudar a abordagem, passando por criar um Atlas no Unity 3D para agregar toda a informação visual num só ficheiro de imagem. O Atlas é uma imagem, resultado da compilação de todas as imagens em cena, que as agrega e que pode ser usada

através de mapeamento por coordenadas. Esta imagem é gerada automaticamente e tem como principal benefício o tamanho reduzido que ocupa em comparação com a soma de todos os ficheiros separados.

Figura 24: Atlas agregador

A utilização do Atlas criou um aumento dos efeitos de imagem previamente descritos, abrindo caminho para uma reflexão acerca da origem do problema.

Após alguma pesquisa nos fóruns da comunidade Unity 3D, foi encontrada a explicação: o efeito da imagem referia-se ao modo de filtragem do Unity 3D que, aquando do uso de imagens em resoluções acima da que foi usada na sua criação, faz uma interpolação linear para calcular a imagem com resolução superior. O grande problema é que uma imagem com transparência criada em Adobe Photoshop CS6, ou outro editor gráfico, codifica o canal de transparência como sendo branco com 0% de opacidade. Por esta razão, a in- terpolação necessária para calcular a imagem com maior resolução, usa o valor de cor da imagem e o branco do canal de transparência, criando os efeitos nefastos visualizados na imagem.

2.3.9.2 Segunda solução

A solução consistiu em assegurar que os pixeis transparentes tivessem um valor de cor coincidente com os pixeis vizinhos que se encontravam visíveis. Deste modo, quando ocorre a interpolação, a cor resultante é a cor apropriada.

Os ajustes do canal alpha passaram por transformar a transparência num canal separado da imagem, enquanto o resto da imagem passou a ser uma mancha uniforme de cor. Após a recodificação da imagem para PNG, o efeito manteve-se. Esta falha, aparentemente, de- veu-se a um conjunto de plugins usados na transformação do canal de transparência que eram incompatíveis com a versão de Adobe Photoshop CS6 utilizada.

2.3.9.3 Resolução final

A resolução final deste problema foi obtida através de programação, onde foi aplicado um

offset nas imagens de modo a não serem visualizados os cantos. De seguida foi efetuada

uma nova separação dos componentes dos widgets, na qual foram novamente isolados os cantos, duas áreas do caixilho, uma vertical e uma horizontal, e um pedaço do fundo.

Figura 25: Cortes das áreas ativas

Em conformidade com o tamanho dos widgets, foram criados vários mosaicos horizon- tais e verticais que foram transformados em gameobjects do Unity 3D, ou seja, por cada mosaico um novo retângulo era criado. A situação ficou resolvida deste modo mas não foi a forma ideal, dado que teria sido mais vantajosa, ao nível de memória despendida, a replicação da textura num único retângulo que representasse a totalidade do widget.