Você está na página 1de 50

Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan.

Donec egestas ultricies venenatis. Aliquam ac tortor ut odio. Duis luctus posuere tellus, vitae placerat mauris iaculis at. Fusce mattis, risus eu aliquet placerat, nulla nibh volutpat lorem, eget ultrices enim tellus eget orci. Integer vel arcu ac ipsum condimentum semper vitae ac nibh.

Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio.

uaQuest - manual de identidade


Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio. Duis luctus posuere tellus, vitae placerat mauris iaculis at. Fusce mattis, risus eu aliquet placerat, nulla nibh volutpat lorem, eget ultrices enim tellus eget orci. Integer vel arcu ac ipsum condimentum semper vitae ac nibh.

02

manual de idenitidade da marca


Disciplina de Projecto 2012 Universidade de Aveiro - Novas Tecnologias da Comunicao

Elaborado por: 49490 - Daniel Silva 50011 - Joo Costa


Orientadores: Helder Caixinha Licnio Mano

Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio.

uaQuest - manual de identidade


Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio. Duis luctus posuere tellus, vitae placerat mauris iaculis at. Fusce mattis, risus eu aliquet placerat, nulla nibh volutpat lorem, eget ultrices enim tellus eget orci. Integer vel arcu ac ipsum condimentum semper vitae ac nibh.

03

ndice
introduo nome registo grfico marca rea de proteco verses monocromticas sistema cromtico sistema cromtico secundrio sistema tipogrfico hierarquia tipogrfica aplicao sobre fundos reduo de escalas aplicao cone da aplicao cones e controlos grelhas de cinzentos interface da aplicao interface da aplicao e grelhas de cinzentos interface e contexto 05 06 07 07 08 09 10 11 12 13 14 15 16 16 17 20 29 38 47
Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio.

uaQuest - manual de identidade


Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio. Duis luctus posuere tellus, vitae placerat mauris iaculis at. Fusce mattis, risus eu aliquet placerat, nulla nibh volutpat lorem, eget ultrices enim tellus eget orci. Integer vel arcu ac ipsum condimentum semper vitae ac nibh.

04

Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio.

uaQuest - manual de identidade


Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio. Duis luctus posuere tellus, vitae placerat mauris iaculis at. Fusce mattis, risus eu aliquet placerat, nulla nibh volutpat lorem, eget ultrices enim tellus eget orci. Integer vel arcu ac ipsum condimentum semper vitae ac nibh.

05

introduo
O presente documento tem por objectivo apresentar duas seces correspondentes ao projecto uaQuest, desenvolvido no mbito da disciplina de Projecto do curso de Novas Tecnologias da Comunicao. A primeira parte visa a apresentao do manual relativo marca uaQuest. Este documento contempla o conceito, o logtipo e a sua forma de uso, sistema cromtico e sistema tipogrfico, e por ltimo, o estudo de escalas. A segunda seco apresenta o ambiente e organizao grficos da aplicao a desenvolver. Engloba assim, o estudo de grelhas dos ecrs nicos, apresentando as grelhas de cinzentos com as medidas dos vrios elementos, os ecrs nicos finalizados demonstrando o estilo grfico a adoptar, a apresentao dos cones da aplicao e a sua forma de uso.

Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio.

uaQuest - manual de identidade


Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio. Duis luctus posuere tellus, vitae placerat mauris iaculis at. Fusce mattis, risus eu aliquet placerat, nulla nibh volutpat lorem, eget ultrices enim tellus eget orci. Integer vel arcu ac ipsum condimentum semper vitae ac nibh.

06

nome
O nome vai construir a essncia da marca e no deve ser escolhido de forma leviana. No caso deste projecto procurou-se efectuar uma escolha que fosse de encontro aos ideais do projecto - desafio, descoberta, interaco social. Sendo que o projecto engloba um jogo de descoberta da Universidade de Aveiro, pretende-se tambm que o nome seja identificativo do local. O nome uaQuest remete-nos para os valores que pretendemos efectivamente transmitir. A "Quest" reflecte um sentido, um objectivo, algo a ser atingido, descoberta. O ua efectua precisamente a ligao universidade desejada. Na escolha do nome foi tido em conta, no s, o facto de no existir, mas tambm o seu significado. A parte Quest tem um significado bastante enraizado entre os amantes de Role Playing Games, tornado o grau de associao ao conceito pretendido ainda maior.

