Workflow de design

dsh-figma-to-lottie

Compile chemins SVG et keyframes en animations Lottie autonomes, depuis la conversation.

De quoi il s’agit

Deux outils qui transforment des données de design en assets de motion : lottie_compile_shape convertit un chemin SVG en valeurs de forme Lottie, et lottie_compile assemble un JSON Lottie complet à partir d’une spec de calques compacte — rectangles, dégradés, chemins, images embarquées et texte, avec animation par keyframes calque par calque.

Figma/SVG to Lottie animation compiler for DeepSeek Harness. Turn SVG paths and keyframe data into self-contained .lottie.json files.
Depuis le README en amont

Pourquoi ça compte pour le design

  • Décrivez une animation de chargement en langage naturel et obtenez un .lottie.json qui tourne sur iOS, Android et le web.
  • Les tangentes bézier in/out et l’easing des keyframes sont compilés, pas écrits à la main.
  • Zéro étape de build et ESM pur : ce qui est publié est exactement ce qui tourne.

Ce que ça couvre

  • Why
  • Features
  • Usage
  • Layer Spec Reference
  • Development

Comment l’installer

dsh-figma-to-lottie

  1. Lancez ceci dans un terminal.

    dsh plugin --profile myprofile add dsh-figma-to-lottie
  2. Redémarrez dsh web pour qu’il charge le plugin.

  3. Décrivez ensuite le design voulu. Le harness récupère les outils du plugin.

Comment le faire tourner avec DeepSeek Harness

  1. Ajoutez le plugin depuis npm, ou verrouillez un commit depuis GitHub.

  2. Décrivez le mouvement : calques, timing, easing, décalages.

  3. Déposez le .lottie.json compilé dans LottieWeb, lottie-ios ou lottie-android.

Chaque plugin présenté ici est gratuit à installer et renvoie à sa vraie source amont.

Plus dans le dépôt DeepSeek Harness ↗

Prochaine étape

Designez avec Open Design, sans la config

Installez ce plugin vous-même, ou faites tourner toute une couche design sélectionnée autour de DeepSeek Harness avec Open Design. Apportez votre clé, gardez la main sur ce que vous produisez.

Open Design Desktop

Un seul design system. Votre marque, cohérente partout

Dans le Vibe Design Workspace complet, appliquez les mêmes règles de marque aux sites, slides, prototypes interactifs, dashboards, images et vidéos HTML. Connectez Codex, Claude Code, Cursor et vos autres agents de code locaux, puis créez gratuitement.

  • Sites, slides, prototypes, dashboards, images et vidéos
  • Plus de 140 design systems et la bibliothèque complète de modèles et skills
  • Codex local et plus de 21 agents de code · Gratuit
Télécharger gratuitement

Disponible sur macOS, Windows et Linux