Translation Testing Guide: Settings, Modals, Authentication, and Overlays

Area: User Settings, Persona Settings, Notifications, Authentication Screens, Welcome Modal, Tours, Command Palette, Tooltips, Dialogs

Translation Files: settings.json, auth.json, notifications.json, common.json, tooltips.json, tours.json

---

How to Get Here

The elements in this guide are not regular pages -- they are popups, overlays, and separate screens that appear when you perform specific actions. Each section below explains exactly how to open it.

---

What You'll See

This guide covers elements that float on top of the main application or appear on separate screens:

• Modals -- popup windows that appear in the center of the screen with a dark background behind them
• Overlays -- panels that slide in from the side or appear over the current content
• Authentication screens -- the login and signup pages (separate from the main app)
• Toast notifications -- small messages that appear briefly at the bottom of the screen
• Tooltips -- small text labels that appear when you hold your mouse over a button or icon

---

User Settings Modal

How to Get Here

1. Look at the top-right corner of the screen
2. Click on your name (or your profile picture)
3. A dropdown menu will appear
4. Click "Settings" (or its Spanish translation)

What You'll See

A popup window with settings organized in sections:

• Profile information fields (name, email, etc.)
• Preference toggles (on/off switches) with labels
• Language preference (should already show Spanish)
• Notification preferences
• Save and Cancel buttons at the bottom

Text to Check

Element	What to Look For
Modal title	"Settings" or its translation
Section headings	Profile, Preferences, Notifications, etc.
Field labels	Name, Email, and other profile fields
Toggle labels	Text next to each on/off switch
Button text	"Save", "Cancel"
Success message	Message shown after saving

---

Persona Settings Modal

How to Get Here

1. Click on your name in the top-right corner
2. In the dropdown menu, click "Personalize Experience" (or its Spanish translation)

What You'll See

A popup window with three sections:

AI Persona Selection

Four options, each with a name and description:

• Blossom -- warm and supportive, like a trusted friend
• Strategist -- analytical and data-driven, focuses on numbers and strategy
• Coach -- motivational and energetic, keeps you moving forward
• Consultant -- professional and direct, gets straight to the point

Each persona shows an icon, the name, and a short description of their style.

UI Theme Selection

Three visual themes, each with a name and description:

• Purple Blossom -- light and warm, the default look
• Mission Control -- dark space theme with a professional feel
• Midnight Mode -- true dark theme, easy on the eyes

Each theme shows a small preview of what the interface will look like.

Verbosity Level

Three options for how much detail the AI gives you:

• Concise -- short, to-the-point responses
• Balanced -- a mix of brevity and detail
• Detailed -- thorough, comprehensive responses

Buttons

• Save -- saves your choices
• Cancel -- closes without saving

Text to Check (Persona Modal)

Element	What to Look For
Modal title	"Personalize Experience" or its translation
Section headings	AI Persona, Theme, Verbosity (or their translations)
Persona names	Blossom, Strategist, Coach, Consultant (check if translated or kept in English)
Persona descriptions	Each description should be in natural Spanish
Theme names	Purple Blossom, Mission Control, Midnight Mode (check if translated or kept in English)
Theme descriptions	Each description should be in Spanish
Verbosity labels	Concise, Balanced, Detailed
Verbosity descriptions	Explanation of each level
Buttons	"Save", "Cancel"

---

Notifications

Toast Notifications

These are small messages that appear briefly at the bottom of the screen and then disappear. They come in four types:

• Success (green) -- "Changes saved", "Email sent", etc.
• Error (red) -- "Something went wrong", "Could not save", etc.
• Warning (yellow) -- "Are you sure?", "This will delete...", etc.
• Info (blue) -- "New feature available", "Update complete", etc.

How to trigger them: Perform any action in the app (save something, create something, delete something). The notification will appear automatically.

Notification Panel

1. Look at the header bar at the top of the screen
2. Find the bell icon
3. Click the bell icon -- a panel slides open showing your notifications

The panel shows:

• Panel title (for example, "Notifications" or its translation)
• "Mark all read" button
• "View all" button
• A list of notification items, each showing:

- Title of the notification

- Timestamp (for example, "2 hours ago", "Yesterday")

- Category label (feature, AI, community, system, learning)

Notification Preferences

Inside the Settings modal, there is a notification section showing:

• Category names (each type of notification)
• Frequency options (Immediately, Daily, Weekly, Off)

Sparks Area (Bottom of Sidebar)

At the very bottom of the sidebar, there is a small area that shows:

