Consejos útiles

¿Cómo se crea la animación flash para un sitio?

Pin
Send
Share
Send
Send


Objetivos de la lección:

Educacional:

  • consolidación de habilidades laborales en el entorno de Macromedia Flash,
  • Aprendiendo un nuevo concepto de banner.

Educacional:

  • fomentando un sentido de responsabilidad por el resultado del trabajo,
  • la formación y el desarrollo de habilidades para el comportamiento correcto cuando se discuten problemas,
  • Fomentar el respeto por la tecnología informática.

Desarrollando:

  • desarrollo de habilidades creativas,
  • formación de habilidades para hablar frente a una audiencia,
  • La formación y el desarrollo de la capacidad de responder la pregunta de manera breve y precisa.

Plan de lección

  1. Momento organizacional (2 min.)
  2. Nuevo material (10 min.)
  3. Trabajo oral (8 min)
  4. Crear un banner en la computadora (20 min)
  5. Visualización de banners (5 min)
  6. Tarea (2 min)

Esta lección incluye los siguientes elementos: parte organizativa, presentación de nuevo material, consolidación de nuevos conocimientos e instrucción sobre la tarea.

1. Momento organizacional.

Maestro (Instalaciones pedagógicas para el trabajo). Hoy continuaremos estudiando el programa Macromedia Flash y haremos el trabajo práctico de crear un banner en este programa.

Maestrob ¿Qué asociaciones tiene la palabra banner para ti?

Estudiantes Internet, publicidad, rectángulo.

2. Nuevo material (presentación "Concepto de una pancarta").

Comentarios Toda la historia va acompañada de una presentación. (Apéndice 1)

Un banner es una imagen gráfica rectangular que anuncia un sitio web, productos o servicios y contiene un enlace a este sitio web. Los banners también son informativos, que informan sobre cualquier evento. (Diapositiva 2)

Cuando comenzó la publicidad de pancartas, es difícil de decir. Ella apareció cuando el comercio comenzó a desarrollarse en la Web. Era necesario anunciar sus servicios en la Web a los propietarios del sitio. Sí, y los sitios mismos necesitaban publicidad.

Wikipedia Encyclopedia afirma que el primer módulo de anuncios gráficos en Internet en el que se podía hacer clic para acceder a la información del anunciante se vendió en 1993 en el sitio web Global Network Navigator propiedad de O'Reilly, un editor de computadoras estadounidense. (Diapositiva 3) Sin embargo, el cumpleaños de la pancarta debe considerarse el 25 de octubre de 1994, cuando la pancarta de AT&T, que parecía horrible, pero era una innovación, se colocó en el sitio web de Hotwired (propiedad de la revista de tecnología estadounidense más famosa Wired). (Diapositiva 4) El tamaño del banner, 468x60, se convirtió posteriormente en el estándar más famoso en publicidad en Internet, aunque fue reemplazado por formatos más grandes 10 años después.

La imagen a continuación muestra un banner que supuestamente se considera el primero en Internet. Apareció en 1994. (Diapositiva 5)

Un banner puede tener cualquier tamaño vertical y horizontalmente, ¡es solo una imagen publicitaria! Pero, como todo en este mundo, estos tamaños se sometieron a estandarización, como resultado de lo cual se pueden distinguir varios tipos principales.

Los más comunes son el tamaño de banner 468–60. Debido a la selección exitosa del tamaño de las partes, tales imágenes publicitarias tienen una buena respuesta y, además, encajan perfectamente en los encabezados de la mayoría de las páginas de Internet. Además, es el primer formato en Internet. (Diapositiva 6)

Los tamaños 125 * 125, 120 * 90, 120 * 60 se encuentran con mayor frecuencia en las páginas a la izquierda o derecha en la columna del menú del sitio.

Los botones 88 * 31 generalmente se ingresan en la parte inferior de la página.

En RuNet, los anunciantes son muy populares con tamaños de 100 a 100, así como de 150 a 80, a pesar de que no están estandarizados.

A menudo se crea una serie completa de pancartas, que tienen el mismo estilo, pero diferentes tamaños. (Diapositiva 8)

Puede realizar diversas clasificaciones de banners.

Los banners se dividen en estáticos y animados. Las pancartas estáticas son imágenes comunes. Estos son principalmente logotipos. Los anuncios de banner reales están animados. (Diapositiva 9)

Distinguir banners de imagen, clic e información. Los primeros, como su nombre lo indica, forman la imagen de la compañía, la marca, y los segundos intentan atraer clientes potenciales a su propia página web, mientras que otros informan sobre cualquier evento (Diapositivas 10-13).

Los banners también pueden diferir en la tecnología de fabricación. El formato más común es GIF. Es adecuado para banners animados no animados o simples. Cuando se utiliza el formato GIF, su tamaño es muy pequeño, y esto es bueno, ya que aumenta la probabilidad de que el usuario cargue el banner hasta el final. (Diapositiva 14)

Los banners GIF se dibujan en varios editores de gráficos de trama o vectoriales. Para estos fines, se utilizan programas especiales como Ulead GIF Animator o Adobe ImegeReady. (Diapositiva 15)

