I've recently been studying Vogler's book for writers because it was part of a Uni course I'm currently waiting to finish off with the exam, and in doing so I tried to make my very first code while summarizing it. As I was doing it, however, I thought that not only other users might be studying the same subject, but they might find this template useful for their own stories, or might be curious to see if the ones they've already written fit this too!
So here's my attempt: FTU HTML: Hero's journey
I'm very open to any suggestions about how to better it (both in wording and coding), and a few disclaimers:
First of all, thanks again toronnie for giving me permission to share this, since I mostly copy-pasted from one of their codes! (If someone wants to contribute to better this code, they will be credited too of course!)
Then, I've actually been studying from a translated edition of the original book, so I'm sorry if I made any mistakes with the terms and please let me know! I also suggest using this template as a quick revision way, but also actually buying the Christopher Vogler's book The Writer's Journey: Mythic Structure for Writers if you're interested (it's very heteronormative and binaristic in many points but otherwise I really liked it).
Just as the original book, then, this is not supposed to be a guide! It's just a set of recurring things that happen in fiction and people generally like when they're being told a story, but you can really do anything with it, like skipping parts, flipping them or adding them.
Hope this can be useful! I'd love to see what will come out of this, no pressure though!
EDIT: There's two new versions, one with stable plot text (better for shorter stories) and one with toggle plot text (better for longer stories). Thank youMelodyDrawz for the suggestion!
Stable: main page
Toggle: first tab
Older version: second tab
God I love this esp after my storyboard course! The only suggestion I'd have is that the "show meaning" text doesn't collapse back down if you click on it again.
I might nab the code and use it for writing up my work I've done for my Capstone in a neat and orderly place.
TyrianCallows Thank you really much! I've actually tried to make it collapse back, but failed miserably and gave it up Hope I can find a solution or be suggested one!
COOL!!!
im probably not going to use it tbh but i also read hero's journey and that is a really cool concept!
ZenoOfElea Thank you! I was immediately mindblown when I first read about the theory, considering I had unknowingly used the same scheme in my stories before, and surely knowing it now gives me a little more confidence and skills to tell an original, well though-of story from more basic ones (which mostly just apply the scheme with no variation, or don't subvert it gracefully)!
Oooh that is such a cool way to sort things out!! I like the hero journey concept and this makes everything simple and clean to look at! :D
I have an idea on how to make it better! ^^
In your example, the text blocks were really big and because of that, they were kinda hard to read. It would be cool if that part was also collapsible and/or there were <hr> lines between each section to separate it a bit and allow smaller paragraphs without getting confused about which section you're reading. Maybe the regular words (i.e., Ordinary World, Call to Adventure, Refusal, etc.) could be the toggle?
MelodyDrawz right now the whole section is based around an invisible table so it doesn't let me add an <hr> easily, and I think that's going to look quite empty without the text being visible, but that's a good point! I'll see how to work around it keeping the same structure but getting rid of the tab in favor of <hr> division asap.