Project Info
Inspiration
As students and programmers we can spend countless iterations and follow ups prompting ChatGPT to give us the answer that we are looking for. Often before we reach a working solution we've already used up our tokens for ChatGPT 4.0. Not only is prompting time consuming, but also token-consuming. Thus, we decided to create something convenient and practical that we can use to help us engineer our prompts for large language models.
What it does
Promptli is a prompt engineering chrome extension that provides personalized suggestions and improves your prompts as you type them live in the chatbot. By using frameworks from our research into prompt engineering, Promptli analyzes the prompt on the following dimensions: Identify any ambiguities, vague terms, or areas that could benefit from more detail or context. Assess the logical flow and organization of the prompt. Evaluate the word choice, vocabulary precision, and overall readability. Determine whether the prompt is appropriately focused and scoped for its intended purpose. Making prompts more "AI-friendly" Make the most out of AI with Promptli, your personal prompt engineer.
How we built it
We built a chrome extension using: Javascript for the back-end server, scripting, and content rendering HTML & CSS for a user-friendly UI/UX that seamlessly integrates with the chat interface Gemini API for Promptli’s prompt engineering capabilities and JSON file rendering 100ms processing time for real time prompt improvement Effortless rendering of new prompts Interactive and easy-to-use UI/UX with single click per prompt
Challenges we ran into
\We began this project without prior experience with creating web extensions. Our first step was looking at resources from the Chrome Developers site. Specifically focused on chrome extension sample code and familiarizing ourselves with their API. Our second challenge was integrating our extension with AI platforms in a seamless fashion that was easy to use and wouldn’t block users’ workflow. This posed greater difficulties than we had initially anticipated as we needed to inject our JS into the website's dynamic layout. After several iterations of designs and troubleshooting our extensions compatibility with the AI site’s code, we were able to create something that works alongside the website’s ever changing layout and is intuitive to use. Lastly, having to work in a time-crunch with little to no sleep was definitely challenging but at the same time thrilling to build something with our friends that we truly would use and love as a product.
Accomplishments we're proud of
We're proud of building an app that we could use ourselves and provides practical value to any daily user of a chat bot. A lot of the time, the world seems overcrowded with artificial intelligence and machines so we are also are proud of creating a more human friendly experience that allows better communication between machine learning models and the human being.
What we learned
I think the best learning experience was about ourselves and our capabilities when working with friends for something we were passionate about. This was a really fun experience and we loved hacking our persimmon app: Promptli. Other things we learned: how to code a chrome extension how to create a back end server how to utilize javascript to call API and parse it through how to prompt engineer how to prompt chatbots to output file structure how to sleep under a table
What's next
We're currently working on integration with a wider range of generative AI services and hope to make the product more accessible with future partnerships. We also hope for a custom prompting model for long term sustainability fine tuned for writing good prompts.
Promptli
Make the most out of AI with Promptli, your personal prompt engineer: automatic prompt suggestions as you type.
How to get started with promptli
-
Clone our repository
git clone git@github.com:crocodile27/Promptli.git -
Head over to https://aistudio.google.com/app/apikey and follow the steps to get your API key
-
Put it in express's server.js
-
Go to chrome://extensions/ on chrome browser and click load unpacked. Then click the userScripts folder and click ok.
-
Open chatgpt.com and start using our chrome extension.
Inspiration
As students and programmers we can spend countless iterations and follow ups prompting ChatGPT to give us the answer that we are looking for. Often before we reach a working solution we've already used up our tokens for ChatGPT 4.0. Not only is prompting time consuming, but also token-consuming. Thus, we decided to create something convenient and practical that we can use to help us engineer our prompts for large language models.
What it does
Promptli is a prompt engineering chrome extension that provides personalized suggestions and improves your prompts as you type them live in the chatbot. By using frameworks from our research into prompt engineering, Promptli analyzes the prompt on the following dimensions:
- Identify any ambiguities, vague terms, or areas that could benefit from more detail or context.
- Assess the logical flow and organization of the prompt.
- Evaluate the word choice, vocabulary precision, and overall readability.
- Determine whether the prompt is appropriately focused and scoped for its intended purpose.
- Making prompts more "AI-friendly"
Make the most out of AI with Promptli, your personal prompt engineer.
How we built it
We built a chrome extension using:
- Javascript for the back-end server, scripting, and content rendering
- HTML & CSS for a user-friendly UI/UX that seamlessly integrates with the chat interface
- Gemini API for Promptli’s prompt engineering capabilities and JSON file rendering
- 100ms processing time for real time prompt improvement
- Effortless rendering of new prompts
- Interactive and easy-to-use UI/UX with single click per prompt
Challenges we ran into
\We began this project without prior experience with creating web extensions. Our first step was looking at resources from the Chrome Developers site. Specifically focused on chrome extension sample code and familiarizing ourselves with their API.
Our second challenge was integrating our extension with AI platforms in a seamless fashion that was easy to use and wouldn’t block users’ workflow. This posed greater difficulties than we had initially anticipated as we needed to inject our JS into the website's dynamic layout. After several iterations of designs and troubleshooting our extensions compatibility with the AI site’s code, we were able to create something that works alongside the website’s ever changing layout and is intuitive to use.
Lastly, having to work in a time-crunch with little to no sleep was definitely challenging but at the same time thrilling to build something with our friends that we truly would use and love as a product.
Accomplishments that we're proud of
We're proud of building an app that we could use ourselves and provides practical value to any daily user of a chat bot. A lot of the time, the world seems overcrowded with artificial intelligence and machines so we are also are proud of creating a more human friendly experience that allows better communication between machine learning models and the human being.
What we learned
I think the best learning experience was about ourselves and our capabilities when working with friends for something we were passionate about. This was a really fun experience and we loved hacking our persimmon app: Promptli.
Other things we learned:
- how to code a chrome extension
- how to create a back end server
- how to utilize javascript to call API and parse it through
- how to prompt engineer
- how to prompt chatbots to output file structure
- how to sleep under a table
What's next for Promptli
We're currently working on integration with a wider range of generative AI services and hope to make the product more accessible with future partnerships. We also hope for a custom prompting model for long term sustainability fine tuned for writing good prompts.
Analysis
View
Metric
- 21
- 17
- 11
- 1
Figures cover GitHub contributors during the hackathon window. A co-authored commit counts in full for each author, so per-member totals add up to more than the whole-team figures.
Technology
- CSSIn code
- ExpressIn code
- Google GeminiIn code
- HTMLIn code
- JavaScriptIn code
5 of 5 appear in the indexed code.
AI coding agents
No AI coding agent signals were found in this repository.
Detected from committed agent config files and commit authorship. Absence of a signal is not proof an agent was unused.
Codebase size
Source size
52 KB
Source files
18
Counts recognized source files only; vendored directories, binaries and lockfiles are excluded, so this is smaller than the repository on disk.
Repository
crocodile27/Promptli
29 files · 1.3 MB · @ 72e6c4a
Structure
Interface
6 files · 21%Screens, components and styles rendered to the user.
Application logic
11 files · 38%Domain rules, services and shared utilities.
Supporting
Layers are inferred from where files sit in the tree, not from reading the code. A project that names its directories unconventionally will read oddly here — open the file browser to check anything the diagram implies.
Languages
- JavaScript65%
- HTML18%
- Markdown13%
- CSS4%
Share of indexed source by file size. Binary and vendored files are excluded.
Dependencies
express/package.json
npm · 4- @google/generative-ai
- cors
- dotenv
- express
Declared in the repository’s manifests at the indexed commit. A declared package is not proof it is used, and runtime dependencies are listed first.
Feature verification
Chrome extension setup via chrome.userScripts / load-unpacked instructionsVerified
Go to chrome://extensions/ and load the userScripts folder
Claimed on readmehigh confidenceuserScripts/manifest.json:1— a valid manifest_version 3 extension exists in userScripts/ matching the README's load-unpacked instructions
Effortless rendering of new prompts with expand/collapse detail viewVerified
Effortless rendering of new prompts
Claimed on readmemedium confidenceuserScripts/content.js:354— injectPrompts() writes each suggestion's truncated text and full content into the button and expanded-content elements, with expand/collapse link handlers
Express back-end server proxying the Gemini APIVerified
Javascript for the back-end server
Claimed on readmehigh confidenceexpress/server.js:32— an Express POST /generate route accepts promptText and forwards it to the Gemini modelexpress/server.js:89— app.listen(PORT) starts the server on port 3000
Gemini API integration for prompt engineeringVerified
Gemini API for Promptli's prompt engineering capabilities and JSON file rendering
Claimed on readmehigh confidenceexpress/server.js:21— GoogleGenerativeAI is initialized with an API key and gemini-1.5-flash model, with responseMimeType set to application/jsonexpress/server.js:71— model.generateContent(prompt) is called and the result is returned to the caller
Interactive single-click suggestion buttons injected into chat UIVerified
Interactive and easy-to-use UI/UX with single click per prompt
Claimed on readmehigh confidenceuserScripts/content.js:393— each injected button gets a click listener that calls populateTextInput(promptData.prompt), populating the chat box with one clickuserScripts/buttons.html:100— three button elements (button1/2/3) are the containers into which generated prompts are injected
JSON-formatted response parsing and rendering of suggestionsVerified
Gemini API for ... JSON file rendering
Claimed on readmemedium confidenceuserScripts/content.js:322— callGeminiAPI double-parses the JSON response text into an array of {prompt, summary} objects before rendering
Prompt analysis across multiple dimensions (clarity, structure, tone, focus, AI-friendliness)Verified
Analyzes prompts for ambiguity, logical flow, word choice/readability, focus/scope, and AI-friendliness
Claimed on readmehigh confidenceexpress/server.js:40— the prompt sent to Gemini explicitly instructs analysis across Clarity and Specificity, Structure and Organization, Language and Tone, Focus and Scope, and AI Optimization
Real-time prompt suggestions as user typesVerified
Automatic prompt suggestions as you type, live in the chatbot
Claimed on Devposthigh confidenceuserScripts/content.js:36— keydown listener on the chat textarea starts a debounce timer (typingTimer/typingInterval) that calls callGeminiAPI(userInput) after typing pausesuserScripts/content.js:68— setTimeout callback fires the Gemini call and injectButtons() automatically while the user types
Seamless integration/injection into ChatGPT (and Perplexity) chat interfaceVerified
Seamlessly integrates with the chat interface; injected JS into the website's dynamic layout
Claimed on readmehigh confidenceuserScripts/manifest.json:12— content script matches https://chatgpt.com/* and https://www.perplexity.ai/*userScripts/content.js:21— querySelector targets #prompt-textarea (ChatGPT) and Perplexity's textarea placeholders to find the chat input across layouts
Background service worker calling Gemini API with stored keyCode-supported
Back-end scripting to call the Gemini API and parse it
Claimed on Devpostlow confidenceuserScripts/background.js:1— background.js references GoogleGenerativeAI and chrome.storage but is not a valid service worker (it uses undefined 'fs' and template-literal misuse at line 7, and self-referential 'const genAI = genAI' at line 25), so it appears broken/non-functional despite the intent being present
100ms real-time processing time for prompt improvementClaimed only
100ms processing time for real time prompt improvement
Claimed on readmehigh confidenceCustom fine-tuned prompting model for long-term sustainabilityClaimed only
Hope for a custom prompting model fine tuned for writing good prompts
Claimed on readmehigh confidenceFuture integration with a wider range of generative AI services and partnershipsClaimed only
Working on integration with a wider range of generative AI services and future partnerships
Claimed on readmehigh confidence
An AI agent derived these features from the project’s Devpost page and readme, then searched the code for each one. Verified features are backed by cited code; claimed-only features had no supporting code, which is not by itself proof a feature is missing.
Export this project's context (description, README, evidence, key source files) to chat with an AI agent elsewhere.