• Celebration messages when you achieve something
• Achievement notifications (for example, "Profile 100% complete!")
• Short encouraging messages

Text to Check (Notifications)

Element	What to Look For
Toast messages	All success, error, warning, and info messages
Panel title	"Notifications"
"Mark all read"	Button text
"View all"	Button text
Timestamps	"2 hours ago", "Yesterday", etc. (should use Spanish time words)
Category labels	Feature, AI, Community, System, Learning
Frequency options	Immediately, Daily, Weekly, Off
Sparks messages	Celebration and achievement messages

---

Authentication Screens

How to Get Here

Log out of the application, or open the login page directly in your browser. This is the very first screen users see.

What You'll See

Login Tab

• Tab label: "Log In" (or its translation)
• Form fields:

- Email -- with placeholder text "Enter your email"

- Password -- with placeholder text "Enter your password"

• "Log In" button
• Links below the form:

- "Forgot Password?" -- opens password reset flow

- "Magic Link" -- sends a login link to your email

- "Remember this device" -- checkbox with label

• OAuth buttons (for example, "Sign in with Google")

Signup Tab

• Tab label: "Sign Up" (or its translation)
• Form fields:

- Full Name -- with placeholder text

- Email -- with placeholder text

- Password -- with placeholder text

• "Sign Up" button

Password Reset Flow

1. Click "Forgot Password?" on the login screen
2. You see a form asking for your email
3. After submitting, you see a confirmation message
4. Check: all labels, buttons, and messages in this flow

Two-Factor Authentication (2FA)

If 2FA is enabled, after entering your password you will see:

• A label asking for a verification code
• A text field for the code
• A hint about where to find the code
• A "Verify" button

Validation Messages

Try submitting the forms with missing or incorrect information to see error messages:

• Leave email empty -- check the error message
• Enter a short password -- check the error message
• Enter an invalid email format -- check the error message

Welcome Text

The login page also shows:

• A title or welcome heading
• A subtitle or tagline for the platform
• These set the first impression -- translation quality is very important here

Text to Check (Authentication)

Element	What to Look For
Tab labels	"Log In", "Sign Up"
Field labels	"Email", "Password", "Full Name"
Placeholder text	"Enter your email", "Enter your password"
Buttons	"Log In", "Sign Up", "Verify"
Links	"Forgot Password?", "Magic Link"
Checkbox labels	"Remember this device"
OAuth buttons	"Sign in with Google"
Validation errors	"Email is required", "Password too short", etc.
2FA labels	Verification code label and hints
Password reset messages	All text in the reset flow
Welcome heading and tagline	First text users see

---

Welcome Modal (First-Time Login)

How to Get Here

This popup appears automatically the first time you log in. If you have already dismissed it, you may need a fresh test account to see it again.

What You'll See

A large popup in the center of the screen showing:

• Title: "Welcome to PurpleBlossom.ai!" (or its translation)
• Subtitle and a short description of the platform
• Feature highlights -- three short bullet points:

- "AI-powered insights"

- "Smart campaigns"

- "Business analytics"

• Two buttons:

- "Take the 5-Minute Tour" -- starts the guided tour

- "I'll explore on my own" -- closes the popup

• A checkbox: "Don't show this again"
• A hint at the bottom: "Press T anytime to access tours"

Text to Check (Welcome Modal)

Element	What to Look For
Title	"Welcome to PurpleBlossom.ai!"
Subtitle and description	Platform introduction text
Feature highlights	"AI-powered insights", "Smart campaigns", "Business analytics"
Tour button	"Take the 5-Minute Tour"
Explore button	"I'll explore on my own"
Checkbox label	"Don't show this again"
Hint text	"Press T anytime to access tours"

---

Tour System

How to Get Here

Press the T key on your keyboard at any time while using the application.

What You'll See

An overlay appears showing available tours:

• A title for the tour selector
• A list of tours, each with:

- Tour name (for example, "Dashboard Tour", "Campaigns Tour")

- Short description of what the tour covers

• Within each tour, step-by-step instructions with labels

Also Check

• The hint text "Press T for tours" that may appear in the sidebar or header
• Step labels within each tour (for example, "Step 1 of 5")
• Navigation buttons within tours: "Next", "Previous", "Skip", "Finish"

Text to Check (Tours)

Element	What to Look For
Tour selector title	Title of the overlay
Tour names	"Dashboard Tour", "Campaigns Tour", etc.
Tour descriptions	What each tour covers
"Press T for tours"	Hint text
Step labels	"Step 1 of 5", etc.
Navigation buttons	"Next", "Previous", "Skip", "Finish"
Step content	The instructions within each step