Los banners Flash creados en Macromedia Flash han sido especialmente populares durante varios años. Estas pancartas tienen ventajas sobre las pancartas GIF: (Diapositiva 16)

  • pueden implementar animaciones más complejas,
  • son más pequeños
  • cargar incluso cuando el usuario ha desactivado la función de reflejo de gráficos en su navegador.

También hay un tercer estándar, el más raro, el llamado banner interactivo. Dichos banners se crean utilizando tecnología CGI, Java o VBS, así como elementos de animación HTML y Flash. (Diapositiva 17)

Entonces, un banner es una invitación a su sitio web. Por supuesto, debe ser original, notable, inusual, pero al mismo tiempo simple y comprensible. Un buen banner es una idea que debería interesar a un visitante y despertar el deseo de seguir un enlace.

Las principales tareas que debe resolver el banner:

  • Atraer visitantes
  • Diferente de otras pancartas
  • Coincidir con el tema del sitio

Al medir la efectividad de los banners, se usa el término CTR (Click Through Ratio), medido en porcentaje y expresando la relación entre el número de impresiones de banner y el número de clics en él. Para pancartas ordinarias, varía de 0.5 a 1.5%. Hay otros cálculos más complejos del rendimiento del banner.

Un visitante del sitio no pasa más de 3-5 segundos para ver un banner. Por lo tanto, el pensamiento en la pancarta debe expresarse clara y figurativamente. Los elementos principales del banner son el eslogan y la imagen visual. Para el desarrollo de ambos, uno debe proceder después de comprender los objetivos del banner. Proponer un buen eslogan es muy importante. Una mala frase puede arruinar la imagen más bella. (Lema - lema o frase corta que expresa la idea principal del mensaje publicitario). En el campo de la publicidad, hay concursos para el eslogan, por lo que, según los resultados de 2006, el eslogan de Yandex "Encontrar todo" (motor de búsqueda) se convirtió en el ganador. La victoria se ganó sobre el lema "Conduce el sueño" (Toyota). (Diapositiva 18)

Después de crear un eslogan, puede seleccionar una imagen gráfica que lo ilustre.

Además, al crear un banner, debe tener en cuenta que se verá en un entorno extraño, y no sabremos nada sobre la página en la que aparece, y no podremos proporcionar el esquema de color. Por lo tanto, es necesario indicar claramente los límites de la pancarta, a lo largo de su perímetro. Además, el banner no debe tener un fondo transparente, siempre sólido (pero no necesariamente simple).

El banner debe llevar algún tipo de idea, de lo contrario será poco atractivo, no tendrá nada que atraer, intrigar, interesar al visitante. Una buena pancarta se puede comparar con un rompecabezas: no se resuelve de inmediato, pero después de encontrar la respuesta, el visitante recibe emociones positivas y la recuerda.

Podemos suponer que cada banner consta de las siguientes partes: (Diapositiva 19)

  1. Lema
  2. Un objeto visual que ilustra un eslogan (a menudo un logotipo).
  3. Colores (para pancartas de imágenes, los colores a menudo coinciden con el color del sitio publicitario)
  4. Información adicional (dirección de la página web, texto explicativo)
  5. Elementos de diseño adicionales que enfatizan la idea principal y el estilo del banner. En el caso de los banners de imágenes, es muy conveniente hacer una plantilla y, sustituyendo diferentes lemas y objetos visuales, obtener una serie completa de banners.

Crear una buena pancarta es muy difícil. Como dicen los practicantes: "Debes recordar una regla: si no te gusta el banner creado, es poco probable que a otros les guste".

Comentarios Estudiantes emitidos Apéndice 2. Entre paréntesis se escriben las respuestas correctas a las tareas.

1. Nombre las compañías que usan los siguientes lemas:

  1. "¿En quién estás pensando ahora?" (MTS)
  2. "Confía en el color rosa y no hay manchas" (Vanish)
  3. "C" ... "es más divertido. La casa está limpia el doble de rápido "(Sr. Proper)
  4. "Conduce el sueño" (Toyota)
  5. "La inmunidad no sucede mucho" (Imuneli)
  6. "Alimentando gatos energéticos" (KiteKat)
  7. "Todo lo que una persona necesita" (chocolate Alenka)
  8. "Libertad para ser tú mismo" (salvaje)
  9. Construye tu comunicación ”(MegaFon)
  10. "Vivir en el lado positivo" (Beeline)
  11. "La felicidad es fácil" (Huerta)
  12. "Uniendo Generaciones" (cookies "Jubileo")

2. Haga un eslogan (varios) para el banner del sitio sobre animales (sobre la ciudad).

3. ¿Cuáles son las 2-3 empresas cuyo logotipo contiene un objeto específico que ilustra su marca?

Huevo - MTS,
Abeja - Beeline,
Perfil de persona - megáfono.

Muchas marcas y compañías usan dos o tres colores para sus logotipos.

4. Nombre 2-3 compañías en el logotipo de las cuales hay dos colores:

Beeline (negro y amarillo),
MTS (rojo y blanco),
Severstal (azul y rojo).