The right name is timeless, tireless, easy to say and remember; it stands for something, and facilitates brand extensions. Its sound has rhythm
Wheeler, A. (2009), Designing Brand Identity

Na definio do nome procurmos que tivesse uma sonoridade agradvel e uma fcil pronncia. facilmente pronuncivel mesmo por pessoas que no dominem o ingls, uma vez que pronunciado da mesma forma que escrito.

Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio.

uaQuest - manual de identidade


Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio. Duis luctus posuere tellus, vitae placerat mauris iaculis at. Fusce mattis, risus eu aliquet placerat, nulla nibh volutpat lorem, eget ultrices enim tellus eget orci. Integer vel arcu ac ipsum condimentum semper vitae ac nibh.

07

registo grfico

marca

Pretendia-se que o logtipo assumisse um estilo futurista, de modo a transmitir os valores do projecto e a ideia de tecnologia e inovao associada prpria universidade. A partir desta ideia, o nome, foi personalizado partindo do uso do tipo de letra Orbitron, o qual foi estilizado para se assemelhar a uma interface futurista. A aparente quebra do nome representa os enigmas, as peas que os jogadores tm de encaixar para completar o jogo. O logtipo desenvolvido recorrendo ao azul uaQuest e ao branco, sendo utilizados brilhos e transparncias para acentuar o estilo pretendido. O branco representa a luz, sendo associado ao xito e ao sucesso, e o azul representa a compreenso, a tranquilidade, a paz, associando desta forma a universidade a um local calmo de conhecimento e sucesso, valores positivos a transmitir aos novos alunos.

Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio.

uaQuest - manual de identidade


Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio. Duis luctus posuere tellus, vitae placerat mauris iaculis at. Fusce mattis, risus eu aliquet placerat, nulla nibh volutpat lorem, eget ultrices enim tellus eget orci. Integer vel arcu ac ipsum condimentum semper vitae ac nibh.

08

registo grfico

rea de proteco

As reas de proteco do logtipo foram definidos tendo em conta a medida dos tringulos existentes. Desta forma preserva-se o logo contra outros elementos grficos. A rea de proteco exterior, refere-se rea mnima entre o logtipo e outros elementos, enquanto que a rea interna, corresponde distncia entre o texto e as linhas contentoras.

Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio.

uaQuest - manual de identidade


Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio. Duis luctus posuere tellus, vitae placerat mauris iaculis at. Fusce mattis, risus eu aliquet placerat, nulla nibh volutpat lorem, eget ultrices enim tellus eget orci. Integer vel arcu ac ipsum condimentum semper vitae ac nibh.

09

registo grfico

verses monocromicas

As verses monocromticas devem ser utilizadas, em detrimento da policromtica, sempre que no for possvel garantir a sua correcta utilizao em cores. Foram assim desenvolvidas duas verses, fundos escuros e claros.

Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio.

uaQuest - manual de identidade


Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio. Duis luctus posuere tellus, vitae placerat mauris iaculis at. Fusce mattis, risus eu aliquet placerat, nulla nibh volutpat lorem, eget ultrices enim tellus eget orci. Integer vel arcu ac ipsum condimentum semper vitae ac nibh.

10

registo grfico

sistema cromtico
web: #22DDDD rgb: r34 g211 b211 cmyk: c60% y0% m22% k0%

