O documento fornece um guia detalhado para criar e aplicar interações com botões no Axure 7.01, incluindo a criação de objetos-mestre e a adição de links a cada botão. Instruções passo a passo são dadas para adicionar estilo de rollover, duplicar botões, alinhar, distribuir, e configurar navegabilidade entre páginas. No final, um protótipo é gerado para visualizar as interações implementadas.

1. 1
1
Widgets
e
Masters
no
Axure
7.01
Componentes
e
Objetos-­‐mestre
Crie
um
novo
arquivo
A.
Adicione
um
botão
(Button
Shape)
e
aplique
o
estilo
rollover
(quando
o
mouse
passa
por
cima)
1.
Clique
e
arraste
o
botão
(Button
Shape)
do
painel
Widgets
(componentes)
para
a
página
na
área
de
desenho.
2.
Abra
a
caixa
de
diálogo
“Interaction
Style”
(Estilo
Interativo).
Selecione
“MouseOver”
(Mouse
em
Cima)
na
aba
“Properties”
(Propriedade).
3.
Marque
Bold
(negrito)
e
Fill
Color
(cor
de
preenchimento).
Marque
as
caixas
para
Bold
e
Fill
Color.
Depois,
selecione
a
cor
cinza
na
paleta
de
cores
e
clique
em
OK.
1
Traduzido
pela
Profa.
Daniela
Carvalho
Monteiro
Ferreira,
para
a
disciplina
de
Web
Design,
nos
cursos
de
Publicidade
e
Relações
Públicas
E-­‐mail:
daniela.carvalho@esamc.br.
Abr
2014.
Blog:
http://colecaoaprender.blogspot.com.br

2. 2
2
B.
Duplique
e
distribua
os
botões
1.
Arraste
(Drag)
para
copiar.
Pressione
a
tecla
[Ctrl]
e
arraste
o
componente
(widget)
de
botão.
Se
você
estiver
usando
um
Mac,
pressione
a
tecla
[Option].
Faça
a
mesma
ação
3
vezes
para
ter,
ao
final,
4
botões.
2.
Selecione
os
botões
(widgets).
Selecione
todos
os
botões
clicando
com
o
botão
esquerdo
do
mouse
enquanto
arrasta
a
área
de
seleção
para
todos
os
botões.
3.
Alinhe
e
distribua.
Com
todos
os
botões
selecionados,
clique
nos
botões
Alinhar
centralizado
(Align
Middle)
e
depois
Distribuir
horizontalmente
(Distribute
Horizontally),
na
barra
de
ferramentas
(Toolbar).
4.
Edite
o
texto
dos
botões.
Selecione
e
depois
nomeie
cada
botão
conforme
mostrado
na
imagem.
Eles
devem
ter
o
mesmo
nome
correspondente
às
páginas
no
painel
Sitemap:
Home;
Page
1;
Page
2
e
Page
3.

3. 3
3
C.
Converta
os
botões
em
objeto-­‐mestre
1.Selecione
os
botões.
Clique
e
arraste
para
selecionar
os
quatro
botões.
2.
Converta-­‐os
para
objeto-­‐
mestre
(Master).
Clique
com
o
botão
direito
e
depois
selecione
[Convert
>
Convert
to
Master].
3.
Nomeie
o
objeto-­‐
mestre.
Nomeie
o
objeto-­‐
mestre
para
“NavigationHeader”.
4.
Escolha
o
comportamento
(Behavior).
Selecione
o
botão
rádio
(radio)
para
bloquear
a
localização
do
objeto
mestre
(“Lock
to
Master
Location”).
5.
Clique
“Continue”
(continuar).
Clique
no
botão
“Continue”
para
criar
o
objeto-­‐mestre.

4. 4
4
D.
Coloque
o
objeto-­‐mestre
(Master)
em
cada
página
1.
Abra
a
página
1
(“Page
1”).
Duplo
clique
no
“Page1”
no
painel
“Site
Map”
(Mapa
do
site)
para
abrí-­‐lo
na
área
de
desenho.
2.
Arraste
o
objeto
mestre
para
a
página.
Arraste
o
objeto
mestre
e
solte-­‐o
na
área
de
desenho
da
página
1
(“Page
1”).
3.
Repita.
Abra
a
“Page
2”
e
a
“Page
3”
e
arraste
e
depois
solte
o
objeto
mestre
dentro
de
cada
uma
delas.

5. 5
5
E.
Adicione
links
nos
botões
no
objeto
mestre
1.
Dê
duplo
clique
para
abrir
o
objeto
mestre.
Abra
o
“Navigation
Header”
clicando
duas
vezes
nele.
2.
Selecione
o
botão
“Home”.
Selecione
o
botão
“Home”
do
objeto
mestre.
3.
Clique
em
“Create
Link”
(Criar
Link).
Clique
em
“Create
Link”
na
aba
“Interactions”
(Interações).
4.
Selecione
a
página
Home.
Selecione
a
página
“Home”
na
lista
suspensa.
5.
Repita.
Repetir
os
passos
2-­‐4
para
cada
botão
para
liga-­‐los
em
suas
páginas
correspondentes.

6. 6
6
Gere
o
protótipo
Visualize
o
protótipo
(“Preview”).
Passe
o
mouse
por
cima
dos
botões
para
ver
o
efeito
“MouseOver”
e
clique
neles
para
navegar
entre
as
páginas.
Note
que
os
links
foram
adicionados
uma
vez
no
objeto-­‐mestre
e
foi
aplicado
para
todas
as
páginas.
Referência:
AXURE.
Axure
Core
Training
#3:
Widgets
&
Masters.
Disponível
em
< http://www.axure.com/learn/core/widgets-­‐
masters>.
Acesso
em
Abr
2014.