Seara da Ciência

GUIA DE ESTILO
Seara da Ciência - Universidade Federal do Ceará
sumário
04
05
06
07
08
16
21
23
24
26
28
38
43
introdução
visão geral
código de valores
identidade da marca
marca gráfica
layout
tipografia
cores
navegação
mídia
diretrizes de codificação
elementos gráfico
documentos UX
| introdução
A Seara da Ciência é um espaço da Universidade Federal do Ceará voltado para a disseminação de conteúdos científicos através de praticas diversas, como: exposições, laboratórios de pesquisa, cursos oferecidos à comunidade, peças teatrais entre outros.
No entanto, o site da Seara da Ciência não comunicava com clareza e unidade suas informações. Assim, reformulamos o mesmo e expomos aqui as mudanças feitas para enaltecer a identidade da Seara e sistematizar de forma clara e objetiva o conteúdo disponibilizado pelo site para que assim os objetivos da Seara sejam difundidos de forma coerente.
04 - Guia de Estilo
| visão geral
VISÃO
“Ser um site reconhecido pelos frutos no âmbito de disseminação da ciência e
do conhecimento para a sociedade de forma simples e eficaz.”
MISSÃO
“Estimular a curiosidade pela ciência, cultura e tecnologia, mostrando suas
relações com o cotidiano e promovendo a interdisciplinaridade entre as diversas áreas do conhecimento.”
Seara da Ciência - 05
O
I
C
L
A
E
C
X
N
C
Ê
IA
L
E
S
E
IS
S
O
O
P
Contribuir com o desenvolvimento social e
M PR O M
ÉTICA
R
06 - Guia de Estilo
Compromisso com a divulgação do conhecimento e Responsabilidade Social
CO
I
B
L
A
I
DAD
S
N
E
S
| código de valores
cientifico, para transformar nossa sociedade
Ética
Respeito com os colaboradores, servidores,
alunos e todas as pessoas envolvidas direta
e indiretamente na instituição
Excelência
Comprometimento com a ciência e o ensino
passado para os alunos
| identidade da marca
símbolo
logotipo
A logormaca da Seara, imagem acima, criada em co-
Da Terra, a natureza criou a vida
res primárias, é composta por quatro velas de janga-
Do pensar, o homem criou o método
da, que formam um cata-vento, simbolizando uma
Pelo amor ao conhecimento a UFC criou a Seara da Ciência,
máquina de transformação de energia. Segundo seu
O campo fértil por onde a Universidade faz brotar
criador, Joaquim Cartaxo, o símbolo aponta para a re-
O pensamento científico e o convívio acadêmico,
presentação de um movimento holístico orientado, in-
Em perfeita sintonia com a sociedade
dutor de energias em transformação. Sua forma e
Luciano Miranda
suas cores encerram elementos da nossa cultura e o
desígnio da relação biunívoca: regional x universal.
Seara da Ciência - 07
| marca gráfica
ASSINATURA
PREFERENCIAL
ASSINATURA
ALTERNATIVA
A marca gráfica em sua completude é formada por
ASSINATURA
SIMPLIFICADA
A assinatura visual pode ser utilizada na versão vertical
dois elementos: o simbolo e o logotipo. Os dois foram,
(preferencial), horizontal (alternativa) ou reduzida (sim-
cuidadosamente, desenvolvidos, para expressar a per-
plificada), para que seja adequável à diversas situações.
sonalidade da Seara. Para que isso aconteça, é neces-
O símbolo pode ser usado individualmente, diferen-
sário que se siga as diretrizes normatizadas deste guia.
temente do logotipo. Quando os dois estiverem jun-
tos, devem respeitar as proporções e o posicionamen-
Observação: Nunca recrie ou redesenhe a assinatura,
to definido pelo diagrama de construção da marca.
pois pode prejudicar de forma veemente a comunicação
da marca gráfica.
visual da Seara.
08 - Guia de Estilo
| marca gráfica
padrão cromático
COLORIDO
COLORIDO:
ESCALA DE CINZA
#004C85
RGB: 0 76 133
ESCALA DE
CINZA:
#E5E7E8
RGB: 209 211 213
#FECE45
a
diversas
atmosferas.
Sua
#727377
RGB: 254 206 69
RGB: 198 23 60
#D1D3D5
#BCBFC1
#727377
RGB: 188 191 193
RGB: 114 115 119
RGB: 229 231 232
A paleta formada por cores frias e quentes é adap-
tável
#C6173C
assinatura
RGB: 114 115 119
Quando não for possível aplicar sobre fundo bran-
em
co, serão permitidos fundos lisos, homogêneos ou ima-
três cores sobre fundo branco é a preferencial.
gens que permitam clara visualização da marca gráfica.
Seara da Ciência - 09
| marca gráfica
diagrama de construção
O objetivo da grid é estabelecer uma proporção
e normatizar a composição dos elementos da assinatura de maneira flexível e sistemática. O pixel
apresentado é referência da proporção estabelecida entre cada elemento da marca. Esta proporção
não deve ser modificada sob qualquer hipótese.
10 - Guia de Estilo
|marca gráfica
padrão tipográfico
Josefin Sans Thin
Josefin Sans Bold
AaBbCc123
AaBbCc123
Seara da Ciência
Seara da Ciência
Josefin Sans Light
Josefin Sans Bold Italic
AaBbCc123
AaBbCc123
Seara da Ciência
Seara da Ciência
Josefin Sans Light Italic
AaBbCc123
Seara da Ciência
A tipografia Josefin Sans é o padrão tipográfico para
o logotipo da marca da Seara. Criada por Santiago Oroz-
Josefin Sans Semibold
co, ela possui uma natureza elegante, formas geomé-
AaBbCc123
tricas e estilo vintage, fazendo com que a mesma seja
Seara da Ciência
marcante e amigável, possuindo também boa leitura
Seara da Ciência - 11
| marca gráfica
12 - Guia de Estilo
monocromática
|marca gráfica
X
C
adequação e variação
X
X
C
Seara da Ciência - 13
| marca gráfica
C
X
14 - Guia de Estilo
adequação e variação
C
X
| marca gráfica
X
adequação e variação
1. Não alterar as cores da assinatura;
2. Não alterar a tipografia no logotipo;
3. Não alterar as relações de tamanho;
4. Não alterar a anatomia e proporção dos elementos da assinatura;
5. Não aplicar a marca em cenas que comprometam sua legibilidade.
X
A cor é sensivelmente afetada. Por isso, garantir que
a reprodução das cores seja feita com precisão é um dos
pontos que integram a padronização básica, para isso
mostramos os exemplos anteriores para que não sejam
repetidos. A tipografia usada na marca não pode ser alterada, assim como o tamanho que deve seguir o diagrama de construção para que a marca não seja distorcida.
Seara da Ciência - 15
| layout
diagrama de construção | grid
49,7 px unidade
1244 pixels de largura da página
O layout é baseado em uma grid universal de 1244
Ela servirá para facilitar a diagramação das informações
pixels de largura que é dividida em 25 unidades de 49,7
na tela, alinhando e posicionando de forma coerente cada
pixels.
elemento.
16 - Guia de Estilo
| layout
298,2 px
298,2 px
A grid da página anterior permite um padrão de divisão
248,5 px
colunas
248,5 px
Esse recurso, em que do lado direito existem colunas
em quatro colunas, as duas primeiras tendo 298,2 pixels
mais largas que do lado direito, demarca espaços mais
e as duas últimas tendo 248,5 pixels.
específicos na tela para as informações, fixas ou não, por
exemplo.
Seara da Ciência - 17
| layout
variações da grid
As colunas podem receber subdivisões que geram di-
versos layouts diferenciados que possuem a mesma base
e que podem se adapatar às diferentes situações.
18 - Guia de Estilo
| layout
linha de base
11px
Usamos também uma grid horizontal formada por lin-
Não é necessário que ela seja sempre seguida a risca,
has de base de 11 pixels que ajudam no ritmo do alinha-
no entanto ela é a base para um bom alinhamento e para
mento na tela.
o posicionamento de determinados elementos na tela.
Seara da Ciência - 19
| layout
11px
50px
533px
50px
iR PARA CATEGORIAS | IR PARA CONTEÚDO | IR PARA RODAPÉ
70px
154px
6px
cabeçalho
HOME
GALERIA
TEATRO SEARA
AGENDAMENTO
SOBRE
CONTATO
SEARA DA
CIÊNCIA
11px
109px
O cabeçalho possui links de navegação para a página
da tela e no canto direito os menus mais uma entrada de
atual, gerando acessibilidade, e para outras páginas. Por
busca. Logo abaixo desse menu global tem-se o menu
padrão sempre há a marca da Seara no canto esquerdo
das categorias com seus respectivos sub-menus.
20 - Guia de Estilo
| tipografia
Open Sans Light
AaBbCc123
Seara da Ciência
Open Sans Light Italic
AaBbCc123
Seara da Ciência
Open Sans Regular
Open Sans Semibold Italic
AaBbCc123
Seara da Ciência
Open Sans Bold
AaBbCc123
Seara da Ciência
Open Sans Bold Italic
AaBbCc123 AaBbCc123
Seara da Ciência
Open Sans Italic
AaBbCc123
Seara da Ciência
Open Sans Semibold
Seara da Ciência
Open Sans Extrabold
AaBbCc123
Seara da Ciência
Open Sans Extrabold Italic
AaBbCc123 AaBbCc123
Seara da Ciência
Seara da Ciência
A tipografia Open Sans é o padrão tipo-
gráfico utilizado no site da Seara. Projetada
por Steve Matteson, ela é uma humanista
sans-serif. Essa versão (2.0) possui 897 caracteres e 5 pesos. Foi projetada com uma
tensão vertical, formas abertas e aparência
neutra, porém simpática, ótima para o público tão amplo da Seara. Otimizada para
impressão, web e interfaces móveis e ainda
possui excelente legibilidade.
Seara da Ciência - 21
| tipografia
A tipografia em negrito deve ser usada para
estabelecer relações de hierarquia nas informações expostas. A tipografia em extrabold ou
bold deve ser utilizada em títulos, bold também
pode ser usada em destaques no corpo do texto.
A tipografia em semibold deve ser utilizada em
subtítulos, e links (podendo variar para a tipografia regular). A tipografia regular deve ser usada
no corpo do texto e seu itálico em citações. A tipografia em itálico não deve ser utilizada em parágrafos inteiros ou textos longos, pois pode prejudicar a legilibidade para o usuário.
Os títulos devem estar em 36 pixels, os marcadores e “migalhas de pão” em 22 pixels, o corpo
do texto em 16 pixels e as opções da postagem
em 14 pixels.
22 - Guia de Estilo
Hiper Título (extrabold) 36 px
Título normal (bold) 36 px
Subtítulo (semibold)
Corpo de Texto (regular) 16 px Lorem ipsum dolor sit amet, consectetur
adipiscing elit. Fusce sed leo. Maecenas ultrices lorem sit amet diam. Aliquam
sollicitudin tristique nulla. Duis libero diam, palavra destacada (bold em
destaques) condimentum et, condimentum in, congue eu, tellus. Phasellus
eu elit at nisi ultricies lobortis. Suspendisse porta commodo leo.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce sed leo. Maecenas ultrices lorem sit amet diam. Aliquam sollicitudin tristique nulla. Duis
libero diam, condimentum et, condimentum in, congue eu, tellus. Phasellus
eu elit at nisi ultricies lobortis. Suspendisse porta commodo leo. Sed tincidunt
tincidunt massa.
“Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce sed leo. Maecenas ultrices lorem sit amet diam. Aliquam sollicitudin tristique nulla. “ (italic)
Exemplo de uso em formulário:
| cores
padrão cromático
RGB: 241 241 241
| Background do Site
RGB: 36 36 36
| Rodapé
| Menu de categorias
| Textos
RGB: 171 19 22
| Botão Matemática
|Marcador categoria
RGB: 241 241 241
| Botão Química
| Marcador categoria
As cores escolhidas foram tons base como,
cinza quase preto e um cinza bem claro para
fundo, menu e rodapé. Para contrastar com
essas cores usamos tons mais vivos como,
amarelo, azul, verde etc. Essas serão usadas
para as categorias do site (química, biologia
...), tentamos o máximo possível usar as co-
RGB: 255 159 0
| Botão Física
|Marcador categoria
RGB: 0 104 99
| Botão Bilogia
|Marcador categoria
RGB: 42 56 142
| Botão Astronomia
|Marcador categoria
RGB: 0 162 177
| Botão Tecnologia
|Marcador categoria
| Links e alguns botões
res mais relacionadas às categorias como o
tom roxo para química pelo estilo mais mágico que a co representa e a categoria; o verde para biologia por estar relacionada à vida,
natureza; o azul mais escuro para astronomia
por lembrar a cor do céu quando as estrelas
podem ser avistadas mais facilmente; o ma-
RGB: 145 69 0
| Botão Geologia
|Marcador categoria
RGB: 206 120 16
| Botão Artigos
|Marcador categoria
RGB: 255 255 255
| Itens - Menu Superior
rrom para geologia por lembrar a terra e assim para as demais categorias. Lembrando
que a cor azul mais clara de tecnologia será
utilizada também em links.
Seara da Ciência - 23
|navegação
Menu global na página inicial mais hover no menu home:
Menu global quando é dado scroll na página:
Menu global com menu de categorias acoplado:
Menu global com menu de categorias acoplado mais hover nas categorias
24 - Guia de Estilo
menu
| navegação
botões e links
Paginação, o branco é o que não está visitado:
Normal
Hover
5px
Normal
5px
Normal
Normal
Normal
Hover
Hover
Hover
Selecionado
Seara da Ciência - 25
|mídia
imagens e vídeos
5px
630x378 px
100x80 px
5px
As imagens da Galeria devem ser fotos comuns de mo-
Recomendamos o uso de imagens em 630 x 378 pixels
mentos na Seara ou sobre a Seara. Elas devem receber
de largura e altura para que se encaixe ao plugin da gale-
legendas detalhadas para que sejam acessíveis para pes-
ria usado no site, elas serão automaticamente adaptadas
soas com deficiência visual. Os vídeos devem seguir o
ao tamanho menor de 100 x 80 pixels ao lado do slide.
mesmo padrão de proporção das imagens.
26 - Guia de Estilo
| mídia
imagens
732x378 px
(slider)
306x300 px
306x176 px
Recomendamos o uso de imagens em 732 x 378 pixels
As imagens devem estar relacionadas as notícias de
para o slider da página inicial. Para as notícias maiores as
acordo com o seu tema, caso não exista uma imagem
imagens devem ser de 306 x 300 pixels, para as menores
específica ficará uma imagem padrão relacionada com a
em 306 x 176 pixels para que não fiquem distorcidas.
categoria.
Seara da Ciência - 27
| diretrizes de codificação
elementos HTML
Em quesitos de elementos HTML, seguimos as principais tags já existentes na sua ulti-
ma versão, a saber ,HTML 5. Tags como nav, article, header, entre outros, foram utilizados no código para que os principais navegadores possam interpreta-los, e para facilitar
a manutenção do mesmo.
28 - Guia de Estilo
| diretrizes de codificação
nomenclatura de classes css
Seguimos o padrão “.palavras-com-traços” para defi-
nir as classes CSS. Por exemplo, para a página fazer a
transição dos links com fade, universalizamos todas as
âncoras (leia-se <a>) para tal feito, porém, em alguns
casos não precisamos fazer isso, foi feita então a classe “.link-normal”, que é colocada em qualquer âncora
que não necessite de um fade entre as páginas do site.
Seara da Ciência - 29
| diretrizes de codificação
integração com javascript
<script> Seus novos scripts</script>
<script src=”//code.jquery.com/jquery-2.1.4.min.js”></script>
No projeto foi utilizado o WordPress, que vem nativamente com referência ao jQuery, porém, ainda cha-
mamos, caso o servidor oficial falhe, no cabeçalho a versão minificada com a versão mais recente 2.1.4. Os
novos scripts javascript devem ser adicionado com a tag <script> e, logo antes, deve-se ter um pequeno comentário falando sobre o script.
30 - Guia de Estilo
| diretrizes de codificação
styling form
Imagem
go
que
mostrando
possibilita
a
o
códi-
nevagação
pelo menu usando a tecla TAB.
Seara da Ciência - 31
| diretrizes de codificação
Imagem
mostrando
o
códi-
go que possibilita a redução e
expansão do menu na pagina:
32 - Guia de Estilo
styling form
| diretrizes de codificação
estrutura de diretórios
No nosso projeto estamos trabalhando com o diretório plugins, no qual é instalado as pastas de plugins do
WordPress, com o diretório themes, no qual é instalado as pastas de temas do WordPress e com o diretório
uploads, no qual ficam todos os arquivos que são feitos
uploads pelo sistema.
Na pasta themes encontramos o tema ‘searaciencia’,
que na verdade é uma pasta que contém todos os códiO WordPress trabalha com uma estrutura de diretórios
gos html, css, javascript e imagens necessárias do tema
bastante organizada, sendo elas: wp-admin, wp-content
criado. O Wordpress trabalha com uma organização de
e wp-includes. Destas três pastas a que nos é mais im-
arquivos bastante interessante, temos os arquivos hea-
portante no que diz respeito ao tema criado é a wp-con-
der.php, index.php e footer.php. Os três se interligam
tent, ela contém outros sub-diretórios, sendo eles cache,
com a linguagem server-side php configurada pelo pró-
languages, plugins, themes, upgrade e uploads.
prio WordPress.
Seara da Ciência - 33
| diretrizes de codificação
estrutura de diretórios
Existe também o arquivo page.php que define a es-
Há também necessidade de colocar uma imagem cha-
trutura das páginas, single.php que define a estrutura
mada screenshot.jpg de sua preferência para personali-
dos posts, search.php que define a estrutura da página
zar a visualização do tema no painel administrativo Word-
de busca, category.php que define a página de catego-
Press.Há também duas outras pastas, a img, na qual ficam
rias, sidebar.php que define uma barra lateral, 404.php
algumas imagens como a logo e os parceiros, porém, não
que define a página de erro, searchform.php que defi-
há muitas imagens pois a maioria delas são svg inseridas
ne a forma do formulário de busca, functions.php que
no próprio código com a tag <svg> ou estão na pasta da
configura e habilita diversas funções WordPress e por
upload do WordPress; e a lib, na qual ficam as bibliotecas
fim a style.css que define o CSS padrão e também o So-
JavaScript como o jQuery.
bre do tema, como título, versão, descrição e autor.
34 - Guia de Estilo
| diretrizes de codificação
Para implementar Acessibilidade no site nos referimos
normas de acessibilidade
Utilizamos também o atributo alt que fornece infor-
a utilização de tags disponíveis no HTML5, usando para
mações alternativas (legendas) para uma imagem caso o
estruturar o site as tags de: header,footer,aside,section,
usuário não consiga visualizá-la por algum motivo como
evitando o uso das tags tables pois essa tag dificulta a
conexão lenta, erro no atributo src, ou o usuário que uti-
leitura pelos leitores de telas.
lize um leitor de tela.
Seara da Ciência - 35
| diretrizes de codificação
normas de acessibilidade
Implementamos as funções de aumentar e diminuir fonte, para pessoas que possuem baixa visão tenham mais facilidade para visualizar o conteúdo disponibilizado no site.
36 - Guia de Estilo
| diretrizes de codificação
normas de acessibilidade
<nav class=”menu-acessivel”>
<a
href=”#menu-categorias”
class=”link-normal”
title=”Atalho para categorias”>Ir para categorias</a>
<a href=”#conteudo” class=”link-normal” title=”Atalho
para o conteúdo”>Ir para conteúdo</a>
<a href=”#rodape” class=”link-normal” title=”Atalho parao rodapé”>Ir para rodapé</a>
</nav>
Foi colocado saltos de paginas, onde o usuário tem a opção
de ir direto para o conteúdo, menu ou rodapé do site, agilizando sua navegação pelo mesmo, o salto de pagina é essencial
para facilitar a navegação das pessoas que usam leitores de
tela, pois evitam quem eles tenham que passar por todos os
menus do site para chegar até o conteúdo.
Seara da Ciência - 37
| elementos gráficos
ícones
A iconização é de suma importância neste projeto, pois eles são um meio de organização das categorias do site. Cada
categoria possui uma cor e um ícone associado, o que gera uma melhor categorização das informações, fazendo com que
se torne mais simples e visível para o usuário a navegação no site.
38 - Guia de Estilo
| elementos gráficos
ícones
O ícone possui dimensão de 48px
Nas etiquetas das notícias e em
no menu de categorias na suas duas
suas categorias, o ícone possui uma
versões, estático e expansível.Possui
dimensão de 15px
ainda margin-padding de 10px
Seara da Ciência - 39
| elementos gráficos
ícones
O nome da categoria presente logo
A caixa colorida possui ainda faixas
Outro exemplo é o ícone de busca,
abaixo de cada ícone nesse menu,
inferiores e superiores de 80x10px
que possui uma caixa de 24x31 px
possui uma área de 80x13 px
40 - Guia de Estilo
em suas duas versões.
| elementos gráficos
ícones
icone-matemática
icone-química
icone-física
icone-biologia
icone-astronomia
icone-tecnologia
Os ícones devem está sempre acompanhados de suas respectivas
icone-geologia
cores. Nunca devem ser utilizados sem indicações como o nome
da categoria ou a própria cor (as cores que devem acompanhar
icone-artigos
os ícones estão especificadas na pág 23 ).
Seara da Ciência - 41
| elementos gráficos
outros elementos
Animação de loading
Indica o carregamento e a transição das
páginas
Página de erro 404
O utilizador ao se deparar com uma página inexistente ou que
sofreu algum erro, encontra esta página que possui uma barra
de busca, que ele pode utilizar para buscar outros conteúdos
42 - Guia de Estilo
| documento UX
personas
TYSSINES MARCIEL
Estudante de Ensino Médio na Escola Técnica Pedra
Verde, 17 anos de idade, cearense. Apaixonada por
astronomia, faz pesquisas frequentes no site da Seara
da Ciência sobre o assunto para saber quando poderá
observar as estrelas através das noites de observação que
a Seara propõe. No entanto, Tyssines vem procurando
novas opções de acessar esse conteúdo pois o site está
ficando cada vez mais chato e cansativo, comparado aos
sites que temos atualmente. Tyssines sonha em ser uma
Para fins de estudo de Interações de usuários com o
sistema, e da experiência dos presentes e futuros utilizadores,
foram criados personas que correspondem ao público alvo
e a pessoas ligadas diretamente a utilização e modificação
grande astrônoma e marcar sua geração através de seus
conhecimentos. Mas, se Tyssines não encontrar uma
nova opção de site, desistirá para sempre do seu sonho
de ser astrônoma?
do sistema implantado.
Seara da Ciência - 43
| documento UX
personas
TOBIAS ALENCAR
Tobias é o tipo de professor que gosta de ensinar
a física não só no seu lado teórico, mas também no
prático, para isso investe em muitas visitas à Seara da
Ciência para que seus alunos possam ver a física teórica
em alguns instrumentos disponibilizados pela Seara. Na
escola onde ensina é o organizador da Feira de Ciências
por isso sempre incentiva que seus alunos pesquisem
dicas sobre a feira no site da Seara, ele gosta muito do
conteúdo abordado no site, seus alunos não consideram
Professor de Física do Ensino Médio na Escola Técnica
Pedras Verde, 30 anos de idade, cearense e casado.
o site atrativo, por isso acabam não ouvindo muito os
conselhos do professor. Tobias tem um grande sonho:
conhecer a NASA e se possível, levar alguns de seus alunos
com ele.
44 - Guia de Estilo
| documento UX
personas
FREDERICO DA SILVA
O mesmo é responsável por gerenciar todo o conteúdo
disponível no site e alimentá-lo com novas informações
que serão disponibilizadas pela instituição. Como está
perto de deixar de executar suas atividades na Seara,
ele precisa que o sistema de gerenciamento do site seja
de fácil acesso e intuitivo, para que ele possa passar
os conhecimentos sobre o gerenciamento do site para
outas pessoas, funcionários ou bolsistas, que não
precisam necessariamente ter um conhecimento na área
Funcionário aposentado da Seara que continua
prestando serviços voluntários à instituição, trabalhou
na mesma durante grande parte da sua vida e é engajado
de programação para que continuem o seu trabalho de
colocar novas informações no site ou editar o conteúdo
já disponibilizado.
nas atividades da Seara, pois possui uma grande paixão
pela ciência.
Seara da Ciência - 45
| documento UX
wireframes e protótipos
Wireframes iniciais
Aqui exemplificamos alguns designs que foram projetados antes da conclusão do projeto. São wireframes, protótipos de alta
fidelidade. Essas informações são de suma importância para compreender a evolução visual do produto, e como a partir disso
novos desenvolvedores poderão criar páginas e mais conteúdo para o site.
46 - Guia de Estilo
| documento UX
wireframes e protótipos
Seara da Ciência - 47
| documento UX
wireframes e protótipos
Protótipo de baixa fidelidade
http://www.searawireframe.16mb.com/
48 - Guia de Estilo
| documento UX
wireframes e protótipos
Protótipo de Alta fidelidade- estático
Seara da Ciência - 49
| documento UX
wireframes e protótipos
Protótipo de Alta fidelidade
http://www.seara.16mb.com
50 - Guia de Estilo
| documento UX
wireframes e protótipos
Seara da Ciência - 51
Seara da Ciência - Universidade Federal do Ceará
Projeto Integrado I - Sistemas e Mídias Digitais
Pyxis © 2015