MI MÉTODO DE TRABAJO
Usando mis conocimientos de publicidad, marketing, diseño, creatividad... y basado en mi experiencia laboral de todos estos años, dirijo proyectos con una estructura organizativa de trabajo propia.
Dicha metodología se compone de 10 Fases de trabajo distintas, que mantienen una conexión lógica y ordenada en el proyecto, construyendo así productos (como páginas web) de forma completa, rápida y óptima.
MIS 10 FASES DE TRABAJO
Explicadas usando de ejemplo la página web “EstudioPro”
1. Información
Reunir toda la información que dará forma al proyecto, como por ejemplo: la Identidad Corportativa de la empresa (o si no la tiene, crearla); analizar las características del público objetivo; decidir si la meta e idea del proyecto es óptima (satisface una necesidad, es algo que no existe, o mejora algo que existe); establecer el contenido principal de la web, todas sus secciones y la más importante; recopilar la estética, mecanismos y contenidos de webs de tendencia y de la competencia; crear y gestionar el equipo de trabajo según prioridades, capacidades, presupuesto y tiempo; etc.
Planificación
Investigación
2. Diseño visual
Crear el aspecto visual que tendrá cada sección de la web (boceto) según los principios del “diseño de interfaz UI” (diseño coherente de colores, tipografías, botones, títulos, imágenes, iconos, etc) y la “experiencia de usuario UX” (jerarquizar los contenidos por importancia, organizar y transmitir la información fácil y rápida, diseñar buena adaptación en móvil y táblet, etc):
3. Materiales
Pensar, diseñar y ejecutar todos los materiales necesarios para llenar de contenido la web, siguiendo la Identidad Corpotativa de la empresa y el enfoque del proyecto.
Por ejemplo: diseñar y adaptar el logotipo, imágenes, vídeos, elementos 3D, fotografías retocadas, iconos SVG personalizados, apps con funciones específicas, redacción de textos, etc.
Como puede verse en el proyecto realizado para la empresa SolQuality.
4. Arquitectura web
Crear un esquema con la relación entre todas las secciones web (su diseño visual), añadiendo anotaciones y flechas que detallan cómo se conecta cada elemento y cómo se comportará según una circunstancia u otra. Especificando por ejemplo: qué tipo de código se utilizará en cada componente, qué Módulos se integrarán, cómo se conectarán con la base de datos, de qué forma interactuará el usuario con formularios o sistemas de correo, etc.
5. Base de Datos
Primero, crear una estructura visual con las características que debe tener la Base de Datos: Tablas, Datos, Registros y Relaciones necesarias para su correcto funcionamiento:
Segundo, crear dicha Base de Datos y construir todos los elementos planteados en su estructura visual:
6. Web Front-End
Tomando como referencia el “diseño visual” y la “arquitectura web” creados anteriormente, construir la página web estática (Front-End), es decir:
- La estructura: con código HTML.
- El aspecto visual: con código CSS.
- Las funciones interactivas: con código JavaScript.
Logrando así el funcionamiento básico de la web, su estilo visual atractivo, buena adaptabilidad en distintos dispositivos (responsive) e interactividad básica.
Usando mis propios Módulos de código.
HTML
CSS
JS
7. Web Back-End
Transformar la página web estática (FrontEnd) en dinámica (BackEnd), es decir, añadir:
- La Base de datos con los contenidos: con código SQL.
- La visión y edición de esos contenidos: con código PHP.
Pudiendo así crear, leer, actualizar o eliminar entradas, iniciar sesión con contraseña, acceder a paneles de administración para la empresa y para usuarios, enviar emails, activar sistemas de filtrado y búsqueda, generar contenido personalizado según el usuario, implementar sistemas de reservas o compras, etc.
Usando mis propios Módulos de código o gestores de contenido como JosPress.
PHP
SQL
8. Animaciones Scroll
Primero, esquematizar cada tipo de animación distinta que agregar a cada contenido de la web, según su función, importancia y ritmo visual:
Segundo, crear dichas animaciones con código JavaScript, haciendo que se reproduzcan cada una sólo cuando el Usuario haga scroll en ellas:
9. Publicación
Elegir el Hosting más adecuado al presupuesto, volumen de tráfico y necesidades técnicas del proyecto; asesorar al cliente en la compra y elección del nombre de Dominio; subir todos los archivos web y base de datos al entorno on-line; instalar certificado de seguridad SSL; hacer que las URLs sean limpias y amigables; crear y entregar el tutorial de uso web personalizado a mi cliente (o integrárselo en JosPress); etc.
Publicando así la web para que cualquier persona pueda acceder a ella desde cualquier dispositivo: www.estudiopro.es y el administrador de la web pueda acceder a su Panel de control.
10. Testeo y Optimización
Comprobar que la web funciona correctamente (enlaces, formularios, animaciones, interacciones y paneles de administración); optimizar la velocidad de carga; supervisar el diseño en distintos dispositivos y navegadores; aplicar un posicionamiento SEO básico (etiquetas, títulos, descripciones, sitemap...); registrar la web en plataformas de visibilidad (como Google Search Console y Analytics); etc.