A aplicao baseia a sua identidade essencialmente em trs cores. O fundo da aplicao ir utilizar um padro semelhante ao carbono, no entanto, quando no possvel, ir ser utilizada a cor azul-escura. A cor principal de toda a aplicao reside no azul uaQuest, assim denominado para fcil referncia, sendo utilizado para todos os elementos da interface. O branco insere-se para efeitos de contraste, como os elementos textuais. O azul-escuro encontra a sua utilizao apenas em certos itens da aplicao utilizando-se como fundo semi-transparente. O vermelho utilizado para apresentar certos elementos em caso de erro. Este novamente utilizado de forma semi-transparente para suavizar a tonalidade.

azul uaQuest

web: #EC1C24 rgb: r236 g28 b36 cmyk: c1% y99% m97% k0%

web: #141414 rgb: r20 g20 b20 cmyk: c73% y67% m66% k81%

web: #FFFFFF rgb: r255 g255 b255 cmyk: c0% y0% m0% k0%

vermelho

azul escuro

branco

Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio.

uaQuest - manual de identidade


Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio. Duis luctus posuere tellus, vitae placerat mauris iaculis at. Fusce mattis, risus eu aliquet placerat, nulla nibh volutpat lorem, eget ultrices enim tellus eget orci. Integer vel arcu ac ipsum condimentum semper vitae ac nibh.

11

registo grfico

sistema cromtico secundrio

A aplicao possui uma palete de trs cores secundrias utilizadas especialmente para a construo dos itens.

web: #F7EE5C rgb: r247 g238 b92 cmyk: c6% y0% m77% k0%

web: #50C878 rgb: r80 g200 b120 cmyk: c6% y0% m77% k0%

web: #94D74A rgb: r148 g215 b74 cmyk: c46% y0% m91% k0%

amarelo claro

verde esmeralda

verde claro

Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio.

uaQuest - manual de identidade


Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio. Duis luctus posuere tellus, vitae placerat mauris iaculis at. Fusce mattis, risus eu aliquet placerat, nulla nibh volutpat lorem, eget ultrices enim tellus eget orci. Integer vel arcu ac ipsum condimentum semper vitae ac nibh.

12

registo grfico

sistema tipogrfico

A aplicao utiliza essencialmente dois tipos de letra. Um dedicado aos titulos e elementos da interface - Orbitron. Este tipo de letra vai de econtro ao estilo futurista da aplicao, atravs do seu estilo rectilneo. Para os elementos textuais foi escolhida uma letra, que alm do facto de remeter para o futurismo, de fcil leitura - Muli.

Orbitron
ABCDEFGHIJKLMNOPQSTUVWXYZ abcdefghijklmnopqstuvwxyz 0123456789

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean imperdiet sodales leo non faucibus. Curabitur est lectus, vehicula at tempus nec, hendrerit non nunc.

Muli
ABCDEFGHIJKLMNOPQSTUVWXYZ abcdefghijklmnopqstuvwxyz 0123456789

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean imperdiet sodales leo non faucibus. Curabitur est lectus, vehicula at tempus nec, hendrerit non nunc.

Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio.

uaQuest - manual de identidade


Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio. Duis luctus posuere tellus, vitae placerat mauris iaculis at. Fusce mattis, risus eu aliquet placerat, nulla nibh volutpat lorem, eget ultrices enim tellus eget orci. Integer vel arcu ac ipsum condimentum semper vitae ac nibh.

13

registo grfico

hierarquia tipogrfica

Durante a aplicao, o tipo de letra Orbitron apenas deve ser utilizado em elementos com um nmero de caracteres reduzidos, como botes ou identificadores de ecr. Esta deve ser apresentada a branco com um tamanho de 14px. Para assegurar uma correcta legibilidade, os textos e elementos com um elevado nmero de caracteres devem ser apresentados com o tipo de letra Muli, tambm a branco, mas com 12px.

Nome do elemento com 14px


Tipo de letra para texto com 12px. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean imperdiet sodales leo non faucibus. Curabitur est lectus, vehicula at tempus nec, hendrerit non nunc.

Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio.

uaQuest - manual de identidade


Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio. Duis luctus posuere tellus, vitae placerat mauris iaculis at. Fusce mattis, risus eu aliquet placerat, nulla nibh volutpat lorem, eget ultrices enim tellus eget orci. Integer vel arcu ac ipsum condimentum semper vitae ac nibh.

