diff --git a/src/components/IntroductionTour.tsx b/src/components/IntroductionTour.tsx index 2961e74..408f250 100644 --- a/src/components/IntroductionTour.tsx +++ b/src/components/IntroductionTour.tsx @@ -42,8 +42,8 @@ const STEPS: TourStepFactory[] = [ (() => ({ content: <> Welcome to Vestige, an interactive generative music synthesizer! With Vestige, - you can create autonomous music compositions from basic building blocks. Let's - get started! + you can create autonomous music compositions by connecting basic building blocks. + Let's get started! })), @@ -59,7 +59,7 @@ const STEPS: TourStepFactory[] = [ initialPos = data.flowState.getViewport(); }, continueWhen(data) { - return distanceSqr(initialPos, data.viewport) > sqr(400); + return distanceSqr(initialPos, data.viewport) > sqr(300); }, } }), @@ -76,9 +76,10 @@ const STEPS: TourStepFactory[] = [ (() => ({ content: <> - This node is a note generator node. Think of it as a keyboard. + This is a note generator node. Think of it as a keyboard. You can move it around - try it! We now have to feed the nodes to an - instrument - try creating a synth node. + instrument. Just like you did with the melody (pentatonic) node, + now try creating a synth node by right-clicking. , continueWhen(data) { return data.nodes.some(x => x.type == "synth") @@ -89,8 +90,9 @@ const STEPS: TourStepFactory[] = [ content: <> Nice! Now, connect the main output of the melody (pentatonic) node with the main input of the synth node. You can do this by - clicking on the green circle of the melody node, and dragging it to the - green circle of the synth one. + clicking on the green circle of the melody node, + and dragging it to the green circle of + the synth one. , continueWhen(data) { return data.edges.some(x => { @@ -104,9 +106,9 @@ const STEPS: TourStepFactory[] = [ (() => ({ content: <> - Great! We don't hear anything yet - connect the main output of - the synth to the final output node. Anything that comes - inside this node will be played through your speakers. + Great! We don't hear anything yet - connect the blue main output of + the synth to the blue main input of the final output node. + Anything that comes inside this node will be played through your speakers. , continueWhen(data) { return data.edges.some(x => { @@ -118,6 +120,13 @@ const STEPS: TourStepFactory[] = [ } })), + (() => ({ + content: <> + Adjust your volume in the final output node to your liking, and + then click Next to continue. + + })), + (() => ({ content: <> You've successfully created your first Vestige composition! It's quite