📑 Memoria Técnica del Proyecto PrintNova

👥 1. Equipo y Distribución de Tareas

El proyecto ha sido realizado por un equipo multidisciplinar, optimizando las capacidades individuales para un resultado profesional:

• Svitlana Vyshemyrska: Responsable de la identidad visual, diseño gráfico de recursos (GIMP), maquetación estética mediante CSS3, diseño de la experiencia de usuario (UX) y redacción de contenidos académicos.
• Vadym Vyshemyrskyi: Responsable de la arquitectura del código HTML5, implementación de la lógica interactiva en JavaScript (calculadora), optimización técnica de multimedia y gestión de la estructura del sitio.

✨ 4. Animaciones mediante Interpoladores

Para cumplir con los requisitos de "dinamismo y publicidad", se ha creado un sistema de entrada visual suave:

• Lógica: Se define una animación denominada slideUpFade en CSS utilizando la regla @keyframes.
• Efecto: Los elementos aparecen desde una posición desplazada 40px hacia abajo con opacidad 0, moviéndose hacia su posición final con opacidad 1.
• Aplicación: Esta animación se aplica a los bloques principales de cada página mediante la clase .animate-up.

📱 5. Interactividad y Lógica (JavaScript)

El núcleo de la interacción es la Calculadora de Presupuestos Editorial, diseñada para captar la atención del cliente potencial:

• Flujo: El script se activa solo al pulsar el botón específico con el ID btn-abrir-calc, evitando conflictos con otras llamadas a la acción del sitio.
• Validación: Implementa una lógica de control que verifica si el usuario ha ingresado números válidos. Si el dato es erróneo, se informa mediante un alert preventivo.
• Algoritmo: Calcula un precio estimado basado en gastos de gestión editorial más un coste variable por página, multiplicado por la tirada deseada.

🚀 6. Multimedia y Optimización

Todos los archivos multimedia han sido tratados para ofrecer la mejor calidad con el menor peso posible:

• Formatos: Uso de PNG-24 para mantener transparencias en el logotipo y JPG optimizado para fondos complejos.
• Resolución: Imágenes exportadas a 72-96 dpi, ideales para visualización en pantallas estándar, manteniendo una carga rápida en el servidor.
• Vídeo: Integración de reproductores externos mediante contenedores CSS que mantienen la proporción de aspecto (aspect-ratio).

🔄 7. Evolución del Proyecto y Cambios en el Storyboard

Durante la implementación web, se realizaron ajustes estratégicos respecto a la Práctica 1 para mejorar el producto final:

1. Unificación de Navegación: En el diseño inicial, el menú era variable. En la versión final se unificó y se fijó para evitar la pérdida de contexto del usuario.
2. Identificación Visual: Se añadieron iconos temáticos (Emojis) en los títulos para servir como anclajes visuales, una técnica de UX que no estaba presente en el storyboard original.
3. Precisión de Servicios: Se amplió la descripción de la "Estrategia de Valor" para incluir conceptos reales como indexación Scopus y DOI, aportando mayor credibilidad al negocio.

🎮 8. Estrategia de Advergaming: Juego "Atrapa las Hojas"

Para potenciar el compromiso del usuario (engagement) y aumentar el tiempo de permanencia en el sitio, se ha diseñado una experiencia interactiva alineada con el sector editorial de PrintNova:

• Concepto y Mecánica: El usuario participa en un reto de agilidad donde debe capturar hojas de papel que caen de forma aleatoria. El sistema registra las colisiones en tiempo real y actualiza un contador de puntuación.
• Gestión de Sesión: Se ha implementado un selector de tiempo y un cronómetro regresivo. Al finalizar el periodo, se presenta un modal con el balance final de "producción" (hojas capturadas).
• Uso de Librerías Externas: Para garantizar animaciones fluidas a 60 FPS, se ha integrado Anime.js. Esta biblioteca permite gestionar trayectorias complejas y aceleraciones realistas sin sobrecargar el procesador del dispositivo.
• Valor Publicitario: El juego actúa como un "intermedio lúdico" que reduce la tasa de rebote y refuerza la identidad visual de la marca de una manera no intrusiva.