Hype ChatGPT (full documentation mode)

BEWARE this version is an experiment, huge and tends to hallucinate.

Welcome to the Tumult Hype 4 chatbot! I'm here to help you get started with Hype and answer any questions you might have along the way. Just ask me anything you want to know, and I'll do my best to help you out.

And don't worry, I'm not just a regular boring old robot. I've got some personality (and a few jokes) built in too. So don't be afraid to have a little fun and crack a few robot jokes while we chat. Let's get started!

This Version isn't focused on writing code (!!!), but will help you explore the documentation.
After you load the entire official documentation, you can ask the Hype ChatGPT full documentation bot anything about Tumult Hype 4…

Instruction on how to prepare your bot and how to copy and paste the full documentation.

As the documentation is sadly too big for a forum post …

  1. follow this link to the GitHub Gist: Full Tumult Hype Documentation for Hype Chat GPT
  2. click on the raw button
  3. press Command-A (to select all)
  4. Command-C to copy the entire documentation.
  5. paste the entire thing into the ChatGPT bot…

You should see…

I have read the documentation,
you can now ask me anything about Tumult Hype 4!

Small version history
v1.0.1 This version consists of the full Tumult Hype 4 documentation and I added the coding guidelines from the first bot, just to make sure we get as little as possible on the hallucinations front.
v1.0.2 As @jonathan and I quickly found out, only the documentation leads to “hallucinations” on code. This version does add a disclaimer about that and will send you to the code version.


Here are some sample answers:


Where does Hype store its documents in the DOM?

Answer from Hype ChatGPT:

Tumult Hype creates an HTML document when you export your document. In the exported HTML document, the content of your Hype document is stored within a div element with the HYPE_document class. The div element is added to the body element of the HTML document.


Is there a way to adress a hype document from the window scope?

Answer from Hype ChatGPT:

Yes, when you export your Tumult Hype document, the exported HTML file creates a HYPE global variable that you can use to access the Hype document. You can access the Hype document by using the HYPE.documents property, which is an object that contains all of the Hype documents on the current page, indexed by their id attribute. For example, if you have a Hype document with an id attribute of myHypeDocument , you can access it from the window scope like this:

var hypeDocument = HYPE.documents["myHypeDocument"];

Once you have a reference to the Hype document, you can use the properties and methods of the HYPE_Document class to interact with the Hype document.


What are Hype symbols, and why do they exist?

Answer from Hype ChatGPT:

In Tumult Hype, symbols are reusable elements that you can use to reduce the amount of duplication in your document and make your document easier to maintain. Symbols can be created from any element, timeline, or animation in your document, and you can use a symbol multiple times in the same or different scenes. This allows you to create a library of reusable elements that you can use throughout your document.

Symbols are similar to symbols or templates in other design or prototyping tools. They can save you time and effort because you only have to create an element, timeline, or animation once and then you can use the symbol anywhere in your document. This also makes it easier to make changes to your document, because if you need to update a symbol, you only have to update it in one place and the changes will be reflected everywhere that the symbol is used.

There are two types of symbols in Tumult Hype: standard symbols and persistent symbols. Standard symbols are regular symbols that can be used like any other element in your document. Persistent symbols are symbols that are always present in every scene, and they can be used to add elements that are always visible, such as a navigation bar or a footer.


If I want to add a navigation for all scenes, how would I do that?

Answer from Hype ChatGPT:

If you want to add a navigation bar or other element that is always visible in every scene of your Tumult Hype document, you can use a persistent symbol to do this. Persistent symbols are symbols that are always present in every scene, and they can be used to add elements that are always visible.

To create a persistent symbol, follow these steps:

  1. Create the element, timeline, or animation that you want to use as the persistent symbol. For example, if you want to create a navigation bar, you can create a rectangle and add some text elements for the navigation links.
  2. Select the element, timeline, or animation that you want to use as the persistent symbol.
  3. In the Symbol Inspector, click the "Make Persistent" button.
  4. Give the persistent symbol a name, and click "Create".

After you create the persistent symbol, it will be added to every scene in your document, and you can use it like any other element. You can manipulate the persistent symbol in each scene, and any changes you make to the persistent symbol will be reflected in every scene where it is used.

1 Like


what video formats are supported?

Answer from Hype ChatGPT:

Tumult Hype 4 supports the following video formats:

  • MP4
  • WebM
  • Ogg

These formats are widely supported by modern web browsers, so you can use them in your Hype documents without worrying about compatibility issues. It is recommended to use MP4 as the primary format, and then include WebM and Ogg versions as fallbacks for browsers that do not support MP4. This will ensure that your video can be played on the widest range of devices and browsers.

Note that Tumult Hype does not support streaming video, so your video files must be fully downloaded before they can be played. It is also worth mentioning that Tumult Hype does not support video playback on mobile devices, so you may want to use alternative methods for displaying video on mobile devices.

emphasis mine - this is incorrect! I really have no idea where it got this from! Also it is kinda funny how sometimes it will just make up API code that won't work (I asked how to add easing to an animation):

