Exemples de projets et de cas d'emploi > Cas d'utilisation : 3D-Guided Service Instructions > 3D-Guided Service Instructions 201 - Utilisation de JavaScript pour mettre en surbrillance des pièces et créer des fenêtres contextuelles Ionic > Création d'un nouveau projet
  
Création d'un nouveau projet
1. Ouvrez Vuforia Studio.
2. Si vous ne l'avez pas déjà fait, cliquez sur dans l'angle supérieur droit de l'écran. Sélectionnez Paramètres et saisissez votre URL Experience Service dans le champ URL Experience Service par défaut. Cliquez sur Terminé.
3. Créez un nouveau projet et sélectionnez le type de modèle Mobile - Par défaut.
4. Dans la fenêtre Nouveau projet, saisissez 3D-Guided Service Instructions 200 dans le champ Nom de projet, puis confirmez que l'URL Experience Service correcte est utilisée.
* 
Ce projet sera utilisé pour les deux tutoriels 3D-Guided Service Instructions 201 et 3D-Guided Service Instructions 202.
5. Faites glisser et déposez une Cible spatiale sur le canevas 3D. Définissez les propriétés Coordonnée X et Coordonnée Z sur 0.
6. Faites glisser et déposez un widget Modèle sur le canevas. Définissez les propriétés Coordonnée X et Coordonnée Z sur 0 pour que le widget du modèle soit aligné à la cible spatiale. Cette étape est importante, car un modèle mal aligné peut causer des problèmes lorsqu'il affiché en tant qu'expérience de réalité augmentée.
7. Sous PROPRIETES du widget Modèle, sélectionnez Ressource + pour ajouter un modèle au widget. Recherchez le fichier quadcopter.pvz créé dans "3D-Guided Service Instructions 101" et sélectionnez-le. Cochez la case Autoriser l'expérience à accéder aux métadonnées CAO. Cette opération permet de conserver les attributs de métadonnées associés au modèle lors du processus d'importation. Ne décochez pas la case Exécuter l'optimiseur CAO car cela supprimerait ses attributs sous-jacents. Cliquez sur Ajouter.
8. Le modèle de quadrirotor est désormais visible sur le canevas. Remplacez la valeur de la propriété ID Studio par quadcopter.
9. Faites glisser et déposez un widget Image 3D sur le canevas. Apportez les mises à jour suivantes aux propriétés du widget :
a. Texte : saisissez Appuyez sur les pièces pour en savoir plus
b. Couleur de police : définissez-la sur blanc
c. Couleur de contour de police : définissez-la sur noir
d. Coordonnée X : définissez-la sur 0
e. Coordonnée Y : définissez-la sur 0.45
f. Coordonnée Z : définissez-la sur -0.165
g. Rotation X : définissez-la sur 0
h. Rotation Y : définissez-la sur -90
i. Panneau d'affichage
: assurez-vous que la case est cochée
j. ID Studio
: saisissez Instructions
10. Ensuite, vous allez créer une fonction de module d'écoute d'événement userpick pour qu'une fenêtre contextuelle Ionic s'affiche lorsqu'une pièce du quadrirotor est sélectionnée.