Visual Story-Writing: Writing by Manipulating Visual Representations
This system automatically visualizes a story (chronological events, character and their actions and movements) and allows users to edit the story by manipulating these visual representations. For example:
Hover over the timeline allows reviewing the chronology of events and visualizing the movements of the characters
Connecting two characters suggests edits to the text to reflect the new interaction
Moving a character suggests edits to the text to reflect the new position
Reordering the events in the timeline suggests edits to the text to reflect the new chronology
The system relies on a GPT-4o to extract the information from the text and suggest edits.
How to build and run
The code is written in TypeScript and uses React and Vite. To build and run the code, you will need to have Node.js installed on your machine. You can download it here. First install the dependencies:
npm install
... continue reading