Enoch + 
You are an experienced prompt engineer, write a prompt template which contains the following factors:
To create well-structured prompts, follow these guidelines to get the most out of the AI:
Quick Checklist (to keep handy)
| ? | Checklist Item |
|---|---|
| 1 | Goal – What do you want? |
| 2 | Specificity – Precise description of the output |
| 3 | Context – Background, setting, characters |
| 4 | Tone – Mood, style, genre |
| 5 | Key Elements – Must?have components |
| 6 | Parameters – Length, format, constraints |
| 7 | Freedom – Allow creative choices, avoid bias |
| 8 | Iteration – Note that you’ll refine later (optional) |
Below is a self?contained HTML page that presents a Prompt?Engineering form with the eight sections you listed.
The form uses a tiny bit of JavaScript to collect the entered values, format them as plain?text, and trigger a download of a .txt file. This way the result can be pasted straight into any AI prompt without needing a server?side component.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Prompt?Engineering Form</title>
<style>
body {font-family: Arial, sans-serif; margin: 2rem;}
label {display: block; margin-top: 1rem; font-weight: bold;}
textarea, input[type=text] {
width: 100%;
max-width: 600px;
padding: .5rem;
margin-top: .3rem;
box-sizing: border-box;
font-family: inherit;
}
button {margin-top: 1.5rem; padding: .6rem 1.2rem; font-size: 1rem;}
</style>
</head>
<body><!– 1. Goal –>
<label for=“goal“>Goal – What do you want?</label>
<textarea id=“goal“ name=“goal“ rows=“2“ placeholder=“e.g., Write a short story“></textarea>
<label for=“specificity“>Specificity – Precise description of the output</label>
<textarea id=“specificity“ name=“specificity“ rows=“2“
placeholder=“e.g., 500?word sci?fi narrative with a twist ending“></textarea>
<label for=“context“>Context – Background, setting, characters</label>
<textarea id=“context“ name=“context“ rows=“3“
placeholder=“e.g., Set in a post?apocalyptic city, protagonist is a former engineer“></textarea>
<label for=“tone“>Tone – Mood, style, genre</label>
<textarea id=“tone“ name=“tone“ rows=“2“
placeholder=“e.g., Dark, gritty, noir?style“></textarea>
<label for=“keyElements“>Key Elements – Must?have components</label>
<textarea id=“keyElements“ name=“keyElements“ rows=“2“
placeholder=“e.g., A hidden laboratory, a cryptic message“></textarea>
<label for=“parameters“>Parameters – Length, format, constraints</label>
<textarea id=“parameters“ name=“parameters“ rows=“2“
placeholder=“e.g., 800 words, plain text, no profanity“></textarea>
<label for=“freedom“>Freedom – Allow creative choices, avoid bias</label>
<textarea id=“freedom“ name=“freedom“ rows=“2“
placeholder=“e.g., Feel free to invent new technology, keep gender neutral“></textarea>
<label for=“iteration“>Iteration – Note that you’ll refine later (optional)</label>
<textarea id=“iteration“ name=“iteration“ rows=“2“
placeholder=“e.g., Will review and tweak after first draft“></textarea>
</form>
document.getElementById(‘promptForm’).addEventListener(‘submit’, function (e) {
e.preventDefault(); // prevent actual form submission
const getVal = id => document.getElementById(id).value.trim() ||
document.getElementById(id).placeholder;
[‘Goal’, getVal(‘goal’)],
[‘Specificity’, getVal(‘specificity’)],
[‘Context’, getVal(‘context’)],
[‘Tone’, getVal(‘tone’)],
[‘Key Elements’, getVal(‘keyElements’)],
[‘Parameters’, getVal(‘parameters’)],
[‘Freedom’, getVal(‘freedom’)],
[‘Iteration’, getVal(‘iteration’)]
];
let txt = ”;
sections.forEach(([title, content]) => {
txt += `${title} – ${content}\n\n`;
});
const blob = new Blob([txt], {type: ‘text/plain’});
const url = URL.createObjectURL(blob);
const a = document.createElement(‘a’);
a.href = url;
a.download = ‘prompt.txt’;
a.click();
URL.revokeObjectURL(url);
});
</script>
</html>
How it works
- User fills the fields – each section is a
<textarea>so you can write multi?line content if needed. - When the “Download Prompt Text” button is pressed, JavaScript gathers the values, falls back to the placeholder text when a field is left blank, and formats everything as plain text.
- A temporary Blob is created and a hidden link is clicked programmatically, prompting the browser to save a file named
prompt.txt.
You can open the saved prompt.txt in any editor and paste its contents directly into an AI prompt window. If you later decide to integrate a server?side solution (e.g., PHP, Node, Python), replace the JavaScript download logic with a normal <form action="your?script.php" method="post"> and have the server write the received data to a file.
