0% acharam este documento útil (0 voto)
13 visualizações8 páginas

Wireframes para Website Pessoal

O documento apresenta um roteiro para a criação de wireframes de média fidelidade para três páginas de um website pessoal, incluindo a página HOME, PORTFÓLIO e SOBRE. Cada atividade detalha requisitos específicos, como áreas para navegação, texto e imagens, além da aplicação de cor de fundo. A avaliação será baseada na correta prototipação e no cumprimento dos critérios estabelecidos para cada página.

Enviado por

Rivail Silva
Direitos autorais
© All Rights Reserved
Levamos muito a sério os direitos de conteúdo. Se você suspeita que este conteúdo é seu, reivindique-o aqui.
Formatos disponíveis
Baixe no formato PDF, TXT ou leia on-line no Scribd
0% acharam este documento útil (0 voto)
13 visualizações8 páginas

Wireframes para Website Pessoal

O documento apresenta um roteiro para a criação de wireframes de média fidelidade para três páginas de um website pessoal, incluindo a página HOME, PORTFÓLIO e SOBRE. Cada atividade detalha requisitos específicos, como áreas para navegação, texto e imagens, além da aplicação de cor de fundo. A avaliação será baseada na correta prototipação e no cumprimento dos critérios estabelecidos para cada página.

Enviado por

Rivail Silva
Direitos autorais
© All Rights Reserved
Levamos muito a sério os direitos de conteúdo. Se você suspeita que este conteúdo é seu, reivindique-o aqui.
Formatos disponíveis
Baixe no formato PDF, TXT ou leia on-line no Scribd

WEB DESIGN

Template

Objetivo: Fazer o wireframe de média fidelidade para 3


páginas de um website pessoal.

NOME: Raquel Linhares Martins Neto


RU: 4328496

CST DE DESIGN - UNINTER


Web design
ATENÇÃO!
Você pode utilizar o software Figma (na versão free account) para
criar os wireframes. ([Link]) – tem versão online ou para
instalar no computador ou outro software como Adobe Illustrator,
Photoshop ou Adobe XD
Exporte as páginas como “PNG” e insira nos locais definidos no
template.

A AVALIAÇÃO se dará pela correta prototipação das três páginas


solicitadas de acordo com os critérios especificados em cada
atividade.
WEB DESIGN
CST DE DESIGN
ATIVIDADES
Roteiro da atividade prática de WEB DESIGN
ATIVIDADE 1 – PÁGINA HOME
Com base nas aulas de Web Design e no mapa de navegação fornecido, crie um wireframe de média fidelidade – anotado –
para a página HOME do site.
Determine áreas para navegação, texto, imagens, ícones e demais elementos que julgue necessários, identificando cada uma
delas.
Aplique uma cor de fundo (background) para a página.

ATIVIDADE 2 – PORTIFÓLIO
Com base nas aulas de Web Design e no mapa de navegação fornecido, crie um wireframe de média fidelidade – anotado –
para a página PORTIFÓLIO do site.
Determine áreas para navegação, texto, imagens, ícones e demais elementos que julgue necessários, identificando cada uma
delas.
Aplique uma cor de fundo (background) para a página.
Insira pelo menos 1 (uma) imagem (pode ser de seu portifólio) em uma das áreas de imagem definidas no layout.

ATIVIDADE 3 – SOBRE
Com base nas aulas de Web Design e no mapa de navegação fornecido, crie um wireframe de média fidelidade – anotado –
para a página SOBRE do site.
Determine áreas para navegação, texto, imagens, ícones e demais elementos que julgue necessários, identificando cada uma
delas.
Aplique uma cor de fundo (background) para a página.
Insira uma área para o formulário de contato.

WEB DESIGN
CST DE DESIGN
ATIVIDADES
Roteiro da atividade prática de WEB DESIGN

MAPA DE NAVEGAÇÃO

HOME

SOBRE PORTIFOLIO

....

...

WEB DESIGN
CST DE DESIGN
ATIVIDADE 1 – PÁGINA HOME WEB DESIGN
CST DE DESIGN

Imagem (png) do layout da


página HOME
ATIVIDADE 2 – PÁGINA PORTIFÓLIO WEB DESIGN
CST DE DESIGN

Imagem (png) do layout da


página PORTIFÓLIO
ATIVIDADE 3 – PÁGINA SOBRE WEB DESIGN
CST DE DESIGN

Imagem (png) do layout da página


SOBRE
AVALIAÇÃO WEB DESIGN
CST DE DESIGN

Página HOME - vale 33% da nota


1- Deve ser um wireframe de média fidelidade – anotado – .
2- Deve ter determinado e identificado áreas para texto/imagem/navegação.
3- Deve ter aplicado cor no background.
4- Deve estar de acordo com o mapa de navegação fornecido.

Página PORTIFÓLIO - vale 34% da nota


1- Deve ser um wireframe de média fidelidade – anotado – .
2- Deve ter determinado e identificado áreas para texto/imagem/navegação.
3- Deve ter aplicado cor no background.
4- Deve ter inserido pelo menos uma imagem como exemplo.
5- Deve estar de acordo com o mapa de navegação fornecido.

Página SOBRE - vale 33% da nota


1- Deve ser um wireframe de média fidelidade – anotado – .
2- Deve ter determinado e identificado áreas para texto/imagem/navegação.
3- Deve ter aplicado cor no background.
4- Deve ter definido a área para o formulário de contato.
5- Deve estar de acordo com o mapa de navegação fornecido.

*A ENTREGA DO ARQUIVO DEVE SER EM PDF

Você também pode gostar