Miguel Puente Objetivo Digital Educatico (ODE) con PowerBullet

Producción de Material Didáctico (2)
En ambientes virtuales de aprendizaje

Producción de Objetos
Digitales Educativos
con PowerBullet
Profesor/Autor

Juan Carlos Asinsten

Versión 9 / mayo 2012

05- 3

Instituto de Formación Docente de Virtual Educa
05 - Producción de Material Didáctico (2)

Objetos con PowerBullet -

CONTENIDOS
Antes de comenzar ....................................................................................... 4
¿Aprender qué..? ........................................................................................................... 4
¿Aprender para qué? ..................................................................................................... 5
¿Aprender cómo? .......................................................................................................... 5
Obtener el programa .................................................................................................... 6

Power Bullet .................................................................................................. 6
Registrar Power Bullet 1.44.......................................................................................... 7
Interfaz........................................................................................................................... 8
Principales ventajas del programa................................................................................. 9
Algunas desventajas del programa ................................................................................ 9

Estructura del proyecto ............................................................................... 10
Comentarios sobre el guión........................................................................................ 11
Comentario sobre la interfaz ...................................................................................... 11
Menú - Túnel de inicio ................................................................................................. 12
Menú - Historia / Goleta Ancud .................................................................................. 13
Menú - Geografía ......................................................................................................... 14
Menú - El fuerte ........................................................................................................... 15
Criterios de nombres de archivos ............................................................................. 16

Pequeño ejercicio previo .............................................................................. 17
Armar el tunel inicial ................................................................................... 20
Configurar el proyecto ............................................................................................... 21
Crear la página 1.......................................................................................................... 23
Comentario sobre botones ........................................................................................ 27
Armar página 2 ............................................................................................................ 28
Armar la página 3 ........................................................................................................ 29
Armar la página 4 - Menú general del proyecto ......................................................... 33
Una mejor estrategia ................................................................................................... 36
Guardar y probar ........................................................................................................ 38
Un poco de trabajo en serie ....................................................................................... 40
Navegar entre páginas................................................................................................. 40
Armar la página 5 ........................................................................................................ 41
Armar la página 12 ...................................................................................................... 43
Armar la página 13 ...................................................................................................... 43
Armar página 14 .......................................................................................................... 46
Armar página 15 .......................................................................................................... 46
Armar página 16 .......................................................................................................... 47
Armar página 17 .......................................................................................................... 47
Armar página 18 .......................................................................................................... 48

El Fuerte Bulnes .......................................................................................... 49
Armar la página 19 ...................................................................................................... 50
Armar página 20 .......................................................................................................... 51
Armar la página 21 ...................................................................................................... 53
Armar página 22 .......................................................................................................... 54
Armar página 23 .......................................................................................................... 55
Importante................................................................................................................... 55
Armar página 24 .......................................................................................................... 56

2


Armar
Armar
Armar
Armar
Armar
Armar
Armar
Armar
Armar
Armar
Armar


página 25 .......................................................................................................... 57
la página 26 ...................................................................................................... 57
página 27 .......................................................................................................... 58
página 28 .......................................................................................................... 59
página 29 .......................................................................................................... 59
página 30 .......................................................................................................... 59
página 31 .......................................................................................................... 60
página 34 .......................................................................................................... 61
página 32 .......................................................................................................... 61
página 33 .......................................................................................................... 61
la página 35 ...................................................................................................... 62

Insertar sonido ............................................................................................ 63
Transiciones y animaciones .......................................................................... 66
Página 3 ........................................................................................................................ 67
El resto de las páginas ................................................................................................. 67
Página 2 ........................................................................................................................ 67
El efecto Fade .............................................................................................................. 67
Animaciones ................................................................................................................. 68

El producto final .......................................................................................... 69
Engordar PowerBullet ................................................................................. 71
Tips ............................................................................................................. 72
Perder la selección ...................................................................................................... 73
Una sola carpeta .......................................................................................................... 73
Hacer Backup .............................................................................................................. 73
Botones missing .......................................................................................................... 73
Guardar ....................................................................................................................... 73
Extraño buffer ............................................................................................................. 73
Cuidado al pegar.......................................................................................................... 74
Inestabilidad ................................................................................................................. 74
JPG en Windows Vista ................................................................................................ 74
Párafos en texto .......................................................................................................... 74

Esta obra puede utilizarse libremente en
actividades educativas, siempre que se
cumplan las siguientes condiciones:
1) Distribuir tal cual está publicada, sin
introducir ninguna modificación
2) Reconocer la autoría.
3) No comercializar ni utilizar en proyectos
educativos arancelados.

3




Antes de comenzar

Nos aprestamos a encarar la construcción de un objeto multimedia. Para
muchos será la primera oportunidad en su vida de realizar una tarea semejante. Queremos hacer unas reflexiones previas, que cremos serán útiles en la
oportunidad.
Como docentes, sabemos que los aprendizajes incluyen una importante
cuota de actitud. Actitud de querer aprender. Quien no quiere aprender,
no aprende. Seguramente se lo hemos señalado muchas veces a nuestros alumnos. La primera cuestión entonces será encarar este trabajo con la actitud de
aprender.
¿Aprender qué..?
Nos estamos formando como docentes para espacios virtuales. Eso significa que (lo sepamos o no) estamos cambiando nuestras pautas culturales como
profesoras y profesores. Entre las nuevas culturas que necesitamos adquirir
está la de dominar nuevos lenguajes. Nuevos lenguajes que son parte hoy
de la vida cotidiana de toda la sociedad (no sólo de nuestros alumnos).
El trabajo que encaramos ahora, en esta Unidad, no es el de aprender a
utilizar un software. No es ese el sentido. El sentido es aprender a escribir en
otro lenguaje: el lenguaje multimedia. El aprendizaje de ese lenguaje tiene sus
reglas, su sintaxis, su gramática, su ortografía. Que se materializan en la
realización práctica de cada objeto.
No es lo mismo cualquier fondo. No es lo mismo si un botón está colocado correctamente en su lugar o no. No es lo mismo si la secuencia de páginas
es la adecuada o no. No es lo mismo si un efecto es agradable o no.
Todos sabemos, por ejemplo, como vestirnos para dar clase en la presencialidad. Cuidamos nuestro aspecto. Cuidamos la forma de hablar. Cuidamos
la forma de escribir.
¿Porqué no cuidar de la misma manera la forma en que escribimos en los

Carta del docente - autor

4




5

otros lenguajes? ¿Porqué no pretender que nuestros alumnos nos entiendan
(más y mejor) usando otros reecursos expresivos? Señalemos, de paso, que
los recursos habituales del discurso oral presencial no los podremos usar en la
modalidad virtual...
Ese es el sentido de las actividades que comenzaremos a concretar, a materializar.
¿Aprender para qué?
Ya señalamos una parte de los «para qué»: adquirir competencias para escribir en lenguaje multimedia.
Pero más importante es que esas competencias nos ayudarán a mejorar
nuestras habilidades docentes para que también nuestros alumnos aprendan a
escribir en lenguaje multimedia. Que es algo diferente y superior a utilizar
con mayor o menor habilidad programas informáticos, o participar de las redes sociales.
¿Aprender cómo?
Como dijimos más arriba, con actitud de aprender.
Eso significa, en primer lugar, considerar la actividad no como una carga
sino como la oportunidad de esos aprendizajes.
En segundo lugar, significa desprenderse de todos los «ésto no es para mí»,
«yo no ando bien con la tecnología» y autolimitaciones similares. Además de
que no aprenden quienes no quieren, tampoco aprenden quienes creen
que no pueden.

No es el momento de
polemizar sobre los mitos
de los «nativos
digitales». Pero que sean
consumidores de
multimedia no significa
automáticamente que
comprendan esos
lenguajes lo suficiente
como para escribir
correctamente y no ser
manipulados a través de
los mismos. De esto ya
nos alertaba Paula Freire
mucho antes de Internet

En nuestra muy larga experiencia en formación de docentes en el uso de TIC en la educación, hemos adquirido la
total convicción de que cualquier docente puede aprender
cualquier cosa (dentro de límites razonables) si le dedica el
tiempo y esfuerzo necesarios. Y, desde luego, encara el proceso con la actitud adecuada.
Además de estas dos cuestiones principales, también influyen algunas conductas:
Es necesario trabajar despacio, con paciencia. Tratando de
comprender el sentido de cada acción. Sin ansiedades
por terminar pronto.
Cuando algo no funciona como es de esperarse, volver a trás
y repetir las acciones. La mayor parte de las fallas en estos
aprendizajes mediante proyectos guiados paso a paso surgen
por saltearse pasos (¡ay!! la ansiedad...).
Tratar de aprender de los errores. Cuando nos equivocamos ,
prestar atención a porqué cometimos ese error, para no repetirlo. Metacognición tecnológica, si se quiere.