14

registo grfico

aplicao sobre fundos

O logtipo no encontra utilizao em fundos claros, no entanto foi desenvolvida uma verso policromtica adaptada para ser utilizada caso necessrio. aqui apresentada a aplicao do logtipo da uaQuest sobre vrios tipos de fundos grficos, representando vrias tonalidades.

Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio.

uaQuest - manual de identidade


Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio. Duis luctus posuere tellus, vitae placerat mauris iaculis at. Fusce mattis, risus eu aliquet placerat, nulla nibh volutpat lorem, eget ultrices enim tellus eget orci. Integer vel arcu ac ipsum condimentum semper vitae ac nibh.

15

registo grfico

reduo de escalas 100%

O logtipo ir sobretudo ser integrado numa interface mvel, no entanto pode assumir vrias dimenses consoante o aparelho. Torna-se pertinente apresentar o logtipo em vrias dimenses para compreender se este se mantm legvel. , assim, apresentado a 100%, 75%, 50% e 25%.

75%

50%

25%

Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio.

uaQuest - manual de identidade


Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio. Duis luctus posuere tellus, vitae placerat mauris iaculis at. Fusce mattis, risus eu aliquet placerat, nulla nibh volutpat lorem, eget ultrices enim tellus eget orci. Integer vel arcu ac ipsum condimentum semper vitae ac nibh.

16

aplicao

cone da aplicao

Sendo uma aplicao para um dispositivo mvel tornou-se necessrio desenvolver um cone para o menu do prprio telemvel. Foi utilizado o tema do logtipo principal, no entanto apenas se utilizou o Q como como smbolo para uaQuest. Utilizou-se esta abordagem uma vez que, sendo a nica letra maiscula no nome, um elemento distintivo.

48x48px

O cone foi desenvolvido com 48px de lado, correspondentes aos valores definidos para os cones num dispositivo Android de densidade mdia. Ser posteriormente necessrio modificar o cone para os dispositivos de densidade baixa, alta e muito alta.

Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio.

uaQuest - manual de identidade


Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio. Duis luctus posuere tellus, vitae placerat mauris iaculis at. Fusce mattis, risus eu aliquet placerat, nulla nibh volutpat lorem, eget ultrices enim tellus eget orci. Integer vel arcu ac ipsum condimentum semper vitae ac nibh.

17

aplicao

cones e controlos

So aqui apresentados so vrios cones a serem utilizados na aplicao, sendo que estes variam entre o azul e o branco representando os vrios estados. Todos os elementos possuem um brilho de 5px que, quando desenhado em azul, apresentam uma transparncia de 50% e, quando desenhado em branco, a transparncia reduzida para 30%.

Confirm

Confirm

Confirm

Confirm

Os botes iro possuir quatro estados, sendo representados pela seguinte ordem: activo, focado, pressionado, bloqueado. Tm uma dimenso de 110x30px.

Os botes referentes aos itens do inventrio, por exemplo, apenas so necessrios trs estados: activo, focado, pressionado. Neste caso o ltimo estado, representado a vermelho, indica um erro e apenas utilizado quando o utilizador tenta combinar itens incompatveis na mesa de montagem. Dimenso de 48x48px.
Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio.

uaQuest - manual de identidade


Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio. Duis luctus posuere tellus, vitae placerat mauris iaculis at. Fusce mattis, risus eu aliquet placerat, nulla nibh volutpat lorem, eget ultrices enim tellus eget orci. Integer vel arcu ac ipsum condimentum semper vitae ac nibh.

18

aplicao

cones e controlos

Os cones referentes aos marquers no mapa, apresentam-se em duas cores. O marquer azul representa a posio do utilizador no mapa, enquanto o vermelho representa o ponto de interesse para onde se tem de dirigir.