---

Command Palette

How to Get Here

Press Ctrl+K (on Windows/Linux) or Cmd+K (on Mac) at any time.

What You'll See

A search box appears in the center of the screen with a list of commands below it:

• Search placeholder -- hint text inside the search box (for example, "Search commands...")
• Category headers grouping commands:

- "Navigation" -- commands to go to different screens

- "Actions" -- commands to perform tasks

- "Help" -- commands for help and guides

• Command names and their descriptions
• "Recent" label above recently used commands
• Keyboard shortcut labels shown next to each command (for example, "Ctrl+1")

Text to Check (Command Palette)

Element	What to Look For
Search placeholder	Hint text in the search box
Category headers	"Navigation", "Actions", "Help"
Command names	All command names in the list
Command descriptions	Short description next to each command
"Recent" label	Label above recent commands
Keyboard shortcut text	Text format (for example, "Ctrl" vs. "Cmd")

---

Tooltips

How to Get Here

Move your mouse over any button, icon, or interactive element and wait about one second. A small text label will appear near the element.

What You'll See

Small floating text labels that describe what a button or icon does. These appear throughout the entire application.

Where to Check

• Sidebar icons -- hover over each navigation icon
• Header icons -- hover over the bell, speaker, microphone, and user icons
• Dashboard elements -- hover over chart icons, action buttons
• Form field help icons -- small question mark icons next to form fields
• Tool-specific buttons -- hover over any button in any tool

Text to Check (Tooltips)

Element	What to Look For
Navigation tooltips	Description of each sidebar item
Header icon tooltips	"Notifications", "Audio", "Microphone", "Settings"
Button tooltips	Description of what the button does
Help icon tooltips	Explanation text for form fields

---

Common Dialog Messages

These are popup messages that appear in various situations throughout the application.

Confirmation Dialogs

When you try to delete something or perform a significant action:

• "Are you sure?" -- main question
• "This action cannot be undone" -- warning text
• Buttons: "Confirm" / "Cancel" (or "Delete" / "Cancel")

Unsaved Changes Warning

When you try to leave a page with unsaved work:

• "You have unsaved changes" -- warning message
• "Save and continue" / "Discard" / "Stay on page" -- buttons

Session Expired

When your login session runs out:

• "Your session has expired. Please log in again." -- message
• "Log In" button

Error Fallbacks

When something goes wrong:

• "An error occurred" -- general error
• "Network error" -- connection problem
• "Please try again" -- retry suggestion

Text to Check (Dialogs)

Element	What to Look For
Confirmation question	"Are you sure?"
Warning text	"This action cannot be undone"
Unsaved changes	"You have unsaved changes"
Session expired	"Your session has expired. Please log in again."
Error messages	"An error occurred", "Network error"
Button labels	"Confirm", "Cancel", "Delete", "Discard", "Save and continue"

---

Interactive Elements

Summary of all ways to open the elements in this guide:

Action	What Opens	Text to Check
Click your name (top-right)	Dropdown menu	Menu items: Settings, Personalize, Theme, Log Out
Click "Settings" in dropdown	Settings modal	All settings labels, toggles, buttons
Click "Personalize Experience" in dropdown	Persona modal	Persona names, descriptions, theme names, verbosity
Click notification bell	Notification panel	Titles, timestamps, categories, action buttons
Press T	Tour selector	Tour names, descriptions, step labels
Press Ctrl+K or Cmd+K	Command palette	Search placeholder, categories, command names
Press ?	Help panel	Help content and navigation
Press S	Toggle audio	Any audio status message
Press V	Toggle voice input	Any voice status message
Hover over any element	Tooltip	Tooltip text
Perform any action	Toast notification	Success, error, warning, or info message
Try to leave unsaved page	Unsaved changes dialog	Warning message and button labels
Wait for session to expire	Session expired dialog	Expiration message
Log out	Login screen	All authentication text

---

Common Issues to Watch For

1. Authentication screen sets the tone -- This is the very first thing users see. If the translation here feels awkward or incomplete, it creates a bad first impression. Pay extra attention to the welcome heading, login/signup labels, and error messages.

1. Persona descriptions should sound natural -- The descriptions for Blossom, Strategist, Coach, and Consultant should feel like they were written in Spanish, not translated word-for-word. They describe personality, so natural language matters.

1. Confirmation dialogs must be clear -- When the app asks "Are you sure?" before deleting something, the Spanish text must be completely unambiguous. A user should never be confused about what "Confirm" or "Cancel" will do.

