Design System · Brainstorm

echogenie

Component exploration — teal palette · Manrope body · Comfortaa brand · frosted surfaces

Component 01

ECHODESK

Frosted Glass Card · product highlight

LIGHT MODE
ECHODESK

Every echo is
an opportunity

Turn conversations from any channel into insights, actions, and reports — automatically, without missing a single signal.

78%
follow-ups
−75%
violations
650%
ROI
/* echogenie / ECHODESK */
Multi-channel conversation analysis
Zero-hallucination AI responses
Smart action item detection
Deployed across every channel
DARK MODE
ECHODESK

Every echo is
an opportunity

Turn conversations from any channel into insights, actions, and reports — automatically, without missing a single signal.

78%
follow-ups
−75%
violations
650%
ROI
/* echogenie / ECHODESK */
Multi-channel conversation analysis
Zero-hallucination AI responses
Smart action item detection
Deployed across every channel
Component 02

Intelligence Loop

Feature Grid · hover to reveal · 2×2 tile layout

LIGHT MODE

echogenie

The Intelligence Loop

ECHODESK
Conversation Analysis
Every call, email, and chat transcribed and scored automatically.
INFOGENIE
Knowledge Base
Your documents and SOPs become an instant answer engine.
ECHOBOT
Intelligent Automation
Deploy custom bots across web, WhatsApp, and SMS in minutes.
echogenie
Intelligence Loop
All three products learn from each other, getting smarter daily.
1 PLATFORM · 3 PRODUCTS · ∞ INSIGHTS
DARK MODE

echogenie

The Intelligence Loop

ECHODESK
Conversation Analysis
Every call, email, and chat transcribed and scored automatically.
INFOGENIE
Knowledge Base
Your documents and SOPs become an instant answer engine.
ECHOBOT
Intelligent Automation
Deploy custom bots across web, WhatsApp, and SMS in minutes.
echogenie
Intelligence Loop
All three products learn from each other, getting smarter daily.
1 PLATFORM · 3 PRODUCTS · ∞ INSIGHTS
Component 03

Controls

Buttons · Dropdown · Radio Group

LIGHT MODE
Buttons
Dropdown
Select product
Radio Group
ECHODESK
Conversation Analysis & Intelligence
INFOGENIE
Smart Knowledge Base
ECHOBOT
AI-Powered Virtual Assistant
All products
Full Intelligence Loop
DARK MODE
Buttons
Dropdown
Select product
Radio Group
ECHODESK
Conversation Analysis & Intelligence
INFOGENIE
Smart Knowledge Base
ECHOBOT
AI-Powered Virtual Assistant
All products
Full Intelligence Loop
Component 04

Form

Text inputs · Textarea · Character counter · Submit

LIGHT MODE
ECHODESK

New conversation analysis

0/280
DARK MODE
ECHODESK

New conversation analysis

0/280
Component 05

Navigation

Navbar · Sidebar · Tabs

LIGHT MODE
Navbar
echogenie
Sidebar
Tabs
» All 47 calls this week · avg score 84/100
DARK MODE
Navbar
echogenie
Sidebar
Tabs
» All 47 calls this week · avg score 84/100
Component 06

Feedback

Toasts · Alerts · Badges · Tooltips

LIGHT MODE
Badges
LiveNewQA PassWarningFailedDraft
Alerts
Analysis complete
47 calls processed · 0 errors
i
INFOGENIE updated
3 new documents indexed
!
Low QA score detected
Agent #4 below threshold (61/100)
Transcription failed
Call #1042 · Retry or skip
Tooltips — hover each
Toasts — click to fire
DARK MODE
Badges
LiveNewQA PassWarningFailedDraft
Alerts
Analysis complete
47 calls processed · 0 errors
i
INFOGENIE updated
3 new documents indexed
!
Low QA score detected
Agent #4 below threshold (61/100)
Transcription failed
Call #1042 · Retry or skip
Tooltips — hover each
Toasts — click to fire
Component 07

Data

Stat Cards · Table · Mini Chart