Para apresentar as vrias caractersticas que os itens podem conferir aos avatares foram desenhados cinco cones. Estes so construdos com apenas uma cor, azul uaQuest, utilizando transparncias para simular a alterao de tonalidades. Da esquerda para a direita, os cones representam: energia, vida, defesa, ataque e velocidade. So utilizados com uma dimenso mxima de 20x20px.

Itens so criados atravs de formas geomtricas sem qualquer ligao sua funo, gerando assim cdigo novo recheado de futurismo. Estes cones so apenas exemplos, devendo sempre estar centrados na caixa. Numa caixa de 48x48 no devem exceder os 28x28px, enquanto numa caixa de 64x64 no devem exceder os 38x38px
Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio.

uaQuest - manual de identidade


Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio. Duis luctus posuere tellus, vitae placerat mauris iaculis at. Fusce mattis, risus eu aliquet placerat, nulla nibh volutpat lorem, eget ultrices enim tellus eget orci. Integer vel arcu ac ipsum condimentum semper vitae ac nibh.

19

aplicao

cones e controlos
Os cones apresentados representam as opes passives de serem tomadas no menu da mesa de combate: combate, trocas e loja. No sendo necessrio o estado bloqueado, estes cones tambm apresentam apenas trs estados: activo, focado, pressionado. Sendo os cones principais no menu, so apresentados com uma dimenso de 100x100px

Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio.

uaQuest - manual de identidade


Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio. Duis luctus posuere tellus, vitae placerat mauris iaculis at. Fusce mattis, risus eu aliquet placerat, nulla nibh volutpat lorem, eget ultrices enim tellus eget orci. Integer vel arcu ac ipsum condimentum semper vitae ac nibh.

20

aplicao

grelhas de cinzentos

Com a grelha de cinzentos pretende-se demonstrar como os elementos esto organizados na interface e quais as dimenses que estes iro assumir. Ecr de login - Apresentado ao utilizador caso este necessite de se autenticar.

Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio.

uaQuest - manual de identidade


Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio. Duis luctus posuere tellus, vitae placerat mauris iaculis at. Fusce mattis, risus eu aliquet placerat, nulla nibh volutpat lorem, eget ultrices enim tellus eget orci. Integer vel arcu ac ipsum condimentum semper vitae ac nibh.

21

aplicao

grelhas de cinzentos

Ecr de tutorial - Apresentado ao utilizador na primeira utilizao de cada ecr.

Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio.

uaQuest - manual de identidade


Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio. Duis luctus posuere tellus, vitae placerat mauris iaculis at. Fusce mattis, risus eu aliquet placerat, nulla nibh volutpat lorem, eget ultrices enim tellus eget orci. Integer vel arcu ac ipsum condimentum semper vitae ac nibh.

22

aplicao

grelhas de cinzentos

Ecr mapa - Corresponde ao ecr principal e apresenta o mapa do campus, com a localizao do utilizador e para onde este se tem de deslocar

Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio.

uaQuest - manual de identidade


Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio. Duis luctus posuere tellus, vitae placerat mauris iaculis at. Fusce mattis, risus eu aliquet placerat, nulla nibh volutpat lorem, eget ultrices enim tellus eget orci. Integer vel arcu ac ipsum condimentum semper vitae ac nibh.

23

aplicao

grelhas de cinzentos

Ecr menu de mesa de combate - Apresenta o menu da mesa de combate aps validao da tag correspondente.

Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio.

uaQuest - manual de identidade


Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio. Duis luctus posuere tellus, vitae placerat mauris iaculis at. Fusce mattis, risus eu aliquet placerat, nulla nibh volutpat lorem, eget ultrices enim tellus eget orci. Integer vel arcu ac ipsum condimentum semper vitae ac nibh.

24

aplicao

grelhas de cinzentos

Ecr de combate - Apresentado no decorrer de um combate.

Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio.

uaQuest - manual de identidade


Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio. Duis luctus posuere tellus, vitae placerat mauris iaculis at. Fusce mattis, risus eu aliquet placerat, nulla nibh volutpat lorem, eget ultrices enim tellus eget orci. Integer vel arcu ac ipsum condimentum semper vitae ac nibh.

