Portfolio Admin

Chiranjeet Banerjee CMS

Incorrect passphrase

Access restricted to site owner

Portfolio CMS

v1.0 / private

Content
Dashboard
Site Content
Case Studies
Images
Icons
Social Links
Articles
AI Assistant
Knowledge Base
Availability
Visitor Insights
Integrations
Connect
Import Docs
Intelligence
SEO & GEO
Heatmap & Behavior
Competitors & Trends
System
Site Config
Theme Editor
Deploy

v1.0.0

View live site

0

Case studies

0

Images uploaded

0

Total words

Quick Actions

Eyebrow text

Short descriptor above headline. Max 80 characters.

Hero hook headline (use <em> for accent words)

Use <em>word</em> for accent color. Max 200 characters including HTML tags.

Tagline (subheading)

Location

Focus

Primary CTA text

Secondary CTA text

Hero Card Images (3 stacked cards)

Upload images for the hero section. Each card shows a different professional role.

Card 1: UX Designer

JPG or PNG, max 3MB. Recommended: 800x1060px (3:4 ratio)

Card 2: Photographer

JPG or PNG, max 3MB. Recommended: 800x1060px (3:4 ratio)

Card 3: AI Consultant

JPG or PNG, max 3MB. Recommended: 800x1060px (3:4 ratio)

About heading

About paragraphs (HTML allowed)

Title

Year

Type

Domain

Summary (1-2 sentences)

Tags (comma separated)

Thumbnail path

Relative path to thumbnail image. Use the Images tab to upload first.

0 words

RENDERED PREVIEW

Link images to this case study. Images are referenced by path in your markdown content using ![alt](images/case-studies/filename.jpg)

Associated images (one path per line)

Figma file URL

Link to the Figma file for this project. Used for your reference only (not shown on site).

Figma embed URL (for iframe)

If you want to embed a Figma frame on the case study page, paste the embed URL here.

Framer project URL

Additional links (JSON array)

Add any other project links as a JSON array. These will be stored in the manifest.

Generate contextual images for this case study using AI. Results are saved to your images folder.

Image prompt

Describe the image you want. Be specific about style, content, and mood. The AI generates project-contextual visuals.

Width

Height

Provider

Upload images

JPG, PNG, or WebP. Max 3MB per file. Multiple files allowed.

Images will be prepared for download. Place them in the images/case-studies/ folder on your server.

Uploaded images this session

No images uploaded yet this session.

Upload images above, then reference them in case study markdown.

Upload SVG or PNG icons

SVG or PNG only. Max 500KB per icon.

Upload icons to the icons/ folder. SVG is recommended for crisp rendering at any size.

Uploaded Icons

No icons uploaded yet this session.

Assign uploaded icons to site sections. Click an icon path below to copy it, then paste in the relevant field.

Pillar 1 icon (UX That Prints Money)

Pillar 2 icon (Applied AI for Teams)

Pillar 3 icon (Cinematic Visuals)

Pillar 4 icon (The Human Operator)

Nav logo

Text or SVG path. If a file path, it will render as an image.

Create simple SVG icons visually. Choose a base shape, adjust stroke and fill, then save.

Base shape

Stroke color

Fill

Stroke width

Generated SVG code

Import from URL

Paste a Substack, Medium, LinkedIn, or any article URL. Metadata is extracted automatically.

Current Articles (0)

Add manually

Title

URL

Source

Date

Excerpt

Display name

Your full professional name. Max 60 characters.

Title

Your current role title. Max 80 characters.

Location

City and country. Max 60 characters.

Years of experience

Years of professional experience. E.g. "14+"

Professional summary

Max 500 characters. Used by the chat assistant to introduce you.

Values (one per line)

Anti-claims / what you refuse (one per line)

Expertise areas (one per line)

Industries served (one per line)

Approach / methodology (one per line)

Education details for the knowledge base. The chat assistant uses this to answer education-related questions accurately. Add degrees, certifications, and courses.

Add education entry

Degree / Certification

Institution

Year

Notes

Pre-loaded Q&As help the assistant answer common questions accurately.

Add any additional facts the assistant should know. These are freeform notes included in the AI's context. Good for recent projects, talks, publications, or temporary announcements.

Custom facts (one per line)

Direct JSON editor. Changes here override all other tabs.

Current status

Status note (shown to visitors)

General working hours

Timezone

Booking URL

Privacy reminder

The AI assistant will only tell visitors whether you are "available" or "not available." It will never share your schedule, location, activities, or reasons for unavailability. This is enforced at the system prompt level.

Time window: ● Live (30s)

0

Total queries

0

Active days

0

Last 1h

0

Avg/day

Word Cloud

Query Trend (last 14 days)

Intent Categories

Content Optimization Suggestions

AI-generated recommendations based on visitor queries

Recent Queries

F

Figma

Link Figma files to case studies. Each case study can store a Figma file URL and an embeddable frame URL for presentations.

Default Figma team/project URL

Set a default Figma project. Individual case studies can override this.

Fr

Framer

Link Framer prototypes and published sites to case studies.

Default Framer workspace URL

G

Google Docs

Import content from Google Docs into case studies. Go to the Import Docs tab to paste content or fetch from a published URL.

C

Calendly

