Ceci est la libre adaption de la Documentation Originale
|
Documentation de SPLINE
Tutoriel d'Introduction
Si vous préférez la vidéo au texte, un moyen rapide de commencer est de regarder notre tutoriel d'introduction sur Youtube.
Création de votre première scène
Commencer avec Spline est facile !
Comment créer un nouveau fichier ?
À partir de la vue principale, il y a deux façons de créer un nouveau fichier.
Contrôle de la caméra
Vous pouvez faire pivoter la caméra en appuyant sur :
À partir de la vue principale, il y a deux façons de créer un nouveau fichier.
- En haut à gauche, à côté de votre nom, appuyez sur l'icône "+".
- Dans l'onglet "Mes fichiers" à côté de la recherche, appuyez sur le bouton "Nouveau fichier".
Contrôle de la caméra
Vous pouvez faire pivoter la caméra en appuyant sur :
- Option + Glisser sur macOS
- Alt + Glisser sur Windows/Linux
Apprendre à partir des fichiers de la bibliothèque
L'exploration de la bibliothèque Spline est un bon moyen de découvrir de nouvelles façons de créer du contenu 3D dans Spline. Des scènes statiques simples aux scènes animées complexes, vous trouverez des exemples qui vous aideront à créer vos scènes plus rapidement.
L'exploration de la bibliothèque Spline est un bon moyen de découvrir de nouvelles façons de créer du contenu 3D dans Spline. Des scènes statiques simples aux scènes animées complexes, vous trouverez des exemples qui vous aideront à créer vos scènes plus rapidement.
Comprendre l'Interface de Spline
Vous pouvez voir ci-dessous un aperçu de l'interface utilisateur de Spline.
Les barres Latérales
La barre latérale gauche affiche les calques ou les objets de votre scène. Elle est également connue sous le nom de Outliner.(Arborescence)
|
La barre latérale droite présente les panneaux de propriétés. Chaque panneau vous permet de modifier les propriétés de la scène entière ou des objets sélectionnés.
|
La barre d'onglets affiche vos fichiers ouverts. Appuyez sur l'icône "+" pour créer de nouveaux fichiers. Appuyez sur le bouton portant votre nom pour revenir au tableau latéral.
La Barre d'Outils permet d'accéder rapidement aux objets les plus courants, aux options de transformation et aux modes spéciaux, comme l'outil vectoriel ou le mode cadre. On peut également voir la valeur du Zoom, Exporter notre scène ou passer en Mode Présentation.
- Appuyez sur l'icône "+" pour voir la liste complète des objets disponibles (objets paramétriques).
- Appuyez sur Transform (les flèches) pour Déplacer, Mettre à l'échelle et faire Pivoter un objet.
- Appuyez sur l'icône "Play" (triangle) pour accéder au Mode de Présentation.
Le Mode Présentation
Le Mode Présentation vous permet de voir votre scène dans toute sa splendeur. Faites Tourner, Pivoter et Zoomer votre caméra ou voyez vos interactions et animations prendre vie.
Entrer en Mode Présentation et faire Tourner la caméra dans une scène avec des objets animés. Appuyez sur Option + Glisser.
Le Mode Présentation montre ce que vous verrez après avoir publié ou exporté votre scène depuis le panneau Publier et Partager.
Le Mode Présentation montre ce que vous verrez après avoir publié ou exporté votre scène depuis le panneau Publier et Partager.
Les Raccourcis Clavier
Symboles de Touches (Mac)
⌘ - CMD
⇧ - MAJ
⌃ - Control
⌥ - Option - Alt
⌘ - CMD
⇧ - MAJ
⌃ - Control
⌥ - Option - Alt
Action
Ouvrir / Importer Sauvegarder le Fichier Sauvegarder le Fichier en Local Annuler Refaire Copier Couper Dupliquer Coller Coller en Place ... Sélectionner tous les Objets Désélectionner les Objets Renommer Basculer l'UI Basculer le Plein Ecran Zoom + Zoom - Réinitialiser la Vue / Caméra ... Grouper la Sélection Dégrouper la Sélection ... Effacer les Objets Echapper à la Création d'Objets Rectangle Ellipse Triangle Polygone Translation Mise à l'Echelle Rotation Basculer Local / Global ... Zoom Objet Orienter sur l'Objet Zoom 100% Perspective Pipette Déplacer la Copie ... Transformer (Miroir) Transformer(Ratio d'Apect) Transform (Miroir+Ratio d'Aspect) ... Zoom Panoramique Orbiter ... ↓ Sélection de la Barre Gauche Sél/Désél série d'objet W/enf 1-1 Sél/Désél objets Multi W/enfants Sél/Désél objets Uniq sans enfant Sél/Désél obj Multi sans enfant 1-1 ... ↓ Sélection depuis l'Ecran Sél/Désél d'Objets W/Enfants 1-1 Sél/Désél objets Multi W/enfants Sél/Désél objet Unique sans enfant Sél/Désél objet Multi sans enfant Sél/Désél d'Objets sans Enfant 1-1 Sél/Désél d'Objets sans Enfant |
MAC
⌘ O ⌘ S ⌘ ⇧ S ⌘ Z ⌘ ⇧ Z ⌘ C ⌘ X ⌘ D ⌘ V ⌘ ⌃ V ... ⌘ A ESC ⌃ R ⌘ \ ⌘ ⇧ F ⌘ + ⌘ - ⌥ R ... ⌘ G ⌘ ⇧ G ... Supp ESC R O K J W T E L ... S ⇧ S ⇧ 1 M I ⌘ + Drag ... ⌥ ⇧ ⇧ ⌥ ... ⌘+Molette Space + Drag ⌥ + Drag ... ⇧ Clic ⌘ Clic ⌥ ⌘ Clic ⌥ ⌘ ⇧ Clic ... ⇧ Clic ⇧ Drag ⌥ ⌘ Clic ⌥ ⌘ Drag ⌥ ⌘ ⇧ Clic ⌥ ⌘ ⇧ Drag |
Windows / Linux
Ctrl + O Ctrl + S Ctrl + MAJ + S Ctrl + Z Ctrl + Shift + Z / Ctrl + Y Ctrl + C Ctrl + X Ctrl + D Ctrl + V Ctrl + Shift + V ... Ctrl + A ESC Ctrl + R Ctrl + \ Ctrl + MAJ + F Ctrl + Ctrl - Alt + R ... Ctrl + G Ctrl + MAJ +G ... Supp ESC R O K J W T E L ... S MAJ + S MAJ + 1 M I Ctrl + Drag ... ALT MAJ MAJ + Alt ... CTRL + Molette Espace + Déplacer Espace + Alt + Déplacer ... MAJ + Clic CTRL + Clic ALT + CTRL + Clic Alt + Ctrl + MAJ + Clic ... MAJ + Clic MAJ + Déplacer ALT + CTRL + Clic ALT + CTRL + Déplacer ALT + CTRL + MAJ + Clic Alt + CTRL + MAJ + Drag |
La FAQ
Quels types de contenus exporter avec SPline?
📸 Voici une liste des types de contenu que vous pouvez actuellement exporter avec Spline, cette liste va très probablement s'allonger au fil du temps.
🖼 Images
🎥 Vidéos
🥕 Contenu 3D
- PNG
- JPG
🎥 Vidéos
- WebM
- Mp4
- Gif animé
- Séquence d'images
🥕 Contenu 3D
- URL publique (hébergée sur les serveurs de Spline).
- URL (comme my.spline.design...)
- Code embarqué (idéal pour l'intégration dans d'autres outils comme Wordpress).
- WebContent (identique aux URL publiques, mais à télécharger localement).
- Fichiers Spline (fichiers avec ".spline" que vous pouvez enregistrer localement).
- GLTF
Quels types de contenus importer avec Spline?
💡 Vous pouvez importer du contenu dans votre scène en glissant et déposant le fichier dans le Viewport.
Voici une liste des formats de fichiers que vous pouvez importer sur Spline ; cette liste augmentera très probablement avec le temps.
🖼 Images
🥕 Contenu 3D
Voici une liste des formats de fichiers que vous pouvez importer sur Spline ; cette liste augmentera très probablement avec le temps.
🖼 Images
- PNG
- JPG
- SVG (partiellement)
🥕 Contenu 3D
- OBJ
- FBX
- GLTF (en tant que .gltf)
- Fichiers Spline (.spline)
SPline intégrable avec d'autres outils ?
🍭Oui, si vous exportez votre scène en tant qu'"URL publique", vous pouvez utiliser les liens ou les codes d'intégration pour l'intégrer sur des plateformes comme Notion, Wordpress, Webflow, etc...
Exigences techniques pour Spline?
💻 Nous vous recommandons d'utiliser la dernière version de votre système d'exploitation pour faire fonctionner Spline. La 3D est une technologie relativement nouvelle pour les navigateurs, et elle nécessite un traitement CPU/GPU plus important que les outils de conception 2D traditionnels.
Comment fonctionne la tarification ?
💡 Depuis votre tableau de bord, allez dans "Paramètres du compte" pour modifier votre plan de compte.
Ou appuyez sur le bouton violet de mise à niveau en haut à droite.
Ou appuyez sur le bouton violet de mise à niveau en haut à droite.
💳 Comment fonctionne la tarification ?Il existe actuellement deux plans de compte différents sur Spline.
Vous avez également la possibilité de vous abonner sur une base mensuelle ou annuelle avec le plan Pro.
- Basic (gratuit)
- Pro
Vous avez également la possibilité de vous abonner sur une base mensuelle ou annuelle avec le plan Pro.
🍭 Comprendre la Conception 3D
Travailler avec les Objets 2D, 3D
Dans Spline, tous les objets "vivent" dans un espace 3D, mais nous considérons comme des objets 2D ceux qui ont une largeur et une hauteur (mais pas de profondeur), ce qui signifie qu'ils ne peuvent être redimensionnés que sur les axes X et Y.
Les objets 2D sont utiles lors de la création d'interfaces utilisateur. Bien qu'ils n'aient pas de profondeur par défaut, vous pouvez toujours extruder ces objets pour leur donner du volume.
En outre, les objets 2D peuvent toujours être déplacés et pivotés dans l'espace 3D sur les trois axes (X, Y et Z).
En outre, les objets 2D peuvent toujours être déplacés et pivotés dans l'espace 3D sur les trois axes (X, Y et Z).
|
Un rectangle et un cercle (2D) se déplaçant et tournant dans l'espace 3D.
|
Extruder des Objets 2D en 3D
Bien que les objets 2D ne possèdent pas de paramètre de profondeur, ils peuvent rapidement devenir 3D grâce à une opération de modélisation appelée extrusion.
Comment extruder un objet 2D
Comment extruder un objet 2D
- Sélectionnez l'objet que vous souhaitez extruder.
- Accédez au panneau Forme dans la barre latérale droite et ajoutez une valeur à la propriété Extrusion.
Conseils pour travailler avec des extrusions
Changez le type d'éclairage en Phong ou Physical si vous souhaitez qu'il reçoive de la lumière/des ombres.
Assurez-vous de sélectionner "Front" dans le panneau de visibilité ; cela améliorera l'ombrage de la surface de l'objet lorsque vous activerez les ombres.
Changez le type d'éclairage en Phong ou Physical si vous souhaitez qu'il reçoive de la lumière/des ombres.
Assurez-vous de sélectionner "Front" dans le panneau de visibilité ; cela améliorera l'ombrage de la surface de l'objet lorsque vous activerez les ombres.
Utiliser des Objets Paramétriques
💡 Un objet paramétrique est un objet qui conserve toujours ses paramètres d'origine après avoir été modifié.
Dans Spline, les objets paramétriques sont accessibles en appuyant sur l'icône "+" de la barre d'outils.
Dans Spline, les objets paramétriques sont accessibles en appuyant sur l'icône "+" de la barre d'outils.
Comme indiqué précédemment, un objet paramétrique est un objet qui conserve ses paramètres modifiables après avoir subi différentes transformations (comme le redimensionnement, le déplacement, la rotation), ce qui signifie que vous pouvez toujours revenir à la forme initiale.
|
Polyèdres (3D) -
Cliquer et faire glisser 👆 Zoom à la molette...etc |
Travailler avec du Texte
Dans Spline, le Texte se comporte comme un objet 2D dans l'espace 3D (comme un Rectangle). Cela signifie qu'il peut être déplacé et tourné sur les axes X, Y et Z.
Pour créer du texte, appuyez sur l'icône "T" de la barre d'outils, puis cliquez et faites-le glisser sur la fenêtre d'affichage.
Pour créer du texte, appuyez sur l'icône "T" de la barre d'outils, puis cliquez et faites-le glisser sur la fenêtre d'affichage.
Vous pouvez également modifier les paramètres du texte à partir du panneau Texte, comme ceci :
Il est possible de transformer votre texte 2D en objet 3D en allant dans le panneau des polices et en appuyant sur le bouton "Convertir en forme".
Cela transformera votre texte en formes vectorielles individuelles que vous pourrez facilement transformer en objets 3D en ajoutant une extrusion dans le panneau Forme. |
|
Travailler avec du texte en 3D est amusant ! Voici un exemple de ce que vous pouvez faire avec !
|
L'Outil Plume
💡 Une forme vectorielle peut être éditée par un double-Clic sur celle-ci.
Quittez le mode d'édition vectorielle en appuyant deux fois sur n'importe quel endroit de la fenêtre d'affichage ou en appuyant sur la touche ESC.
L'outil Plume vous permet de créer des formes 2D personnalisées dans l'espace 3D. Il fonctionne de la même manière que les autres outils de conception 2D ou d'interface utilisateur.
Commencez par sélectionner l'outil stylo dans la barre d'outils et créez les points de votre forme vectorielle.
Quittez le mode d'édition vectorielle en appuyant deux fois sur n'importe quel endroit de la fenêtre d'affichage ou en appuyant sur la touche ESC.
L'outil Plume vous permet de créer des formes 2D personnalisées dans l'espace 3D. Il fonctionne de la même manière que les autres outils de conception 2D ou d'interface utilisateur.
Commencez par sélectionner l'outil stylo dans la barre d'outils et créez les points de votre forme vectorielle.
Pour ajouter une courbe à vos points, vous pouvez soit cliquer sur la courbe + glisser tout en ajoutant un point, soit utiliser l'outil de courbure (en le sélectionnant dans la barre d'outils ou en cliquant sur ⌘ / Ctrl pour un raccourci).
La partie la plus amusante est celle où nous ajoutons l'extrusion et travaillons avec une forme vectorielle 3D.
Pour ce faire, il suffit d'aller dans le panneau Forme et d'ajouter l'extrusion à votre forme. N'oubliez pas d'ajouter l'éclairage à votre forme dans le panneau des matériaux.
Pour ce faire, il suffit d'aller dans le panneau Forme et d'ajouter l'extrusion à votre forme. N'oubliez pas d'ajouter l'éclairage à votre forme dans le panneau des matériaux.
Coins Arrondis
Vous pouvez également ajouter des coins arrondis aux formes vectorielles !
Vous pouvez également ajouter des coins arrondis aux formes vectorielles !
Biseaux (angles 3D)
Si vous ajoutez une extrusion à votre forme, vous pouvez ajouter des coins arrondis au volume résultant (généralement appelés biseaux).
Si vous ajoutez une extrusion à votre forme, vous pouvez ajouter des coins arrondis au volume résultant (généralement appelés biseaux).
Partager des Fichiers
Notre première étape vers un flux de travail plus collaboratif sur Spline est le partage de fichiers.
Pour partager un fichier, vous aurez besoin de l'email du compte avec lequel vous partagez votre fichier.
Pour partager un fichier, vous aurez besoin de l'email du compte avec lequel vous partagez votre fichier.
- Ouvrez le menu contextuel d'un fichier (appuyez sur le bouton droit) et appuyez sur "Partager".
- Ajoutez l'adresse électronique du compte avec lequel vous partagez votre fichier et appuyez sur Entrée. Répétez cette étape pour ajouter plusieurs adresses électroniques.
- Appuyez sur "Envoyer" pour envoyer une copie du fichier à toutes les adresses électroniques ajoutées.
Si vous recevez un fichier de quelqu'un d'autre, vérifiez l'onglet Activité de votre tableau de bord. Une nouvelle notification devrait s'afficher, vous indiquant que quelqu'un a partagé un fichier avec vous.
Choisissez si vous souhaitez accepter ou refuser le fichier partagé :
Si vous le refusez, le fichier et la notification disparaissent, ce qui vous permet de garder votre onglet Activité propre.
Si vous acceptez, une copie du fichier partagé s'affiche dans votre onglet "Mes fichiers", prête à être consultée.
Choisissez si vous souhaitez accepter ou refuser le fichier partagé :
Si vous le refusez, le fichier et la notification disparaissent, ce qui vous permet de garder votre onglet Activité propre.
Si vous acceptez, une copie du fichier partagé s'affiche dans votre onglet "Mes fichiers", prête à être consultée.
Les Outils de Modélisation
Les outils de modélisation (introduits dans Spline Alpha II) vous permettent de modifier les géométries pour créer des formes plus complexes.
Pour modifier une géométrie, cliquez sur "Smooth & Edit" dans le panneau Shape de la barre latérale droite. L'objet est alors converti en une surface de subdivision.
Vous pouvez extruder, insérer ou générer des boucles d'arêtes :
Pour modifier une géométrie, cliquez sur "Smooth & Edit" dans le panneau Shape de la barre latérale droite. L'objet est alors converti en une surface de subdivision.
Vous pouvez extruder, insérer ou générer des boucles d'arêtes :
Vous pouvez également modifier les sommets (points), les faces (polygones) ou les arêtes (lignes) :
🎮 Interaction ( États et Evénements )
Comment fonctionne une animation par états
Lorsque vous souhaitez commencer à ajouter des animations et des interactions à votre scène, il est temps de comprendre les états et les événements.
L'animation basée sur les états fonctionne en ajoutant, vous l'aurez deviné, plusieurs états à vos objets.
Ensuite, vous pouvez déclencher des animations d'un état à l'autre en utilisant des événements.
Comment créer un état d'objet
L'animation basée sur les états fonctionne en ajoutant, vous l'aurez deviné, plusieurs états à vos objets.
Ensuite, vous pouvez déclencher des animations d'un état à l'autre en utilisant des événements.
Comment créer un état d'objet
- Sélectionnez l'objet.
- Allez dans le panneau États dans la barre latérale droite et cliquez sur l'icône "+".
- Vous verrez deux nouveaux états. L'"État de base" (l'état dans lequel se trouvait déjà votre objet) et un autre appelé "État 1".
- L'"État 1" sera automatiquement sélectionné, ce qui signifie que vous êtes prêt à commencer à appliquer des modifications à votre objet, comme le changement d'échelle, de position, de rotation, de couleur, etc.
- Une fois les modifications apportées à l'"État 1", vous pouvez passer de l'"État de base" à l'"État 1" dans le panneau États pour voir les différences.
Commutation entre "État de base" et "État 1".
Bon, vous avez maintenant un nouvel état, mais lorsque vous passez en Mode Présentation (icône "Play" (triangle), rien ne se passe. C'est là que les événements entrent en jeu. (section suivante)
évènements et interactivité
💡 Les événements vous permettent de modifier l'état d'un objet en fonction de vos entrées sur l'écran ; cela ressemble au fonctionnement des événements CSS ou JS (si vous êtes familier avec ces termes).
Avant de créer un nouvel événement, assurez-vous que vous avez déjà au moins deux états créés pour votre objet (avec des valeurs différentes).
Avant de créer un nouvel événement, assurez-vous que vous avez déjà au moins deux états créés pour votre objet (avec des valeurs différentes).
Comment ajouter votre premier événement
Vous pouvez maintenant jouer avec le reste des paramètres et prévisualiser votre animation en entrant dans le Mode Présentation.
- Sélectionnez l'objet auquel vous souhaitez ajouter un nouvel événement.
- Accédez au panneau Événements dans la barre latérale droite et cliquez sur l'icône "+".
- Utilisez la liste déroulante Type pour passer à un événement différent (souris vers le bas, vers le haut, touche, etc.).
- Dans la liste déroulante Objet, choisissez l'objet cible de l'événement.
- Dans la liste déroulante Etat, choisissez l'état cible vers lequel l'événement va effectuer une transition.
Vous pouvez maintenant jouer avec le reste des paramètres et prévisualiser votre animation en entrant dans le Mode Présentation.
L'ajout d'un événement "Start" cycle et répétitif avec une transition facile.
|
Voici un exemple concret de ce qui précède.
Cliquez et glisser, Zoom etc...
|
Cliquez et glissez 👆 Un événement "Start" qui se répète et se répète avec une transition "douce", d'un état à un autre.
Voici une description des propriétés de l'événement :
|
évènements courants
Voici une liste des événements actuellement disponibles dans Spline :
Mouse Down - Une transition se produit lorsqu'un bouton de la souris est enfoncé.
Mouse Up - Une transition se produit lorsque le bouton de la souris est relâché.
Mouse Hover - Une transition se produit lorsque le curseur survole un objet.
Key Down - Une transition se produit lorsqu'une touche du clavier est enfoncée.
Key Up - Une transition se produit lorsqu'une touche du clavier est relâchée.
Start - Une transition se produit dès que la scène est chargée.
Look At - Un objet avec cet événement fait toujours face au curseur.
Follow - Un objet avec cet événement suit le curseur.
Mouse Down - Une transition se produit lorsqu'un bouton de la souris est enfoncé.
Mouse Up - Une transition se produit lorsque le bouton de la souris est relâché.
Mouse Hover - Une transition se produit lorsque le curseur survole un objet.
Key Down - Une transition se produit lorsqu'une touche du clavier est enfoncée.
Key Up - Une transition se produit lorsqu'une touche du clavier est relâchée.
Start - Une transition se produit dès que la scène est chargée.
Look At - Un objet avec cet événement fait toujours face au curseur.
Follow - Un objet avec cet événement suit le curseur.
Ouvrir une adresse web par évènements
Les évènements de type "Mouse Down/Up" et "Key Down/Up" ont la possibilité d'ouvrir des liens.
|
Faire Pivoter, zoomer etc pour pouvoir cliquer sur le bouton! :)
|
Testez-le ! Appuyez sur le bouton ci-dessus 👆
Voici comment ajouter un lien à l'un de ces événements :
- Sélectionnez l'objet auquel vous souhaitez ajouter un lien.
- Dans le panneau Événements, ajoutez l'un des événements suivants : Souris vers le bas/vers le haut ou Touche vers le bas/vers le haut.
- Après avoir ajouté l'événement, ajoutez le lien souhaité à l'entrée URL. Veillez à ajouter https:// à votre lien.
Si vous souhaitez simplement utiliser les événements sans lien, vous pouvez ignorer la saisie de l'URL.
Propriétés animables
💡 Sur la version Spline Preview, les propriétés animables pour les transitions d'état sont limitées, mais augmenteront au fil du temps.
Voici une liste des propriétés qui peuvent être animées sur Spline.
Tous les objets
Caméras
Tous les objets
- Position
- Rotation
- Échelle
- Taille (X, Y, Z)
- Calques de matériaux
- Propriétés des formes personnalisées (bientôt disponible)
Caméras
- Zoom
- Position
|
Passer le curseur sur l'objet!
Clic & Drag etc... Une scène avec de multiples propriétés animées, notamment la position de la caméra et le zoom. Avion conçu par ARC.
|
🎞 Exportation de Votre Scène
exporter comme adresse web publique
💡 Le lien "Public URL" est généralement utilisé pour partager votre scène via un lien. Tandis que le code "Embed" est utilisé pour intégrer votre scène dans d'autres outils comme Notion, Webflow, Wordpress, etc.
- Une fois que vous êtes satisfait de votre scène, appuyez sur le bouton Exporter de la barre d'outils.
- Sélectionnez Public URL dans la liste déroulante Type et cliquez sur Exporter.
- Un panneau apparaît avec deux options. Vous pouvez copier l'URL publique ou le code embarqué.
Exporter comme contenu web
💡
Les fichiers enregistrés à partir de l'option "Contenu Web" sont les mêmes que ceux utilisés pour l'"URL publique". C'est le moyen d'ajouter les fichiers directement dans votre projet web.
- Une fois que vous êtes satisfait de votre scène, appuyez sur le bouton Exporter de la barre d'outils.
- Sélectionnez "Contenu Web" dans la liste déroulante Type et cliquez sur Exporter. Vous serez ensuite invité à enregistrer le fichier .zip exporté.
- Si vous souhaitez exécuter l'expérience, exécutez un serveur local.
- Ouvrez le terminal ou la console de votre système d'exploitation à partir du chemin du dossier non compressé et exécutez : python -m SimpleHTTPServer
exporter comme gltf
💡 L'exportateur gLTF actuel ne prend en charge que les géométries (les matériaux et les couleurs ne sont pas encore pris en charge). Le fichier résultant est un gLTF json.
- Une fois que vous êtes satisfait de votre scène, appuyez sur le bouton Exporter de la barre d'outils.
- Sélectionnez "gLTF" dans la liste déroulante Type et cliquez sur Exporter.
Vous pourrez ensuite importer le gLTF sur d'autres logiciels 3D.
exporter comme image
💡 Conseil : utilisez le mode cadre pour vous aider à visualiser votre composition.
L'exportation de votre scène en tant qu'image est aussi simple qu'il n'y paraît.
L'exportation de votre scène en tant qu'image est aussi simple qu'il n'y paraît.
- Avant d'exporter, assurez-vous de composer votre scène à l'aide du mode cadre et des guides de cadre.
- Appuyez sur le bouton Exporter de la barre d'outils.
- Choisissez entre JPG ou PNG, choisissez le rapport de densité de pixels et cliquez sur Exporter.
exporter comme vidéo
💡 L'exportation de votre scène en tant que "vidéo" est une fonctionnalité Pro.
Assurez-vous d'abord de passer à un compte Pro.
Assurez-vous d'abord de passer à un compte Pro.
- Une fois que vous êtes satisfait de votre scène, appuyez sur le bouton Exporter dans la barre d'outils.
- Sélectionnez "Vidéo" dans la liste déroulante Type.
- Sélectionnez l'un des formats vidéo dans la liste déroulante Format (WebM et MP4).
- Dans la liste déroulante Stop-by, vous pouvez choisir d'utiliser une durée fixe ou une durée manuelle pour la vidéo.
- Si vous sélectionnez une durée fixe, appuyez sur "Start" pour commencer l'enregistrement et la vidéo sera automatiquement arrêtée à la durée que vous avez choisie.
- Si vous sélectionnez une durée manuelle, vous devrez contrôler manuellement le début et la fin de la vidéo avec les boutons "Start" et "Stop".
exporter comme gifs animées
💡 L'exportation de votre scène en tant que "GIF animé" est une fonctionnalité Pro.
Assurez-vous d'abord de passer à un compte Pro.
Assurez-vous d'abord de passer à un compte Pro.
- Une fois que vous êtes satisfait de votre scène, appuyez sur le bouton Exporter dans la barre d'outils.
- Sélectionnez "Vidéo" dans la liste déroulante Type et "GIF" dans la liste déroulante Format.
- Dans la liste déroulante Stop-by, vous pouvez choisir d'utiliser une durée fixe ou une durée manuelle pour votre GIF.
- Si vous sélectionnez une durée fixe, appuyez sur "Start" pour commencer l'enregistrement et le GIF sera automatiquement arrêté à la durée que vous avez choisie.
- Si vous sélectionnez une durée manuelle, vous devrez contrôler manuellement le début et la fin de votre GIF à l'aide des boutons "Start" et "Stop".
exporter des séquences d'images
L'exportation de votre scène sous forme de "séquence d'images" est une fonctionnalité Pro.
Assurez-vous d'abord de passer à un compte Pro.
Assurez-vous d'abord de passer à un compte Pro.
- Une fois que vous êtes satisfait de votre scène, appuyez sur le bouton Exporter dans la barre d'outils.
- Sélectionnez "Vidéo" dans la liste déroulante Type et "Séquence d'images" dans la liste déroulante Format.
- Choisissez le type de fichier image que vous souhaitez enregistrer (JPG ou PNG).
- Dans la liste déroulante Stop-by, vous pouvez choisir d'utiliser une durée fixe ou une durée manuelle pour votre séquence d'images.
- Si vous sélectionnez une durée fixe, appuyez sur "Start" pour commencer l'enregistrement et la séquence d'images sera automatiquement arrêtée pendant la durée que vous avez choisie.
- Si vous sélectionnez une durée manuelle, vous devrez contrôler manuellement le début et la fin de votre séquence d'images avec les boutons "Start" et "Stop".
💻 Importation de Contenu
Comment Importer du contenu
Ouvrez le menu principal dans la barre latérale gauche, à côté de Recherche.
Sélectionnez Ouvrir / Importer et choisissez le fichier à importer.
Voici le type de fichiers que vous pouvez importer sur Spline :
🖼 Images
🥕 Contenu 3D
💡 Importez des fichiers en appuyant sur le raccourci "⌘+O" / "Ctrl+O".
Ou bien faites simplement glisser et déposer votre fichier dans la fenêtre d'affichage
Sélectionnez Ouvrir / Importer et choisissez le fichier à importer.
Voici le type de fichiers que vous pouvez importer sur Spline :
🖼 Images
- PNG
- JPG
- SVG (partiellement)
🥕 Contenu 3D
- OBJ
- FBX
- STL
- GLTF (en tant que .gltf)
- Fichiers Spline (.spline)
💡 Importez des fichiers en appuyant sur le raccourci "⌘+O" / "Ctrl+O".
Ou bien faites simplement glisser et déposer votre fichier dans la fenêtre d'affichage
🌈 Matériaux et Ombrage
création de calques de matériaux
💡 Pour créer un nouveau Calque de Matériau, sélectionnez un objet, allez dans le panneau Matériau dans la barre latérale droite, puis appuyez sur "+" pour ajouter un nouveau Calque.
Dans Spline, les matériaux fonctionnent selon une approche basée sur les Calques, ce qui signifie que vous pouvez contrôler l'apparence d'un objet en créant ou en modifiant des Calques sur une pile verticale. Cette approche est différente de celle des éditeurs 3D traditionnels, mais elle s'apparente au fonctionnement de la plupart des outils de conception graphique.
Dans Spline, les matériaux fonctionnent selon une approche basée sur les Calques, ce qui signifie que vous pouvez contrôler l'apparence d'un objet en créant ou en modifiant des Calques sur une pile verticale. Cette approche est différente de celle des éditeurs 3D traditionnels, mais elle s'apparente au fonctionnement de la plupart des outils de conception graphique.
Les Calques par défaut des Matériaux
Calque de Propriétés
Tous les Calques de Matériaux sont différents, mais ils partagent tous les paramètres d'Opacité et de Mélange.
les objets matériaux
Vous pouvez enregistrer une combinaison de Calques de Matériaux en les convertissant en un Objet Matériau que vous pouvez rapidement appliquer à plusieurs objets.
Si des modifications sont apportées à l'Objet Matériau, tous les objets qui l'utilisent sont mis à jour avec ces changements.
Si des modifications sont apportées à l'Objet Matériau, tous les objets qui l'utilisent sont mis à jour avec ces changements.
Lorsqu'aucun objet n'est sélectionné, vous pouvez trouver une liste de tous les Objets Matériau créés sur chaque scène.
C'est aussi un moyen rapide de modifier n'importe quel Objet sans avoir à sélectionner un objet.
C'est aussi un moyen rapide de modifier n'importe quel Objet sans avoir à sélectionner un objet.
calque de couleur
Le Calque de Couleur est très simple. Vous pouvez choisir une couleur à partir de la teinte ou modifier l'opacité/alpha.
calque d'éclairage
Le Calque d'éclairage vous permet de choisir parmi 4 types d'éclairages différents pour vos objets :
Lambert : Mat, sans reflets brillants (Béton, Sable).
Phong : Ajoute une réflexion spéculaire (Plastique, Peau).
Physical : Similaire à Phong, mais avec plus de contrôles (Métal, Céramique).
Toon : Effet cartoon (aspect non photoréaliste).
Lambert : Mat, sans reflets brillants (Béton, Sable).
Phong : Ajoute une réflexion spéculaire (Plastique, Peau).
Physical : Similaire à Phong, mais avec plus de contrôles (Métal, Céramique).
Toon : Effet cartoon (aspect non photoréaliste).
calque de texture
Le Calque de Texture vous permet d'ajouter des textures (images) à vos objets.
Vous pouvez soit télécharger une image personnalisée, soit en sélectionner une dans la palette des textures.
Vous pouvez soit télécharger une image personnalisée, soit en sélectionner une dans la palette des textures.
calque de bruit
Le Calque de Bruit est idéal pour simuler les changements de couleur organiques des surfaces.
Depuis Spline Alpha II, le Calque de Bruit est maintenant en 3D, ce qui signifie qu'il n'y a plus de coutures visibles (points de connexion dans la surface).
Depuis Spline Alpha II, le Calque de Bruit est maintenant en 3D, ce qui signifie qu'il n'y a plus de coutures visibles (points de connexion dans la surface).
calque de normale
En géométrie 3D, les Normales définissent l'orientation de chacun des triangles qui forment une forme.
Les couleurs proviennent du mélange des canaux Y (vert), X (rouge) et Z (bleu). Vous pouvez jouer avec les différents canaux et modes de mélange pour ajouter des changements de tonalité de couleur basés sur la direction à vos modèles 3D.
Les couleurs proviennent du mélange des canaux Y (vert), X (rouge) et Z (bleu). Vous pouvez jouer avec les différents canaux et modes de mélange pour ajouter des changements de tonalité de couleur basés sur la direction à vos modèles 3D.
calque de fresnel
💡 Le Calque de Fresnel simule la façon dont nous percevons les réflexions sur les surfaces en fonction de l'angle de la lumière.
Le Calque de Fresnel montre une couleur qui s'estompe au fur et à mesure qu'elle se rapproche d'une parallèle à l'angle de la caméra (qui dans la vie réelle peut être l'œil).
Cet effet est pratique pour reproduire des surfaces brillantes ou métalliques.
Le Calque de Fresnel montre une couleur qui s'estompe au fur et à mesure qu'elle se rapproche d'une parallèle à l'angle de la caméra (qui dans la vie réelle peut être l'œil).
Cet effet est pratique pour reproduire des surfaces brillantes ou métalliques.
calque de déplacement
Le Calque de Déplacement déforme la géométrie de l'objet (généralement appelé déplacement).
Vous pouvez choisir d'utiliser une carte (texture) ou un bruit (similaire au fonctionnement du Calque Bruit, mais il ne déforme que la géométrie).
Vous pouvez choisir d'utiliser une carte (texture) ou un bruit (similaire au fonctionnement du Calque Bruit, mais il ne déforme que la géométrie).
calque de matcap
Le Calque MatCap (Material Capture) fonctionne en projetant une texture sur la géométrie. Ceci est utile pour générer des surfaces de matériaux complexes.
calque de verre
💡 Éclairage
Utiliser les lumières
Dans Spline, vous pouvez créer différents types de lumières pour générer différents types d'éclairage pour votre scène.
Pour créer une lumière, appuyez sur l'icône "+" de la barre d'outils et choisissez l'une des lumières suivantes :
Propriétés des lumières
Chaque lumière contient des propriétés partagées et uniques.
Pour créer une lumière, appuyez sur l'icône "+" de la barre d'outils et choisissez l'une des lumières suivantes :
- Lumière directionnelle
- Lumière ponctuelle
- Lumière Spot
Propriétés des lumières
Chaque lumière contient des propriétés partagées et uniques.
Éclairage par défaut (environnement)
Par défaut, toute nouvelle scène dans Spline comprend déjà une lumière directionnelle et une lumière ambiante qui définissent l'éclairage par défaut de tout objet.
Bien que cela fonctionne assez bien pour les scènes de base, il se peut que vous souhaitiez désactiver ou ajuster ces paramètres en fonction de vos objectifs visuels pour votre scène.
Par défaut, toute nouvelle scène dans Spline comprend déjà une lumière directionnelle et une lumière ambiante qui définissent l'éclairage par défaut de tout objet.
Bien que cela fonctionne assez bien pour les scènes de base, il se peut que vous souhaitiez désactiver ou ajuster ces paramètres en fonction de vos objectifs visuels pour votre scène.
lumière directionnelle
Les lumières directionnelles sont idéales pour simuler l'éclairage du soleil ou dans les scènes ouvertes.
Comment cela fonctionne-t-il ?
Les feux directionnels sont basés sur l'angle directionnel entre la position du feu et l'origine du système de coordonnées. La ligne tracée entre ces deux points définit la direction.
Les feux directionnels sont basés sur l'angle directionnel entre la position du feu et l'origine du système de coordonnées. La ligne tracée entre ces deux points définit la direction.
lumière ponctuelle
Lumière ponctuelle
Les lumières ponctuelles - comme leur nom l'indique - émettent de la lumière à partir d'un point dans l'espace et s'estompent avec la distance. Ces lumières peuvent être utiles pour représenter l'émission de lumière d'une grande variété de lumières dans le monde, comme les lampes de maison, les feux de circulation, les feux de voiture, et plus encore.
Les lumières ponctuelles - comme leur nom l'indique - émettent de la lumière à partir d'un point dans l'espace et s'estompent avec la distance. Ces lumières peuvent être utiles pour représenter l'émission de lumière d'une grande variété de lumières dans le monde, comme les lampes de maison, les feux de circulation, les feux de voiture, et plus encore.
spot de lumière
Spot lumineux
Les spots sont des lumières de forme conique qui sont généralement idéales pour simuler l'éclairage artificiel d'objets tels que les lampes ou les lampadaires
Les spots sont des lumières de forme conique qui sont généralement idéales pour simuler l'éclairage artificiel d'objets tels que les lampes ou les lampadaires
Comment fonctionne le spot lumineux ?
Tout comme la lumière directionnelle, la lumière ponctuelle fonctionne selon l'angle directionnel de la lumière.
Tout comme la lumière directionnelle, la lumière ponctuelle fonctionne selon l'angle directionnel de la lumière.
📸 Caméras
Travailler avec les caméras
Les commandes de caméra de Spline se trouvent en bas au centre de la fenêtre d'affichage.
Pour naviguer entre les vues, il suffit d'appuyer sur les points d'axe.
Pour naviguer entre les vues, il suffit d'appuyer sur les points d'axe.
En survolant l'assistant de vue, deux options supplémentaires s'offrent à vous. Réinitialisez rapidement la vue de votre scène ou passez à une vue isométrique.
Sous l'assistant de vue, vous pouvez choisir entre deux vues de caméra différentes.
Orthographique et Perspective.
Orthographique : Tous les angles sont parallèles.
Perspective : Tous les angles changent en fonction de la distance entre la caméra et l'objet.
Voici une vidéo utilisant l'assistant de vue pour changer rapidement de vue et passer de la vue orthographique à la vue en perspective. (Raccourci M).
Orthographique et Perspective.
Orthographique : Tous les angles sont parallèles.
Perspective : Tous les angles changent en fonction de la distance entre la caméra et l'objet.
Voici une vidéo utilisant l'assistant de vue pour changer rapidement de vue et passer de la vue orthographique à la vue en perspective. (Raccourci M).
La valeur du zoom se trouve dans la barre d'outils. En appuyant dessus, vous trouverez les options de zoom.
Paramètres des caméras
Comprendre les différents paramètres de la caméra vous permettra de simuler différents effets visuels pour vos scènes. Les caméras, après tout, sont la façon dont vous voyez les objets dans l'espace virtuel.
Effets de post-traitement
Le post-traitement permet d'obtenir des effets 2D globaux sur l'ensemble de votre scène.
Par défaut, le post-traitement est désactivé. Vous pouvez l'activer en appuyant sur le bouton à bascule du panneau Post-Traitement.
Par défaut, le post-traitement est désactivé. Vous pouvez l'activer en appuyant sur le bouton à bascule du panneau Post-Traitement.
Par défaut, tous les effets de post-traitement sont masqués et peuvent être activés/désactivés en appuyant sur l'icône représentant un œil. Pour modifier les paramètres de chaque effet, appuyez sur l'icône de la roue dentée.
Pour l'instant, Spline dispose des effets de post-traitement suivants :
- Pixelation
- Aberration
- Bloom
- Teinte
- Luminosité
- Vignette
- Bruit
Travailler avec le brouillard
Ajouter du brouillard à votre scène est un excellent moyen de créer de la profondeur.
Pour commencer, assurez-vous qu'aucun objet n'est sélectionné en appuyant n'importe où dans la fenêtre d'affichage.
Ensuite, allez dans le panneau Fog dans la barre latérale droite, développez-le et activez-le.
Pour commencer, assurez-vous qu'aucun objet n'est sélectionné en appuyant n'importe où dans la fenêtre d'affichage.
Ensuite, allez dans le panneau Fog dans la barre latérale droite, développez-le et activez-le.
Utiliser la même couleur que l'arrière-plan est le meilleur moyen d'obtenir l'effet d'un véritable brouillard.
Il est également possible de changer la couleur pour une plus grande liberté de création.
Il est également possible de changer la couleur pour une plus grande liberté de création.
Les valeurs Near et Far (proche, loin) sont utilisées pour modifier la profondeur du brouillard. Plus elles sont proches l'une de l'autre, plus la transition vers le brouillard est épaisse.
🧶 Intégrations
Intégration avec notion
- Ouvrez votre scène et appuyez sur le bouton Export de la barre d'outils.
- Sélectionnez "Public URL" dans la liste déroulante Type et copiez l'URL publique générée.
- Allez sur votre page Notion et tapez "/", puis choisissez "Embed".
- Collez l'URL publique dans l'entrée qui apparaît
|
Maintenant, vous verrez quelque chose comme ceci (Cliquez et faites glisser !)
Zoom à la molette etc...
|
intégration avec webflow
💡 Vous pouvez "verrouiller" votre scène de l'interaction comme Rotation, Pan et Zoom avant l'exportation en sélectionnant "Non" pour toutes ces options.
L'intégration de votre scène dans Webflow est très simple.
L'intégration de votre scène dans Webflow est très simple.
- Avant d'exporter, assurez-vous de composer votre scène comme vous voulez qu'elle ait l'air quand elle se charge. Utilisez le Mode Cadre et les guides de cadre pour vous aider à composer votre scène.
- Cliquez sur Export dans la barre d'outils, sélectionnez "Public URL" dans la liste déroulante Type et cliquez sur Export.
- Copiez le lien "Embed" qui commence par un iframe. Cela ressemble à ceci 👇
- Dans Webflow, cliquez sur l'icône "+" en haut à gauche pour ajouter un composant embarqué. Il suffit de faire glisser et de déposer le composant embarqué dans votre conteneur. Le conteneur sera probablement un div.
- Collez le code iframe dans l'éditeur de code HTML embarqué de Webflow qui s'est affiché et enregistrez.
- Modifiez la largeur et la hauteur de votre conteneur pour afficher votre scène à la taille souhaitée.
- Publiez votre site Web pour voir votre scène en direct et jouer avec elle.
🥳 Faits amusants
Les objets lapin et théière
jets lapin et théière
🐇 Lapin de Stanford
Source : Wikipedia
Le lapin de Stanford est un modèle de test d'infographie en 3D développé par Greg Turk et Marc Levoy en 1994 à l'université de Stanford.
Le modèle est constitué de 69 451 triangles, les données étant déterminées par le balayage 3D d'une figurine en céramique représentant un lapin. Cette figurine et d'autres ont été scannées pour tester les méthodes de numérisation à distance d'objets physiques.
Les données peuvent être utilisées pour tester divers algorithmes graphiques, notamment la simplification polygonale, la compression et le lissage des surfaces.
🐇 Lapin de Stanford
Source : Wikipedia
Le lapin de Stanford est un modèle de test d'infographie en 3D développé par Greg Turk et Marc Levoy en 1994 à l'université de Stanford.
Le modèle est constitué de 69 451 triangles, les données étant déterminées par le balayage 3D d'une figurine en céramique représentant un lapin. Cette figurine et d'autres ont été scannées pour tester les méthodes de numérisation à distance d'objets physiques.
Les données peuvent être utilisées pour tester divers algorithmes graphiques, notamment la simplification polygonale, la compression et le lissage des surfaces.
|
Désolé il n'a laissé que la carotte!
Clic & Bouge, Zoom à la molette etc... |
Théière de l'Utah
Source : Wikipedia
La théière de l'Utah, ou théière de Newell, est un modèle de test 3D qui est devenu un objet de référence standard et une plaisanterie au sein de la communauté de l'infographie.
L'utilisation d'un modèle de théière est considérée comme l'équivalent 3D d'un programme "Hello, World !", un moyen de créer une scène 3D facile avec un modèle quelque peu complexe servant de géométrie de base pour une scène avec une configuration de lumière.
Le modèle de théière a été créé en 1975 par Martin Newell, un des premiers chercheurs en infographie, membre du programme graphique pionnier de l'université de l'Utah. C'était l'un des premiers modèles (utilisant des courbes de bézier) plutôt que des mesures précises.
Source : Wikipedia
La théière de l'Utah, ou théière de Newell, est un modèle de test 3D qui est devenu un objet de référence standard et une plaisanterie au sein de la communauté de l'infographie.
L'utilisation d'un modèle de théière est considérée comme l'équivalent 3D d'un programme "Hello, World !", un moyen de créer une scène 3D facile avec un modèle quelque peu complexe servant de géométrie de base pour une scène avec une configuration de lumière.
Le modèle de théière a été créé en 1975 par Martin Newell, un des premiers chercheurs en infographie, membre du programme graphique pionnier de l'université de l'Utah. C'était l'un des premiers modèles (utilisant des courbes de bézier) plutôt que des mesures précises.
|
Désolé il ne reste que les gâteaux!
Clic & Bouger, Zoom à la molette etc... |