LIGHT MODE
Stat Cards
Calls Analysed
2,847
+12% vs last month
Avg QA Score
87/100
+4pts vs last month
Follow-ups Done
78%
−3% vs last month
ROI This Month
650%
+41% vs last month
QA Score Trend · 12 weeks
W1W12
Agent Leaderboard
Agent
Calls
Score
Mood
Sarah Chen
42
94
Positive
Marcus Webb
38
87
Mixed
Priya Nair
31
76
Positive
Tom Ellison
19
61
Negative
DARK MODE
Stat Cards
Calls Analysed
2,847
+12% vs last month
Avg QA Score
87/100
+4pts vs last month
Follow-ups Done
78%
−3% vs last month
ROI This Month
650%
+41% vs last month
QA Score Trend · 12 weeks
W1W12
Agent Leaderboard
Agent
Calls
Score
Mood
Sarah Chen
42
94
Positive
Marcus Webb
38
87
Mixed
Priya Nair
31
76
Positive
Tom Ellison
19
61
Negative
Component 08

Modals

Dialog · Drawer · Confirm Sheet

LIGHT MODE
Dialog — centred overlay
Drawer — slides from right
Confirm Sheet — bottom destructive
DialogCentred overlay · backdrop blur · close on outside click
DrawerSlides from right · full height · scrollable content
ConfirmBottom sheet · swipe handle · destructive CTA
DARK MODE
Dialog — centred overlay
Drawer — slides from right
Confirm Sheet — bottom destructive
DialogCentred overlay · backdrop blur · close on outside click
DrawerSlides from right · full height · scrollable content
ConfirmBottom sheet · swipe handle · destructive CTA
Component 09

DataTable

Sort · Filter · Multi-select · Pagination · Full width

LIGHT MODE
ID
Agent
Product
Channel
Duration
Score
Priority
Actions
Mood
Status
Date
Lang
#1042
Sarah Chen
ECHODESK
Phone
4m 18s
94
Low
1
▲ Positive
Complete
2026-03-10
EN
#1041
Marcus Webb
ECHOBOT
WhatsApp
2m 05s
87
Low
2
● Mixed
Complete
2026-03-10
EN
#1040
Priya Nair
ECHODESK
Email
76
Med
3
▲ Positive
Pending
2026-03-09
FR
#1039
Tom Ellison
INFOGENIE
Phone
7m 44s
61
High
5
▼ Negative
Flagged
2026-03-09
EN
#1038
Sarah Chen
ECHODESK
Phone
3m 12s
91
Low
1
▲ Positive
Complete
2026-03-08
EN
#1037
Lena Park
ECHOBOT
SMS
0m 58s
83
Low
0
▲ Positive
Complete
2026-03-08
AR
1–6 of 30
rows:
DARK MODE
ID
Agent
Product
Channel
Duration
Score
Priority
Actions
Mood
Status
Date
Lang
#1042
Sarah Chen
ECHODESK
Phone
4m 18s
94
Low
1
▲ Positive
Complete
2026-03-10
EN
#1041
Marcus Webb
ECHOBOT
WhatsApp
2m 05s
87
Low
2
● Mixed
Complete
2026-03-10
EN
#1040
Priya Nair
ECHODESK
Email
76
Med
3
▲ Positive
Pending
2026-03-09
FR
#1039
Tom Ellison
INFOGENIE
Phone
7m 44s
61
High
5
▼ Negative
Flagged
2026-03-09
EN
#1038
Sarah Chen
ECHODESK
Phone
3m 12s
91
Low
1
▲ Positive
Complete
2026-03-08
EN
#1037
Lena Park
ECHOBOT
SMS
0m 58s
83
Low
0
▲ Positive
Complete
2026-03-08
AR
1–6 of 30
rows:
Component 10

Typography

Comfortaa × Manrope · scales · badges

LIGHT MODE
Display

Every echo is

an opportunity.

Headings — Manrope
H1

Conversation Intelligence Platform

H2

Analyse Every Call Automatically