El trabajo práctico se describe en etapas en Apéndice 3 Resultado de ejecución Apéndice 4.

Comentarios Todos los banners creados pueden transferirse a la computadora del profesor e insertarse en el documento HTML usando el programa Macromedia Dreamweaver y mostrarse a través del proyector.

6. Tarea.

Piense en un diseño, un eslogan y recoja imágenes para el banner que anuncia su futura profesión.

Literatura

1. Smirnova I.E. "El comienzo del diseño web", San Petersburgo, "BHV-Petersburgo", 2003

Tecnología flash

El marco multimedia fue desarrollado por Macromedia. Pero después de su absorción (fusión), todos los derechos de la tecnología pasaron al nuevo propietario: la empresa Adobe Systems.

Alcance de la aplicación moderna de Adobe Flash:

  • Crear aplicaciones web es una dirección bastante nueva. Implica el uso total o parcial de Flash para crear sitios. El uso parcial de esta tecnología crea elementos de diseño separados: varios menús interactivos, botones animados, etc.

En comparación con los recursos convencionales basados ​​en html, los sitios flash tienen algunas características que limitan su uso. Estos incluyen un gran costo de desarrollo, demandando recursos del servidor, largos tiempos de descarga con una conexión lenta a Internet y algunos otros aspectos:

  • Realización de capacidades multimedia: los reproductores multimedia creados sobre la base de Flash a menudo se utilizan para escuchar audio y reproducir videos en sitios web. Su desarrollo incluye el uso de uno de los lenguajes de secuencias de comandos (a menudo JavaScript):

  • En los medios de publicidad en línea, la tecnología se utiliza con mayor frecuencia para crear pancartas animadas. Implican no solo reproducir anuncios multimedia, sino también cierta interacción con el usuario a modo de juego.

Fundamentos y herramientas de desarrollo de Flash

Para crear animaciones flash, las herramientas tradicionales más utilizadas de Adobe:

  • Adobe Flash Professional: un programa para crear animación interactiva (animador),
  • Adobe Flash Builder: un entorno para crear una interfaz de aplicación web,
  • Adobe Flash Player: un reproductor integrado en el navegador para reproducir Flash.

Además, varias aplicaciones de terceros pueden reproducir contenido multimedia de este tipo. Los más populares son Gnash, QuickTime y algunos otros:

El estándar principal para los archivos flash es la extensión SWF. La abreviatura significa Small Web Format. El video grabado en Flash tiene las extensiones de archivo FLV, F4V.

La animación flash interactiva se basa en gráficos vectoriales. Gracias a esto, fue posible obtener soporte para la plataforma multimedia y la independencia de la calidad de la animación de la resolución de la pantalla.

El tamaño del archivo de la aplicación flash es el mismo para todos los usuarios, independientemente de las características técnicas de la pantalla (resolución).

La animación interactiva en Flash se basa en la transformación (tipo de vector), en el que hay un flujo lento entre fotogramas clave. Para reproducir datos, se utiliza un reproductor flash, cuya operación es muy similar a la operación de la máquina virtual JavaScript. El componente de software de la tecnología se implementa utilizando el lenguaje ActionScript.

Las desventajas de la tecnología incluyen los siguientes puntos:

  • Fuerte carga en el procesador central de la máquina cliente. Esto se debe a la baja eficiencia de la máquina virtual flash, que está integrada con el reproductor en el navegador del usuario,
  • Alta probabilidad de errores: la reproducción de animaciones flash puede ocurrir con una alta probabilidad de errores. Además, las fallas en la reproducción de Flash afectan negativamente el funcionamiento de toda la aplicación cliente (navegador). Esto se debe a un control insuficiente de la tolerancia a fallas del código del programa al crear aplicaciones flash,
  • Incapacidad para indexar: todo el contenido de texto que se muestra en contenido Flash no está involucrado en el proceso de indexación. Esta restricción es especialmente problemática para aquellos recursos que se basan en esta tecnología.

Descripción general del software de creación de Flash de terceros

Sothink SWF Quicker se tomó como una aplicación prototipo en la que demostraremos los conceptos básicos de la creación de Flash. Según muchos profesionales, el programa es el más comprensible y más fácil de aprender.

Además de crear y editar flash, el editor "sabe cómo" trabajar con todos los demás tipos de animaciones web (GIF, HTML y otros estándares):

Para comprender cómo hacer animación flash en esta aplicación, utilizamos las plantillas integradas. El cuadro de diálogo "Nuevo desde plantilla" aparece inmediatamente después de iniciar el programa. Además, se puede llamar a través del elemento del menú principal "Archivo". Entre las opciones propuestas, elegimos crear un banner:

  • SwishMAX,
  • Alligator Flash Designer.

En conclusión, me gustaría señalar que la elección del programa es importante, pero no el aspecto principal. Para crear Flash, no solo necesita una aplicación probada y confiable, sino también conocimiento de los conceptos básicos de la programación web. Por lo tanto, primero debe "adquirir" la base de conocimiento adecuada, y solo entonces elegir el software especializado.

Pin
Send
Share
Send
Send