Entender el sentido de
las aciones (y no hacerlas
mecánicamente) nos
servirá para poder
traspolar lo que estamos
haciendo a otros
proyectos, con otros
programas y objetivos.




6

Power Bullet

PowerBullet es un programa creado para presentaciones. Pero el hecho
de que el producto final se exporta en formato flash y algunas de sus prestaciones, sumado al hecho de ser un producto gratuito, hizo que lo eligiéramos como una opción para trabajar en la producción de pequeños objetos para nuestras clases virtuales.
No hay muchas opciones gratuitas de este tipo de software. La mayor
parte de los programas gratuitos que revisamos se limitan al armado de secuencias de imágenes (slideshows).
Obtener el programa
El sitio Web de los creadores del programa está en
http://www.powerbullet.com/

...pero han dejado de ofrecer la descarga del programa. Todo indica que
han abandonado el mismo. Por lo tanto el programa hay que bajarlo de la
sección Archivos del aula de la materia, o de la clase respectiva
Curiosamente, la versión Plus, que en algún momento pensaron en comercializar, ahora la ofrecen gratuitamente, en la misma Web, donde figura el
código con que se activan las prestaciones extendidas.

This is the registration info to enter in order to unlock extra features that is, upgrade to Plus in 1.44:
Name: Information Services and Technology 10
Key: 000014-4776X5-DX1HB9-VC9EPN-F3JG4Y-VK2CT3-TDFKKM-1DZZCUMFD87W-NET9UN

Algunos antivirus dan una
falsa alarma de troyano
al instalar PowerBullet.
Hemos chequeado el
instalador con varios
antivirus y antitroyanos
actualizados con
resultados negativos.




7

Hay que descargar la versión 1.44 y después de instalarlo activar la versión Plus. Este proceso de registro es totalmente egratuito.

Registrar Power Bullet 1.44

1

1

Una vez instalado el
programa, lo abrimos y...
1) Vamos al menú Help
2) Elegimos la opción
Enter registración code

2

1

2
1) Aparece unapantalla de
registración.
2) Se ingresa el nombre
(Name). Se copia del
archivo TXT que
suministramos junto al
software y se pega en
la casilla.
3) Hacmos lo mismo con
la clave (Key).

Este usuario y clave están
disponibles también en el
sitio Web del programa.

2

4) Completamos con el
botón Install...

3
4

3
Aparece una pantalla de
saludo.

1

1) Confirmamos con
Aceptar.

4
1

Aparece una pantalla que
nos informa que hay que
resetear el programa (no la
compu)
1) Confirmamos con
Aceptar.




Algunas referencias del
programa

Interfaz
Cuando abrimos el programa la primera vez, aparecerá aproximadamente con el siguiente aspecto:

8




La zona superior (no configurable) muestra las cuatro barras con todos los
controles (los que se repiten en los menúes), comandos a los que se puede
acceder también mediante atajos de teclado, que vale la pena aprender si
utilizaremos mucho el programa. Los comandos los iremos describiendo a
medida que los utilicemos. Son pocos y sencillos.
Abajo se ubica la zona de trabajo y se cierra con una barra de estado con
información sobe los objetos seleccionados.

9

Todos los comandos a los
que se accede mediante
botones, están incluídos
en los menúes del
programa. En el tutorial
utilizamos los botones
porque son más sencillos
de mostrar.

Principales ventajas del programa
Exporta las presentaciones en formato SWF (flash), lo que permite su utilización con mucha libertad.
A la vez, exporta en formato flash ejecutable (exe), lo que
facilita aún más su distribución.
Por último, exporta código HTML para incrustar las presentaciones en sitios Web.
Incluye la inserción de botones roll-over de tres posiciones,
lo que brinda una serie de posibilidades para crear efectos
dinámicos.
Tiene prestaciones importantes para trabajar con imágenes.
Incluye una colección importante de efectos de animación y transiciones muy completa y con algún grado de configuración.
Permite insertar sonido.

Algunas desventajas del programa
No posee una herramienta específica de selección de objetos.
Se pierde la selección con mucha facilidad, lo que obliga a un
par de pasos para recuperarla. Aunque a poco de hacerlo se
aprende, resulta molesto. Esto sucede sobre todo al trabajar
con textos. En este tutorial no trabajaremos con textos.
No posee página maestra.
No incluye un modo de fijar los objetos para no moverlos
accidentalmente al trabajar.
No permite ejecutar sonido a pedido. Sólo colocarlo como
fondo en las páginas.
Manejo torpe de la configuración de textos.
No incluye avance automático de páginas seleccionadas. Sólo
se puede elegir esa opción para el conjunto del objeto.
Puede no funcionar bien en las versiones más recientes de Windows (Windows Vista y Seven)
Soluciones
En el capítulo final (Tips) daremos indicaciones sobre los principales problemas y trucos para solucionarlos. Recomendamos leerlo antes de trabajar.

Seguramente existen
programas comerciales de
mejor calidad. Pero en
este posgrado utilizamos
sólo software gratuito o de
libre distribución, de
manera que todos los
participantes estén en
igualdad de condiciones.




10

Estructura del proyecto

El proyecto trabaja sobre el tema de un fuerte chileno ubicado en la zona
más austral del continente, llamado Fuerte Bulnes. No pretende ser un proyecto educativo real, sino servir como pretexto para el aprendizaje del programa y la reflexión sobre los modos expresivos del lenguaje multimedia.
El proyecto completo es demasiado extenso para el tiempo del que disponemos, para los participantes más inexpertos en el uso de programas no
conocidos. Por esa razón, cada participante armará la parte que se solicita en
las Asignaciones publicadas en la clase de inicio de la Unidad. Armar el resto
del proyecto es optativo.

Fotografía actual (enero
de 2012)




11

Comentarios sobre el guión
El guión tiene una estructura en árbol. Con un menú general al que se
puede regresar desde cualquier página.
La navegación entre páginas sigue la lógica del discurso. Hay
algunas que son secuenciales y otras que son opciones que el
usuario final puede abrir o no.

Se adapta a lo que se está
diciendo

El avance (o regreso) entre páginas se realiza mediante botones ubicados en la zona inferior de la pantalla. Donde también hay un botón que lleva al menú general.

Los accesos al tercer nivel de información se hacen desde botones intercalados en el texto, o porciones de imágenes que
son botones.
En pocas ocasiones se accede a la misma página desde dos
lugares diferentes. El programa no posee la opción de regresar a la página de origen, por lo que hay que ser cuidadosos con esa opción.
En los apartados destinados a la construcción de cada página
detallaremos todos los elementos que se incluyen, y algunos
comentarios sobre los criterios de diseño.
Nota
Todas las capturas de pantalla del guión fueron realizadas sobre una versión preliminar del objeto. Pueden presentar leves variantes con el demo
final que publicamos.

Comentario sobre la interfaz
La interfaz fue diseñada utilizando elementos que remitan visualmente a la época de
construcción del fuerte.
Madera, hierros, remaches. Y el color predominante es el sepia, que
en la cultura visual se relaciona con lo antiguo.

Regresar ala página de
origen es una opción que
se usa cuando a una
página se puede regresar
desde dos o más lugares
diferentes.




12

Menú - Túnel de inicio
El comienzo del objeto está trabajado como
«túnel», constituido por tres páginas consecutivas que llevan a la del menú.
1) La página 1contiene sólo un botón,
bastante obvio, para comenzar a recorrer el objeto. Fondo negro.

1
2) La segunda página muestra el
logotipo del IFD.
Toda la pagina es un botón que lleva a
la siguiente.

2
3) La tercera página contiene el título del
objeto, un botón que lleva a la página
de créditos y un botón para continuar.

3
4) La cuarta página es la del menú general. Los botones de la zona inferior
no tienen acciones (regresan a la misma página) y cinco botones de las tantas secciones en que se estructura el
objeto:
Historia
Geografía
El fuerte

4

La zona
La goleta Ancud


Menú - Historia / Goleta Ancud

No están graficados los retornos. En general, van a la página de origen.
La goleta Ancud tiene un botón en el menú general. También se llega desde la segunda
página de historia.


13



Menú - Geografía

La secuencia de imágenes de
la sección Geografía corresponden a capturas de aproximaciones en Google Maps (las
mismas que usamos en el video Fuerte Bulnes). Pero tomando sólo una selección de
las placas.
Todas las páginas incluyen un
botón para regresar al menú
general. En todas menos la última hay un botón (lupa) que
lleva a la siguiente página.

La placa final no tiene botón de
avanzar...

14


Menú - El fuerte

Los links de este frame
se desglosan en la
página siguiente

La imagen funciona como
menú. Hay cuatro botones
que se destacan sólo al pasar
el mouse sobre ellos.


15


El «botón» es una
fracción de texto.

