Animated sticker studioEstudio de stickers animados
STIX MΛGIC
Pick a style and the magic happens. One single flow, from your image to a ready-to-use animated sticker — no technical panels, no assembling parts by hand.Eliges un estilo y la magia sucede. Un solo flujo, de tu imagen al sticker animado listo para usar — sin paneles técnicos, sin armar piezas a mano.
"It's not a technical configuration tool. It's an animated sticker studio where you pick a style and the magic happens in one single flow."
"No es una herramienta técnica de configuración. Es un estudio de stickers animados donde eliges un estilo y la magia sucede en un solo flujo."
PrinciplesPrincipios
01
Style first ✦Estilo primero ✦
Style is the main decision. Finish and motion come together inside each style — they aren't configured separately.El estilo es la decisión principal. Acabado y movimiento vienen juntos dentro de cada estilo — no se configuran por separado.
02
Magic in one flowMagia en un flujo
The whole transformation happens in a single journey: you pick, preview and apply. No assembling components by hand.Toda la transformación ocurre en un mismo recorrido: eliges, previsualizas y aplicas. Nada de armar componentes manualmente.
03
Minimal by defaultMínimo por defecto
The base experience is simple. The extra magic stays hidden until someone wants more control.La experiencia base es simple. La magia extra está oculta hasta que la persona quiere más control.
04
Symbols with precisionSímbolos con precisión
The symbols (✦ ✧ ○ ◌ △) are used with intent and restraint. They reinforce meaning, they don't decorate at random.Los símbolos (✦ ✧ ○ ◌ △) se usan con intención y mesura. Refuerzan el significado, no decoran al azar.
05
Visible transformationTransformación visible
People understand what's happening: image ○ → edge refined △ → motion infused ✧ → ready ✦.La persona entiende lo que sucede: imagen ○ → borde refinado △ → movimiento infundido ✧ → listo ✦.
06
Conversion by outcomeConversión por resultado
Primary CTAs speak to the outcome and the value: "Apply to my image ✦", not "use this preset".Los CTAs principales hablan del resultado y el valor: "Apply to my image ✦", no "usa este preset".
In the familyEn la familia
STIX MΛGIC is a product of the Frisky family. It shares the brand DNA, the design rigor and the house signature, while keeping its own magical voice and its symbol system as a distinctive trait.
STIX MΛGIC es un producto de la familia Frisky. Comparte el ADN de marca, el rigor de diseño y la firma de la casa, manteniendo su propia voz mágica y su sistema de símbolos como rasgo distintivo.
Brand voiceVoz de marca
Short, guided, magicalCorta, guiada, mágica
One- or two-word labels, clear direction and a touch of transformation. Warmth without slipping into casual; magic without slipping into fantasy roleplay.Etiquetas de una o dos palabras, dirección clara y un toque de transformación. Calidez sin caer en lo casual; magia sin caer en el roleplay de fantasía.
Voice characteristicsCaracterísticas de voz
| CharacteristicCaracterística | ✓ DO | ✗ AVOID |
|---|---|---|
ShortCorta One- or two-word labels, preferably.Etiquetas de una o dos palabras de preferencia. |
"Pick a style ✦" | Long, explanatory paragraphs.Párrafos largos y explicativos. |
GuidedGuiada Lead the person with confidence.Dirige a la persona con confianza. |
"Bring it to life" | Parameter and technical-tweak language.Lenguaje de parámetros y ajustes técnicos. |
FriendlyAmigable Warm, but not overly casual.Cálida, pero no excesivamente casual. |
"Your sticker is forming ◌" | Dry technical labels.Etiquetas técnicas secas. |
MagicalMágica Hint at transformation and delight.Insinúa transformación y deleite. |
"Magic applied ✦" | Fantasy roleplay: wizard, mage, summoner.Roleplay de fantasía: wizard, mage, summoner. |
MinimalMinimalista Avoid long explanations.Evita explicaciones largas. |
"Ready to export ✦" | Advanced builder or configuration language.Lenguaje de builder avanzado o de configuración. |
Vocabulary LawLey de Vocabulario
| Old termTérmino anterior | Brand termTérmino de marca | ContextContexto |
|---|---|---|
preset | style | When referring to full animated outcomes.Al referirse a resultados animados completos. |
effect | magic / look | User-facing copy.Copy visible para la persona usuaria. |
intensity | energy | Control labels.Etiquetas de control. |
mask | finish / edge | User-facing copy (use "mask" only where technically necessary).Copy visible (usa "mask" solo donde sea técnicamente necesario). |
apply effect | Apply to my image ✦ | Call to action.Llamado a la acción. |
playground | studio / style lab | If it fits the context.Si encaja con el contexto. |
Brand signatureFirma de marca
Brand signature — this line always stays in English across every locale and is never translated. In any i18n structure it must be marked as non-translatable:
Brand signature — esta línea permanece siempre en inglés en todos los locales y nunca se traduce. En cualquier estructura de i18n debe marcarse como no traducible (non-translatable):
🐾 Forged with a frisky paw and a daring heart
Distinctive elementElemento distintivo
Symbol SystemSistema de Símbolos
The signature trait of STIX MΛGIC. Five symbols, used with precision and restraint, that tell the state and flow of the transformation without a single extra technical word.El rasgo firma de STIX MΛGIC. Cinco símbolos, usados con precisión y mesura, que cuentan el estado y el flujo de la transformación sin una sola palabra técnica de más.
The five symbolsLos cinco símbolos
| SymbolSímbolo | MeaningSignificado | RuleRegla |
|---|---|---|
| ✦ | Primary action / main flowAcción primaria / flujo principal | Hero and primary CTAs only.Solo en héroe y CTAs primarios. |
| ✧ | Optional enhancementMejora opcional | NEVER in the main flow.NUNCA en el flujo principal. |
| ○ | Neutral stateEstado neutral | Starting point, no action.Punto de partida, sin acción. |
| ◌ | In progress / forming / loadingEn progreso / formando / cargando | Active processes and loaders.Procesos activos y loaders. |
| △ | Transformation / changeTransformación / cambio | When something transforms or changes state.Cuando algo se transforma o cambia de estado. |
Transformation flowFlujo de transformación
Your imageTu imagen ○
→
Edge refined △
→
Motion infused ✧
→
Ready to applyListo para aplicar ✦
All magic happens in one flow. The full journey is told with symbols: from the neutral state ○ to the primary outcome ✦, with no separate panels and no manual assembly.El recorrido completo se cuenta con símbolos: del estado neutral ○ hasta el resultado primario ✦, sin paneles separados ni armado manual.
Finish / edge terminologyTerminología de acabado / borde
Finish
Clean cut
Sharp, defined edges. The clean cut-out at its finest.Bordes nítidos y definidos. El recorte limpio por excelencia.
Finish
Soft edge
Blurred, gentle edges with a delicate transition.Bordes difuminados y suaves, con transición delicada.
Finish
Glow edge
Luminous edges that radiate light around the sticker.Bordes luminosos que irradian luz alrededor del sticker.
Finish
Aura edge
A diffuse halo that wraps the figure in a soft aura.Halo difuso que envuelve la figura con un aura suave.
Visual systemSistema visual
Twilight & glow
A deep twilight canvas where magic violet and aura accents make motion and energy shine.Un lienzo crepuscular profundo donde el violeta mágico y los acentos de aura hacen brillar el movimiento y la energía.
PROPOSED palette. STIX MΛGIC has a real, consolidated voice, but it doesn't yet have committed color tokens. This palette is proposed, derived from its "magic / glow / aura" language. Treat it as a starting point, not as final.
Paleta PROPUESTA. STIX MΛGIC tiene una voz real y consolidada, pero aún no tiene tokens de color comprometidos. Esta paleta es propuesta, derivada de su lenguaje de "magic / glow / aura". Trátala como punto de partida, no como definitiva.
Palette (proposed)Paleta (propuesta)
Twilight
#1A1430 · canvas
Magic Violet ✦
#B07DFF · primaryprimario
Aura Rose ✧
#FF8AB3 · optionalopcional
Glow Cyan
#73E7FF · motion / energymovimiento / energía
Spark Gold
#FFCF70 · ready / successlisto / éxito
White
#FFFFFF · texttexto
Implementation note. The current STIX MΛGIC UI borrows the surface tokens from Cyberpup. The migration to this proposed palette is still pending commitment.
Nota de implementación. La UI actual de STIX MΛGIC toma prestados los tokens de superficie de Cyberpup. La migración a esta paleta propuesta queda pendiente de compromiso.
TypographyTipografía
Outfit · Inter · Mono
Outfit for headlines with character, Inter for legible body, JetBrains Mono for metadata and tokens. The symbols live comfortably in any of the three.Outfit para títulos con carácter, Inter para cuerpo legible, JetBrains Mono para metadatos y tokens. Los símbolos viven cómodos en cualquiera de las tres.
SpecimensEspecímenes
Pick a style ✦Elige un estilo ✦
Your sticker is forming ◌Tu sticker se está formando ◌
Pick a style ✦, bring it to life and apply it to your image. The magic happens in one single flow, with no technical steps in between.Pick a style ✦, dale vida y aplícalo a tu imagen. La magia sucede en un solo flujo, sin pasos técnicos de por medio.
Add extra magic ✧ · Edge refined △
--accent: #B07DFF; /* Magic Violet ✦ */
ComponentsComponentes
Pieces of the flowPiezas del flujo
Primary buttons with ✦, options with ✧, style cards and process states. Every piece respects the symbol system and the vocabulary law.Botones primarios con ✦, opciones con ✧, tarjetas de estilo y estados de proceso. Cada pieza respeta el sistema de símbolos y la ley de vocabulario.
Primary CTAs ✦CTAs primarios ✦
Primary CTACTA primario
Primary CTACTA primario
Optional toggles ✧Toggles opcionales ✧
Optional · hidden by defaultOpcional · oculto por defecto
The extra magic is hidden by default. It only appears when someone wants more control.La magia extra está oculta por defecto. Solo aparece cuando la persona quiere más control.
Style cardsTarjetas de estilo
Style
Dream Glow
Soft glow that breathes. Slow, dreamy motion.Brillo suave que respira. Movimiento lento y soñador.
Style
Pulse Edge
An edge that pulses with energy. Quick, sharp motion.Borde que late con energía. Movimiento ágil y marcado.
Style
Aura Drift
A halo that floats around. Orbital, ethereal motion.Halo que flota alrededor. Movimiento orbital y etéreo.
Loader chip ◌Loader chip ◌
◌ Your sticker is forming
Energy levelsNiveles de energía
Clean
Minimal energy, natural look.Energía mínima, look natural.
Enhanced
Balanced energy.Energía equilibrada.
Intense
Maximum energy, dramatic look.Energía máxima, look dramático.
SpeedVelocidad
Slow
Paused motion.Movimiento pausado.
Normal
Standard pace.Ritmo estándar.
Fast
Fast motion.Movimiento veloz.
Tokens / CodeTokens / Código
Tokens :root
A dump of color and typography tokens. Remember: the colors are PROPOSED — the voice is real, the palette isn't committed yet.Volcado de tokens de color y tipografía. Recuerda: los colores son PROPUESTOS — la voz es real, la paleta aún no está comprometida.
:root {
/* ─── COLOR · PROPUESTO ───────────────────────────── */
/* Estos tokens de color son PROPUESTOS, derivados del */
/* lenguaje "magic / glow / aura". Aún NO comprometidos. */
--bg: #15102b; /* Twilight base */
--surface: #1c1638;
--surface-2: #241c47;
--surface-3: #2c2255;
--border: rgba(255,255,255,.09);
--border-strong:rgba(255,255,255,.17);
--text: #f3eeff; /* White */
--text-muted: #b3a8d0;
--text-faint: #7d72a0;
--accent: #b07dff; /* Magic Violet ✦ */
--accent-2: #ff8ab3; /* Aura Rose ✧ */
--accent-glow: rgba(176,125,255,.16);
/* Swatches de marca (propuestos) */
--twilight: #1A1430; /* canvas */
--magic-violet: #B07DFF; /* primario ✦ */
--aura-rose: #FF8AB3; /* opcional ✧ */
--glow-cyan: #73E7FF; /* movimiento / energía */
--spark-gold: #FFCF70; /* listo / éxito */
--white: #FFFFFF; /* texto */
/* ─── TIPOGRAFÍA ──────────────────────────────────── */
--font-display: 'Outfit', 'Space Grotesk', sans-serif;
--font-body: 'Inter', system-ui, sans-serif;
--font-mono: 'JetBrains Mono', monospace;
}
Checklist
Consistency Check
Before shipping any copy or screen, verify that it follows the STIX MΛGIC brand system.Antes de enviar cualquier copy o pantalla, verifica que cumpla con el sistema de marca de STIX MΛGIC.
Correct symbol use: ✦ for primary action, ✧ for optional. Never ✧ in the main flow.Uso de símbolos correcto: ✦ para acción primaria, ✧ para opcional. Nunca ✧ en el flujo principal.
Vocabulary replacements applied: style, magic / look, energy, finish / edge, studio / style lab.Reemplazos de vocabulario aplicados: style, magic / look, energy, finish / edge, studio / style lab.
Brand signature present and non-translatable: "🐾 Forged with a frisky paw and a daring heart" (always in English).Firma de marca presente y no traducible: "🐾 Forged with a frisky paw and a daring heart" (siempre en inglés).
Extra magic ✧ hidden by default; it only appears when someone asks for more control.Extra magic ✧ oculta por defecto; solo aparece cuando la persona pide más control.
Style-first, non-technical language: no presets, parameters or separate mask/motion configuration.Lenguaje style-first, no técnico: nada de presets, parámetros ni configuración de máscaras o motion por separado.