Desarrollador Web & Diseñador Visual
Soy un técnico informático veterano con 19 años de trayectoria, reinventando mi carrera a través del Desarrollo de Aplicaciones Web (DAW). Mi objetivo es fusionar casi dos décadas de experiencia técnica real con una profunda sensibilidad estética para crear productos digitales que no solo funcionen, sino que impacten.
No solo escribo código; diseño soluciones. Mi valor diferencial reside en el equilibrio: aporto la lógica estructural de un técnico experto, la armonía visual de un diseñador gráfico y la frescura de las tecnologías actuales como HTML5, CSS3 y JavaScript. Busco transformar conceptos complejos en interfaces limpias, funcionales y preparadas para el futuro.
Trabajo desde Murcia para todo el mundo, ofreciendo servicios de Diseño Web y Diseño Gráfico con personalidad propia.
Ver Proyectos
Cargando parámetros...
Formación Académica
Universae | 2025 – 2027 (Actualmente en curso)
Formación especializada en desarrollo Full Stack, arquitecturas web y despliegue de aplicaciones modernas.
SEF | 2025-2026
Certificado de profesionalidad enfocado en la programación de sistemas web y gestión de bases de datos.
Prácticas en DigitalizaTodo: actualización y optimización web, digitalización y edición de contenido.
IES Alcántara | 2003 – 2005
Base técnica sólida en administración de servidores, redes y seguridad informática.
Ucomur | 2006
Especialización en identidad visual, maquetación y herramientas de diseño vectorial.
Certificaciones Verificadas
He escrito un libro...
Bueno, más bien lo he dibujado. Se trata de Mandalas España y Olé, un libro de colorear para adultos con los memes castizos de toda la vida.
Es físico, huele a papel y no necesita batería: la mejor forma de desconectar del móvil y echarte unas risas.
Comprar en AmazonExperiencia Profesional
Webmaster & Creador de Contenido Digital
Taoma y Maralma Inmobiliaria
2024 – Actualidad
- Desarrollo Web: Gestión, diseño y mantenimiento del portal inmobiliario www.taomaymaralma.es , optimizando la carga de propiedades y la experiencia de usuario (UX).
Técnico Informático & Responsable de Comunicación Visual
SATSE, Sindicato de Enfermería
09/2006 – 11/2025
- Gestión y mantenimiento integral de la infraestructura informática de la sede autonómica de Murcia.
- Resolución de incidencias de hardware y software para garantizar la operatividad diaria.
- Social Media Manager: Gestión estratégica de redes sociales (Facebook, Instagram, X y Telegram), liderando una comunidad de más de 6,000 seguidores.
- Diseño y Publicidad: Creación de cartelería, materiales gráficos y gestión de campañas publicitarias para diversos eventos y comunicaciones del sindicato.
- Participación en la digitalización de procesos internos, aportando una visión sistémica.
Diseñador Gráfico & Creativo Freelance
Laprintera
2019 - 2024
- Diseño Editorial y Maquetación: Creación de catálogos de producto, folletos y material corporativo impreso, gestionando desde el concepto hasta el arte final.
- Diseño Textil y Moda: Desarrollo de colecciones gráficas para camisetas y prendas (incluyendo mis marcas propias), con preparación técnica de archivos para serigrafía e impresión digital (DTG).
- Identidad Corporativa: Diseño de logotipos, manuales de marca y papelería para diversos clientes, dotando a sus negocios de una imagen visual coherente y profesional.
Habilidades Clave
Programación y Web
- HTML5
- CSS3
- JavaScript
- Base de Datos (SQL, etc.)
Diseño y Creatividad
- Illustrator (Dominio)
- Photoshop (Dominio)
- Teoría del Color
- Composición Visual
Informática
- Administración de Sistemas
- Resolución de Problemas
- Mantenimiento de Hardware/Software
Portfolio Integral: Diseño y Desarrollo
Proyectos de Ilustración y Diseño Gráfico
Mi base visual se aplica a la usabilidad. Haz clic en las miniaturas para previsualizar los trabajos.
Proyectos de Desarrollo Web
Lógica de Interfaz y Estado
Implementación de un sistema de Modo de Contraste dinámico mediante manipulación del DOM con JavaScript Vanilla.
Arquitectura de Color y Design Ops
Desarrollo de una identidad visual basada en estándares PANTONE, gestionada a través de una estructura de cascada CSS coherente.
Maquetación de Componentes UX
Construcción de una Galería Interactiva con sistema de visualización Lightbox técnica, optimizada para dispositivos móviles (Responsive Design).
Backend & Gestión de Datos
Desarrollo de un sistema CRUD completo (Crear, Leer, Actualizar, Borrar) utilizando PHP nativo y MySQL. Gestión de subida de imágenes al servidor y arquitectura de base de datos relacional.
Ver Código en GitHub →
Moda Supercute & Travesti
Tambien tengo una tienda en LaTostadora.com con camisetas y sudaderas exclusivas de las colecciones RedGirls y Gaticos Travestis.
Diseños únicos para vestir con orgullo y mucho arte.
Ir a la TiendaContacto
Si tienes una propuesta de trabajo o quieres hablar sobre diseño y código, no dudes en contactarme.
🕵️♂️ Backstage: Lo que no se ve
Has encontrado el código fuente del alma de esta web. Aquí tienes los trucos de magia explicados con EL CÓDIGO REAL.
1. El Camaleón de la Publicidad (CSS)
Uso clases específicas y !important para forzar la visualización correcta según el dispositivo, evitando duplicados.
/* MÓVIL (Por defecto oculto en PC) */
body:not(.modo-contraste) .banner-movil.banner-color {
display: block !important;
}
/* PC (Oculto en móvil por @media) */
.banner-pc.banner-color {
display: block !important;
}2. Protección "Anti-Cotillas" (JS)
Un pequeño script que intercepta el evento contextmenu. Sencillo pero efectivo para disuadir.
// Bloquear el menú contextual (clic derecho)
document.addEventListener('contextmenu', function(e) {
e.preventDefault();
}, false);3. La Flecha Fantasma (JS)
Monitorizo el eje Y de la ventana. Si bajas más de 300 píxeles, le añado la clase mostrar al botón.
window.addEventListener('scroll', function() {
const btnSubir = document.getElementById('btn-subir');
// Si bajamos más de 300px, aparece la flecha
if (window.scrollY > 300) {
btnSubir.classList.add('mostrar');
} else {
btnSubir.classList.remove('mostrar');
}
});4. Modo Noche: Filtros Inteligentes (CSS)
En lugar de cambiar cada imagen una por una, aplico un filtro global pero excluyo el logo para que no se rompa.
/* Imágenes Global */
body.modo-contraste img {
filter: grayscale(100%) brightness(0.7) !important;
}
/* Excepciones que mantienen color/brillo */
body.modo-contraste .logo-404,
body.modo-contraste .banner-bn {
filter: none !important;
}5. El Camaleón Artificial (JavaScript)
Uso un array de objetos llamado variantes con la ruta de la foto y el prompt exacto que usé en la IA.
const variantes = [
{
foto: "fotos/foto1.webp",
prompt: "Studio portrait of a man..."
},
// ... más variantes
];
const indiceAleatorio = Math.floor(Math.random() * variantes.length);6. La Textura Fantasma (CSS)
La textura de papel está en un pseudo-elemento fijo. La clave es pointer-events: none para que puedas hacer clic a través de ella.
body::before {
content: "";
position: fixed;
background-image: url(".../natural-paper.png");
opacity: 0.15;
pointer-events: none; /* ¡La clave! */
z-index: 9999;
}7. Modo Debug (Solo para tus ojos)
¿Quieres ver las "tripas" de la maquetación? Activa este botón para ver los bordes de cada caja HTML.
Hecho con ❤️ y mucho café en Murcia.