Criterios de nombres de archivos
Para facilitar la carga (en la ventana se ve sólo el nombre) de los archivos gráficos que usaremos en el proyecto, los mismos han sido bautizados de la siguiente manera:
Todos tienen un prefijo numérico que corresponde al número de página en el objeto (es el mismo número que usa PowerBullet para identificar cada página o frame). Por ejemplo 04-imagen.jpg es una imagen que se usa en la página 4.
Los elementos que se usan en más de una página (algunos botones y la
«madera» de la base, llevan como prefijo un doble cero (00)
Las imágenes de los botones usan el prefijo de la página donde van
insertados, y un sufijo, aplicando un criterio que nos ha sido muy útil
desde hace años:
Usamos la letra a para la primera posición (reposo)
Usamos la letra b para la segunda posición (cuando el
mouse pasa sobre el botón)
Usamos la letra c para la tercera posición (cuando se
hace clic sobre el botón)
Así, por ejemplo, el gráfico 27-boton-b.jpg es una imagen de botón
que se usa en la página 27 para la segunda posición.


16




17

Pequeño ejercicio previo

PowerBullet es un programa orientado a objetos. Eso significa que todos
los elementos que colocamos, dibujamos o editamos en su pantalla de trabajo, son tratados como objetos individuales, que no se mezclan con los otros.
Cuando abrimos por primera vez el programa, aparece una pantalla como
la que mostramos más abajo. Las imágenes que se muestran en la zona de
trabajo, ilustran los efectos de degradé y transparencia en objetos dibujados
en el programa. Esas cuatro figuras son, cada una, un objeto individual, editable (se puede modificar) y cambiar de posición en la pantalla y/o entre sí (cual
tapa a cual).

El texto también es
un objeto individual,
editable.

Usamos la palabra
objeto con dos
significados diferentes:
para designar cada
elemento en el proyecto
(imágenes, sonidos,
textos, botones) y para el
proyecto terminado, al
usar la categoría de
objeto digital
educativo.




18

1

2

Seleccionar un
objeto
1) Hacemos clic sobre uno
de los objetos. el
cuadrado celeste.
2) Observemos que
aparecen ocho puntos
cuadrados en los
vértices y en los lados.
Esos puntos son los
controles de selección
del objeto. Si los
vemos, el objeto está
seleccionado.
Si los tomamos con el
puntero del mouse,
podemos modificar la
forma y el tamaño del
objeto.

1

2
1

Cambiar posición
relativa
(Cual objeto está por sobre
el otro)
1) Clic sobre el botón que
manda «al fondo» al
cuadrado.

Cuando trabajemos en el
proyecto veremos las
cuatro opciones de cambiar
la posición relativa de los
objetos entre sí.

3
Observemos que ahora el
cuadrado celeste quedó
por debajo del negro, que
lo tapa.

1




4
Haciendo clic sobre el
objeto, y sin soltar el
botón principal del
mouse, podemos
arrastrarlo hasta otra
posición de la pantalla.

Podemos cambiar cualquier otro atributo o propiedad del objeto seleccionado:
Color del fondo
Transparencia del fondo
Color de la línea de contorno
Ancho de la línea de contorno
Tamaño de la figura
Forma de la figura
Borrarlo
Etcétera
Lo más importante, en PowerBullet, es asegurarnos que nuestras acciones
se apliquen al objeto seleccionado. Cuando el fondo ocupa toda la pantalla
(como será en nuestro proyecto) los puntos de selección del mismo no se
ven. Hay que tener cuidado con eso. Podemos probar cómo desaparecen los
puntos, arrastrando el objeto fuera de los límites de la pantalla.
Es un buen momento, ahora, para «jugar» un rato, explorando la
interfaz, moviendo objetos, dibujando figuras, etc. para ir tomando
confianza. Es gratis, no hay peligro de equivocarnos y no engorda.

19




Armar el tunel inicial

Ell túnel incial lo constituyen las cuatro primeras placas. En la construcción
de las mismas aprenderemos todas las acciones básicas, por lo que es importante ir presstando atención a cada paso.
Antes de comenzar

Tener instalado y registrado el programa, tal como se indica
en las páginas 6 y siguientes.
Armar una carpeta de trabajo donde colocaremos todos nuestros materiales, que debemos bajar del aula. No se debe colocar el material de trabajo en la misma carpeta donde el programa guarda sus archivos de funcionamiento.
El archivo comprimido contiene todos los gráficos y demás
recursos para armar el proyecto completo. Son muchos archivos, de los que usaremos sólo una parte si no contruimos
el proyecto completo.
Programar el trabajo. No conviene realizar sesiones muy largas, ya que al final se realizan muy automáticamente las tareas, sin consolidar el parendizaje. Tampoco sesiones muy
cortas, ya que no se alcanza a crear el «clima» de trabajo necesario. Mínimo una hora y tratar de no pasar de cuatro.
Recomendamos imprimir este capítulo (o todo el manual) para
tenerlo sobre la mesa de trabajo mientras editamos en
PowerBullet.

20




21

Configurar el proyecto

1

2

Crear nuevo
proyecto

3

1) Clic sobre el botón
nuevo...

Muy importante
El programa abre en la carpeta donde
guarda sus propios archivos. No hay
que guardar allí el proyecto.
Usar la carpeta donde guardamos las
imágenes.

2) Aparece una
ventanapara guardar...
3) Buscamos nuestra
carpeta de trabajo...
4) Le damos un nombre al
proyecto
5) Guardamos

5

4

1

2
1) En la barra superior
aparece el nombre del
proyecto

3

1

Dimensiones de la
pantalla

2

Dimensiones
Estas medidas se deben a:
Ancho: es el máximo que podemos publicar en nuestras aulas virtuales.
Alto: es la proporción al reducir de las pantallas originales de
640x480 px

1) Menú Project
2) Layout dimensions...

1

0

2

4
En la pantalla que aparece...
1) Ancho 516 px
2) Alto 380 px




22

5
Configurar la
exportación
1) Menú Project
2) Export settings...

6
En la pantalla que
aparece....

Opciones de exportación
Son las que el programa usa en
el momento de exportar el proyecto al formato swf (flash), exe y
html . No hemos explorado todas
las opciones, ya que usamos el programa sólo para los proyectos de
creación de objetos.

1) Tildamos la casilla
Manual (los botones de
avance y retroceso los
ponemos nosotros)
Dejamos el resto sin tocar.

Elprograma posee botones
propios para avanzar y
retroceder de a una página.
Se pueden colocar botones
rollover para esas
funciones. No usaremos
esas opciones en este
proyecto.
1

Ver los formatos de archivo
La computadora de un docente virtual debe estar configurada de acuerdo al tipo de tareas que debe encarar. Los diseñadores de Windows,
empeñados en producir usuarios bobos, automatizan muchas cosas que
no deberían ser así, y ocultan información importante para los usuarios.
Entre esos ocultamientos está la configuración por defecto de todas las
versiones de Windows que oculta las extensiones de archivo.
En la Guía Didáctica en línea (aula virtual) publicamos las indicaciones
para volver visibles las extensiones.

El programa permite
establecer avance
automático temporizado
para pasar a la página
siguiente. Tampoco
usaremos esa opción (sirve
para banners...)




23

Crear la página 1
La página 1 sólo contiene el botón de iniciar el recorrido, sobre fondo
negro. Nos pareció que sería mejor un diseño «de época» que un típico botón
play.

1
Color de fondo de
la pantalla
1) Menú Project
2) Background color

2
Color negro, pero...

En la pantalla que aparece
elegimos el negro

Elegimos el color negro para fondo, porque si
al visualizar el producto final se demora en
cargar algún gráfico, ese color «molestará»
menos que otro.
También es el color que PowerBullet usa para
fondo de la página Web que crea (formato
html)

Pero...
En los navegadores, no siempre se visualiza
el color de fondo de los objetos flash
(swf). Eso no sucede sólo con elpobrecito
PowerBullet sino también con el
superpoderoso Adobe Flash...
De manera que debemos agregar un paso.

3
1

Agregar figura de
fondo
1) Clic sobre el botón de
agregar figura
rectangular




24

4
Aparecerá un cuadrado
blanco, seleccionado, en el
ángulo superior izquierdo
de la zona de trabajo.

5
1) Tomando el punto de
control del vértice
inferior derecho con el
puntero del mouse...

1

2) ...lo arrastramos hasta
el vértice inferior
derecho de la zona de
trabajo.

2

6

2
1
2

1) Con las flechitas del
teclado corremos la
figura hasta que
desaparece el punto de
control de la izquierda
(y el de arriba, que no
se ve en la captura).
2) Con el puntero
agrandamos el
rectángulo hasta cubrir
el lado derecho y abajo

7
Cambiar el color
Con el recuadro
seleccionado...
color de fondo de
figuras




