christianV/CrazeAnalytix
1
0
Fork 0
mirror of https://github.com/christianvidalwolf-prog/CrazeAnalytix.git synced 2026-08-03 15:05:22 +02:00
Code Issues Packages Projects Releases Wiki Activity
Files
01e20eb0730e32ae466ef6ea6427381fb14920ca
CrazeAnalytix/presentacion.html
T

1132 lines
40 KiB
HTML
Raw Normal View History

feat: add weekly sales tab with WoW growth
2026-01-21 13:19:13 +01:00
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>CrazeAnalytix - Executive Presentation</title>
<style>
@page {
size: A4 landscape;
margin: 0;
}
@media print {
.slide {
page-break-after: always;
page-break-inside: avoid;
height: 100vh !important;
}
.slide:last-child {
page-break-after: auto;
}
body {
-webkit-print-color-adjust: exact !important;
print-color-adjust: exact !important;
}
.print-instructions {
display: none;
}
}
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
color: #e2e8f0;
line-height: 1.5;
}
.slide {
height: 100vh;
padding: 35px 55px;
display: flex;
flex-direction: column;
justify-content: flex-start;
background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
}
h1 {
font-size: 2.2rem;
background: linear-gradient(90deg, #818cf8, #c084fc);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
margin-bottom: 10px;
}
h2 {
font-size: 1.4rem;
color: #94a3b8;
margin-bottom: 15px;
}
h3 {
font-size: 1.15rem;
color: #818cf8;
margin: 12px 0 8px;
}
p {
font-size: 0.95rem;
margin-bottom: 10px;
max-width: 900px;
}
ul {
margin-left: 20px;
margin-bottom: 12px;
}
li {
font-size: 0.9rem;
margin-bottom: 6px;
}
img {
max-width: 100%;
max-height: 280px;
border-radius: 8px;
box-shadow: 0 12px 25px -8px rgba(0, 0, 0, 0.5);
margin: 15px 0;
border: 1px solid #334155;
object-fit: contain;
}
img.large {
max-height: 350px;
}
table {
border-collapse: collapse;
margin: 12px 0;
width: 100%;
max-width: 700px;
font-size: 0.85rem;
}
th,
td {
border: 1px solid #475569;
padding: 8px 12px;
text-align: left;
}
th {
background: #334155;
color: #818cf8;
}
td {
background: #1e293b;
}
.highlight {
color: #34d399;
font-weight: bold;
}
.warning {
color: #f87171;
}
blockquote {
border-left: 4px solid #818cf8;
padding-left: 15px;
margin: 12px 0;
color: #94a3b8;
font-style: italic;
font-size: 0.9rem;
}
.flow-diagram {
background: #1e293b;
padding: 15px;
border-radius: 8px;
font-family: monospace;
font-size: 0.85rem;
white-space: pre;
margin: 12px 0;
}
.title-slide {
text-align: center;
justify-content: center;
align-items: center;
}
.title-slide h1 {
font-size: 3.2rem;
}
.title-slide h2 {
font-size: 1.8rem;
}
.grid-2 {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 20px;
margin-top: 12px;
}
.grid-3 {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
gap: 15px;
margin-top: 12px;
}
.card {
background: #1e293b;
padding: 15px;
border-radius: 8px;
border: 1px solid #334155;
}
.card h3 {
margin-top: 0;
font-size: 1rem;
}
.card p {
font-size: 0.85rem;
margin-bottom: 0;
}
.feature-list {
list-style: none;
margin-left: 0;
}
.feature-list li {
padding: 8px 12px;
background: #1e293b;
border-radius: 6px;
margin-bottom: 8px;
border-left: 3px solid #818cf8;
}
.print-instructions {
position: fixed;
top: 8px;
right: 8px;
background: #818cf8;
color: white;
padding: 12px 16px;
border-radius: 6px;
font-size: 0.8rem;
z-index: 1000;
}
.section-title {
background: linear-gradient(90deg, rgba(129, 140, 248, 0.2), transparent);
padding: 8px 15px;
border-radius: 6px;
margin-bottom: 15px;
}
.badge {
display: inline-block;
background: #818cf8;
color: white;
padding: 2px 8px;
border-radius: 4px;
font-size: 0.75rem;
margin-right: 5px;
}
.badge.green {
background: #34d399;
}
.badge.orange {
background: #fb923c;
}
</style>
</head>
<body>
<div class="print-instructions">
📄 <strong>Save as PDF:</strong> Cmd+P → "Save as PDF" → Landscape A4
</div>
<!-- SLIDE 0: Title -->
<div class="slide title-slide">
<h1>🎯 CrazeAnalytix</h1>
<h2>Amazon Sales Analytics Platform</h2>
<p style="margin-top: 25px; color: #64748b;">Complete Feature Documentation</p>
<p style="color: #64748b;">Executive Presentation • January 2026</p>
</div>
<!-- SLIDE 1: Executive Summary -->
<div class="slide">
<h1>📋 Executive Summary</h1>
<h2>What is CrazeAnalytix?</h2>
<p><strong>CrazeAnalytix</strong> is a comprehensive Business Intelligence platform designed to consolidate,
analyze, and visualize Amazon sales data across multiple European markets in real-time.</p>
<div class="grid-3">
<div class="card">
<h3>📊 3 Main Tabs</h3>
<p>Dashboard, Grid, and Movers - each serving different analytical purposes</p>
</div>
<div class="card">
<h3>🌍 6 Markets</h3>
<p>Amazon DE, IT, FR, ES, UK, and Seller Central (SC) data in one place</p>
</div>
<div class="card">
<h3>🔄 Automatic Sync</h3>
<p>Live connection to Dropbox with daily auto-refresh at 7:00 AM</p>
</div>
</div>
<h3>Core Capabilities:</h3>
<ul class="feature-list">
<li>📈 <strong>Year-over-Year Analysis</strong> - Compare 2024, 2025, and 2026 performance instantly</li>
<li>🌍 <strong>Pan-EU Grouping</strong> - View DE+IT+FR+ES as a unified European market</li>
<li>📅 <strong>Weekly & Monthly Trends</strong> - Detect seasonality and peak periods</li>
<li>🚀 <strong>Growth Analytics</strong> - Identify top performers and declining products</li>
<li>📥 <strong>CSV Export</strong> - Download filtered data for external analysis</li>
</ul>
</div>
<!-- SLIDE 2: App Structure -->
<div class="slide">
<h1>🏗️ Application Structure</h1>
<h2>Navigation & Layout Overview</h2>
<img src="file:///Users/christianvidalwolf/.gemini/antigravity/brain/6febf01b-1938-4a93-af99-97c309582cd2/top_filter_bar_details_1768921874047.png"
alt="App Structure">
<div class="grid-2">
<div>
<h3>Header Components:</h3>
<ul>
<li><span class="badge">Logo</span> CrazeAnalytix branding</li>
<li><span class="badge green">Live Sync</span> Real-time data status indicator</li>
<li><span class="badge">Data Settings</span> Source configuration</li>
<li><span class="badge">Navigation</span> Dashboard | Grid | Movers</li>
</ul>
</div>
<div>
<h3>Global Filter Bar:</h3>
<ul>
<li><strong>Customer</strong> - Amazon marketplace selection</li>
<li><strong>Year</strong> - Time period (2024-2026)</li>
<li><strong>Month / Week</strong> - Granular time filters</li>
<li><strong>Product Line / SKU / Title / ASIN</strong> - Product filters</li>
</ul>
</div>
</div>
</div>
<!-- SLIDE 3: Dashboard Overview -->
<div class="slide">
<h1>📊 Tab 1: Dashboard</h1>
<h2>High-Level Performance Overview</h2>
<img src="file:///Users/christianvidalwolf/.gemini/antigravity/brain/6febf01b-1938-4a93-af99-97c309582cd2/dashboard_overview_1768920783550.png"
alt="Dashboard Overview" class="large">
<p>The Dashboard provides an <strong>executive-level snapshot</strong> of overall business health, featuring key
performance indicators, revenue breakdowns, and trend analysis at a glance.</p>
</div>
<!-- SLIDE 4: Dashboard KPIs -->
<div class="slide">
<h1>📈 Dashboard: KPI Cards</h1>
<h2>Real-Time Performance Metrics</h2>
<div class="grid-2">
<div class="card">
<h3>💰 Sell Out Revenue</h3>
<table>
<tr>
<th>Year</th>
<th>Revenue</th>
<th>YoY Change</th>
</tr>
<tr>
<td>2026</td>
<td class="highlight">€304.723,14</td>
<td class="highlight">+30.0%</td>
</tr>
<tr>
<td>2025</td>
<td>€6.895.382,51</td>
<td>+16.4%</td>
</tr>
<tr>
<td>2024</td>
<td>€7.697.655,55</td>
<td>-</td>
</tr>
</table>
<p>Total revenue with automatic year-over-year percentage calculation</p>
</div>
<div class="card">
<h3>📦 Units Sold</h3>
<table>
<tr>
<th>Year</th>
<th>Units</th>
<th>YoY Change</th>
</tr>
<tr>
<td>2026</td>
<td class="highlight">45.010</td>
<td class="highlight">+55.5%</td>
</tr>
<tr>
<td>2025</td>
<td>996.213</td>
<td>+6.2%</td>
</tr>
<tr>
<td>2024</td>
<td>1.061.909</td>
<td>-</td>
</tr>
</table>
<p>Volume metrics with growth indicators</p>
</div>
</div>
<h3>Key Features:</h3>
<ul>
<li>✅ <strong>Color-coded growth</strong> - Green for positive, red for negative trends</li>
<li>✅ <strong>European number format</strong> - Dots as thousands separator (1.234,56)</li>
<li>✅ <strong>Real-time updates</strong> - Data refreshes when filters change</li>
</ul>
</div>
<!-- SLIDE 5: Dashboard Charts -->
<div class="slide">
<h1>📊 Dashboard: Revenue Charts</h1>
<h2>Product Line Breakdown</h2>
<div class="grid-2">
<div>
<h3>Revenue by Product Line</h3>
<p>Horizontal bar chart showing revenue contribution by product category:</p>
<ul>
<li><strong>INKEE</strong> - Bath bombs and surprise toys</li>
<li><strong>MAGIC PONYS</strong> - Collectible figures</li>
<li><strong>ADVENT CALENDAR</strong> - Seasonal items</li>
<li><strong>RINKATINK TOY MAGIC</strong> - Educational toys</li>
<li><strong>GALLERY TOY'S MAGIC</strong> - Premium toys</li>
</ul>
<blockquote>Toggle between <strong>Sell Out (€)</strong> and <strong>Units</strong> using the buttons
above the chart</blockquote>
</div>
<div>
<h3>Units by Product Line (Overview)</h3>
<p>Multi-year comparison bar chart showing:</p>
<ul>
<li>📊 <strong>2024</strong> - Historical baseline (pink)</li>
<li>📊 <strong>2025</strong> - Previous year (purple)</li>
<li>📊 <strong>2026</strong> - Current year (blue)</li>
</ul>
<p>Enables quick identification of:</p>
<ul>
<li>Products with growing demand</li>
<li>Products losing market share</li>
<li>Seasonal patterns across years</li>
</ul>
</div>
</div>
</div>
<!-- SLIDE 6: Dashboard Growth Tables -->
<div class="slide">
<h1>📈 Dashboard: Growth & Decline Analysis</h1>
<h2>Top Performers & Problem Areas</h2>
<img src="file:///Users/christianvidalwolf/.gemini/antigravity/brain/6febf01b-1938-4a93-af99-97c309582cd2/dashboard_growth_decline_tables_1768921516265.png"
alt="Growth Tables">
<div class="grid-2">
<div class="card">
<h3>✅ Fastest Growing Lines</h3>
<ul>
<li>Shows top 5 product lines by revenue growth</li>
<li>Displays <strong>€ difference</strong> (absolute change)</li>
<li>Shows <strong>% change</strong> year-over-year</li>
<li>Identifies products driving business growth</li>
</ul>
</div>
<div class="card">
<h3>❌ Declining Lines</h3>
<ul>
<li>Highlights products with negative growth</li>
<li>Sorted by largest revenue decline</li>
<li class="warning">Alerts management to problem areas</li>
<li>Enables proactive inventory decisions</li>
</ul>
</div>
</div>
</div>
<!-- SLIDE 7: Grid Tab Overview -->
<div class="slide">
<h1>📋 Tab 2: Grid</h1>
<h2>Detailed Data Analysis & Export</h2>
<img src="file:///Users/christianvidalwolf/.gemini/antigravity/brain/6febf01b-1938-4a93-af99-97c309582cd2/grid_tab_details_1768920927843.png"
alt="Grid Tab" class="large">
<p>The Grid tab provides <strong>granular access to all sales data</strong> with powerful filtering, grouping,
sorting, and export capabilities for detailed analysis.</p>
</div>
<!-- SLIDE 8: Grid Weekly Chart -->
<div class="slide">
<h1>📈 Grid: Weekly Sales Comparison</h1>
<h2>52-Week Trend Analysis</h2>
<h3>Interactive Line Chart Features:</h3>
<div class="grid-2">
<div>
<ul class="feature-list">
<li>📊 <strong>Sell Out 2024</strong> - Pink line showing historical revenue</li>
<li>📊 <strong>Sell Out 2025</strong> - Red line for previous year</li>
<li>📊 <strong>Sell Out 2026</strong> - Green line for current year</li>
</ul>
</div>
<div>
<ul class="feature-list">
<li>📦 <strong>Units 2024</strong> - Blue dashed line</li>
<li>📦 <strong>Units 2025</strong> - Cyan dashed line</li>
<li>📦 <strong>Units 2026</strong> - Teal dashed line</li>
</ul>
</div>
</div>
<h3>Use Cases:</h3>
<ul>
<li>🎄 <strong>Peak Detection</strong> - Identify Christmas, Easter, and back-to-school spikes</li>
<li>📉 <strong>Low Season Analysis</strong> - Plan inventory for slow periods</li>
<li>📅 <strong>Week-by-Week Comparison</strong> - See exact performance differences</li>
<li>🔍 <strong>Hover Tooltips</strong> - Get precise values for any data point</li>
</ul>
</div>
<!-- SLIDE 9: Grid Data Table -->
<div class="slide">
<h1>📋 Grid: Interactive Data Table</h1>
<h2>Complete Sales Data Access</h2>
<h3>Table Structure:</h3>
<table>
<tr>
<th>Column</th>
<th>Description</th>
<th>Sortable</th>
</tr>
<tr>
<td><strong>Product Line</strong></td>
<td>Product category (INKEE, MAGIC PONYS, etc.)</td>
<td>✅</td>
</tr>
<tr>
<td><strong>Customer</strong></td>
<td>Amazon marketplace (Pan-EU, UK, SC)</td>
<td>✅</td>
</tr>
<tr>
<td><strong>SKU</strong></td>
<td>Stock Keeping Unit identifier</td>
<td>✅</td>
</tr>
<tr>
<td><strong>Title</strong></td>
<td>Product name</td>
<td>✅</td>
</tr>
<tr>
<td><strong>Sell Out 2024</strong></td>
<td>Revenue previous year</td>
<td>✅</td>
</tr>
<tr>
<td><strong>Sell Out 2025</strong></td>
<td>Revenue last year with YoY %</td>
<td>✅</td>
</tr>
<tr>
<td><strong>Sell Out 2026</strong></td>
<td>Revenue current year with YoY %</td>
<td>✅</td>
</tr>
<tr>
<td><strong>Units (2024-2026)</strong></td>
<td>Volume metrics per year</td>
<td>✅</td>
</tr>
</table>
<blockquote>Click any column header to sort ascending/descending. Click again to reverse sort order.
</blockquote>
</div>
<!-- SLIDE 10: Grid Pan-EU Grouping -->
<div class="slide">
<h1>🌍 Grid: Pan-EU Grouping Feature</h1>
<h2>Unified European Market View</h2>
<h3>How It Works:</h3>
<div class="grid-2">
<div class="card">
<h3>🔹 No Country Filter Applied</h3>
<p>When viewing all data without customer filter:</p>
<ul>
<li><strong>Pan-EU</strong> = DE + IT + FR + ES combined</li>
<li><strong>Amazon UK</strong> = United Kingdom only</li>
<li><strong>Amazon SC</strong> = Seller Central only</li>
</ul>
<p class="highlight">Perfect for European market overview</p>
</div>
<div class="card">
<h3>🔸 Country Filter Applied</h3>
<p>When selecting a specific country:</p>
<ul>
<li>Pan-EU grouping is <strong>disabled</strong></li>
<li>Shows individual country data only</li>
<li>Enables deep-dive into specific markets</li>
</ul>
<p>Example: Filter "Amazon DE" → See only Germany</p>
</div>
</div>
<blockquote>This feature eliminates the need for manual Excel grouping and saves hours of work monthly.
</blockquote>
</div>
<!-- SLIDE 11: Grid Group By -->
<div class="slide">
<h1>🔧 Grid: Group By Options</h1>
<h2>Dynamic Data Aggregation</h2>
<img src="file:///Users/christianvidalwolf/.gemini/antigravity/brain/6febf01b-1938-4a93-af99-97c309582cd2/grid_group_by_options_1768921782657.png"
alt="Group By Options">
<h3>Available Grouping Dimensions:</h3>
<div class="grid-2">
<div>
<ul>
<li><span class="badge">1</span> <strong>Product Line</strong> - Group by brand/category</li>
<li><span class="badge">2</span> <strong>Customer</strong> - Group by marketplace</li>
<li><span class="badge">3</span> <strong>SKU</strong> - Group by product code</li>
</ul>
</div>
<div>
<ul>
<li><span class="badge">4</span> <strong>Title</strong> - Group by product name</li>
<li><span class="badge">5</span> <strong>ASIN</strong> - Group by Amazon ID</li>
<li><span class="badge orange">Multi</span> Up to 4 dimensions simultaneously</li>
</ul>
</div>
</div>
<h3>Example Combinations:</h3>
<ul>
<li>📊 <strong>Customer → Product Line</strong> - See which product lines sell best in each market</li>
<li>📊 <strong>Product Line → SKU</strong> - Drill down from category to individual products</li>
<li>📊 <strong>Title only</strong> - Aggregate all variations of a product</li>
</ul>
</div>
<!-- SLIDE 12: Grid Filter Rows -->
<div class="slide">
<h1>🔍 Grid: Advanced Row Filtering</h1>
<h2>Precision Data Selection</h2>
<img src="file:///Users/christianvidalwolf/.gemini/antigravity/brain/6febf01b-1938-4a93-af99-97c309582cd2/grid_filter_options_1768921719013.png"
alt="Filter Options">
<h3>Filter Capabilities:</h3>
<table>
<tr>
<th>Metric</th>
<th>Operators Available</th>
<th>Example Use</th>
</tr>
<tr>
<td>Sell Out 2025</td>
<td>≥, ≤, =, ≠, contains</td>
<td>Find products with €10,000+ revenue</td>
</tr>
<tr>
<td>Sell Out 2026</td>
<td>≥, ≤, =, ≠, contains</td>
<td>Filter current year high performers</td>
</tr>
<tr>
<td>Units 2025</td>
<td>≥, ≤, =, ≠, contains</td>
<td>Find products selling 500+ units</td>
</tr>
<tr>
<td>Units 2026</td>
<td>≥, ≤, =, ≠, contains</td>
<td>Current volume analysis</td>
</tr>
<tr>
<td>% YoY Growth</td>
<td>≥, ≤, positive, negative</td>
<td>Find products growing 20%+</td>
</tr>
</table>
</div>
<!-- SLIDE 13: Grid Filtered Totals -->
<div class="slide">
<h1>📊 Grid: Filtered Totals Summary</h1>
<h2>Real-Time Aggregation</h2>
<h3>Summary Bar Components:</h3>
<div class="grid-2">
<div class="card">
<h3>2026 Totals</h3>
<ul>
<li>💰 <strong>€304.723</strong> total filtered revenue</li>
<li>📦 <strong>45.010</strong> total filtered units</li>
<li>📈 <strong>+84.8%</strong> YoY growth indicator</li>
</ul>
</div>
<div class="card">
<h3>2025 Totals</h3>
<ul>
<li>💰 <strong>€6.895.383</strong> revenue</li>
<li>📦 <strong>996.213</strong> units</li>
<li>📈 <strong>+16.4%</strong> vs 2024</li>
</ul>
</div>
</div>
<h3>Dynamic Updates:</h3>
<ul>
<li>✅ Totals update <strong>instantly</strong> when filters are applied</li>
<li>✅ Shows aggregate of <strong>visible rows only</strong></li>
<li>✅ Enables quick <strong>"what-if" analysis</strong> - filter by product line and see total impact</li>
<li>✅ Row counter shows <strong>"Showing X of Y rows"</strong></li>
</ul>
</div>
<!-- SLIDE 14: Grid Export -->
<div class="slide">
<h1>📥 Grid: CSV Export</h1>
<h2>Data Download for External Analysis</h2>
<h3>Export Features:</h3>
<div class="grid-2">
<div>
<ul class="feature-list">
<li>📄 <strong>Export CSV</strong> button in top-right</li>
<li>📊 Downloads <strong>currently filtered view</strong></li>
<li>📋 Includes all visible columns</li>
<li>🔢 Numbers in European format</li>
</ul>
</div>
<div>
<ul class="feature-list">
<li>📎 Ready for Excel/Google Sheets</li>
<li>📧 Perfect for email reports</li>
<li>📈 Import into other BI tools</li>
<li>💾 Local backup of filtered data</li>
</ul>
</div>
</div>
<h3>Use Cases:</h3>
<ul>
<li>📊 Export product line data for quarterly presentations</li>
<li>📧 Share filtered views with non-app users via email</li>
<li>📈 Combine with advertising data in Excel for ROAS analysis</li>
<li>💼 Prepare board reports with selected metrics</li>
</ul>
</div>
<!-- SLIDE 15: Movers Tab Overview -->
<div class="slide">
<h1>🚀 Tab 3: Movers</h1>
<h2>Growth Analytics & SKU Performance</h2>
<img src="file:///Users/christianvidalwolf/.gemini/antigravity/brain/6febf01b-1938-4a93-af99-97c309582cd2/movers_tab_gainers_1768921014485.png"
alt="Movers Tab" class="large">
<p>The Movers tab identifies <strong>the fastest growing and fastest declining SKUs</strong>, enabling quick
action on top performers and problem products.</p>
</div>
<!-- SLIDE 16: Movers Features -->
<div class="slide">
<h1>📈 Movers: Feature Breakdown</h1>
<h2>Analytics Overview</h2>
<h3>Control Panel:</h3>
<div class="grid-2">
<div class="card">
<h3>🔀 Movement Toggles</h3>
<ul>
<li><span class="badge green">Top Gainers</span> Products with highest growth</li>
<li><span class="badge warning">Top Losers</span> Products with biggest decline</li>
</ul>
</div>
<div class="card">
<h3>📊 Metric Selection</h3>
<ul>
<li><span class="badge">Sell Out €</span> Analyze by revenue</li>
<li><span class="badge">Units</span> Analyze by volume</li>
</ul>
</div>
</div>
<h3>Leaderboard Columns:</h3>
<table>
<tr>
<th>Column</th>
<th>Description</th>
</tr>
<tr>
<td><strong>Rank</strong></td>
<td>Position in top 20 (1-20)</td>
</tr>
<tr>
<td><strong>SKU Details</strong></td>
<td>Product name with SKU code</td>
</tr>
<tr>
<td><strong>Product Line</strong></td>
<td>Category/brand</td>
</tr>
<tr>
<td><strong>2025</strong></td>
<td>Previous year value (€ or units)</td>
</tr>
<tr>
<td><strong>2026</strong></td>
<td>Current year value</td>
</tr>
<tr>
<td><strong>Diff</strong></td>
<td>Absolute difference (€ or units)</td>
</tr>
<tr>
<td><strong>% Change</strong></td>
<td class="highlight">Year-over-year growth percentage</td>
</tr>
</table>
</div>
<!-- SLIDE 17: Movers Examples -->
<div class="slide">
<h1>🏆 Movers: Real Examples</h1>
<h2>Top Gainers Analysis</h2>
<h3>Sample Top Gainers (Units):</h3>
<table>
<tr>
<th>Rank</th>
<th>Product</th>
<th>Line</th>
<th>2025</th>
<th>2026</th>
<th>+/-</th>
<th>%</th>
</tr>
<tr>
<td>1</td>
<td>MAGIC PONYS - School Of Magic</td>
<td>MAGIC PONYS</td>
<td>€478</td>
<td>€715</td>
<td class="highlight">+€237</td>
<td class="highlight">+71.4%</td>
</tr>
<tr>
<td>2</td>
<td>INKEE - Surprise XXL Bath Bomb</td>
<td>INKEE</td>
<td>€438</td>
<td>€522</td>
<td class="highlight">+€84</td>
<td class="highlight">+19.2%</td>
</tr>
<tr>
<td>3</td>
<td>INKEE - Surprise Bath Bomb Rescue</td>
<td>INKEE</td>
<td>€17</td>
<td>€83</td>
<td class="highlight">+€66</td>
<td class="highlight">+400%</td>
</tr>
</table>
<h3>Insights Enabled:</h3>
<ul>
<li>🏆 Quickly identify which SKUs are driving growth</li>
<li>📦 Prioritize inventory replenishment for top performers</li>
<li>💡 Inform marketing budget allocation</li>
<li>🎯 Focus sales efforts on winning products</li>
</ul>
</div>
<!-- SLIDE 18: Data Settings -->
<div class="slide">
<h1>⚙️ Data Settings</h1>
<h2>Source Configuration & Sync Management</h2>
<img src="file:///Users/christianvidalwolf/.gemini/antigravity/brain/6febf01b-1938-4a93-af99-97c309582cd2/data_settings_modal_1768921607972.png"
alt="Data Settings Modal">
<div class="grid-2">
<div class="card">
<h3>☁️ Cloud Sync</h3>
<ul>
<li><span class="badge green">Live Sync</span> Active connection to Dropbox</li>
<li>🔄 <strong>Sync Now</strong> - Manual refresh button</li>
<li>⏰ <strong>Auto-refresh</strong> - Daily at 7:00 AM</li>
</ul>
</div>
<div class="card">
<h3>📂 Local Uploads</h3>
<ul>
<li>📊 <strong>Sales CSV</strong> - Main sales data file</li>
<li>📣 <strong>Ads CSV</strong> - Advertising expenses data</li>
<li>📎 Drag-and-drop supported</li>
</ul>
</div>
</div>
</div>
<!-- SLIDE 19: Automation Flow -->
<div class="slide">
<h1>🔄 Data Automation</h1>
<h2>End-to-End Data Pipeline</h2>
<div class="flow-diagram">
┌─────────────────┐ ┌─────────────────┐ ┌─────────────────┐ ┌─────────────────┐
│ Master CSV │────▶│ Dropbox │────▶│ API Proxy │────▶│ CrazeAnalytix │
│ (Updated by │ │ (Cloud Host) │ │ (/api/fetch) │ │ (Dashboard) │
│ team) │ │ │ │ │ │ │
└─────────────────┘ └─────────────────┘ └─────────────────┘ └─────────────────┘
│
▼
┌─────────────────┐
│ IndexedDB │
│ (Local Cache) │
└─────────────────┘
</div>
<table>
<tr>
<th>Feature</th>
<th>Description</th>
<th>Benefit</th>
</tr>
<tr>
<td>🔄 Daily Sync</td>
<td>Automatic fetch at 7:00 AM</td>
<td>Always fresh data</td>
</tr>
<tr>
<td>💾 Local Cache</td>
<td>IndexedDB storage</td>
<td>Fast loading, offline support</td>
</tr>
<tr>
<td>🔗 Live Indicator</td>
<td>Green dot in header</td>
<td>Connection status visibility</td>
</tr>
<tr>
<td>⚡ Manual Refresh</td>
<td>Sync Now button</td>
<td>Immediate updates when needed</td>
</tr>
</table>
</div>
<!-- SLIDE 20: Number Formatting -->
<div class="slide">
<h1>🇪🇺 European Number Formatting</h1>
<h2>Regional Display Standards</h2>
<p>All numerical values throughout the application use <strong>European formatting standards</strong> for
consistency with local business practices.</p>
<div class="grid-2">
<div class="card">
<h3>Format Rules</h3>
<table>
<tr>
<th>Element</th>
<th>Character</th>
</tr>
<tr>
<td>Thousands separator</td>
<td class="highlight">. (period)</td>
</tr>
<tr>
<td>Decimal separator</td>
<td class="highlight">, (comma)</td>
</tr>
<tr>
<td>Currency symbol</td>
<td class="highlight">€ (before)</td>
</tr>
</table>
</div>
<div class="card">
<h3>Examples</h3>
<table>
<tr>
<th>Value</th>
<th>Display</th>
</tr>
<tr>
<td>1234.56</td>
<td class="highlight">€1.234,56</td>
</tr>
<tr>
<td>1000000</td>
<td class="highlight">1.000.000</td>
</tr>
<tr>
<td>6895382.51</td>
<td class="highlight">€6.895.382,51</td>
</tr>
</table>
</div>
</div>
<h3>Applied Throughout:</h3>
<ul>
<li>✅ Dashboard KPI cards</li>
<li>✅ Grid table cells</li>
<li>✅ Movers leaderboard</li>
<li>✅ Chart tooltips</li>
<li>✅ Filtered totals summary</li>
<li>✅ CSV exports</li>
</ul>
</div>
<!-- SLIDE 21: Business Benefits -->
<div class="slide">
<h1>💼 Business Benefits</h1>
<h2>ROI & Operational Improvements</h2>
<div class="grid-2">
<div class="card">
<h3>⏱️ Time Savings</h3>
<ul>
<li><strong>Before:</strong> 4+ hours/week Excel consolidation</li>
<li><strong>After:</strong> Instant, automatic updates</li>
<li class="highlight">Estimated: 16+ hours/month saved</li>
</ul>
</div>
<div class="card">
<h3>📊 Better Decisions</h3>
<ul>
<li>Real-time visibility into trends</li>
<li>Quick identification of problems</li>
<li class="highlight">Data-driven inventory management</li>
</ul>
</div>
<div class="card">
<h3>🌍 Unified View</h3>
<ul>
<li>6 Amazon markets in one place</li>
<li>Pan-EU grouping for Europe overview</li>
<li class="highlight">No more switching between reports</li>
</ul>
</div>
<div class="card">
<h3>👥 Team Collaboration</h3>
<ul>
<li>Shared access via web URL</li>
<li>No software installation required</li>
<li class="highlight">Everyone sees the same data</li>
</ul>
</div>
</div>
</div>
<!-- SLIDE 22: Access Information -->
<div class="slide">
<h1>🔗 Access & Requirements</h1>
<h2>How to Use CrazeAnalytix</h2>
<div class="grid-2">
<div class="card">
<h3>🌐 URLs</h3>
<table>
<tr>
<th>Environment</th>
<th>URL</th>
</tr>
<tr>
<td><strong>Production</strong></td>
<td>https://crazeanalytix.vercel.app</td>
</tr>
<tr>
<td><strong>Development</strong></td>
<td>http://localhost:3000</td>
</tr>
</table>
</div>
<div class="card">
<h3>💻 Requirements</h3>
<ul>
<li>🌐 Modern web browser (Chrome, Firefox, Safari, Edge)</li>
<li>📱 Works on desktop and tablet</li>
<li>🔒 No login required</li>
<li>⚡ Internet connection for data sync</li>
</ul>
</div>
</div>
<h3>Technical Stack:</h3>
<ul>
<li>⚛️ <strong>React + TypeScript</strong> - Modern frontend framework</li>
<li>☁️ <strong>Vercel</strong> - Cloud hosting with global CDN</li>
<li>📦 <strong>Dropbox API</strong> - Cloud data storage</li>
<li>💾 <strong>IndexedDB</strong> - Local caching for performance</li>
</ul>
</div>
<!-- SLIDE 23: Summary -->
<div class="slide title-slide">
<h1>✨ Summary</h1>
<h2>CrazeAnalytix Key Takeaways</h2>
<ul style="text-align: left; max-width: 650px; margin-top: 25px;">
<li>1️⃣ <strong>Dashboard</strong> - Executive overview with KPIs, charts, and growth tables</li>
<li>2️⃣ <strong>Grid</strong> - Detailed data with Pan-EU grouping, filtering, and CSV export</li>
<li>3️⃣ <strong>Movers</strong> - Top 20 gainers and losers by SKU performance</li>
<li>4️⃣ <strong>8 Global Filters</strong> - Customer, Year, Month, Week, Line, SKU, Title, ASIN</li>
<li>5️⃣ <strong>Automatic Sync</strong> - Daily updates from Dropbox at 7:00 AM</li>
<li>6️⃣ <strong>European Format</strong> - Numbers displayed as 1.234,56</li>
<li>7️⃣ <strong>No Installation</strong> - Access via web browser, no setup required</li>
</ul>
<p style="margin-top: 35px; color: #64748b;">Presentation generated: January 20, 2026</p>
</div>
</body>
</html>
Reference in New Issue Copy Permalink