Promptpal

• 

  promptpal homepage

\section*{Inspiration}

We noticed that while AI adoption is growing worldwide, many users struggle to communicate effectively with AI systems because English is not their first language. Most AI tools are optimized for English, leaving non-native speakers at a disadvantage. PromptPal was inspired by the idea of bridging this accessibility gap, helping people from diverse backgrounds craft better prompts regardless of their language skills. Alongside this, we wanted to create a platform where anyone — from beginners to experts — could experiment, analyze, and refine prompts in an intuitive, interactive environment.

\section*{What it does}

Deepened my understanding of prompt engineering and how small linguistic patterns influence AI behavior.

Learned to integrate authentication (Google, GitHub, LinkedIn, Twitter) securely using NextAuth.

Gained hands-on experience in building interactive analytics dashboards with Recharts to measure prompt performance.

Enhanced my knowledge of 3D model embedding (Spline) to improve user interactivity and create a premium look.

\section*{How we built it}

\begin{itemize}

  \item \textbf{Frontend:} Next.js, React, Tailwind CSS for responsive UI.

  \item \textbf{Backend:} Next.js API routes with MongoDB for storing prompts, user data, and analytics.

  \item \textbf{Authentication:} NextAuth with multiple OAuth providers (Google, GitHub, LinkedIn, Twitter).

  \item \textbf{Analytics:} Recharts for visualization of prompt performance.

  \item \textbf{3D Experience:} Spline models for interactivity and modern design.

\end{itemize}

\section*{Challenges we ran into}

\begin{itemize}

  \item Handling OAuth with LinkedIn, as it requires specific scopes (r_emailaddress) and setup in the developer portal.

  \item Managing real-time responsiveness of charts and analytics while keeping the app performant.

  \item Designing the UX so that the sidebar vs. main page layout works seamlessly across desktop and mobile (hamburger menu vs. fixed sidebar).

  \item Ensuring smooth integration of 3D models without breaking page hydration in Next.js.

\end{itemize}

\section*{Accomplishments that we're proud of}

\begin{itemize}

  \item Successfully built a fully functional AI-powered prompt optimization platform within the hackathon timeline.

  \item Integrated multi-provider authentication (Google, GitHub, LinkedIn, Twitter) to give users flexibility and a seamless login experience.

  \item Designed an interactive analytics dashboard using Recharts, enabling users to track prompt performance, success rates, and engagement trends in real-time.

  \item Built the dashboard to be intuitive and visually appealing, making data easy to understand even for non-technical users.

  \item Incorporated 3D models via Spline to deliver a premium, engaging, and modern user experience.

\end{itemize}

\section*{What we learned}

\begin{itemize}

  \item How to design an analytics-driven product, where dashboards aren’t just charts but provide meaningful insights to end users.

  \item Learned to balance data visualization and performance, making sure charts update smoothly without slowing the platform.

  \item The importance of user-friendly dashboards in empowering decision-making, even for people with limited technical backgrounds.

\end{itemize}

\section*{What's next for PromptPal}

\begin{itemize}

  \item Enhancing the analytics dashboard with AI-powered recommendations (e.g., suggest better prompt rewrites).

  \item Adding customizable dashboards, letting users track metrics that matter most to them.

  \item Expanding multilingual support, helping non-English speakers interact with AI more effectively.

  \item Developing a mobile app version of PromptPal, making prompt crafting and analytics accessible on-the-go.

  \item Scaling the platform with collaborative features and preparing for real-world deployment.

\end{itemize}

Built With

• auth
• mongodb
• mongoose
• next.js
• openrouteservice
• react
• tailwind