25

8
Aparece la clásica ventana
de seleccionar colores de
Windows...
Elegimos el negro.

2

10
3

Colocar el botón
de inicio
insertar imagen

3

4

2) Aparece la ventana de
seleccionar imagen
3) Elegimos laimagen del
botón en reposo (sufijo
a). El nombre es el que
aparece en la captura.
4) Clic sobre Abrir

11
Aparece la imagen del
botón en reposo en la zona
de trabajo.
Con la imagen seleccionada
(se ven los 8 puntos),
usando las flechas del
teclado, corremos la
imagen hasta el centro de la
pantalla. Esto se hace «a
ojo».




26

12
Convertir en botón
rollover

2

3

1) Hacemos clic con el
botón derecho del
mouse sobre la imagen
del botón en reposo
2) En el menú emergente...
3) Clic sobre Item rollover
effects.

13

1

2

1) Aparecela pantalla para
cargar las otras dos
imágenes del botón
2) Clic sobre Over para
cargar la imagen que se
verá cuando el mouse
pase sobre el botón.

14
Cuando aparece la ventana
de cargar la imagen,
elegimos la que tiene el
sufijo b, que corresponde a
la posición Over (sobre)
El nombre del archivo es el
que aparece en la captura.
Nuevamente clic con el
botón derecho del mouse...
Repetimos la operaqción
para la posición Down,
para la que elegimos el
archivo que tiene el sufijo c
(01-b-play_inicio-c.jpg)

15

Muy importante
Asegurarse que lo que esté seleccionado sea la imagen del botón, y no
el fondo. En este y en todos los casos en que armemos botones.
La selección la indican los ocho puntos de control.

Función del botón
Hacemos clic con el botón
derecho sobre la imagen
del botón en la pantalla.
1

1) En el menú emergente
elegimos Item Click
action.




1

2

27

16

1) Aparece la pantalla de
asignar acciones al
botón (lo que convierte
a cualquier objeto en
botón, tenga o no
configuración rollover)
2) Tildamos el botón de
radio Go to page... (ir
a página).
3) Escribimos enl a casilla
el número dela página
siguiente (2). No elegir
de la lista...
4) Clic sobre OK.

3

.

4

Comentario sobre botones
Para PowerBullet botón es cualquier objeto al que se le asigna una
acción «de clic». Pero la acción de establecer una acción para el
botón no es reversible. Lo que significa que, si por error tenemos
seleccionado el fondo u otro objeto, y lo convertimos en botón, no hay
modo de volver atrás. Deberemos borrar el objeto convertido erróneamente en botón y volverlo a insertar.
No hemos experimentado con otras acciones del botón. Pero normalmente los player de flash no permiten ejecutar acciones fuera de la
Web de origen, para evitar que se inserte código malicioso en los objetos flash.
Antes de abandonar la página 1
Después de terminar con el botón, seleccionamos el recuadro negro de
fondo y lo copiamos, con el botón copy.

Guardar
Conviene guardar al terminar cada página, o parte de ella, cuando
hay muchos elementos.

Es importante tildar
la casilla. No se
selecciona
automáticamente al
llenar el número de
página de destino,
como hacen la mayor
parte de los
programas de
Windows




28

Armar página 2
La página 2 contiene sólo el logotipo del IFD sobre fondo negro.

Las páginas nuevas se agregan siempre a continuación de la
que está abierta en el momento de crearlas.
Elpegado se hace exactamente en la misma posición que el
objeto copiado tenía en la página de origen.

1
Clic sobre el botón de
agregar una página.

2
pegar, para insertar el
recuadro negro que
copiamos de la página 1

3
insertar imagen

4
Seleccionamos el archivo
02-logo3D-ve.jpg

5
Mediante las felchitas del
teclado lo acomodamos en
el centro de la pantalla (más
espacio arriba que abajo,
para equilibrar)




29

6
Sin rollover
En este caso, al ser la imagen de tamaño grande, y el
único elemento en la pantalla, no es necesario que usemos imágenes para el efecto rollover.
Convertimos directamente
la imagen en botón, al asignarle una acción.

1) Clic con el botón
derecho del mouse
sobre la imagen.

seleccionamos Item
Click Action

7
1) Seleccionamos el botón
de radio Go to page...
2) Colocamos el número
de la página siguiente
(3)
3) Clic sobre OK

1

2
Guardar

Armar la página 3
La tercera página es la del título del objeto. Tiene un botón de acceso a los
créditos y la barra inferior de navegación.
La barra inferior de navegación la integran una franja (madera) y, según la
página, los botones de avanzar (ir a...) retroceder (ir a...) y de acceso al menú.
en este caso sólo el botón de avanzar.

1
Agregamos una nueva
página mediante el botón
respectivo.

2

1) Mediante el botón de
insertar imagen...

2

2) Agregamos el archivo
00-madera2.jpg para
el friso de navegación.




30

3
Aparecerá en la zona media
de la pantalla.
Lo arrastramos hacia la
parte inferior.

4
Lo paroximamos al
borde...

5

Con las flechas del teclado
lo llevamos hasta su
posición., cuando
desaparecen (apenas) los
puntos de control inferiores
y del costado.
Ver que el superior todavías
e visualiza.

6
agregar imagen

2) 00-B-avanzar-a.jpg

7

Con el puntero del mouse
lo aproximamos al lugar
donde se ubicará

8
La ubicación exacta la
tendremos cuando
hagamos coincidr las dos
marquitas claras. Una está
en la mader y la otra en el
botón



Registrar
Registrar es colocar cada elemento exactamente en su
posición, guiándonos por detalles (como las marquitas).
Esta exactitud tiene que ver con la credibilidad de las
imágenes, que deben verse integradas y no
superpuestas.


31

9
Se ve una sola marquita...

10
1) Clic con botón derecho
del mouse...
2) Elegir rollover efects ene
le menú emergente
3) Cargar los gráficos
avanzar-b y

avanzar-c

11
Como acción del clic
colocar ir a página 4.

12

Cargar la imagen de fondo
03-Titulo.jpg

13
Aparecerá en la zona
central
Con el púntero del mouse la
movemos hacia su posición
final...




32

14
Con las flechitas del teclado
movemos la imagen hasta
que desaparecen los puntos
de selección...

Con el botón de «enviar al
fondo» colocamos la
imagen por debajo del friso
de madera inferior

15

Cargamos la imagen del
botón Créditos para la
posición reposo.

03-B-Creditos-a.jpg

16
1

La acomodamos lo mejor
posible en su lugar. No hay
guías visuales para esta
ocasión.
1) Que no corte la sombra
del título.

17
Colocamos las otras dos
imágenes para el efecto
rollover del botón:

03-B-Creditos-b.jpg
03-B-Creditos-c.jpg

18
Establecemos como acción
del clic ir a la página 35

Guardar




33

Antes de abandonar la página 3, seleccionamos y copiamos el friso inferior de madera.

Armar la página 4 - Menú general del proyecto
Esta página contiene un fondo igual al de la anterior, pero más suave, la
tabla sobre la que se arma el menú, el friso inferior con una versión especial
del menú de navegación. Y los cinco botones que van a cada una de las secciones del proyecto.

1

Clic para crear una nueva
página
Se acomoda según la posición
que tenía en la página 3.

2

Pegamos el friso inferior de
madera.

3
Menú de navegación especial
En el friso de madera dela parte inferior van los botones de navegación de avanzar,
retroceder y el de ir al menú de la página 4. En esta página colocaremos una versión
especial, con los botones atenuados (más claros o grisáceos), como es usual en las
interfaces Windows para los botones que no funcionana, aunque se vean.
De manera que podemos reproducir el friso y ese menú en todas las páginas, y
postriormente usar lo que necesitemos en cada una.

Cargamos nuevamente el
gráfico del botón de
avanzar. Lo acomodamos
según hicimos antes.

00-B-avanzar-a.jpg

4
Sobre la imagen del botón
en reposo (a)
2

1) Clic con el botón
derecho del mouse

elegimos Item
properites
(propiedades de esa
imagen)

1




34

5
1

Aparece una ventana de
propiedades generales del
objeto seleccionado (en
este caso nuestro botón)
1) Colocamos como
opacidad el valor de 50
o 60 %
2) Clic sobre OK.

2

Observemos que podemos
cambiar en esta pantalla la
posición, el tamaño,
agregarle sombra e, incluso,
cargar otra imagen en lugar
de la original.

6
Observemos la diferencia
entre el botón normal y el
semitransparente.

7
Para el efecto rollover
Cargar los gráficos

00-B-avanzar-b.jpg y
00-B-avanzar-c.jpg

8
Colocamos como acción de
clic ir a la página 4. El botón
no hará nada, ya que se
encuentra en la página 4.

9

Cargamos la imagen del
botón del menú para la
posición de reposo

