Define your system prompt here. It can include both custom and predefined variables.
Always check the correctness of data before to import from untrusted sources.
Welcome to Articles AI Prompt Builder!
This is a personal recreational programming exercise—a proof of concept for a web application designed to assist users in creating textual prompts for AI assistants (such as Gemini, Chat-GPT, Claude, or any other LLM) for further processing.
The application primarily focuses on articles as the target output.
It is subdivided into six interconnected sections: Variables, System Prompt, Inputs, Options, Import/Export, and this section.
Variables
In the Variables section, you can define all the custom variables that will be used within the System Prompt and/or the text chips provided in the Inputs section.
Each variable has a name and can be of either single or multiple selection type. The data must be textual and should be entered one item per line. Each entry will be available for selection in the Inputs section.
System Prompt
The System Prompt section is straightforward; it allows you to define the text for the system prompt. This prompt serves to instruct the AI assistant on how to process the subsequent text you will provide.
In the System Prompt, it is possible (and often expected) to use both the custom variables defined in the Variables section and the predefined ones by enclosing the variable name in double curly braces (e.g., {{variable}}
).
Inputs
In the Inputs section, you will add all the text chips that define the body of the text to be provided to the AI assistant, alongside the system prompt. Text chips can include both custom and predefined variables by enclosing the variable name in double curly braces (e.g., {{variable}}
). You can add, rearrange, or remove chips as needed.
To configure the data for a specific variable to be used in the prompt you’re working on (note that variables are reset each time), simply click on the respective tag. A dialog will appear, allowing you to set the item(s) to be used.
By clicking the Build Prompt button, you can open another dialog for a final review of the generated prompt text before copying and pasting it into your favorite LLM.
Options
This section is quite self-explanatory. Here, you can configure all the global settings that will affect the final prompt result. (Still a Work in Progress).
Import/Export
In the Import/Export section, you can import previously saved configurations or export a new one to your computer. Configurations will save your defined variables, options, and system prompt, but chips are never saved.
To import a configuration, click the Import button and select the JSON file containing the previously exported configuration, or simply drag and drop the file from your folder into the window (this works only if the Import/Export panel is currently open). Once the file is imported, be sure to verify that everything you are importing is correct before clicking the Accept button.
To export a configuration, just click the Export button and choose where to save the JSON file.
Please note that everything will be overwritten by the newly imported configuration file. Be sure to create a backup copy by exporting your current configuration before importing if you have data you want to reuse.
Predefined Variables
The application provides some predefined variables that can be used within the system prompt and text chips. Please note that if a custom variable with the same name is created, the custom variable will take precedence over the predefined one.
Variable | Syntax | Description |
---|---|---|
context | {{context}} | this is the placeholder for all the text chips defined in Inputs section. |
date | {{date}} | prints out current date |
Options
Options can be tagged within chips by using their ID between double curly brackets.
Option | Syntax | Description |
---|---|---|
Enable SEO | {{enableSEO:text}} | prints out text if the option is checked, or nothing otherwise. |
Credits
This project was developed using Typescript, which was then transpiled into JavaScript with the help of esbuild. For styling, CSS was processed using Lightning CSS, ensuring a modern and efficient approach to styling the website. The overall structure and functionality of the site were built utilizing lume.land, a powerful static site generator. To enhance the visual appeal, icons were sourced from Google Material Icons and Developer Icons, while the typography features the elegant Inter font alongside the monospaced JetBrains Mono font, providing a clean and readable interface for users.
Articles AI Prompt Builder - v0.1.2ɑ (liminal-selkie)
©2024, RaionDev. Released under MIT License.
Last update: 2024-12-13T13:51:50.092Z