25

aplicao

grelhas de cinzentos

Ecr de trocas - Apresentado ao utilizador assim que este escolher a opo trocas do menu da mesa de combate.

Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio.

uaQuest - manual de identidade


Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio. Duis luctus posuere tellus, vitae placerat mauris iaculis at. Fusce mattis, risus eu aliquet placerat, nulla nibh volutpat lorem, eget ultrices enim tellus eget orci. Integer vel arcu ac ipsum condimentum semper vitae ac nibh.

26

aplicao

grelhas de cinzentos

Ecr de loja - Apresentado ao utilizador assim que este escolher a opo loja no menu da mesa de montagem. Permite a compra de itens.

Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio.

uaQuest - manual de identidade


Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio. Duis luctus posuere tellus, vitae placerat mauris iaculis at. Fusce mattis, risus eu aliquet placerat, nulla nibh volutpat lorem, eget ultrices enim tellus eget orci. Integer vel arcu ac ipsum condimentum semper vitae ac nibh.

27

aplicao

grelhas de cinzentos

Ecr de inventrio - Apresenta o inventrio do jogador.

Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio.

uaQuest - manual de identidade


Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio. Duis luctus posuere tellus, vitae placerat mauris iaculis at. Fusce mattis, risus eu aliquet placerat, nulla nibh volutpat lorem, eget ultrices enim tellus eget orci. Integer vel arcu ac ipsum condimentum semper vitae ac nibh.

28

aplicao

grelhas de cinzentos

Ecr de mesa de montagem - Apresentado ao utilizador assim que este validar a tag da mesa de montagem. Permite combinar as partes de um item lendrio.

Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio.

uaQuest - manual de identidade


Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio. Duis luctus posuere tellus, vitae placerat mauris iaculis at. Fusce mattis, risus eu aliquet placerat, nulla nibh volutpat lorem, eget ultrices enim tellus eget orci. Integer vel arcu ac ipsum condimentum semper vitae ac nibh.

29

aplicao

interface da aplicao

Nesta seco apresentada a interface dos ecrs nicos da aplicao mvel tendo sido desenhada a partir das grelhas definidas. Ecr de login - Apresentado ao utilizador caso este necessite de se autenticar.

Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio.

uaQuest - manual de identidade


Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio. Duis luctus posuere tellus, vitae placerat mauris iaculis at. Fusce mattis, risus eu aliquet placerat, nulla nibh volutpat lorem, eget ultrices enim tellus eget orci. Integer vel arcu ac ipsum condimentum semper vitae ac nibh.

30

aplicao

interface da aplicao

Ecr de tutorial - Apresentado ao utilizador na primeira utilizao de cada ecr.

Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio.

uaQuest - manual de identidade


Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio. Duis luctus posuere tellus, vitae placerat mauris iaculis at. Fusce mattis, risus eu aliquet placerat, nulla nibh volutpat lorem, eget ultrices enim tellus eget orci. Integer vel arcu ac ipsum condimentum semper vitae ac nibh.

31

aplicao

interface da aplicao

Ecr mapa - Corresponde ao ecr principal e apresenta o mapa do campus, com a localizao do utilizador e para onde este se tem de deslocar

Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio.

uaQuest - manual de identidade


Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio. Duis luctus posuere tellus, vitae placerat mauris iaculis at. Fusce mattis, risus eu aliquet placerat, nulla nibh volutpat lorem, eget ultrices enim tellus eget orci. Integer vel arcu ac ipsum condimentum semper vitae ac nibh.

32

aplicao

interface da aplicao

Ecr menu de mesa de combate - Apresenta o menu da mesa de combate aps validao da tag correspondente.

Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio.

uaQuest - manual de identidade


Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio. Duis luctus posuere tellus, vitae placerat mauris iaculis at. Fusce mattis, risus eu aliquet placerat, nulla nibh volutpat lorem, eget ultrices enim tellus eget orci. Integer vel arcu ac ipsum condimentum semper vitae ac nibh.

33

aplicao

interface da aplicao