00-B-Menu-a.jpg



1


35

10

1

Para acomodarla
(registrarla)...
1) Ver los detalles que nos
guiarán

11
Hacemos semitransparente
la imagen (50%)

12
Zzoom

1

Zzoom es una lupa de pantalla
muy útil para estos casos. No
necesita instalarse.
Colocamos el pequeño exe.
en el escritorio y lo abrimos
cuando lo necesitamos.
En su ventana muestra
(aumentada) la zona
alrededor del puntero del
mouse.
Aunque para registrar los
objetos usemos las teclas de
flechita, hay que poner el
mouse en la zona para poder
ver lo que sucede.
Está en la sección Archivos
del espacio de Ayudas del
aula..

Se puede hacer a ojo, pero
mejor con la lupa de
pantalla Zzoom.
Ver los detalles que nos
ayudan, usando la
transparencia:
2

1) El pixel más brillante es
una buena guía.
2) El relieve se ve muy
borroso si la imagen no
está bien registrada.

13
Incorporar los otros dos
gráficos del botón.

00-B-Menu-b.jpg
00-B-Menu-c.jpg

Colocar como acción del
botón ir a la página 4

14
Insertar la imagen del botón

00-B-volver-a.jpg




36

15
Para este botón tenemos
marcas fuertes que nos
ayudarán a registrarlo en su
posición

16
Con el botón transparente y
usando la lupa Zzoom, esa
línea oscura fue la guía que
más me ayudó

17
Colocamos las dos
imágenes para el efecto
rollover

00-Bvolver-b.jpg y
00-B-volver-c.jpg

También le asignamos la
acción de ir a la página 4
como acción del clic.

18
Ya tenemos nuestros tres
botones de navegación
(atenuados)

Una mejor estrategia
El proceso más adecuado sería, no cargar en esta ocasión las imágenes del efecto rollover,
lo que haría innecesario también colocar la acción de clic. Es decir, sólo tendríamos la
imagen de los tres botones, sin que sean botones.
Posteriormente los copiamos, los pegamos en la página siguiente, les sacamos la
transparencia (volvemos al 100% de opacidad), colocamos las dos imágenes para el eferto
rollover y (sin cambiar todavía la acción de clic) los propagamos en el total de las páginas
(las vamos creando y pegando el conjunto de friso de madera y tres botones). Después,
cuando completamos cada página, borramos los botones que no se usan y colocamos el
destino de la acción de clic que corresponda.
Este tipo de automatización ahorra tiempo, pero como estamos aprendiendo, ahora no es
lo más importante..




37

19
Colocar el fondo
Cargamos la
imagen

04-Fondo_menu.jpg

20
1) La acomodamos con el
mouse y las flechitas
del teclado hasta que
desaparecen los puntos
de control.
2) La «mandamos al
fondo» con el botón
respectivo.

21

Cargamos las imágenes de
los cinco botones:

04-B-El_Fuerte-a.jpg
04-B-Geografia-a.jpg
04-B-Historia-a.jpg
04-B-La_Goleta-a.jpg
04-B-La_Zona-a.jpg

22
1) Los aproximamos a su
posición con el mouse

2) con la layuda de la lupa
Zzoom, ajustamos el
registro con las flechitas
del mouse, usando los
detalles visuales (hay
muchos en esta zona)




38

23
Procedemos igual con los
otros cuatro botones.
Los detalles nos ayudan al
registro de cada uno.
Hay que ir mirando en la
vista normal y en la lupa,
porque en la vista normal
se parecian mejor cuáles
son los puntos a observar.

Botón
Historia

Ir a pág. Ir a pág.

12

4

Geografía

5

4

El Fuerte

19

19

La zona

4

36

La goleta Ancud

15

4

La columna de destinos de la izquierda es la
que corresonde al proyecto completo.
La de la derecha es para quienes hagan sólo
la p arte del proyecto obligatoria (túnel, El
Fuerte y La zona)

Guardar y probar

24
Así queda el panel del menú
de la página 4.
Completamos para cada
uno de los botones las dos
imágenes del efecto
rollover.
Ver al costado el cuadro de
acciones para cada botón.

Con esto se finaliza la
construcción de la
página 4 del menú.

Atención
Los números de destino
(Ir a pág...) de los
botones del menú
cambian según se
realice el proyecto
completo o sólo la
parte obligatoria.

Ya es hora de ver cómo funciona lo que hicimos...

1
Con el botón de publicar
obtenemos una versión
funcional del proyecto.




39

2
En nuestro navegador
aparece el proyecto, que
podremos recorrer hasta
donde está construido

3
Si al accionar un botón
apaqrece una página como
la de la captura, es porque
hemos omitido asignar una
acción de clic o porque la
misma es incorrecta.

4
Volvemos a la
página 4...
1) Seleccionamos el friso
de madera inferior, y los
tres botones de
navegación.
Eso se hace con la teca
mayúsculas presionada,
mientras haceos clic
sobre cada uno de los
objetos.
2) Los copiamos

+

=
Al publicar, guardamos...
La acción de publicar incluye la de guardar, por lo que no hace falta
guardar cuando publicamos.




40

1

Un poco de trabajo en serie
Vamos a crear todas las páginas que usaremos en el proyecto.
Para ganar tiempo de producción. Si por cualquier razón necesitáramos otras, se pueden crear, intercalar o desplazar a donde las
necesitemos.

Creamos una nueva página.

2
Pegamos la barra de
navegación que acabamos
de copiar en el último paso
de la página 4

3
1) Damos la opacidad total
(100%) a los tres
botones.
2) Dejamos las acciones
como están. La del
botón central (menú) es
la definitiva (ir a la
página 4 , que es la del
menú).
Las de los otros botones
las cambiqaremos en
cada página.
3) Seleccionamos la
madera del friso y los
cuatro botones.
4) Copiamos con el botón
Copy

+

4
Creamos 30 páginas
nuevas. A medida que las
creamos, en cada una
pegamos la barra inferior
de navegación completa.
Al finalizar el progrma nos
indicará que tenemos 35
páginas.

Tenemos ahora 35 páginas. Las cuatro primeras completas y las 31 restantes a medio hacer. Con fondo negro y la barra de navegación inferior con sus
tres botones.

Navegar entre páginas
La navegación entre páginas, mientras trabajamos en el proyecto, se hace
mediante dos flechas ubicadas a la izquierda de la barra de botones del programa. No confundir con otras dos flechas parecidas, que sirven para mover
una página a otra posición relativa (por ejemplo, que la página 17 pase a ser la
29)
1

2

1

2

1) Moverse entre páginas
(navegar)
Sólo se puede avanzar
o retroceder de a una
página por vez.
2) Mover las páginas de
lugar




41

Armar la página 5
La página 5 es la primera de la serie de vistas satelitales de Google Mpas,
correpondientes a la sección Geografía del proyecto.
Contiene la imagen de fondo y un botón con una lupa para ir a la página
siguiente, además del botón del menú.

1
1) Seleccionamos los dos
botones de navegar.
2) Los borramos...

2
Cargamos el gráfico de
fondo

05-satelite.jpg

La acomodamos con las
flechitas y la mandamos al
fondo con el botón
respectivo.

3
1) Cargamos la imagen del
botón

00-Lup-a.png

2) La achicamos un poco...
2) La colocamos en el
vértice inferior derecho.

4
1

2

Antes de abnadonar la
página, copiar el botón-lupa

1) Cargamos el botón -b
para la posición Over.
2) Cargamos nuevamente
la imagen

00-Lup-a.png

para la posición Down.
Este es un botón con sólo
dos imágenes.
Ponemos como acción del
botón ir a la página 6




Pagina 6
1) Borrar los botones triangulares
2) Pegar el botón lupa
3) Acción = Ir a página 7
4) Colocar imagen de fondo 06-satelite.jpg,
acomodar y mandar la fondo.

Pagina 7

Pagina 8

Pagina 9

Pagina 10

Pagina 11
3) NO pegar el botón lupa (es la última página de la serie)
Para hacer
otra página

42

Estas páginas se hacen en
serie, en unos minutos.

Pegamos la lupa en
primer lugar, para
evitar reemplazar por
accidente al fondo. Si
el fondo está todavía
seleccionado cuando
pegamos la lupa, la
misma lo reemplaza.

Atención:
Mucho cuidado con no
aplicar la acción de clic
al fondo, en lugar del
botón.
Nos daremos cuenta
porque al editar la
acción de clic, no
aparecerá ir a página
6, que es lo que tiene el
botón que copiamos.




43

Armar la página 12
La página 12 es la primera de la sección de historia.
Además de la placa de fondo, sólo tienen el friso inferior de madera, el
botón de ir al menú y un botón de avanzar.

1
2

1) Borrar el botón de
retroceder.
2) Editar el botón de
avanzar...
Establecercomo acción
de clic ir a página 13.

