HanaVerse 🌸

An interactive web UI for chatting with Ollama, featuring Hana - a lively 2D anime character

• Features • Installation • Usage • Screenshots • Configuration • Contributing

🌟 Features

• Interactive Chat Interface: Talk with Ollama's powerful language models in a friendly web UI
• Live 2D Animation: Chat with Hana, an expressive anime character that responds to your interactions
• Markdown Support: View beautifully formatted responses with syntax highlighting
• LaTeX Math Rendering: Display mathematical equations properly with KaTeX
• Customizable Settings: Choose your Ollama model and configure system prompts
• Responsive Design: Enjoy HanaVerse on desktop and mobile devices
• Real-time Response: Stream responses as they're generated

📸 Screenshots

💻Demo

This is just a skeleton demo Link = https://hanaverse.vercel.app/

hanaverse.demo.1.1.1.mp4

🚀 Installation

Prerequisites

• Python 3.8+ installed
• Ollama installed and running on your system
• Git

Step 1: Clone the repository

git clone https://github.com/Ashish-Patnaik/HanaVerse.git
cd HanaVerse

Step 2: Install dependencies

pip install -r requirements.txt

Step 3: Start the Flask server

python server.py

The server will start running at http://localhost:5000 by default.

Step 4: Access HanaVerse in your browser

After running the server open index.html in your web browser and accese HanaVerse

💬 Usage

1. Start Chatting: Type your message in the input box and press Send or hit Enter
2. Change Settings: Click the hamburger menu (☰) to access settings
3. Configure Ollama:

• Set your Ollama server URL (default: http://localhost:11434)
• Choose your preferred model (e.g., llama3:8b, codellama:7b, mistral:latest)
• Customize the system prompt for specialized responses

4. Stop Generation: Click the Stop button anytime to halt response generation

💃Models

1. Only support Cubism 4 models

2. Models need to support motionsync3

   Reference: https://docs.live2d.com/en/cubism-editor-manual/motion-sync/

3. Add your models in model directory

⚙️ Configuration

Ollama Models

HanaVerse works with any model available in your Ollama installation. Some recommended models:

• llama3:8b - Great general purpose assistant (default)
• codellama:7b - Specialized for coding tasks
• mistral:latest - Alternative high-quality model
• phi3:latest - Microsoft's compact but powerful model

📖 System Prompts

Customize the system prompt to get specialized responses:

1. Math Helper: "Format math using LaTeX. Show step-by-step solutions."
2. Coding Assistant: "Provide code examples with detailed explanations. Use appropriate syntax highlighting."
3. Recipe Generator: "Present ingredients as bullet points and steps as numbered lists."

🔧 Project Structure

HanaVerse/
├── server.py              # Flask server for handling API requests
├── index.html          # Main web interface
├── style.css           # CSS styling for the UI
├── script.js           # Core functionality for Live2D character
├── chat.js             # Chat interaction logic
├── sdk/                # Live2D SDK components
├── prism/              # Syntax highlighting library
├── katex/              # Math rendering library
├── models/             # Live2D model files for Hana
└── requirements.txt    # Python dependencies

🤝 Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

1. Fork the repository
2. Create your feature branch (git checkout -b feature/amazing-feature)
3. Commit your changes (git commit -m 'Add some amazing feature')
4. Push to the branch (git push origin feature/amazing-feature)
5. Open a Pull Request

📜 License

This project is licensed under a Custom Non-Commercial Use License.
You may use, copy, and run this software for personal or educational use only.
Commercial use and modification for commercial purposes are not allowed for now.

🙏 Acknowledgements

1. Ollama for the local LLM runtime
2. Live2D for the Cubism SDK
3. pixi-live2d-display for the WebGL rendering
4. KaTeX for math rendering
5. Prism for syntax highlighting
6. Live2d motionsync library

Made with ♥️ by Ashish Patnaik

Don't Forget to ⭐Star⭐ the repo