v1.0.0
- Versión inicial con materiales predefinidos, frases en relieve, frotado direccional de grafito, soporte táctil y renderer estático para Framer.
ComponenteFramer · React · TypeScript · Canvasv1.0.0
Trace PressUn fondo táctil para Framer que revela palabras en relieve allí donde el puntero deposita temporalmente un frotado de grafito.
Un fondo táctil para Framer que revela palabras en relieve allí donde el puntero deposita temporalmente un frotado de grafito.
ResponsiveAccesibilidad declaradaDemo aislada
Demo interactiva
Pruébalo como si ya fuera tuyo.
Prueba la interacción, los tamaños responsive y sus ajustes reales sin salir de la ficha.
Trace Press / v1.0.0
Se abre a pantalla completa dentro de esta misma ficha.
Qué resuelve
Qué aporta Trace Press a tu proyecto
Trace Press convierte un fondo en una interacción física y silenciosa. Las palabras permanecen grabadas en seco sobre papel de archivo, yeso, terracota o pizarra y solo aparecen cuando el movimiento del puntero o del dedo deposita grafito sobre sus relieves. Cada trazo vuelve a desaparecer dentro del material. Puedes sustituir frases, tipografía, superficie, relieve, grano y comportamiento desde Framer sin bloquear el contenido situado encima.
01
El grafito aparece solo sobre las letras en relieve atravesadas por el puntero o el gesto táctil
02
Papel de archivo, yeso, terracota, pizarra y paleta de material totalmente personalizada
03
Frases, fuente de Framer, escala, densidad de filas, ángulo y profundidad editables
04
Texturas de frotado suave, seco y grueso con tamaño, presión, intensidad y memoria ajustables
05
Los enlaces y controles superiores siguen siendo clicables porque el componente no bloquea la página
06
Renderizado responsive de altura fija para composiciones de escritorio, tablet y móvil
07
Renderer estático para Canvas y exportación de Framer sin animación o temporizador en reposo
08
Movimiento reducido, frotado táctil opcional y grano direccional
Casos de uso
Situaciones documentadas para esta versión del producto.
- 01
Fondos de landing pages centradas en la marca
- 02
Portadas editoriales y aperturas de campaña
- 03
Introducciones de portfolios y estudios
- 04
Relatos táctiles de productos y servicios
Galería del producto
Imágenes y vídeos publicados específicamente para esta versión.
Capacidades publicadas
Valores declarados y revisados para esta versión concreta; no se heredan automáticamente en una actualización.
- Animaciones
- Sí
- Interacción
- Sí
- Responsive
- Sí
- Modo oscuro
- Sí
- Accesibilidad declarada
- Sí
- CMS
- No
- Formularios
- No
- Propiedades configurables
- Sí
Compatibilidad
- Framer
- Desktop
- Tablet
- Mobile
Dependencias
El manifiesto de esta versión no enumera dependencias.
Requisitos
- Un proyecto de Framer
- Un frame de altura fija de al menos 260 px
- El contenido principal debe colocarse en una capa por encima del componente cuando se use como fondo
Instalación y uso
Estas instrucciones se publican como parte del manifiesto de esta versión.
Instalar
- 01Abre el enlace de instalación verificado de Framer incluido con la compra.
- 02Añade Trace Press a un frame de altura fija y colócalo detrás del contenido de la página que deba seguir siendo clicable.
- 03Elige un material, sustituye las palabras y ajusta escala tipográfica, filas, ángulo, profundidad y grano en las propiedades de Framer.
- 04Ajusta tamaño, presión, textura y memoria del frotado, y prueba puntero, tacto y movimiento reducido antes de publicar.
Documentación
- START-HERE.md contiene en inglés la instalación y la primera configuración.
- CONTROLS.md documenta en inglés cada Property Control, rango, valor inicial y regla de visibilidad.
- README.md explica capas, interacción del contenido superior y tamaños de frame recomendados.
- LICENSE.md, CHANGELOG.md y SUPPORT.md documentan el uso permitido, la versión y el soporte.
Accesibilidad
El manifiesto publicado marca esta versión como accesible y declara que su demo admite teclado. Es información del producto, no una certificación externa de conformidad.
- Uso con teclado
- Declarado compatible
- Uso con puntero
- Declarado compatible
Rendimiento
La demo solo se carga cuando la abres, se desmonta al cerrarla y no añade sus dependencias al bundle principal de SolveKit.
Historial de cambios
Licencias
Licencia comercial para un solo uso
Usa Trace Press en un proyecto personal, comercial o para un cliente en Framer. Cada producto final adicional requiere otra licencia. Se prohíben la redistribución y la reventa.
Metadatos de descarga
Datos publicados para identificar el archivo de esta versión y comprobarlo después de descargarlo.
- Archivo
- Trace-Press-v1.0.0.zip
- Tamaño
- 7,9 KB (7931 bytes)
- SHA-256
- 62818bbb8ede8dbaf66fcb8868b892fd2b6785caf8884c5f00b4971f7b6e22cf
Preguntas frecuentes
¿Puedo colocar botones y textos encima de Trace Press?
Sí. Trace Press está diseñado como fondo y no bloquea la interacción con el contenido situado delante.
¿Puedo utilizar mis propias palabras y colores de marca?
Sí. Sustituye las frases, elige una fuente de Framer y utiliza un material predefinido o la paleta personalizada de cuatro colores.
¿Funciona en móvil?
Sí. El componente es responsive y el frotado táctil puede activarse cuando esa interacción encaje con la página.
¿Qué cubre una licencia?
Una compra cubre un producto final personal, comercial o para un cliente. Cada producto final adicional requiere otra licencia.
Productos relacionados
component · Framer · React · TypeScript
Relay Deck
Una baraja responsive para Framer en la que todo el conjunto sigue el puntero y los gestos táctiles en tiempo real.
component · Framer · React · TypeScript · Framer MotionType Aperture
Titular de doble mensaje para Framer con apertura guiada por cursor, cinco estilos, control táctil, teclado y movimiento reducido.