Ecr de combate - Apresentado no decorrer de um combate.

Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio.

uaQuest - manual de identidade


Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio. Duis luctus posuere tellus, vitae placerat mauris iaculis at. Fusce mattis, risus eu aliquet placerat, nulla nibh volutpat lorem, eget ultrices enim tellus eget orci. Integer vel arcu ac ipsum condimentum semper vitae ac nibh.

34

aplicao

interface da aplicao

Ecr de trocas - Apresentado ao utilizador assim que este escolher a opo trocas do menu da mesa de combate.

Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio.

uaQuest - manual de identidade


Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio. Duis luctus posuere tellus, vitae placerat mauris iaculis at. Fusce mattis, risus eu aliquet placerat, nulla nibh volutpat lorem, eget ultrices enim tellus eget orci. Integer vel arcu ac ipsum condimentum semper vitae ac nibh.

35

aplicao

interface da aplicao

Ecr de loja - Apresentado ao utilizador assim que este escolher a opo loja no menu da mesa de montagem. Permite a compra de itens.

Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio.

uaQuest - manual de identidade


Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio. Duis luctus posuere tellus, vitae placerat mauris iaculis at. Fusce mattis, risus eu aliquet placerat, nulla nibh volutpat lorem, eget ultrices enim tellus eget orci. Integer vel arcu ac ipsum condimentum semper vitae ac nibh.

36

aplicao

interface da aplicao

Ecr de inventrio - Apresenta o inventrio do jogador.

Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio.

uaQuest - manual de identidade


Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio. Duis luctus posuere tellus, vitae placerat mauris iaculis at. Fusce mattis, risus eu aliquet placerat, nulla nibh volutpat lorem, eget ultrices enim tellus eget orci. Integer vel arcu ac ipsum condimentum semper vitae ac nibh.

37

aplicao

interface da aplicao

Ecr de mesa de montagem - Apresentado ao utilizador assim que este validar a tag da mesa de montagem. Permite combinar as partes de um item lendrio.

Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio.

uaQuest - manual de identidade


Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio. Duis luctus posuere tellus, vitae placerat mauris iaculis at. Fusce mattis, risus eu aliquet placerat, nulla nibh volutpat lorem, eget ultrices enim tellus eget orci. Integer vel arcu ac ipsum condimentum semper vitae ac nibh.

38

aplicao

interface da aplicao e grelhas de cinzentos

Com vista a compreender qual os alinhamentos e distribuio dos elementos na interface, aqui apresentada com as linhas guia, e dimenses sobrepostas. Ecr de login - Apresentado ao utilizador caso este necessite de se autenticar.

Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio.

uaQuest - manual de identidade


Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio. Duis luctus posuere tellus, vitae placerat mauris iaculis at. Fusce mattis, risus eu aliquet placerat, nulla nibh volutpat lorem, eget ultrices enim tellus eget orci. Integer vel arcu ac ipsum condimentum semper vitae ac nibh.

39

aplicao

interface da aplicao e grelhas de cinzentos

Ecr de tutorial - Apresentado ao utilizador na primeira utilizao de cada ecr.

Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio.

uaQuest - manual de identidade


Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio. Duis luctus posuere tellus, vitae placerat mauris iaculis at. Fusce mattis, risus eu aliquet placerat, nulla nibh volutpat lorem, eget ultrices enim tellus eget orci. Integer vel arcu ac ipsum condimentum semper vitae ac nibh.

40

aplicao

interface da aplicao e grelhas de cinzentos

Ecr mapa - Corresponde ao ecr principal e apresenta o mapa do campus, com a localizao do utilizador e para onde este se tem de deslocar

Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio.

uaQuest - manual de identidade


Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio. Duis luctus posuere tellus, vitae placerat mauris iaculis at. Fusce mattis, risus eu aliquet placerat, nulla nibh volutpat lorem, eget ultrices enim tellus eget orci. Integer vel arcu ac ipsum condimentum semper vitae ac nibh.

41

aplicao

interface da aplicao e grelhas de cinzentos