2

2
Insertar la imagen de fondo

12-Historia-01.jpg
Acomodar y mandar al
fondo.

Armar la página 13
La página 13 tiene, además del botón de avanzar en el friso inferior, tres
botones de un tipo que no vimos hasta ahora: botones en el texto. Aunque
no se trata de texto sino de imágenes que lo contienen.

1
2

1) Borrar el botón de
retroceder.
2) Editar el botón de
avanzar...
Establecercomo acción
de clic ir a página 16.




44

2

1

1) Insertar la imagen de
fondo

13-Historia-02.jpg

2) Acomodar
3) Enviar al fondo

1

2

3

3
Cargamos la imagen para
uno de los botones.

13-B-Ancud-a.jpg

4
1) Aproximar con el
mouse hasta cerca de
su posición final

2) Ajustar el registro con
las teclas de flechita.




45

5
Efecto rollover
1

2

1) Cargar para la posición
Over el archivo

13-B-Ancud-b.jpg
Down nuevamente el
archivo

13-B-Ancud-a.jpg
Este es un botón de dos
imágenes

6
Colocar como acción del
clic ir a página 15

1

7
Cargar el gráfico

13-B-Bulnes-a.jpg
Armar el efecto rollover
(dos imágenes).
Acción: Ir a página 14

8
Cargar el gráfico

13-B-Zarpo-a.jpg

En los dos botones se repiten los pasos 4, 5 y 6

Armar el efecto rollover
(dos imágenes).
Acción: Ir a página 16

9




46

Armar página 14
La página 14 tiene sólo el botón de volver y una imagen de fondo.

2

1

1
1) Borrar boton avanzar
2) Acción: ir a página 13

2
Insertar imagen de fondo

14-Historia-03.jpg
fondo.

3
Armar página 15
La página 15 tiene sólo el botón de volver y una imagen de fondo.

2

1

1
1) Borrar boton avanzar
2) Acción: ir a página 13

2
Insertar imagen de fondo

15-Historia-04.jpg
fondo.

3




47

Armar página 16
do.

La página 16 tiene el menú de navegación completo y una imagen de fon-

1
1

Acción de clic
2

1) Ir a página 13
2) Ir a página 17

2

16-Historia-05.jpg

Acomodar y enviar al fondo

3
Armar página 17
La página 17 tiene el menú de navegación completo y una imagen de
fondo.

1
1

2

Acción de clic
1) Ir a página 16
2) Ir a página 18

2

17-Historia-06.jpg


3




48

Armar página 18
La página 18 tiene el botón de regresar y una imagen de fondo.

2

1

1
1) Borrar
2) Acción de clic:
Ir a página 17

2

18-Historia-07.jpg


3
Momento oportuno para probar si todo funciona bien
...y corregir lo que sea necesario.


El Fuerte Bulnes

Nos internamos ahora en lo que es el núcleo del proyecto. La descripción, predominantemente visual, del Fuerte.
Para quienes hemos tenido la oportunidad
de conocerlo, impresiona la solidez con que
desafía las inclemencias del durísimo clima de
la zona. Cuesta imaginar las condiciones de vida
de los pioneros, en los años de su fundación.


49




50

Armar la página 19
La página 19 funciona como carátula de la sección dedicada al fuerte de
manera específica.
El menú de navegación tiene el botón de regresar al menú general del
proyecto y el de avanzar. Además, hay un botón en el texto que simula un
hiperlink. Este botón lleva a una sección con detalles de la construcción.

1
1

2

3

1) Borrar
2) No se modifica
3) Acción de clic:
Ir a página 20

2
1) Insertamos el gráfico de
fondo

19-El_Fuerte-01.jpg
2) Lo acomodamos con el
puntero del mouse y las
flechitas del teclado.
3) Lo enviamos al fondo
4) Ajustamos la posición
con las flechitas.

3

1) Insertar la imagen para
la posición de reposo
del botón.

19-B-Detalles-a.jpg

2) Aproximarla a su
posición

3) Registrarla con la ayuda
de las teclas de flechitas
del teclado.




51

4
Efecto rollover
Over la imagen
19-B-Detalles-b.jpg
Down nuevamente la
imagen
19-B-Detalles-a.jpg

Es un botón con dos
imágenes.

5
Establecer para la acción
del botón (Item clic action)
Ir a página 31.

6
Armar página 20
Esta página tiene en el friso de navegación el botón de ir al menú
general y otro de regresar.
La imagen de fondo simula un dibujo del fuerte en vista aérea. En
realidad es un filtro de dibujo aplicado sobre una fotografía de una
maqueta (del museo de Ancud). Algunos edificios del dibujo son
botones que se descubren recorriendo con el puntero del mouse la
imagen. Funciona como menú de las fotografías del fuerte.
Cuando se usan este tipo de soluciones, hay que evitar el risego de que el
usuario final pase de largo la pantalla, sin darse cuenta de que a través de la
misma se accede a otra información. Nosotros optamos por una solución obvia: el texto del áungulo superior izquierdo. Pero pueden elegirse otras alternativas: por ejemplo, si borramos todos los botones de la barra inferior, al
llegar a esta pantalla el usuario la recorrerá buscando el modo «escondido» de
seguir adelante.

1
1

2

1) Acción de clic del
botón:
Ir a página 19
2) Borrar




52

2

Cargar la imagen de fondo

20-El_Fuerte-02.jpg
Acomodar y enviar al
fondo.

3
Posición de los
botones

1

Utilizamos cuatro botones,
que ocupanlas posiciones
indicadas en los recuadros.
Los gráficos para la
posición en reposo son:
3

2
1 20-B-canoa-a.jpg
2 20-B-Porton-a.jpg

4

3 20-B-Iglesia-a.jpg
4 20-B-caniones-a.jpg

4
Efecto rollover
El efecto visual al pasar el
mouse sobre los botones es
un leve movimiento y el
cambio entre el dibujo y la
fotografía.
El efecto es bastante sutil
pero se advierte.
No se colocaron más
botones para no extender
demasiado el ejercicio. Pero
tampoco sería fácil hacerlo
sin que se superpongan. En
caso de pretender usar un
botón para cada edificio
habría que buscar otro
diseño.
Los botones son de dos
posiciones. Para la posición
presionado se usa la primera
imagen.

Over

Down

Posiciones rollover
y acciones
OVER
20-B-canoa-a.jpg
DOWN
20-B-canoa-a.jpg
Ir a página 30
OVER
20-B-Porton-a.jpg
DOWN
20-B-Porton-a.jpg
Ir a página 27
OVER
20-B-Iglesia-a.jpg
DOWN
20-B-Porton-a.jpg
Ir a página 21

OVER
20-B-caniones-a.jpg
DOWN
20-B-Porton-a.jpg
Ir a página 23




53

5
Cuando colocamos la
imagen inicial del botón
caniones, queda por sobre
el friso de madera.
Hay que bajarla
presionando el botón de
enviar una posición abajo
(varias veces).
Cuidar que el botón no
quede por debajo del
fondo. Para eso, seleccionar
la imagen del fondo y usar el
botón de enviar al fondo...

5
Armar la página 21
La página 21 tiene en el friso de navegación el botón de ir al menú general
y otro de retroceder.
Además de la imagen de fondo, tiene un botón que va a simular ampliar la
fotografía de la capilla.

1

2

1
1) Acción de clic del
botón:
Ir a página 20
2) Borrar

2
Imagen de fondo
21-El_Fuerte-04.jpg
fondo.

3
Imagen botón
Insertamos la imagen para
el botón en reposo:

21-B-capilla-a.jpg




54

4
Acomodar el
botón
Utilizando como guías
visuales el borde del botón,
lo registramos en su lugar

5
Efecto rollover
Posición Over

21-B-capilla-b.jpg
Posición Down

21-B-capilla-c.jpg

6
Acción del botón
Ir a página 22

7
Armar página 22
Esta página simula que la fotografía se amplía. Mantiene los botones del
friso, ya que la fotografía no se superpone a ellos y deben verse (y funcionar).
Todo el fondo lo convertimos en botón, para que al hacer clic se regrese a
la página de origen.

2

1

1
1) Borrar
2) Ir a página 21




55

2

22-El_Fuerte-05.jpg

3
Al acomodarla, asegurar
que el borde inferior de la
fotografía quede visible.

4

Importante
La ilusión de que la foto se amplía funciona si al pasar de pantalla el
fondo queda exactamente en el mismo lugar. (Ir de la 21 a la 22)
Para eso primero hay que acomodar perfectamente la página 22, como
se indica en el punto anterior.
Y después, editar y verificar con el proyecto en funcionamiento,
la coincidencia. Como seguramente no coincidirán en el primer intento,
acomodar la imagen de fondo de la página 21(la anterior), con las
teclas de flechita, hasta que coincidan. Y recordar volver a registrar el
botón de la página 21.
La guía visual es el texto del ángulo superior izquierdo (ver el resultado
correcto en el demo)

