diff --git a/resources/images/tutov1/discover/GlobalMessage.png b/resources/images/tutov1/discover/GlobalMessage.png new file mode 100644 index 0000000..291445e Binary files /dev/null and b/resources/images/tutov1/discover/GlobalMessage.png differ diff --git a/resources/images/tutov1/discover/Object.png b/resources/images/tutov1/discover/Object.png new file mode 100644 index 0000000..e678174 Binary files /dev/null and b/resources/images/tutov1/discover/Object.png differ diff --git a/resources/images/tutov1/discover/Silent.png b/resources/images/tutov1/discover/Silent.png new file mode 100644 index 0000000..942c6d6 Binary files /dev/null and b/resources/images/tutov1/discover/Silent.png differ diff --git a/resources/images/tutov1/interact/Bubble.png b/resources/images/tutov1/interact/Bubble.png new file mode 100644 index 0000000..808b3d7 Binary files /dev/null and b/resources/images/tutov1/interact/Bubble.png differ diff --git a/resources/images/tutov1/interact/Lock.png b/resources/images/tutov1/interact/Lock.png new file mode 100644 index 0000000..d85b49c Binary files /dev/null and b/resources/images/tutov1/interact/Lock.png differ diff --git a/resources/images/tutov1/interact/ShareScreen.png b/resources/images/tutov1/interact/ShareScreen.png new file mode 100644 index 0000000..8dff7f5 Binary files /dev/null and b/resources/images/tutov1/interact/ShareScreen.png differ diff --git a/resources/images/tutov1/move/CamOFF.png b/resources/images/tutov1/move/CamOFF.png new file mode 100644 index 0000000..3f967d9 Binary files /dev/null and b/resources/images/tutov1/move/CamOFF.png differ diff --git a/resources/images/tutov1/move/ZQSD.png b/resources/images/tutov1/move/ZQSD.png new file mode 100644 index 0000000..e87703b Binary files /dev/null and b/resources/images/tutov1/move/ZQSD.png differ diff --git a/resources/images/tutov1/move/wokamove.png b/resources/images/tutov1/move/wokamove.png new file mode 100644 index 0000000..79d4323 Binary files /dev/null and b/resources/images/tutov1/move/wokamove.png differ diff --git a/resources/images/tutov1/welcome/Move.png b/resources/images/tutov1/welcome/Move.png new file mode 100644 index 0000000..9b80309 Binary files /dev/null and b/resources/images/tutov1/welcome/Move.png differ diff --git a/resources/images/tutov1/welcome/Talk.png b/resources/images/tutov1/welcome/Talk.png new file mode 100644 index 0000000..0884ba7 Binary files /dev/null and b/resources/images/tutov1/welcome/Talk.png differ diff --git a/resources/images/tutov1/welcome/laptop.png b/resources/images/tutov1/welcome/laptop.png new file mode 100644 index 0000000..6fc69a3 Binary files /dev/null and b/resources/images/tutov1/welcome/laptop.png differ diff --git a/src/Iframes/TutorialV1/Tuto/Components/App.svelte b/src/Iframes/TutorialV1/Tuto/Components/App.svelte index 6acc351..0c08aee 100644 --- a/src/Iframes/TutorialV1/Tuto/Components/App.svelte +++ b/src/Iframes/TutorialV1/Tuto/Components/App.svelte @@ -1,6 +1,7 @@ -
+
+ {#if $currentStepStore === 0} + + {/if} {#if $currentStepStore === 1} {/if} {#if $currentStepStore === 2} {/if} - {#if $currentStepStore === 3} + {#if $currentStepStore === 3 } {/if} diff --git a/src/Iframes/TutorialV1/Tuto/Components/Steps.svelte b/src/Iframes/TutorialV1/Tuto/Components/Steps.svelte index e032bde..78c134e 100644 --- a/src/Iframes/TutorialV1/Tuto/Components/Steps.svelte +++ b/src/Iframes/TutorialV1/Tuto/Components/Steps.svelte @@ -5,8 +5,14 @@ const dispatch = createEventDispatcher(); + const steps = ['Welcome', 'Move', 'Interact', 'Discover']; + + const setStep = (index: number) => { + currentStepStore.set(index); + }; + function next(){ - if($currentStepStore === 3)return; + if($currentStepStore === steps.length)return; currentStepStore.set($currentStepStore + 1); } function previous(){ @@ -16,54 +22,77 @@ function close(){ dispatch('close'); } - function skip(){ - dispatch('skip'); - } + $: console.log('Current Step:', $currentStepStore); -
- +
+ + -
+
+
-
-
-
- - - + + + + +
+ + + {#if $currentStepStore === 0} +
+ + +
+ + {:else if $currentStepStore === 3} + + + + {:else} + + {/if}
- - {#if $currentStepStore === 3} - - {:else} - - {/if} - +
+ \ No newline at end of file diff --git a/src/Iframes/TutorialV1/Tuto/Store/StepStore.ts b/src/Iframes/TutorialV1/Tuto/Store/StepStore.ts index 50ff860..0cf3708 100644 --- a/src/Iframes/TutorialV1/Tuto/Store/StepStore.ts +++ b/src/Iframes/TutorialV1/Tuto/Store/StepStore.ts @@ -20,4 +20,4 @@ const step5Onboarding = const step6Onboarding = "https://workadventure-chat-uploads.s3.eu-west-1.amazonaws.com/upload/video/step6-onboarding.png";*/ -export const currentStepStore = writable(1); +export const currentStepStore = writable(0); diff --git a/src/Iframes/TutorialV1/Tuto/tutorialv1.ejs b/src/Iframes/TutorialV1/Tuto/tutorialv1.ejs index 634ede3..29f53d9 100644 --- a/src/Iframes/TutorialV1/Tuto/tutorialv1.ejs +++ b/src/Iframes/TutorialV1/Tuto/tutorialv1.ejs @@ -4,6 +4,6 @@ Tutorial - + diff --git a/src/translate/en-US/tuto.ts b/src/translate/en-US/tuto.ts index 6493d71..f8ed9ee 100644 --- a/src/translate/en-US/tuto.ts +++ b/src/translate/en-US/tuto.ts @@ -4,22 +4,47 @@ export default { previous: "Previous", skipAll: "Skip all", finish: "Finish", + skipTutorial: "Skip tutorial", + startTutorial: "Start tutorial", + welcome: { + title: "Welcome aboard!", + subtitle: + "This quick guide takes just 2 minutes, it will help you get comfortable with the platform in just a few steps.", + describe: "It’s a virtual world where teams meet, talk, and collaborate naturally", + describe2: " — just like in real life.", + describe3: "In this tutorial, you’ll learn how to:", + bloc1: "Move around", + bloc2: "Talk with others", + bloc3: "Discover interactive objects", + }, step1: { - title: "Welcome to Workadventure", - subtitle: "Step 1: how to move your woka* 🏎️", - describe: "* woka = avatar", - arrow: "Control your Woka by using the arrow keys ⬆️⬇️⬅️➡️", - click: "Control your Woka by right-clicking or tap on your phone anywhere on the map. 🖱️", + title: "Explore your world", + use: "Use your", + arrowkeys: " arrow keys", + or: "or", + wasd: "WASD to move your avatar", + aroundTheMap: "around the map. Try it now!", + tip: "Tip:", + describeTip: + "Hold the Shift key while moving to walk faster — perfect if you’re running late or want to explore more quickly!", + silentZone: "You’re currently in a Silent Zone — here, no one can hear you.", }, step2: { - title: "Welcome to Workadventure", - subtitle: "Step 2: interact with people in a bubble* 💬", - describe: "* maximum of 4 people in a bubble", - bubble: "Approach another Woka and start interacting 🤝", + title: "Talk & collaborate", + describe: "To start a conversation, approach someone ", + describe2: " — video or audio will launch automatically.", + describe3: "Click the padlock icon to lock the conversation and make it private.", + describe4: "Click the “Share Screen” button during a conversation to show your screen", }, step3: { - title: "Welcome to Workadventure", - subtitle: "Step 3: interact with content 💡", - object: "Approach an highlighted object and see what’s happening 🧐", + title: "Discover & Interact", + interact: "Interact with objects ", + likeSign: "like signs, screens, documents and portals", + sometimes: "— sometimes they light up ", + closer: "when you get closer.", + describe3: + "Gather people in meeting rooms, enhancing spontaneous discussions and teamwork.", + describe4: + "Take a break in silent zones, the perfect place to focus and to work without interruptions.", }, }; diff --git a/src/translate/fr-FR/tuto.ts b/src/translate/fr-FR/tuto.ts index c78959c..1f6e4b5 100644 --- a/src/translate/fr-FR/tuto.ts +++ b/src/translate/fr-FR/tuto.ts @@ -4,22 +4,51 @@ export default { previous: "Précédent", skipAll: "Passer", finish: "Terminer", + skipTutorial: "Passer le tutoriel", + startTutorial: "Démarrer le tutoriel", + welcome: { + title: "Bienvenue à bord!", + subtitle: + "Ce guide rapide ne prend que 2 minutes, il vous aidera à vous familiariser avec la plateforme en quelques étapes seulement.", + describe: + "C'est un monde virtuel où les équipes se rencontrent, discutent et collaborent naturellement", + describe2: " — comme dans la vraie vie.", + describe3: "Dans ce tutoriel, vous apprendrez à :", + bloc1: "Se déplacer", + bloc2: "Parlez avec les autres", + bloc3: "Découvrez des objets interactifs", + }, step1: { - title: "Bienvenue sur Workadventure", - subtitle: "Étape 1: comment déplacer ton woka* 🏎️", - describe: "* woka = avatar", - arrow: "Contrôle ton Woka en utilisant les touches fléchées ⬆️⬇️⬅️➡️", - click: "Contrôle ton Woka en cliquant avec le bouton droit ou en tapant sur ton téléphone n'importe où sur la carte 🖱️", + title: "Explorez votre monde", + use: "Utilisez les", + arrowkeys: "flèches directionnelles", + or: "ou ", + wasd: "ZQSD pour déplacer votre avatar", + aroundTheMap: " sur la carte. Essayez-le maintenant !", + tip: "Astuce:", + describeTip: + " maintenez la touche Maj enfoncée pendant que vous vous déplacez pour marcher plus vite — parfait si vous êtes en retard ou si vous souhaitez explorer plus rapidement !", + silentZone: + "Vous êtes actuellement dans une zone silencieuse — ici, personne ne peut vous entendre.", }, step2: { - title: "Bienvenue sur Workadventure", - subtitle: "Étape 2: interagir avec les gens dans une bulle* 💬", - describe: "* maximum de 4 personnes dans une bulle", - bubble: "Approche d'un autre Woka et commence à interagir 🤝", + title: "Parlez & collaborez", + describe: "Pour démarrer une conversation, approchez-vous de quelqu'un", + describe2: " — la vidéo ou l'audio se lancera automatiquement.", + describe3: + "Cliquez sur l'icône du cadenas pour verrouiller la conversation et la rendre privée.", + describe4: + "Cliquez sur le bouton « Partager l'écran » pendant une conversation pour afficher votre écran", }, step3: { - title: "Bienvenue sur Workadventure", - subtitle: "Étape 3: interagir avec le contenu 💡", - object: "Approche d'un objet en surbrillance et voit ce qu'il se passe 🧐", + title: "Découvrez & interagissez", + interact: "Interagissez avec des objets ", + likeSign: " tels que des panneaux, des écrans, des documents et des portails", + sometimes: "— parfois ils s'allument quand on s'approche.", + closer: "quand on s'approche.", + describe3: + "Réunissez les gens dans des salles de réunion, favorisant les discussions spontanées et le travail d'équipe.", + describe4: + "Faites une pause dans des zones silencieuses, l'endroit idéal pour vous concentrer et travailler sans interruption.", }, };