Ecr menu de mesa de combate - Apresenta o menu da mesa de combate aps validao da tag correspondente.

Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio.

uaQuest - manual de identidade


Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio. Duis luctus posuere tellus, vitae placerat mauris iaculis at. Fusce mattis, risus eu aliquet placerat, nulla nibh volutpat lorem, eget ultrices enim tellus eget orci. Integer vel arcu ac ipsum condimentum semper vitae ac nibh.

42

aplicao

interface da aplicao e grelhas de cinzentos

Ecr de combate - Apresentado no decorrer de um combate.

Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio.

uaQuest - manual de identidade


Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio. Duis luctus posuere tellus, vitae placerat mauris iaculis at. Fusce mattis, risus eu aliquet placerat, nulla nibh volutpat lorem, eget ultrices enim tellus eget orci. Integer vel arcu ac ipsum condimentum semper vitae ac nibh.

43

aplicao

interface da aplicao e grelhas de cinzentos

Ecr de trocas - Apresentado ao utilizador assim que este escolher a opo trocas do menu da mesa de combate.

Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio.

uaQuest - manual de identidade


Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio. Duis luctus posuere tellus, vitae placerat mauris iaculis at. Fusce mattis, risus eu aliquet placerat, nulla nibh volutpat lorem, eget ultrices enim tellus eget orci. Integer vel arcu ac ipsum condimentum semper vitae ac nibh.

44

aplicao

interface da aplicao e grelhas de cinzentos

Ecr de loja - Apresentado ao utilizador assim que este escolher a opo loja no menu da mesa de montagem. Permite a compra de itens.

Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio.

uaQuest - manual de identidade


Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio. Duis luctus posuere tellus, vitae placerat mauris iaculis at. Fusce mattis, risus eu aliquet placerat, nulla nibh volutpat lorem, eget ultrices enim tellus eget orci. Integer vel arcu ac ipsum condimentum semper vitae ac nibh.

45

aplicao

interface da aplicao e grelhas de cinzentos

Ecr de inventrio - Apresenta o inventrio do jogador.

Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio.

uaQuest - manual de identidade


Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio. Duis luctus posuere tellus, vitae placerat mauris iaculis at. Fusce mattis, risus eu aliquet placerat, nulla nibh volutpat lorem, eget ultrices enim tellus eget orci. Integer vel arcu ac ipsum condimentum semper vitae ac nibh.

46

aplicao

interface da aplicao e grelhas de cinzentos

Ecr de mesa de montagem - Apresentado ao utilizador assim que este validar a tag da mesa de montagem. Permite combinar as partes de um item lendrio.

Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio.

uaQuest - manual de identidade


Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio. Duis luctus posuere tellus, vitae placerat mauris iaculis at. Fusce mattis, risus eu aliquet placerat, nulla nibh volutpat lorem, eget ultrices enim tellus eget orci. Integer vel arcu ac ipsum condimentum semper vitae ac nibh.

47

aplicao

interface e contexto

De modo a percepcionar a interface no seu contexto, alguns ecrs exemplo foram inseridos num esqueleto de um dispositivo Android.

Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio.

uaQuest - manual de identidade


Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio. Duis luctus posuere tellus, vitae placerat mauris iaculis at. Fusce mattis, risus eu aliquet placerat, nulla nibh volutpat lorem, eget ultrices enim tellus eget orci. Integer vel arcu ac ipsum condimentum semper vitae ac nibh.

48

aplicao

interface e contexto

Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio.

uaQuest - manual de identidade


Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio. Duis luctus posuere tellus, vitae placerat mauris iaculis at. Fusce mattis, risus eu aliquet placerat, nulla nibh volutpat lorem, eget ultrices enim tellus eget orci. Integer vel arcu ac ipsum condimentum semper vitae ac nibh.

49

aplicao

interface e contexto

Sed pretium elit ut erat feugiat porttitor. Morbi sit amet lacus venenatis leo imperdiet accumsan. Donec egestas ultricies venenatis. Aliquam ac tortor ut odio.