Skip to main content

heberthdesing.com

01 / PORTFOLIO — BOGOTÁ, 2026

HEBERTH RINCÓN

RESEARCH · NARRATIVE · FASHION DESIGN

DE LA INVESTIGACIÓN Y LA NARRATIVA A PRENDAS CON SIGNIFICADO.

STREETWEAR ✦ SNEAKERS ✦ FASHION DESIGN ✦ CREATIVE DIRECTION ✦ RESEARCH ✦ NARRATIVE ✦ MATERIAL EXPERIMENTATION ✦ BOGOTÁ ✦ STREETWEAR ✦ SNEAKERS ✦ FASHION DESIGN ✦ CREATIVE DIRECTION ✦ RESEARCH ✦ NARRATIVE ✦ MATERIAL EXPERIMENTATION ✦ BOGOTÁ ✦

02 / ARCHIVO DE PROYECTOS

CADA PROYECTO EMPIEZA CON UNA PREGUNTA

Una selección de proyectos desarrollados desde la investigación, la construcción de una narrativa y la experimentación, hasta llegar a una prenda final que comunica la historia de la que partió.

ARCHIVO 01 / FASHION DESIGN
ARCHIVO 02 / KIDSWEAR
ARCHIVO 03 / EXPERIMENTAL
ARCHIVO 04 / INVESTIGACIÓN + DISEÑO
03 / PERFIL CREATIVO

LAS IDEAS NO SE VISTEN. SE CONSTRUYEN.

Soy diseñador de moda en Bogotá. Desarrollo proyectos desde la investigación y la construcción conceptual hasta la prenda y su comunicación visual. Mi fortaleza está en transformar narrativas en materiales, texturas, siluetas y propuestas editoriales con intención.

PROCESO / 01—04

H

INVESTIGAR → NARRAR → EXPERIMENTAR → CONSTRUIR
} } /* Ojal que reemplaza al cursor */ #hx-eyelet-cursor { position: fixed; left: 0; top: 0; width: 42px; height: 42px; z-index: 2147483647; pointer-events: none; background-image: var(--hx-eyelet); background-size: contain; background-position: center; background-repeat: no-repeat; transform: translate(-50%, -50%); transition: width 160ms ease, height 160ms ease, filter 160ms ease; filter: drop-shadow(0 3px 5px rgba(0, 0, 0, 0.42)) drop-shadow(0 0 4px rgba(255, 255, 255, 0.55)); } /* Al colocarse sobre algo seleccionable */ #hx-eyelet-cursor.is-link { width: 54px; height: 54px; filter: drop-shadow(0 4px 7px rgba(0, 0, 0, 0.55)) drop-shadow(0 0 9px #ff6159); } /* Al oprimir */ #hx-eyelet-cursor.is-clicking { width: 31px; height: 31px; } /* Capa universal de efectos */ #hx-global-effects { position: fixed; inset: 0; z-index: 2147483646; pointer-events: none; overflow: hidden; } /* Ojales de la explosión */ .hx-burst-eyelet { position: fixed; left: var(--x); top: var(--y); width: var(--size); height: var(--size); pointer-events: none; background-image: var(--hx-eyelet); background-size: contain; background-position: center; background-repeat: no-repeat; transform: translate(-50%, -50%) scale(0.35); filter: drop-shadow(0 2px 3px rgba(0, 0, 0, 0.6)) drop-shadow(0 0 4px rgba(255, 255, 255, 0.6)); animation: hxEyeletExplosion 680ms cubic-bezier(0.13, 0.82, 0.2, 1) forwards; } /* Chispas coral para que la explosión se note */ .hx-coral-spark { position: fixed; left: var(--x); top: var(--y); width: var(--size); height: var(--size); border-radius: 50%; pointer-events: none; background: #ff6159; box-shadow: 0 0 8px #ff6159, 0 0 15px rgba(255, 97, 89, 0.8); transform: translate(-50%, -50%) scale(0.2); animation: hxSparkExplosion 590ms ease-out forwards; } /* Destello contenido dentro del header o menú */ .hx-area-flash { position: fixed; pointer-events: none; border: 1px solid rgba(255, 255, 255, 0.75); box-shadow: inset 0 0 25px rgba(255, 97, 89, 0.8), inset 0 0 50px rgba(255, 255, 255, 0.25); animation: hxAreaFlash 660ms ease-out forwards; } /* Palabra del enlace seleccionado */ .hx-click-word { position: fixed; left: var(--x); top: var(--y); color: #ff6159; font-family: Arial, Helvetica, sans-serif; font-size: 11px; font-weight: 800; letter-spacing: 0.14em; text-transform: uppercase; white-space: nowrap; pointer-events: none; text-shadow: 0 2px 5px rgba(0, 0, 0, 0.8); transform: translate(-50%, -50%); animation: hxWordReveal 700ms ease-out forwards; } /* Rastro sutil únicamente dentro del hero */ .hx-hero-trail { position: fixed; width: 15px; height: 15px; pointer-events: none; background-image: var(--hx-eyelet); background-size: contain; background-repeat: no-repeat; transform: translate(-50%, -50%); animation: hxTrailFade 650ms ease-out forwards; } @keyframes hxEyeletExplosion { 0% { opacity: 1; transform: translate(-50%, -50%) scale(0.3) rotate(0deg); } 72% { opacity: 1; } 100% { opacity: 0; transform: translate( calc(-50% + var(--move-x)), calc(-50% + var(--move-y)) ) scale(1.15) rotate(var(--rotation)); } } @keyframes hxSparkExplosion { 0% { opacity: 1; transform: translate(-50%, -50%) scale(0.2); } 100% { opacity: 0; transform: translate( calc(-50% + var(--move-x)), calc(-50% + var(--move-y)) ) scale(1.7); } } @keyframes hxAreaFlash { 0% { opacity: 0; background: rgba(255, 97, 89, 0); } 25% { opacity: 1; background: rgba(255, 97, 89, 0.17); } 100% { opacity: 0; background: rgba(255, 97, 89, 0); } } @keyframes hxWordReveal { 0% { opacity: 0; transform: translate(-50%, -30%) scale(0.8); } 30% { opacity: 1; } 100% { opacity: 0; transform: translate(-50%, -135%) scale(1.08); } } @keyframes hxTrailFade { 0% { opacity: 0.75; transform: translate(-50%, -50%) scale(0.75); } 100% { opacity: 0; transform: translate(-50%, -75%) scale(0.15) rotate(130deg); } } @media (hover: none), (pointer: coarse) { #hx-eyelet-cursor { display: none !important; } } @media (prefers-reduced-motion: reduce) { .hx-burst-eyelet, .hx-coral-spark, .hx-area-flash, .hx-click-word, .hx-hero-trail { animation-duration: 250ms !important; } }