H3

QA Score Trends — Last 12 Weeks

H4

Agent Performance Summary

H5

Inbound calls — March 2026

H6

Section title · subsection

Body — Manrope
Large — 18px / 400

Turn every conversation into a scored, structured, actionable insight — without lifting a finger.

Regular — 15px / 400

echogenie listens to your calls, emails, and chats — then surfaces action items, compliance flags, and QA scores automatically. No manual review, no missed signals, no guesswork.

Small — 13px / 400

Results may vary based on call volume and configuration. echogenie processes conversations in real time with zero data retention beyond your configured window.

Italic emphasis — 15px / 400

"The intelligence loop means your bots, knowledge base, and analytics all improve together — automatically."

Labels & Metadata
Field label

AGENT NAME · WORK EMAIL

Micro / eyebrow

COMPONENT 01 · DESIGN SYSTEM

Section subtitle

Buttons · Dropdown · Radio Group

Helper / caption

Max 280 characters · Markdown supported

Tag label (brand)
ECHODESK · INFOGENIE · ECHOBOT
Data & Numerics — Manrope
Stat — large

2,847

Calls Analysed

Score — accent

94/100

QA Score

Delta — positive

+41%

ROI vs last month

ID / code

#1042

Call reference

Timestamp

2026-03-10 · 4m 18s

Date · Duration

Brand — Comfortaa
Wordmark

echogenie

Product

ECHODESK

INFOGENIE

ECHOBOT

Badge / label
ECHODESKLiveDraft
Button text
Colour Roles
Primary

Conversation Intelligence · Call Analysis · Smart Routing

Secondary

Supporting metadata, captions, and helper text

Accent

echogenie · ECHODESK · Interactive elements & CTAs

Positive

↑ +41% ROI · QA Pass · Analysis Complete

Warning

! Low score detected · Agent #4 below threshold

Destructive

✕ Transcription failed · Call #1042 · Delete recording

DARK MODE
Display

Every echo is

an opportunity.

Headings — Manrope
H1

Conversation Intelligence Platform

H2

Analyse Every Call Automatically

H3

QA Score Trends — Last 12 Weeks

H4

Agent Performance Summary

H5

Inbound calls — March 2026

H6

Section title · subsection

Body — Manrope
Large — 18px / 400

Turn every conversation into a scored, structured, actionable insight — without lifting a finger.

Regular — 15px / 400

echogenie listens to your calls, emails, and chats — then surfaces action items, compliance flags, and QA scores automatically. No manual review, no missed signals, no guesswork.

Small — 13px / 400

Results may vary based on call volume and configuration. echogenie processes conversations in real time with zero data retention beyond your configured window.

Italic emphasis — 15px / 400

"The intelligence loop means your bots, knowledge base, and analytics all improve together — automatically."

Labels & Metadata
Field label

AGENT NAME · WORK EMAIL

Micro / eyebrow

COMPONENT 01 · DESIGN SYSTEM

Section subtitle

Buttons · Dropdown · Radio Group

Helper / caption

Max 280 characters · Markdown supported

Tag label (brand)
ECHODESK · INFOGENIE · ECHOBOT
Data & Numerics — Manrope
Stat — large

2,847

Calls Analysed

Score — accent

94/100

QA Score

Delta — positive

+41%

ROI vs last month

ID / code

#1042

Call reference

Timestamp

2026-03-10 · 4m 18s

Date · Duration

Brand — Comfortaa
Wordmark

echogenie

Product

ECHODESK

INFOGENIE

ECHOBOT

Badge / label
ECHODESKLiveDraft
Button text
Colour Roles
Primary

Conversation Intelligence · Call Analysis · Smart Routing

Secondary

Supporting metadata, captions, and helper text

Accent

echogenie · ECHODESK · Interactive elements & CTAs

Positive

↑ +41% ROI · QA Pass · Analysis Complete

Warning

! Low score detected · Agent #4 below threshold

Destructive

✕ Transcription failed · Call #1042 · Delete recording