Help on how to display element only first time a scene is loaded (for tutorial)

Scenes
1

Hello
I’m working on an app prototype in which tutorial appears on the screen the first time given scenes are loaded. It should of course not appear again next time the scene is loaded.
Any tips about how to do that ?
Thanks for your help !

2

hi,
it depends on your needs.
if the element should only be seen once per session you could store its status in a global var. say
hypeDocument.seen = false or true and play the timeline (?) that shows the element only once …

to save the status longer then the actual session you’ll have to use localStorage or work with logins and serverside handling …

i’m quite sure questions of this sort have been asked and answered already in this forum … as a hint :wink:

2 Likes
3

Hi Hans,
Thanks for the answer.
Yes, it should be seen only once per session. And it doesn’t matter if it doesn’t appear next time the prototype is launched (like in a real app).
OK, so on every page that needs to show a tutorial once, I should at pageLoad call a javascript that checks if ‘seen’ var is true or false. If it is false, then start timeline showing short tutorial overlay and turn var to true ?

I’ve checked the forum but haven’t seen anything like this.

4

quick’n dirty
run a timelineaction at the beginning of the timeline that offers intructions …

if(!hypeDocument[hypeDocument.currentSceneName()]){
hypeDocument.startTimelineNamed(event.timelineName, hypeDocument.kDirectionForward);
hypeDocument[hypeDocument.currentSceneName()] = true;
}

one more edtion … ;_)

you’ll have to start the timeline from the maintimeline and add a stop-timeline-behaviour at the beginning of the targeted timeline …

2 Likes
5

You can also do this with Custom Behaviors.

Add an Hide Timeline on the Scene to hide the elements.

When for instance the ok button is clicked the hide timeline is run.

Add a Custom Behavior to also run the timeline and go to the time in the timeline where the elements ar hidden.

Now on other scenes when you transition back to the first timeline for instance clicking a ‘Prev’ button add a second action to trigger the Custom Behavior.

ShowOnce.hype.zip (20.4 KB)

3 Likes
6

Oh, lovely !
I have to admit that I like the Custom Behavior approach :slight_smile:

1 Like
7

Good solution!

To be honest I’m surprised that works… actions generally don’t get triggered until the transition is complete! (I would expect it would work with an instant transition but not a crossfade…).

As I read through this I thought of another idea, though this shouldn’t take away from @MarkHunte’s approach since it is easier to follow.

My code-less approach would be to use a persistent symbol on the first scene to keep track of state. The advantage is that you don’t need to worry about including anything into your buttons returning to the scene. The disadvantage is you have to think in “reverse” a bit – the default state is your final state and you need to setup the first time view animations separately.

Here’s what you’d do:

  1. Create a persistent symbol. No need to add it to any other scenes than the one that needs to remember its state.
  2. Create a custom behavior called “Initialize” that Continues a timeline (no restart) and make that new timeline
  3. On this timeline add a timeline action that triggers a custom behavior called “Setup”
  4. Exit back to your scene and in the Scene Inspector add a Custom Behavior called “Setup” and have this run a timeline that does whatever initial animations you’d like.
3 Likes
8

I admit I actually momentarily forgot to choose instant when I did it and I took a double take.. when it worked!
As as you say with cross-fades this type of thing does not normally work and you have to use instant..