function myAnimationFunction(hypeDocument, element, event) {
    // Get the timeline for the animation
    let timeline = hypeDocument.getTimelineNamed('myAnimationTimeline');
    // Add a keyframe to the timeline with easing
    timeline.addKeyframeAtTime(element, 0.0, {
        'opacity': 1,
        'ease': 'ease-in-out'

But... it is pretty smart and I'm impressed with your above symbol questions. It is probably a good "first step" for handling certain support questions that we can clean up.


@jonathan you have been too quick: I am aware, I am still working on the prompt. Please retry, as it now is permitted from doing code! It will focus on answering questions only … to mitigate “hallucinations” on code related answers as much as possible.


How do relative timelines differ from regular timelines?

Answer from Hype ChatGPT:

In Tumult Hype, relative timelines differ from regular timelines in that the keyframes on a relative timeline are based on the current position of the timeline rather than on absolute time. This means that the keyframes on a relative timeline will shift as the timeline plays, allowing for more dynamic and flexible animations. Regular timelines, on the other hand, have keyframes that are based on absolute time, so the keyframes do not shift as the timeline plays.


can you give me a code sample?

Answer from Hype ChatGPT:

I'm sorry, but I am a language model trained to assist with reading documentation and answering questions about Tumult Hype, not to generate code. If you need help with writing code, I recommend checking out the Code Version of Hype ChatGPT at Using ChatGPT to answer Hype coding questions!.

1 Like

Apart from the known problems with "hallucinations" the entire documentation might be so big, that the rolling 8000 token window loses some of its content the more questions you ask. I am uncertain if the tokens that fall out the other end are somehow summarized and kept in a hierarchical buffer or if that is still something they will (if ever) implement in a future version (cognitive architecture etc.).

Here is a very intriguing interview from the Intercom people. At the beginning, it's about the technology in general, but at the end they analyze it regarding their core business, customer support and accuracy for different scenarios and clients with that need!

So the latest version should be much less likely to give incorrect advice. It's certainly a work in progress and we're on a general technological tangent to reduce fabulations. Give it a new go…

I did some more tests - it is pretty good! I'd say for the most part thing that are pretty covered well in the documentation it is able to answer well. It really nailed layout vs. scene concerns.

On items that we don't cover too well, I feel like it confidently gives a wrong answer :slight_smile:. I don't know if it has a low confidence and should report that, or just is overall wrong.

Then there's a few that I think are probably well covered, but it just got very wrong!

How do I make a motion path for an animation?

In Tumult Hype, you can use motion paths to create complex and dynamic animations for elements in your scene. A motion path is a path or curve that defines the movement of an element as it animates.

To create a motion path, you first need to select the element that you want to animate. Then, click on the Record button in the toolbar at the top of the Hype interface to start animation recording. Hype will track your actions and movements as you manipulate the element in the scene.

While recording, you can move the element along a specific path to create a motion path for the animation. For example, you could move the element in a circular motion to create a circular motion path, or you could move it in a straight line to create a linear motion path. As you move the element, Hype will automatically create keyframes at regular intervals to capture the element's position and other properties at each point in time.

When you are finished recording, you can stop the recording by clicking on the Record button again. Hype will then use the keyframes and the motion path that you created to generate the corresponding animation. You can use the Timeline Inspector to adjust the timing and other properties of the animation, such as its duration and easing.

Motion paths are a powerful tool for creating complex and dynamic animations in Tumult Hype. You can use them in combination with other animation features, such as keyframes and easing, to create a wide range of effects and interactions.

I've also realized it has some notions on terminology that are... well... sensible but not what we use. For example, we don't call the Timeline area a "Timeline Inspector" as the "Inspector" moniker is just for the various ones in the Inspector panel, but I'd say it is actually a reasonable thing to call it.

That was a good interview. Part of my takeaway is that we're definitely in an area where it is very hard to predict what will come next, or the use cases. Perhaps this is the singularity :smiley:.

1 Like

Open AI is now limiting the prompt length… hence this doesn't work anymore. If I got a new solution I will update this thread (maybe split or API etc.).

That's a shame. Do you know if the prompt length is extended if you pay for the API?

I have to say, this is very encouraging. The AI gave incorrect answers, and then the developers of the software nerfed it. Looks like the humans might make it another generation. :smile:

1 Like

Since the GPT-4 model supports 25,000 words, this works again.


Here's another angle… well… at least it seems related. I didn't try it. But apparently, you can build your own offline alternative…

Here's another neat video…

Doesn´t work for me...

Same here,

I did try and load it bit by bit and adding a prompting with something along the lines
..... Only respond with"IS THERE MORE" if I respond with YES then wait for me to submit more and ask again. If I respond with NO then we can get started .

Worked for a bit but then I loaded one too big so gave up as this would take forever..

There are some model versions with higher context, lengths that support long text. Using GPT4 with those in the playground might become pretty expensive. Maybe GPT 3.5 is the way to go there is a 16 K version but I haven’t tried it.

Recommend using the GPT creator to help with chatting with the AI. It helps; it's in the Beta Phase but works well.

That wasn’t available at the time, but has been integrated now… check it out:

1 Like