igny8/docs/plans/implemented/UX-GUIDELINES.md

IGNY8 UX Guidelines

Last Updated: December 25, 2025

---

Design Principles

1. Concise Labels

Navigation & Tabs: Keep labels short (1-2 words max)

• ✅ Good: Queue, Drafts, Images, Review, Published
• ❌ Bad: Ready to Write, Finished Drafts, Review Before Publishing

Section Headers: Use simple, consistent terminology

• ✅ Good: SETUP, WORKFLOW, ACCOUNT, SETTINGS
• ❌ Bad: GET STARTED, CREATE CONTENT, MANAGE ACCOUNT, CONFIGURATION

2. Consistent Terminology

Use the same term throughout the system:

Concept	Correct Term	Avoid
Content measurement	"Content pieces"	"Credits"
Sidebar modules	Module name only	Verbose descriptions
Page titles	Match tab name	Flowery language

3. Page Titles

Page titles should be:

• Short and descriptive
• Match the sidebar navigation
• Consistent with tab labels

Dashboard (not "Your Content Creation Dashboard")
Keywords (not "Your Keywords")
Drafts (not "Your Articles" or "Finished Drafts")

4. Descriptions & Helper Text

• Keep descriptions short (under 10 words)
• Put longer explanations in tooltips or Help pages
• Dashboard cards: 3-5 word descriptions maximum

// ✅ Good
<ComponentCard title="Workflow Progress" desc="Track your content pipeline">

// ❌ Bad
<ComponentCard title="Your Content Journey" desc="Track your content creation progress from ideas to published articles">

5. Workflow Pipeline Labels

For pipeline stages, use arrow notation:

• ✅ Keywords → Clusters
• ❌ Organize Keywords

---

Navigation Structure

Sidebar Sections

Dashboard (standalone)

SETUP
├── Add Keywords
├── Sites
└── Thinker

WORKFLOW
├── Planner
├── Writer
├── Automation
├── Linker
└── Optimizer

ACCOUNT
├── Account Settings
├── Team
├── Plans & Billing
└── Usage

SETTINGS
├── Profile
├── AI Models
├── Publishing
└── Import / Export

HELP
└── Help & Docs

Module Tab Labels

Planner: Keywords | Clusters | Ideas

Writer: Queue | Drafts | Images | Review | Published

Thinker: Prompts | Author Profiles | Strategies | Image Testing

---

When to Add Explanatory Text

DO add explanations for:

• Help & Documentation pages
• First-time user onboarding flows
• Error messages and empty states
• Tooltips on hover

DON'T add explanations to:

• Navigation labels
• Tab labels
• Page headers
• Card descriptions on dashboards

---

User-Facing Terminology

Content & Pricing

Internal (Backend)	User-Facing (Frontend)
credits	"content pieces"
credits_remaining	"X remaining"
plan_credits_per_month	"monthly allowance"
Purchase Credits	Upgrade Plan
Credit Balance	Content Usage

Actions

Internal/Old	User-Facing
Generate	Create
Execute	Run
Configure	Set up
Insufficient credits	Content limit reached

---

Change History

Date	Change
Dec 25, 2025	Reverted verbose navigation labels to concise terms
Dec 25, 2025	Fixed Dashboard progress item descriptions
Dec 25, 2025	Fixed Writer module tabs (Queue, Drafts, etc.)
Dec 25, 2025	Fixed Planner module tabs (Keywords, Clusters, Ideas)
Dec 25, 2025	Restored original Automation pipeline stage names