Armar página 23
La página 23 tiene el friso con el botón de volver (regresa a lapágina «menú
de la zona de el Fuerte) y el de ir al menú general del proyecto; una imagen de
fondo y tres botones que simulan que las fotos que contienen se amplían, de
manera similar a la de la capilla.

2

1

1
1) Borrar
2) Ir a página 20




56

2

23-El_Fuerte-07.jpg

3
Botones
Colocar, completar el
efecto rollover y asignar
acción.
En reposo
23-B-cañon1-a.jpg
Posición Over
23-B-cañon1-b.jpg
Posición Down
23-B-cañon1-c.jpg
Acción del botón
Ir a página 24

En reposo
23-B-cañon2-a.jpg
Posición Over
23-B-cañon2-b.jpg
Posición Down
23-B-cañon2-c.jpg
Acción del botón
Ir a página 25

En reposo
23-B-cañon3-a.jpg
Posición Over
23-B-cañon3-b.jpg
Posición Down
23-B-cañon3-c.jpg
Acción del botón
Ir a página 26

Armar página 24
En esta página el problema principal será el registro, para que se mantenga
la ilusión de que la foto se amplía en la misma pantalla.

2

1

1
1) Borrar
2) Ir a página 23

2
Cargar imagen de fondo

24-El_Fuerte-08.jpg
Acomodar
Probar en funcionamiento y
ajustar para que registre
con la página 23




57

Armar página 25
También en este caso el problema principal es el registro respecto a la
página 23. Pero, como veremos, no se puede resolver bien porque la imagen
no lo permite.

2

1

1
1) Borrar
2) Ir a página 23

2
Colocar la imagen de fondo

25-El_Fuerte-09.jpg


3
Al acomodar, dejar el
borde de la foto visible,
pero lo más abajo posible.
No alcana para poder
ajustar con la página 23.

4
Armar la página 26
En este caso se puede registrar con la página 23, pero el borde de la fotografía queda oculto tanto arriba como abajo.

2

1

1
1) Borrar
2) Ir a página 23

2
Colocar la imagen de
fondo

26-El_Fuerte-10.jpg
fondo




58

3
El borde de la fotografía
ampliada queda oculto,
tanto arriba como abajo.

4
Armar página 27
Imagend e fondo, dos botones que amplían la fotografía y el menú de navegación inferior.

2

1

1
1) Borrar
2) Ir a página 20

2
fondo

27-El_Fuerte-11.jpg
fondo

3
Colocar botones

En reposo
27-B-porton-a.jpg
Posición Over
27-B-porton-b.jpg
Posición Down
27-B-poton-c.jpg
Acción del botón
Ir a página 28

En reposo
27-B-porton2-a.jpg
Posición Over
27-B-porton2-b.jpg
Posición Down
27-B-poton2-c.jpg
Acción del botón
Ir a página 29




59

Armar página 28
Esta es otra delas varias páginas de ampliación de fotografías. Es posible
registrar perfectamente con la página 27.

2

1

1
1) Borrar
2) Ir a página 27

2
fondo

28-El_Fuerte-12.jpg
fondo

Armar página 29
Esta página se puede registrar muy fácilmente con la 27.

2

1

1
1) Borrar
2) Ir a página 27

2
fondo

29-El_Fuerte-13.jpg
fondo

Armar página 30
Una página muy sencilla. Contiene sólo la imagen de fondo. Nada que
registrar...

2

1

1
1) Borrar
2) Ir a página 20

2
fondo

30-El_Fuerte-14.jpg
fondo




60

Armar página 31
La página inicial de la zona de detalles constructivos del fuerte. Viene de
página 19 y contiene tres fotografías que se «amplían», como en los casos
anteriores.

2

1

1
1) Borrar
2) Ir a página 19

2

31-Detalles-01.jpg

3
Insertar y
acomodar botones

En reposo
31-B-Detalles-1-a.jpg
Posición Over
31-B-Detalles-1-b.jpg
Posición Down
31-B-Detalles-1-c.jpg
Acción del botón
Ir a página 32

En reposo
Posición Over
Posición Down
Acción del botón
Ir a página 33

En reposo
Posición Over
Posición Down
Acción del botón
Ir a página 34

4




61

Armar página 32
31

Sólo la imagen de fondo que hay que tratar de registrar con la de la página

2

1

1
1) Borrar
2) Ir a página 31

2

Insertar la imagen del fondo

32-Detalles-02.jpg

Armar página 33
31


2

1

1
1) Borrar
2) Ir a página 31

2


33-Detalles-03.jpg

Armar página 34
31


2

1

1
1) Borrar
2) Ir a página 31

2


34-Detalles-04.jpg




Armar la página 35
La página 35 es la de créditos. La que inseertamos nosotros es una placa
con poca información sobre fondo negro.
Cada participante de la Especialización deberá construir la suya, indicando
sus nombres y apellidos, así como la fecha y la comisión a la que pertenece.
Debe incluir un modo de regresar a la página 3

62




63

Insertar sonido

1

PowerBullet hace un manejo muy elemental del sonido. Sólo admite colocarlos
como «fondo» en la página, y
el mismo se ejecuta automáticamente al ingresar a la misma. Se puede establecer una
demora en el inicio de ejecución del clip de sonido.
Por tales limitaciones, sólo
haremos unas pocas inserciones, como para aprender
los procedimientos.

insertar sonidos

2
Aparece la pantalla de
sonidos...
1

1) Clic sobre Browse para
abrir la ventana de
búsqueda.




64

3
Aparecerá la ventana de
buscar archivos...
1

1) Elegimos click03.mp3
2) Abrir

2

1

2
1

Repetimos la operación en las páginas... 3 y 5 a 11. Probamos

4
1) Aparece el archivo
seleccionado
2) Clic sobre OK

5

La operación puede hacerse también arrastrando el archivo de sonido a
la página.

1
Sonido de fondo
En la página 16 vamos a
colocar un efecto de sonido
de agua...
Elegimos el clip

olas de mar.mp3




65

2
1

En este caso le agregamos
un delay (demora) que
retardará el comienzo...
1) Entre 0.8 y 1.2
segundos.

1
En la página 17
Para la página 17 elegimos
el clip fanfarrias.mp3
Le asignamos un delay
(demora) de 1 segundo.

1
En la página 18
Para esta página
seleccionamos el clip de
sonido viento-2.mp3
También le configuramos un
delay de 1 segundo

Como vemos, no es mucho lo que podemos hacer con el sonido en
PowerBullet. Solamente «adornar» un poco con efectos especiales.
Ni soñemos con sincronizar el sonido con avances automáticos de las
placas. Eso sólo puede hacerce en archivos de video, cuya banda sonora está sincronizada inernamente.




66

Transiciones y animaciones

Power Bullet cuenta con tres transiciones de página preconfiguradas, a las
que se le puede asignar un tiempo de duración.
Pantalla de
transiciones de
página

5

6

1
2

7

4
3
8

9

Muy importante
No convertir al objeto en un muestrario de transiciones y animaciones.
Aunque podamos agregar otras.
Usaremos las tres que disponemos para ver cómo funcionan.

1) Ninguna
2) Slide (desplazamiento
horizontal)
3) Zoom (Se acerca desde
el ángulo superioro
izquierdo,
agrandándose hasta el
tamaño final)
4) Fade
(desvanecimiento).
Aparece laimagen
desde negro...
5) Duración del efecto en
segundos.
6) Configurar. Fija los
valores elegidos.
7) Los valores de salida no
funcionaron en las
pruebas que hicimos.
8) Aparentemente se
pueden cargar efectos
de transición
adicionales.
9) Confirmar todo.




Página 2
1)
2)
3)
4)

1)
2)
3)
4)

2

Zoom
1,50 segundos
Clic sobre Set
OK

Slide
1,00 segundos
Clic sobre Set
OK

1)
2)
3)
4)

Fade
0,50 segundos
Clic sobre Set
OK

3

1

Página 3

El resto de las páginas
Aplicar a todo el resto
de las páginas del
proyecto

El efecto Fade
El efecto de desvanecimiento, en este caso de ingreso, tiene por fin,
cuando se aplica con duraciones breves, evitar el efecto de salto al cambiar de página, suavizando la transición.
El fade de PowerBullet no se aplica de manera pareja a todos los objetos de la página, por lo que no conviene usar duraciones largas, ya que
algunos objetos pueden aparecer antes que otros. Hay que probar y
corregir.

67




68

