Página Inicial > Boas práticas > Template para especificação de interface visual

Template para especificação de interface visual

A especificação da interface visual é um dos artefatos que eu valorizo muito no desenvolvimento de sistemas ON-LINE, pois ele serve para diferentes propósitos além do de orientar na construção das telas: auxilia na integração do código com suas respectivas telas, é um importante documento para o analista de testes elaborar os casos de testes, (juntamente com os casos de uso) orienta o dba na definição dos tabelas do banco de dados, e ainda pode ser usada para a elaboração de um guia de usuário.

Para ajudar nessa importante tarefa do desenvolvimento, publico abaixo um template bastante simples e prático que tenho utilizado e recomendado nos trabalhos que meus alunos desenvolvem.

Esse template se incia com um layout da tela com seus respectivos campos e opções do menu:

image

Após se definir o lay-out de todas as telas necessárias define-se as orientações gerais para o design das telas

  1. - Página Web
    - Sem a utilização de Frames.
    - Resolução 1024 x 768 e 800×600.
    - Scroll vertical em listas, para informações que não caibam na tela, sem utilização do scroll do browser.
    - Orientações válidas para todas as páginas, conforme exemplo apresentado na figura abaixo:

 

image

 

Em seguida define-se a descrição de cada campo das telas, conforme a tabela abaixo:

Nome Campo

Origem do Dado

Tipo

Default

Máscara Edição

Brancos (S/N)

Tam

Consistência

9

Curso

 

Txt

   

S

70

Não vazio

11

Gestor

TBME_Usuário

(nome) perfil administrador de curso.

list

<<Gestor>>

 

N

50

Gestor válido selecionado

12

Descrição

TBME_Curso

Txt

   

S

2000

 

13

Conteúdo

TBME_Curso

Txt

   

S

4500

 

14

Público Alvo

TBME_Curso

Txt

   

S

1000

 

15

Pré-Requisitos

TBME_Curso

Txt

   

S

1000

 

22

Excluir

 

Lnk

         

23

Alterar

 

Lnk

         

24

Menu Principal

 

Btn img

   

S

20

Menu deve ser mostrado de acordo com o Perfil, conforme ilustram as figuras ao longo deste documento em orden alfabética.

26

Duração (Horas)

TBME_Curso

int

   

N

4

Debe ser numérico.

27

Custos

 

lbl

   

N

   

28

Estimado

TBME_curso

money

 

999.999,99

N

10

 

29

Máximo Previsto

TBME_curso

money

 

999.999,99

N

10

 

30

Salvar

 

btn

         

31

Cancelar

 

btn

         

E você utiliza algum template para especificação de interface visual? Vê valor em gerar esse tipo de documento, ou o julga desnecessário?

Compartilhe:
  • Print
  • email
  • RSS
  • Add to favorites
  • Digg
  • Twitter
  • Facebook
  • MySpace
  • LinkedIn
  • del.icio.us
  • Slashdot
  • Technorati
  • Rec6
  • Google Bookmarks
  • Yahoo! Bookmarks
  • Yahoo! Buzz

Related posts:

  1. O que elaborar primeiro, casos de uso ou protótipo de interface visual?
  2. Template para descrição de caso de uso
  3. Uma abordagem prática de análise e projeto de software
  1. Nenhum comentário ainda.
  1. Nenhum trackback ainda.