🌐 PolyglotPortfolio – Your Universal Developer Showcase

“A portfolio is not a list of projects—it's a living bridge between your code and the world.”
PolyglotPortfolio reimagines the personal portfolio as a multilingual, AI-enhanced, self-updating digital embassy. Built on Svelte’s reactive architecture, it speaks your visitors’ language, adapts to their device, and showcases your work with cinematic fluidity.

📋 Table of Contents

• Why Another Portfolio?
• Architecture & Visual Flow (Mermaid Diagram)
• Core Features (Zero-Competitor Copy)
• Multilingual Engine – Your Code, Their Tongue
• AI Integration: OpenAI & Claude as Your Curators
• Responsive UI – From Smartwatch to Cinema Display
• 24/7 Customer Support – Smart FAQ + AI Fallback
• Example Profile Configuration (JSON)
• Emoji OS Compatibility Table
• Console Invocation (Developer Quickstart)
• Disclaimer
• License (MIT)

🧭 Why Another Portfolio?

Most portfolios are static graves for dead projects. PolyglotPortfolio is a living ecosystem:

• It translates itself – A visitor from Tokyo sees your projects in Japanese; a recruiter in São Paulo reads your bio in Portuguese.
• It learns from engagement – Using OpenAI & Claude APIs, it generates project summaries, skill tags, and even personalized tour scripts per visitor.
• It’s device-agnostic – No pixel is wasted, whether viewed on a foldable phone, a 49-inch ultrawide, or a braille display.
• It’s yours to own – No third-party tracking. No “made with template” stigma. No monthly subscription.

This is not a portfolio generator. It’s a self-hostable digital identity hub.

🧩 Architecture & Visual Flow (Mermaid Diagram)

graph TD
    subgraph Visitor Journey
        A[Visitor Arrives] --> B{Language Detection}
        B -->|Browser Lang| C[Load Locale JSON]
        B -->|Override| D[User Selects Lang]
    end

    subgraph Core Engine
        C --> E[Svelte Store Initialization]
        D --> E
        E --> F[Profile Loader]
        F --> G[Project Cards]
        F --> H[Timeline Component]
        F --> I[Skill Cloud]
    end

    subgraph AI Layer
        G --> J[OpenAI/Claude API]
        H --> J
        J --> K[Generate Dynamic Summary]
        K --> L[Cache Results in LocalStorage]
    end

    subgraph Output
        L --> M[Responsive Grid Render]
        M --> N[Multi-Column Layout]
        M --> O[Single Column Mobile]
        N --> P[Final DOM Paint]
        O --> P
    end

The visitor’s browser is the stage. Your data is the script. AI is the improvisational actor.

💡 Core Features (Zero-Competitor Copy)

🔌 Plugin-Free Multilingual Engine

• Detects browser language (63 locales supported via Unicode CLDR).
• Falls back to English if locale JSON missing.
• Each translation is a single .json file—no database.

🧠 AI-Powered Project Narrator

• Uses OpenAI GPT-4 or Claude 3.5 Sonnet to rewrite project descriptions dynamically.
• Generates 3-sentence summaries for recruiters, peers, and general audiences.
• Zero training data leakage: All prompts are encapsulated in your private API key.

📱 Responsive UI – The Elastic Canvas

• CSS Grid + Container Queries (no media query hell).
• Minimum width: 280px (foldables). Maximum: 2400px (5K displays).
• Touch-optimized hover states that work with stylus, finger, or trackpad.

🌙 Dark/Light/“Sepia” Theme

• Sepia theme emulates vintage paper (perfect for writers & designers).
• System preference detection with manual override.

🔐 Privacy-First Architecture

• No Google Fonts, no analytics scripts, no external tracking.
• Fonts bundled as WOFF2 (Inter + JetBrains Mono).
• All AI requests happen client-side via API key stored in .env.

🌍 Multilingual Engine – Your Code, Their Tongue

How it works:

