Interactive site characters?

[VelvetSoul]

I believe this topic has been discussed somewhere on this site previously, though I am unable to find it at this time (and not for lack of trying.) To put it plainly I was searching for a way to run a sort of interactive character on a website. In the sense that they would have a portrait alongside a text box that would display their dialogue and offer the "player" various input. Essentially giving them various paths of dialogue based on their selected topics and such.

I believe this could easily be achieved by simply having a multi-paged website in which each option is a clickable link that simply leads to a new page that looks identical with different dialogue and text choices. However I'm thinking about whether or not such a system would be able to run independent of the page so to speak.

This is essentially a multi-question post. The first major question would be what the easiest possible route to achieve such a dialogue system would be. Essentially creating a website that functions similarly to a visual novel where the player could speak to a character on various topics or even multiple characters. I assume this could be done via multiple pages with each page being slightly different from the last, if I were to go this route I was curious about what kind of templates I would use or what HTML I might use to display a character alongside a text box. The second question would be, rather than having this system run across multiple pages, is it possible to simply have a system embedded in a website that would simply change "states" or such, when interacted with in specific ways?

I'm basically looking to add NPCs to a website that the "player" of the site would be able to interact with via select key words or selecting various dialogue options. Ideally this system would operate while the individual was able to explore the site independently, though if such a system is not possible that's fine.

[Corrupted Unicorn]

I'm VERY interested in this topic  at first I was not going to reply since I thought I had nothing to add  , but then I thought, "wait, aren't you doing some sort of dialogue system for your site mascot?" and while this is still something I'm working behind the scenes, I'll be glad to share my two cents with you.

You asked for the easiest possible route. I see your multiple pages approach and I raise you: spoiler tags (aka the <summary> tag)



(excuse the rainbow checkers, I wanted to replace it for something more readable)

You can tell from my site that I'm a BIG fan of <summary> tags. Basically, I put the question/dialogue option on the summary, and the answer on details.



I also made these little animated pixel sprites since I am using two characters, as to distinguish which is the one talking. There's also several versions with different expressions, although I would also encourage you to distinguish multiple characters' "voices" via the font &/or colour of their text

My vision for my site was to be able to "encounter" the option to "talk" with several characters as you browsed, placed in pages related to them, and for them to talk a bit about the page's purpose and themselves. This would take the form of its own (customized according to the character) page, so perhaps it doesn't quite match your idea to allow the user to explore the site on their own as they interact with the character.

But hey, you asked for the easiest approach, and that's something my code clumsiness CAN do!! 

[wygolvillage]

Twine would be great for this kind of thing, or buttons that overwrite the innerHTML of the textbox via some javascript. There are definitely options!