Animaciones
Power Bullet posee una importante cantidad de animaciones, aplicables a
objetos en las páginas. Algunas de ellas las mostramos en las Guías (Espacio
de Ayudas) del programa.
En el capítulo «Engordar PowerBullet» indicamos cómo agregar otras,
que suministramos en una colección aparte.
En este proyecto no hemos considerado que aporten nada, por lo que no
las utilizamos. Y colocamos la indicación del procedimiento para los participantes que quieran experimentar.
Animaciones

1

3

2

4
5

1) Tiempo de demora
para el inico de la
animación, desde el
ingreso a la página.
2) Fijar valor.
3) Tiempo de duración de
la animación.
4) Fijar valor
5) Lista desplegable de
animaciones
disponibles

Parte de la lista de
animaciones
instaladas
Para conocer qué hace
cada una no hay otro
remedio que probar, y
anotar los nombres de las
que nos gustan




69

El producto final

1

El archivo flash final, definitivo, lo obtenemos con el
midmo botón con que hicimos
las pruebas durante el trabajo.

Luego de presionar el
botón, aparecerá un
ventana que mostrará el
avance del proceso.
Inmediatamente después de
que finalice la exportación,
se abrirá el navegador
(Explorer, Firefox o el que
tenga instalada la compu) y
se podrá ver y nagegar por
el proyecto terminado.

2
3

1

5

2

4

En la carpeta del proyecto
encontraremos:
1) El archivo del proyecto,
en formato propio de
PowerBullet.
3) El archivo en formato
flsh SWF que podemos
,
colocar en una página
Web, blog, en una clase
de nuestro campus.
3) Un archivo EXE
(proyector flash). Este
permite ver el flash en
cualquier compu, sin
necesidad del
navegador.
4) Un archivo HTML
5) Un archivo PBX. De uso
interno de PowerBullet




70

Una vez más insistimos en la importancia de poder ver las extensiones de los archivos, y no guiarnos sólo por los íconos, que pueden confundirnos.
El archivo con extensión .pbt, con un bonito ícono que represente un rollo de película, no es un archivo que sirva para
mostrar nada. Es el archivo de trabajo interno de Power Bullet.

El archivo .exe es un archivo flash ejecutable, que permite
mostrar la película flash sin necesidad de que en la compu
esté instalado el player de Flash.

El archivo .swf es la película flash que podemos insertar en
una página Web, un blog, una clase virtual o ejecutarla en una
ventana de Flashplayer. Es el que hay que remitir al docente.

Los archivos tendrán el
nombre que le pusimos al
proyecto. Pero podemos
renombrar los de formato
flash.




71

Engordar PowerBullet

Instalar animaciones extras
Bajamos de la clase o de la sección archivos del aula el archivo llamado
05-3-efectos_extras.zip y lo descomprimimos en algún lado. Conviene hacerlo en una carpeta especial.
1

1
1) El archivo zipeado
abierto. El programa
necesario para
descomprimir (WinZip)
y un tutorial de uso lo
encontraremos en la
Biblioteca del Campus.
2) Clic sobre Extract, para
extraer elc ontenido.

2

2

1

2

2

1) Seleccionamos todos
los archivos (los
reconocemos por la
extensión fvanim)
2) Los arrastramos hasta la
carpeta
Powerbulletkeyframes




72

Tips

Como todos los programas, a PowerBullet hay que «tomarle la mano», es
decir, aprender los pequeños trucos y tips que nos ayudarán a trabajar con
comodidad.
Como hemos repetido varias veces, la mayor parte de los problemas tiene que ver con la edición de textos en el programa. La mejor solución que
hemos encontrado es no usar ese recurso, y reemplazarlo por placas gráficas
con el texto editado en el programade imágenes. Tal como hemos hecho con
el proyecto de Fuerte Bulnes.
Hacemos entonces un breve resumen de nuestra (corta) experiencia con
el programa, los problemas que encontramos y las soluciones que nos parecieron viables.
Perder la selección
Una sola carpeta
Hacer Backup
Botones missing
Guardar
Extraño buffer
Cuidado al pegar
Inestabilidad
JPG en Windows Vista
Párafos en texto

Tomarle la mano es un
argentinismo que significa
conocerlo




Perder la selección
Cuando tenemos un fondo que cubre toda la superficie del proyecto (como
los fondos del proyecto Fuerte Bulnes), es muy fácil que inadvertidamente
toquemos el fondo, en lugar del objeto sobre el que queremos trabajar (un
botón, otra imagen, etc).
Al tener el fondo seleccionado, cuesta retomar la selección del objeto más
pequeño.
La solución más sencilla es des-seleccionar el fondo con la tecla ESC.

Una sola carpeta
Aunque podemos cargar imágenes, sonido u otros objetos desde cualquier lugar, es muy importante concentrar todos los contenidos en la carpeta
de trabajo. Eso nos asegura poder reconstruir y retomar el proyecto en cualquier momento, sin tener que buscar archivos perdidos por borrados, cambios de nombre de carpetas, etc.
Pasados unos días, no recordaremos más dónde estaban las cosas, ni la
necesidad de conservar archivos o carpetas que no recordamos vinculados a
ningún proyecto.
Guardar todo en la carpeta de trabajo nos permite copiar esa carpeta en
un CD o DVD y poder reponerla cuando querramos.

Hacer Backup
No nos sucedió nunca el perder un proyecto. Pero, nunca se sabe...
Una forma sencilla de hacer un backup mientra trabajamos es guardar el
proyecto con otro nombre en otra carpeta. El programa copiará todos los
archivos vinculados.
Para p robar si realmente lo hizo, podemos renombrar la carpeta anterior
agregando un signo adelante del nombre (#) y ver si esto hace que no aparezca algún archivo. Si eso sucediera lo copiamos «a mano» a la nueva carpeta.
Este mismo procedimiento lo podemos usar para hacer variantes del proyecto, o experimentos con el mismo.

Botones missing
Sucede muy raramente, pero en algunas condiciones pueden volverse invisibles algunos botones de la interfaz. No hay problema, ya que todas las
acciones están también en los menúes desplegables.

Guardar
En algunas ocasiones encontramos que guarda mejor con el botón de publicar. Y de paso probamos cómo andamos con el armado...

Extraño buffer
Nos ha sucedido que al reemplazar una imagen por otra con el mismo
nombre (modificándola afuera del PB), el programa sigue cargando la anterior, aunque la borremos.

73




No encontramos explicación a ésto, salvo que el programa seguramente
arma un buffer de trabajo y almacena allí temporalmente las imágenes que
vamos cargando.
La solución es borrar la imagen, guardar y cerrar PB. Al volver a abrirlo el
problema desaparece y podemos reemplazar la imagen.

Cuidado al pegar
Cuando pegamos un objeto copiado, remplazará a cualquiera que esté
seleccionado en ese momento.
La solución: si pegamos algo en una pantalla que contenga objetos, asegurarnos de que no haya ninguno seleccionado con la tecla ESC
Si al pegar un nuevo objeto vemos que desaparece el fondo, podemos
volver atrás, deseleccionarlo y volver a pegar.

Inestabilidad

Botón de deshacer

Aunque la inestabilidad del programa aparece asociada (en nuestra experiencia) al trabajo con edición de textos, y no hemos tenido problemas de
«cuelgues» ni otras irregularidades mientras trabajamos en el proyecto de Fuerte
Bulnes, en el caso de que el programa comience a tener conductas extrañas
(inestabilidad) lo mejor es guardar y cerrar el programa. Al volver a abrirlo el
problema habrá desaparecido.

JPG en Windows Vista
Power Bullet tiene problemas con algunos gráficos en formato JPG cuando trabaja en el sistema operativo Windows Vista. El síntoma es que no
compila los archivos (no produce los SWF ni los EXE). Posiblemente
debido a los metadatos de algunos archivos JPG.
Por eso hay que porbar el funcionamiento al armar un par de páginas, al
principio
Una solución es cargarlos en el programa Paint de Windows y guardarlos
con otro nombre (agregarle una letra, por ejemplo) ya que Paint omite los
metadatos.
Otra solución es convertir esos archivos en GIFs, con la opción de dithering
o difusión. Se perderá alguna calidad en las imágenes.

Párafos en texto
Los espacios entre párrafos son muy grandes cuando bajamos con enter.
Lo mismo que ocurre en HTML. La solución es también la misma: bajamos
con:

+

Esta no es una falla
sistemática, sino
aleatoria. Sucede sólo
algunas veces

74

Miguel Puente Objetivo Digital Educatico (ODE) con PowerBullet

Recomendados

Recomendados

Más contenido relacionado

La actualidad más candente

La actualidad más candente (15)

Destacado

Destacado (20)

Similar a Miguel Puente Objetivo Digital Educatico (ODE) con PowerBullet

Similar a Miguel Puente Objetivo Digital Educatico (ODE) con PowerBullet (20)

Más de JR Consulting

Más de JR Consulting (8)

Miguel Puente Objetivo Digital Educatico (ODE) con PowerBullet