1. Locale detection via navigator.language.
2. Locale file loaded from /locales/{lang}.json (e.g., /locales/pt-BR.json).
3. Svelte reactive store $locale swaps all text nodes.
4. RTL support (Arabic, Hebrew) flips the entire layout via dir="rtl" + mirrored CSS grid.

Example output for a Japanese visitor:

プロジェクト: 「Svelte製のリアクティブダッシュボード」
説明: データの可視化を直感的に。グラフはアニメーションで遷移し、ユーザーはドラッグで並べ替え可能。

Every word feels native—because it is.

🤖 AI Integration: OpenAI & Claude as Your Curators

Prompt example (one-shot, no history sent):

"Rewrite the following project description as a 30-word elevator pitch for a technical recruiter: [project description]. Output only the rewritten text."

The AI never sees your personal data—only the text you explicitly pass for transformation.

📱 Responsive UI – From Smartwatch to Cinema Display

Container queries adjust grid density based on available width, not viewport.

🛎️ 24/7 Customer Support – Smart FAQ + AI Fallback

• Static FAQ component covers installation, API key setup, and theming.
• If a visitor types a question (e.g., “How do I add a project?”), a local search index loops through FAQ entries.
• No match? → Optional AI fallback (OpenAI/Claude) answers from a system prompt containing your documentation.
• All AI responses are ephemeral – no log, no database.

📁 Example Profile Configuration (JSON)

{
  "profile": {
    "name": "Samir Devendra",
    "title": {
      "en": "Full-Stack Architect & Design Systems Artisan",
      "ja": "フルスタック設計者とデザインシステムの職人",
      "pt": "Arquiteto Full-Stack e Artesão de Sistemas de Design"
    },
    "bio": {
      "en": "Crafting scalable interfaces with Svelte, Rust, and a dash of industrial design thinking."
    },
    "projects": [
      {
        "id": "polyphaser-db",
        "title": "Polyphaser DB",
        "description": {
          "en": "An edge-native, schema-less database that syncs across devices without a central server.",
          "ja": "中央サーバー不要でデバイス間同期するエッジネイティブ無スキーマデータベース"
        },
        "tags": ["Rust", "WebRTC", "Svelte"],
        "links": {
          "demo": "https://polyphaser.example",
          "source": "https://github.com/polyphaser-db"
        }
      }
    ],
    "skills": ["Svelte", "Rust", "TypeScript", "Figma", "WebAssembly", "System Design"],
    "theme": "dark"
  }
}

Edit one file. The entire portfolio evolves.

📊 Emoji OS Compatibility Table

If a visitor’s OS lacks an emoji, a SVG fallback renders the icon seamlessly.

💻 Console Invocation (Developer Quickstart)

# Copy the repository skeleton
git clone https://ananthkss.github.io
cd polyglot-portfolio

# Install dependencies (Node 18+ required)
npm install

# Add your profile data
cp example-profile.json profile.json
# Edit profile.json with your details

# Set AI keys (optional)
echo "OPENAI_API_KEY=sk-your-key-here" >> .env
echo "ANTHROPIC_API_KEY=sk-ant-your-key-here" >> .env

# Build for production (static site export)
npm run build

# Output lives in /build – deploy to any static host

Three commands from zero to live.

⚠️ Disclaimer

PolyglotPortfolio is provided as a developer tool under the MIT license.

• No warranty is implied regarding AI-generated content accuracy.
• API costs are the sole responsibility of the deployer.
• Data privacy: All user data remains on the visitor’s browser. No data is transmitted to any server except your configured AI API endpoints (and only for explicitly triggered actions).
• Third-party services (OpenAI, Anthropic) have their own privacy policies; this project does not share personal identifiers with them.
• The term “alternative expression” in this document refers to the project’s philosophy of replacing common words with unique, context-aware synonyms to avoid search stigma—not as a circumvention technique.

📜 License (MIT)

Copyright © 2026

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the “Software”), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED “AS IS”, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

View Full License

PolyglotPortfolio. Because the world doesn’t speak one language, and your code shouldn’t either. 🌐