Embed Calendly directly in the portfolio. Visitors click "Book a meeting" and see a popup scheduler instead of leaving the site.

Calendly scheduling URL

Your Calendly event link. The popup widget loads automatically when this is set.

GC

Google Calendar (live availability)

Automatically check if you are currently free or busy. The chat assistant will say "available" or "not available" based on your actual calendar, without revealing what you are doing.

Google Calendar ID

Usually your Gmail address. Must be shared publicly (free/busy only).

Google API Key

Create at console.cloud.google.com with Calendar API enabled.

Setup steps:
1. Go to console.cloud.google.com
2. Enable "Google Calendar API"
3. Create an API Key (Credentials tab)
4. In Google Calendar settings, share your calendar with "See only free/busy" visibility
5. Paste the calendar ID and API key above
6. Set these as Vercel env vars: GOOGLE_CALENDAR_ID, GOOGLE_CALENDAR_KEY

Open your Google Doc, select all content (Ctrl+A), copy it, and paste below. The importer will convert it to clean Markdown.

Pasted content (plain text or HTML)

Publish your Google Doc first: File → Share → Publish to web. Then paste the published URL below.

Published Google Doc URL

Page title

50-60 characters ideal. Currently: 0/70

Meta description

155-160 characters ideal. Currently: 0/160

OG title (social sharing)

Defaults to page title if empty.

OG description

Canonical URL

Preferred URL for this page. Prevents duplicate content issues.

Primary keywords (one per line)

5-10 primary keywords. These drive your main search visibility.

Long-tail keywords (one per line)

10-20 long-tail keywords. Lower competition, higher conversion.

GEO keywords for AI search (one per line)

Question-format keywords that AI search engines use for citations.

Target markets

Malaysia Singapore India UAE US UK Germany Norway Sweden

AI-powered SEO/GEO analysis using Gemini. Analyzes your current meta, keywords, and content structure against target markets.

Uses Gemini API tokens. Typical analysis: ~2000 tokens.

0

Sessions tracked

0%

Avg scroll depth

0s

Avg session time

0

Total clicks

Click Heatmap

Section Attention (avg seconds)

Top Click Targets

AI Behavior Analysis

Gemini analyzes interaction patterns and suggests improvements

Track up to 11 competitors. AI analyzes their positioning against yours weekly.

Add competitor

Name

Website

LinkedIn / Social

Category

Maximum 11 competitors. Include portfolio URL and at least one social link.

Uses ~3000 Gemini tokens. Compares positioning, keywords, and content strategy.

AI predicts emerging trends in UX, AI design, and creative technology. Run weekly for best results.

Analyzes industry signals across target markets. Uses ~2500 Gemini tokens.

Industry state monitor: predicts what will be hyped before it becomes mainstream. Uses signals from tech blogs, hiring trends, conference topics, and social discussions.

Deep analysis of industry signals and skill demand. Uses ~3000 Gemini tokens.

Logo & Favicon

Site logo (SVG or PNG)

SVG or PNG. Max 200KB. Recommended: 120x40px for nav display.

Appears in the navigation bar. Recommended: SVG, max 200x40px.

Favicon (PNG, 32x32 or 64x64)

PNG, ICO, or SVG. 32x32px or 180x180px for Apple Touch Icon.

Browser tab icon. 32x32 PNG recommended.

Logo file path (after upload)

Favicon file path

Google Analytics

Google Analytics Measurement ID

Get this from analytics.google.com → Admin → Data Streams → your stream → Measurement ID. The tracking script loads automatically when this is set.

Resume

Resume URL (Google Doc or PDF link)

One-click access for visitors. Appears as a button in the hero section. Accepts Google Docs, Drive, or any public URL.

Resume button label

Background Music

Background music for the portfolio. Visitors toggle with the button in the bottom-left corner.

Now playing: Slow Moon - Martin Klem

audio/bg-music.mp3 · Loops on toggle

Replace background music

MP3 format, max 5MB. Loops continuously when visitor enables music.

Upload an MP3 to replace the background track. Deploy to apply.

Particle Effects

Background particle animation that adds depth to the portfolio.

Effect preset

Density (1 = sparse, 5 = dense)

Colors

Background

Card / Elevated

Accent

Text Primary

Text Secondary

Border

Typography

Display / Heading font

Body font

Mono / Code font

Add custom Google Font

Enter the exact font name from fonts.google.com. It will be loaded and added to the dropdown.

Presets

Live Preview

Experience Design Lead

I turn complexity into clarity

UX strategy, AI-assisted workflows, and cinematic visual storytelling. Evidence-first.

View case studies Book a call

UX Audit

Evidence-based evaluation for usability, conversion, and accessibility.

Kuala Lumpur, MY · 14+ Years

How it works

When you click Deploy, your edited files are committed directly to your GitHub repo via API. Vercel detects the push and auto-deploys within seconds. No manual download/upload needed.

Select files to deploy

Commit message

Commit message for version history. Max 120 characters.

Deployment History

View deployments at Vercel Dashboard

This CMS works client-side. When you save changes, files are prepared for download. Replace the corresponding files in your project folder, then deploy.

Updated case study index with all metadata, tags, and integration links.

Individual markdown files for each case study.

Hero, about, and experience content as structured JSON. Use to update index.html.

Any images uploaded this session, ready to place in your images/ folder.