DATE06/01/2024

Lunaris: A Custom Gemini Experience

Web App
Gemini API

Services

Frontend Development, API Integration


Category

Personal AI Project


Client

Personal Project

Contact us Now
Lunaris: A Custom Gemini Experience

Analysis - Crafting an Interactive & Responsive AI Interface

The goal for Lunaris was to build a highly interactive and visually engaging front-end experience around the powerful Gemini API, prioritizing user experience and modern design.

Performance

SEO
  • Modern Frontend Stack: Built with ReactJS and Vite for a lightning-fast development experience and an optimized, snappy user interface.
  • Engaging UI/UX: Utilized libraries like WOW.js and Counterup to create smooth, robotic-themed animations that enhance user engagement.
  • Interactive Responses: Implemented a custom typing effect for AI responses, making the conversation feel more dynamic and alive.

Responsiveness

A core focus was ensuring a seamless, mobile-first design. The UI is fully responsive, delivering a consistent and intuitive chat experience on any device, from smartphones to desktops.

Analysis - Crafting an Interactive & Responsive AI Interface analysis image 1
Analysis - Crafting an Interactive & Responsive AI Interface analysis image 2

Problem - Overcoming Hurdles & Formatting Chaos

This project faced two primary challenges: the ambitious goal of training a custom model with limited resources, and the technical complexity of handling raw, unstructured API data.

The Challenge of API Response Formatting

SEO

The raw output from the Gemini API was unstructured and not user-friendly. The key technical problem was to develop robust parsing logic using React Markdown and custom functions to interpret and reformat this data into clean, readable chat bubbles, lists, and code blocks, all while maintaining performance.

Problem - Overcoming Hurdles & Formatting Chaos

Solution - A Feature-Rich, API-Driven Application

The solution was to pivot from model training to creating a best-in-class user interface. We focused on integrating powerful third-party services, allowing us to dedicate our efforts to the core user experience.

Full-Featured User Experience & Deployment

EMAIL

By integrating Clerk for secure user authentication (including Google/GitHub logins) and EmailJS for notifications, we built a complete application. The final product features full user management and a polished chat interface that successfully tames the Gemini API's raw output, delivering a truly unique and engaging user experience.

CLARITY

Your Questions,
Answered.

We believe in transparency. Here are answers to common questions to help clarify our process and how we can partner together.

Our pricing is tailored to the project's scope. A simple static website is different from a full-stack AI application. After our initial discovery call, we provide a detailed, transparent proposal with a fixed price or a clear hourly/sprint-based estimate, so you know exactly what to expect.

We follow a three-phase approach. It begins with 'Aql' (Intellect) — a deep discovery and strategy phase to create a solid blueprint. Next comes 'Agility' — the actual development in sprints with regular check-ins. Finally, we move to deployment and partnership for ongoing success.

You'll be working directly with us, Moin and Faiz, the founders of Aqlity. This is our biggest strength. There are no project managers or communication overhead. You get direct access, clear answers, and a team that is fully invested in your project's success.

Timelines depend on the project's complexity. A standard informational website might take a few weeks, while a custom web application or an AI agent could take a couple of months. We establish a clear timeline in our project proposal before any work begins.

Yes. All our projects include an initial support period to handle any post-launch bugs. We also offer ongoing monthly retainers for maintenance, updates, and feature additions to ensure your digital asset continues to perform and evolve.

Absolutely. We are flexible. Whether you need a standalone AI chatbot integrated into your current site, a new frontend for an existing backend, or help optimizing a part of your application, we're happy to discuss how we can help.