adding some business tasks to look at including in the demo, and updating the slides
This commit is contained in:
itsamejms
@@ -25,7 +25,7 @@ export default function App() {
|
||||
const [soundEnabled, setSoundEnabled] = useState<boolean>(false);
|
||||
|
||||
// Shared state for cross-slide communication
|
||||
const [selectedGoal, setSelectedGoal] = useState<GoalType>('agents');
|
||||
const [selectedGoal, setSelectedGoal] = useState<GoalType>('writing');
|
||||
const [procureBudget, setProcureBudget] = useState<BudgetType>('budget');
|
||||
const [toastMessage, setToastMessage] = useState<string | null>(null);
|
||||
|
||||
|
||||
@@ -49,7 +49,7 @@ export default function ControlBar({
|
||||
</div>
|
||||
|
||||
<div className="flex items-center gap-2 order-2 sm:order-3 w-full sm:w-auto justify-between sm:justify-start">
|
||||
<button
|
||||
{/* <button
|
||||
onClick={() => {
|
||||
handleElementClick();
|
||||
onToggleAutoplay();
|
||||
@@ -63,7 +63,7 @@ export default function ControlBar({
|
||||
>
|
||||
{isAutoplay ? <Pause className="w-3 h-3 text-emerald-400 animate-pulse" /> : <Play className="w-3 h-3" />}
|
||||
<span>{isAutoplay ? 'AUTOPLAY: ON' : 'AUTOPLAY: OFF'}</span>
|
||||
</button>
|
||||
</button> */}
|
||||
|
||||
<div className="flex items-center gap-2">
|
||||
<button
|
||||
|
||||
@@ -23,7 +23,7 @@ export default function Slide1Title() {
|
||||
</p>
|
||||
|
||||
<h1 className="font-display font-extrabold text-3xl sm:text-4xl md:text-5xl lg:text-5xl text-white tracking-tight leading-tight uppercase font-glow mb-5">
|
||||
The Sovereign Business Engine
|
||||
Private AI for Your Business
|
||||
</h1>
|
||||
|
||||
<div className="h-[2px] w-24 bg-gradient-to-r from-transparent via-emerald-500 to-transparent mb-6" />
|
||||
@@ -33,7 +33,7 @@ export default function Slide1Title() {
|
||||
</p>
|
||||
|
||||
<div className="mt-12 flex flex-wrap gap-3 font-mono text-[10px] text-slate-400 justify-center">
|
||||
<span className="px-3 py-1.5 rounded-full bg-slate-950 border border-emerald-900/30">✓ PRIVATE INTEL</span>
|
||||
<span className="px-3 py-1.5 rounded-full bg-slate-950 border border-emerald-900/30">✓ PRIVATE</span>
|
||||
<span className="px-3 py-1.5 rounded-full bg-slate-950 border border-emerald-900/30">✓ DECENTRALISED</span>
|
||||
<span className="px-3 py-1.5 rounded-full bg-slate-950 border border-emerald-900/30">✓ 0% SAAS TRANSACTION</span>
|
||||
</div>
|
||||
|
||||
@@ -23,7 +23,7 @@ const paradoxCards: ParadoxCard[] = [
|
||||
{
|
||||
title: "Subscription Taxes",
|
||||
desc: "Licensing Cost",
|
||||
detail: "Paying $20–$40 per person every single month creates heavy baseline overheads for growing digital agencies or self-starters.",
|
||||
detail: "Paying $20+ per person every single month creates heavy baseline overheads for growing digital agencies or self-starters.",
|
||||
alternative: "Zero-Bill Scale. Run identical models on modern laptops with zero cumulative licensing bills or user caps.",
|
||||
color: "from-amber-500/10 to-amber-600/5 border-amber-950/40 text-amber-400",
|
||||
tag: "CASH BURN"
|
||||
@@ -54,13 +54,13 @@ export default function Slide2CloudParadox() {
|
||||
The Cloud Expense Trap
|
||||
</h2>
|
||||
<p className="text-slate-400 font-sans text-sm sm:text-base leading-relaxed mb-6">
|
||||
Relying on big-tech online platforms invites data leakage risks, builds high monthly software subscriptions, and depends on having perfect Internet. Tap each risk card to unlock your secure local remedy.
|
||||
Relying on big-tech online platforms invites data leakage risks, builds high monthly software subscriptions, and depends on having perfect Internet.
|
||||
</p>
|
||||
|
||||
<div className="hidden lg:flex items-center gap-2 border border-slate-800/80 rounded px-3 py-1.5 bg-slate-900/50 text-[10px] font-mono text-slate-500">
|
||||
{/* <div className="hidden lg:flex items-center gap-2 border border-slate-800/80 rounded px-3 py-1.5 bg-slate-900/50 text-[10px] font-mono text-slate-500">
|
||||
<Info className="w-3.5 h-3.5 text-emerald-400 shrink-0" />
|
||||
<span>Interactive: Click each card to reveal the offline local alternative.</span>
|
||||
</div>
|
||||
</div> */}
|
||||
</div>
|
||||
|
||||
<div className="lg:col-span-8 grid grid-cols-1 md:grid-cols-3 gap-4 w-full h-auto">
|
||||
|
||||
@@ -52,7 +52,7 @@ export default function Slide3LocalAIStack() {
|
||||
Your Private AI Workspace
|
||||
</h2>
|
||||
<p className="text-slate-400 font-sans text-sm sm:text-base leading-relaxed mb-6">
|
||||
Running secure local AI is straightforward and divides into three simple, clear levels. Click any layer below to see how friendly desktop apps link directly to your laptop's power.
|
||||
Running secure local AI is straightforward and divides into three simple, clear levels.
|
||||
</p>
|
||||
|
||||
<div className="bg-slate-950/40 border border-emerald-950/30 rounded-lg p-5 font-mono text-left">
|
||||
|
||||
@@ -63,7 +63,7 @@ export default function Slide4Quantization() {
|
||||
|
||||
return (
|
||||
<div className="grid grid-cols-1 lg:grid-cols-12 gap-8 items-center max-w-6xl mx-auto w-full">
|
||||
<div className="lg:col-span-5 flex flex-col justify-center">
|
||||
<div className="lg:col-span-6 flex flex-col justify-center">
|
||||
<span className="text-emerald-500 font-mono text-xs font-bold uppercase tracking-wider mb-2">// DYNAMIC OPTIMISATION</span>
|
||||
<h2 className="font-display font-bold text-2xl sm:text-3xl text-white tracking-tight uppercase leading-none mb-4">
|
||||
AI Compression: Smart Scaling
|
||||
@@ -80,7 +80,7 @@ export default function Slide4Quantization() {
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="lg:col-span-7 flex flex-col gap-6 w-full">
|
||||
<div className="lg:col-span-6 flex flex-col gap-6 w-full">
|
||||
<div className="bg-slate-950/60 border border-slate-800/80 rounded-xl p-5 sm:p-6 md:p-8 relative">
|
||||
<div className="flex items-center justify-between font-mono text-[10px] text-slate-400 mb-6">
|
||||
<span>INTERACTIVE COMPRESSION SELECTOR</span>
|
||||
|
||||
@@ -241,7 +241,7 @@ export default function Slide5Pipelines({ showToast }: { showToast: (msg: string
|
||||
Smart Workflow Pipelines
|
||||
</h2>
|
||||
<p className="text-slate-400 font-sans text-sm sm:text-base leading-relaxed mb-6">
|
||||
Transform unstructured data into actionable insights. Select a pipeline type and watch local AI extract, categorize, and score your business data in milliseconds.
|
||||
Transform unstructured data into actionable insights.
|
||||
</p>
|
||||
|
||||
<div className="flex flex-col gap-3 font-mono text-[11px] text-slate-400">
|
||||
|
||||
@@ -150,7 +150,7 @@ export default function Slide6HardwareMatrix({
|
||||
Your Hardware Match
|
||||
</h2>
|
||||
<p className="text-slate-400 font-sans text-sm sm:text-base leading-relaxed mb-6">
|
||||
Map local AI targets against your company assets. Standard office equipment already houses substantial computational power. Utilize our selector to plan your deployment.
|
||||
Map local AI targets against your company assets. Standard office equipment already houses substantial computational power.
|
||||
</p>
|
||||
|
||||
<div className="flex bg-slate-950/80 border border-slate-800/80 rounded p-1 gap-1 mb-6 font-mono text-[10px]">
|
||||
|
||||
@@ -54,7 +54,7 @@ export default function Slide7BuyersGuide({
|
||||
Easy Setup & Hardware Guide
|
||||
</h2>
|
||||
<p className="text-slate-400 text-xs sm:text-sm leading-relaxed mb-5">
|
||||
Buying or repurposing hardware is simple once you isolate your goals. Modern large models scale entirely based on **Memory Bandwidth** rather than CPU cores. Select your options below to see your optimal setup plan:
|
||||
Buying or repurposing hardware is simple once you isolate your goals. Modern large models scale entirely based on **Memory Bandwidth** rather than CPU cores.
|
||||
</p>
|
||||
|
||||
<div className="mb-4">
|
||||
@@ -130,13 +130,13 @@ export default function Slide7BuyersGuide({
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="bg-rose-950/15 border border-rose-900/25 p-4 rounded-lg text-slate-350 font-sans text-[11px] leading-relaxed flex gap-3">
|
||||
{/* <div className="bg-rose-950/15 border border-rose-900/25 p-4 rounded-lg text-slate-350 font-sans text-[11px] leading-relaxed flex gap-3">
|
||||
<AlertTriangle className="w-5 h-5 text-rose-500 shrink-0 animate-pulse" />
|
||||
<div>
|
||||
<span className="font-mono text-[9.5px] font-bold text-rose-400 tracking-wider block uppercase mb-1">// CRITICAL BUYER SHIELD PROTOCOL:</span>
|
||||
Do NOT buy multiple CPU-core servers expecting quick inference speeds. LLM read-phases are bound strictly by **Memory Bandwidth**. Prefer Apple Silicon (Unified Memory bus width > 300GB/s) or discrete Nvidia RTX Series GPUs. CPU-only rendering will result in a 5x to 10x speed penalty.
|
||||
</div>
|
||||
</div>
|
||||
</div> */}
|
||||
</div>
|
||||
|
||||
<div className="lg:col-span-7 flex flex-col w-full font-sans">
|
||||
|
||||
@@ -20,7 +20,7 @@ export default function Slide8ROI({ selectedGoal, procureBudget, showToast }: Sl
|
||||
const goalCostMap: Record<GoalType, number> = { writing: 0, rag: 1500, agents: 3500 };
|
||||
const targetCost = goalCostMap[selectedGoal] ?? 3500;
|
||||
setSetupCosts(targetCost);
|
||||
showToast(`Applied ${selectedGoal.toUpperCase()} goal recommendation: $${targetCost.toLocaleString()}`);
|
||||
// showToast(`Applied ${selectedGoal.toUpperCase()} goal recommendation: $${targetCost.toLocaleString()}`);
|
||||
};
|
||||
|
||||
const handleBudgetCostApply = () => {
|
||||
@@ -28,7 +28,7 @@ export default function Slide8ROI({ selectedGoal, procureBudget, showToast }: Sl
|
||||
const bgtCostMap: Record<BudgetType, number> = { existing: 0, budget: 1500, pro: 3500, enterprise: 12500 };
|
||||
const targetCost = bgtCostMap[procureBudget] ?? 1500;
|
||||
setSetupCosts(targetCost);
|
||||
showToast(`Applied ${procureBudget.toUpperCase()} specification plan: $${targetCost.toLocaleString()}`);
|
||||
// showToast(`Applied ${procureBudget.toUpperCase()} specification plan: $${targetCost.toLocaleString()}`);
|
||||
};
|
||||
|
||||
const cloudMonthlyCost = employees * monthlySaaS;
|
||||
@@ -106,9 +106,9 @@ export default function Slide8ROI({ selectedGoal, procureBudget, showToast }: Sl
|
||||
</div>
|
||||
<input
|
||||
type="range"
|
||||
min="10"
|
||||
min="1"
|
||||
max="500"
|
||||
step="10"
|
||||
step="1"
|
||||
value={employees}
|
||||
onChange={(e) => { handleElementClick(); setEmployees(Number(e.target.value)); }}
|
||||
className="w-full h-1 bg-slate-900 rounded-lg appearance-none cursor-pointer accent-emerald-500"
|
||||
@@ -123,7 +123,7 @@ export default function Slide8ROI({ selectedGoal, procureBudget, showToast }: Sl
|
||||
<input
|
||||
type="range"
|
||||
min="10"
|
||||
max="100"
|
||||
max="1000"
|
||||
step="5"
|
||||
value={monthlySaaS}
|
||||
onChange={(e) => { handleElementClick(); setMonthlySaaS(Number(e.target.value)); }}
|
||||
|
||||
Reference in New Issue
Block a user