00 · Principio
Criterio humano, ejecución compartida.
El sistema de fipe.cl sigue la misma idea que los manuales que diseño: decisiones claras, firmadas, que una persona o una IA pueden ejecutar sin adivinar.
- Una semilla, el Rosso (rojo italiano con un toque salmón), para la acción. El salmón solo brilla sobre fondos oscuros.
- Neutros levemente cálidos. Sin crema ni amarillo.
- Titulares legibles (Bricolage Grotesque 600). El ritmo lo dan el énfasis liviano en rojo y el revelado por palabras, no la deformación de la letra.
- Todo movimiento confirma, orienta o revela. Con
prefers-reduced-motion, nada se mueve.
01 · Color
Color con nombre propio.
02 · Tipografía
Dos familias, pesos que conversan.
Marca gráfica
Lo que trae tu manual
Ploteo vehicular con plano técnico
No vendemos logos sueltos. Diseñamos tu marca con sus reglas.
El manual define versiones, colores en HEX, CMYK y Pantone, tipografías y usos incorrectos.
Plan base · 10 a 15 días
$400.000
03 · Botones
Botones.
Pasa el cursor: el círculo del icono se expande y rellena el botón, la etiqueta rueda y la flecha sale y entra. Al presionar, escala a 0,97. En táctil no hay hover: el feedback es la presión.
04 · Enlaces
Enlaces.
Revisa qué incluye el manual antes de cotizar. Hover forzado.
05 · Campos
Campos y sus estados.
La etiqueta flota al enfocar. La validación ocurre al salir del campo, nunca mientras escribes la primera vez. El error sacude el campo una vez y despliega el mensaje; el éxito dibuja un check.
- Construcción
- Transporte
- Salud
06 · Selección
Elegir sin pensar.
Tarjetas de opción (una)Chips (varias)Casilla e interruptorEtiquetas07 · Cards
Cards.
Manual de marca
Versiones, color físico y reglas. El documento que ordena todo.
02Hover forzado
Sube 4 px, gana sombra y la flecha gira hacia el destino.
$400.000
Logo + manual · 10 a 15 días hábiles
08 · Formulario
Cotizar en 3 pasos.
Una decisión por pantalla. Progreso visible. Errores en el momento justo. Cierre con resumen y salida a WhatsApp.
09 · Acordeón
Preguntas.
¿Qué incluye el manual base?
Diez capítulos: concepto, versiones del logo, construcción, área de seguridad, color, usos incorrectos, paleta, tipografías, fondos y aplicaciones básicas.
¿Cuánto se demora?
Entre 10 y 15 días hábiles desde el brief.
10 · Movimiento
Movimiento.
Casi todo: hover, entradas.
Telones: menú, slides, pasos.
Confirmaciones: checks, radio, switch.
| 120 ms | --d-1 | Presión |
| 240 ms | --d-2 | Hover, color |
| 480 ms | --d-3 | Entradas, campos, checks |
| 760 ms | --d-4 | Telones: menú, slides, portadas |
Con prefers-reduced-motion todas las duraciones pasan a 0.
11 · Menú
Menú.
Telón circular que nace del botón. Los ítems suben en cascada; al hover, el resto se apaga y el elegido se estira. Esc cierra, el foco queda atrapado y el fondo no hace scroll.