beekley / standbild

Standbild

Standbild is an open-source tool for making story-driven mystery games.

Installation

1. Install Node.
2. Clone the repository.

   git clone https://github.com/beekley/standbild.git
   cd standbild
   

3. Install the dependencies.

   npm install
   

4. Build and run the dev server.

   npm run dev
   

5. Open the URL provided by the dev server.

Developer's Guide

The project is split into two main components: The data that make up chapters and scenes, and the that generates the game from that data.

Creating chapters and scenes

Chapters represent a single, complete story and consist of one or more scenes. Scenes are each a single view into a part of a chapter, consisting of an image and a set of clickable areas in an imagemap. They have the following folder structure:

└─public
  └─chapters
    ├─chapter1 -- A directory for a given chapter, which can be named anything.
    │ ├─story.txt -- The story for the entire shapter.
    │ ├─main.jpeg -- The image for the first scene in the chapter.
    │ ├─main.html -- The HTML imagemap for the first scene in the chapter.
    │ ├─scene2.jpeg -- Subseqent scenes can have arbitrary names...
    │ ├─scene2.html -- ...as long as they have both jpeg image and html files.
    │ └─...
    └─...

To create a new chapter:

1. Create a folder within public/scenes with the name of the chapter.
2. Create a story.txt within this folder.
   1. Write a brief story in this file.
   2. Wrap key words in curly braces to mark them as answers in the game, which the player must find and fill in (e.g. the {king} opened the {door}).
3. For each scene in the chapter:
   1. Add an image, named ${scene name}.jpeg.
   2. Create an imagemap using a tool like image-map.net and paste the <map> element into ${scene name}.jpeg.
4. Run the dev server and you should see your scenes at http://${hostname}/scene/${chaptername}/${scenename}

Deploying changes

To deploy changes to the default domain, run:

npm run build
npm run deploy

To deploy chanes to another domain, you must set up github pages to point to that domain and update the deploy command to use that domain.