1. Tooltip text is very short -- Spanish words are often longer than English. Check that tooltip translations still make sense even though they are brief. They should not be so short that they lose meaning, or so long that they look odd.

1. Timestamps and relative time -- "2 hours ago", "Yesterday", "Just now" -- these need to use natural Spanish time expressions, not literal translations.

1. Keyboard shortcut text -- Labels like "Ctrl+K" or "Cmd+K" should not be translated (these are keyboard key names), but surrounding text like "Press" or "to open" should be.

1. Validation error messages -- Form errors like "Email is required" must be clear and grammatically correct in Spanish. Test by submitting empty or invalid forms.

1. Modal titles and buttons -- Every modal (popup window) has a title and at least one button. Check that none are still in English.

1. Dropdown menu items -- The user dropdown (click your name) has menu items that should all be translated. These are easy to overlook.

1. Feature highlight text in Welcome modal -- "AI-powered insights", "Smart campaigns", "Business analytics" should be translated in a way that sounds exciting and appealing, not technical.

---

Checklist

User Settings Modal

• Modal title is in Spanish
• All section headings are in Spanish
• All field labels are in Spanish
• All toggle labels are in Spanish
• "Save" and "Cancel" buttons are in Spanish
• Success message after saving is in Spanish

Persona Settings Modal

• Modal title is in Spanish
• AI Persona section heading is in Spanish
• Persona descriptions are in natural Spanish
• Theme section heading is in Spanish
• Theme descriptions are in Spanish
• Verbosity labels and descriptions are in Spanish
• "Save" and "Cancel" buttons are in Spanish

Notifications

• Toast success messages are in Spanish
• Toast error messages are in Spanish
• Toast warning messages are in Spanish
• Toast info messages are in Spanish
• Notification panel title is in Spanish
• "Mark all read" is in Spanish
• "View all" is in Spanish
• Timestamps use natural Spanish expressions ("hace 2 horas", "Ayer")
• Category labels are in Spanish
• Notification frequency options are in Spanish
• Sparks celebration messages are in Spanish

Authentication Screens

• "Log In" tab label is in Spanish
• "Sign Up" tab label is in Spanish
• All form field labels are in Spanish
• All placeholder text is in Spanish
• "Log In" and "Sign Up" buttons are in Spanish
• "Forgot Password?" link is in Spanish
• "Magic Link" text is in Spanish
• "Remember this device" is in Spanish
• OAuth button text is in Spanish ("Sign in with Google")
• All validation error messages are in Spanish
• 2FA verification labels and hints are in Spanish
• Password reset flow -- all text is in Spanish
• Welcome heading and tagline are in Spanish

Welcome Modal

• Title is in Spanish
• Subtitle and description are in Spanish
• Feature highlights are in Spanish
• "Take the 5-Minute Tour" button is in Spanish
• "I'll explore on my own" button is in Spanish
• "Don't show this again" checkbox label is in Spanish
• "Press T anytime to access tours" hint is in Spanish

Tour System

• Tour selector title is in Spanish
• All tour names are in Spanish
• All tour descriptions are in Spanish
• "Press T for tours" hint is in Spanish
• Step labels ("Step 1 of 5") are in Spanish
• "Next", "Previous", "Skip", "Finish" buttons are in Spanish
• Step content (instructions) is in Spanish

Command Palette

• Search placeholder text is in Spanish
• Category headers ("Navigation", "Actions", "Help") are in Spanish
• All command names are in Spanish
• All command descriptions are in Spanish
• "Recent" label is in Spanish

Tooltips

• Sidebar icon tooltips are in Spanish
• Header icon tooltips are in Spanish
• Dashboard element tooltips are in Spanish
• Form field help tooltips are in Spanish

Common Dialogs

• "Are you sure?" confirmation is in Spanish
• "This action cannot be undone" warning is in Spanish
• "You have unsaved changes" warning is in Spanish
• Session expired message is in Spanish
• "An error occurred" fallback is in Spanish
• "Network error" message is in Spanish
• All dialog buttons ("Confirm", "Cancel", "Delete", etc.) are in Spanish

User Dropdown Menu

• "Settings" menu item is in Spanish
• "Personalize Experience" menu item is in Spanish
• "Log Out" menu item is in Spanish
• Any other menu items are in Spanish

General (All Overlays and Modals)

• No English text visible in any popup or overlay (except brand names and keyboard keys)
• Spanish text fits inside buttons and does not overflow
• Spanish text in tooltips is short but clear
• Timestamps and relative dates use natural Spanish
• Keyboard shortcut key names (Ctrl, Cmd, T) are not translated