splash updates

CerebriumAI · Jun 26, 2024 · a31aa54 · a31aa54
1 parent 9766785
commit a31aa54
Show file tree

Hide file tree

Showing 6 changed files with 80 additions and 24 deletions.
diff --git a/index.html b/index.html
@@ -8,17 +8,17 @@
     <link rel="preconnect" href="https://fonts.googleapis.com">
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
     <link href="https://fonts.googleapis.com/css2?family=Inter:[email protected]&family=Space+Mono:wght@400;700&display=swap" rel="stylesheet">
-    <meta name="description" content="Open Source framework for voice and multimodal conversational AI" />
-    <meta property="og:title" content="Pipecat - %VITE_APP_TITLE%" />
-    <meta property="og:description" content="Open Source framework for voice and multimodal conversational AI" />
+    <meta name="description" content="A demo showcasing the potential capabilities of voice-driven AI chatbots when optimized and deployed to minimize network and model latency." />
+    <meta property="og:title" content="The World&apos;s Fastest Voice Bot Demo" />
+    <meta property="og:description" content="A demo showcasing the potential capabilities of voice-driven AI chatbots when optimized and deployed to minimize network and model latency."  />
     <meta property="og:image" content="/social.png" />
     <meta property="og:url" content="%BASE_URL%" />
     <meta name="twitter:card" content="summary_large_image" />
-    <meta name="twitter:title" content="Pipecat - %VITE_APP_TITLE%" />
-    <meta name="twitter:description" content="Open Source framework for voice and multimodal conversational AI" />
+    <meta name="twitter:title" content="The World&apos;s Fastest Voice Bot Demo" />
+    <meta name="twitter:description" content="A demo showcasing the potential capabilities of voice-driven AI chatbots when optimized and deployed to minimize network and model latency." />
     <meta name="twitter:image" content="/social.png" />
 
-    <title>Pipecat - %VITE_APP_TITLE%</title>
+    <title>The World&apos;s Fastest Voice Bot Demo</title>
   </head>
   <body>
     <div id="root"></div>

diff --git a/src/Splash.tsx b/src/Splash.tsx
@@ -1,4 +1,10 @@
 import React from "react";
+import { Book, Info, Rocket } from "lucide-react";
+
+import CerebriumLogo from "@/assets/logos/cerebrium.png";
+import DailyLogo from "@/assets/logos/daily.png";
+import DeepgramLogo from "@/assets/logos/deepgram.png";
+import L3Logo from "@/assets/logos/llama3.png";
 
 import { Button } from "./components/ui/button";
 
@@ -8,27 +14,77 @@ type SplashProps = {
 
 const Splash: React.FC<SplashProps> = ({ handleReady }) => {
   return (
-    <main className="w-full h-full flex items-center justify-center bg-primary-200">
-      <div className="flex flex-col gap-8 items-center max-w-xl p-4">
+    <main className="w-full h-full flex items-center justify-center bg-primary-200 p-4">
+      <div className="flex flex-col gap-8 lg:gap-12 items-center max-w-full lg:max-w-3xl">
         <h1 className="scroll-m-20 text-4xl font-extrabold tracking-tight lg:text-5xl text-balance">
-          Very Fast Voice AI Agents - Demo
+          The World&apos;s Fastest Voice Bot Demo
         </h1>
-        <p>
-          A demo showcasing the potential capabilities of voice-driven AI
-          chatbots when optimized and deployed to minimize network and model
-          latency.
-        </p>
-        <p>
-          Our goal was to demonstrate human-level interaction with an LLM by
-          situating the core technologies alongside each other. In
-          voice-to-voice interaction, every millisecond counts for fluid
-          conversation.
-        </p>
-        <footer className="flex flex-row gap-2">
-          <Button onClick={handleReady}>Try Demo</Button>
+
+        <div className="flex flex-col gap-2">
+          <span className="text-sm text-primary-400">Brought to you by:</span>
+          <div className="flex flex-row gap-6 bg-white rounded-full py-4 px-8 items-center">
+            <a href="https://www.daily.co/" target="_blank">
+              <img src={DailyLogo} alt="Daily.co" className="max-h-[22px]" />
+            </a>
+            <a href="https://www.cerebrium.ai/" target="_blank">
+              <img
+                src={CerebriumLogo}
+                alt="Daily.co"
+                className="max-h-[22px]"
+              />
+            </a>
+            <a href="https://deepgram.com/" target="_blank">
+              <img src={DeepgramLogo} alt="Daily.co" className="max-h-[22px]" />
+            </a>
+            <a href="https://llama.meta.com/llama3/" target="_blank">
+              <img src={L3Logo} alt="Daily.co" className="max-h-[22px]" />
+            </a>
+          </div>
+        </div>
+
+        <div className="max-w-full lg:max-w-2xl flex flex-col gap-6">
+          <p className="lg:text-lg text-primary-600">
+            Speed is important for voice AI interfaces. Humans expect fast
+            responses in normal conversation. This demo showcases low-latency
+            LLM interaction, aiming to achieve 500ms voice-to-voice response
+            times.
+          </p>
+          <p className="lg:text-lg text-primary-600">
+            This bot was built using Pipecat, and open source framework for
+            voice and multimodal conversational AI.
+          </p>
+        </div>
+
+        <Button onClick={handleReady}>Try the demo</Button>
+
+        <div className="h-[1px] bg-primary-300 w-full" />
+
+        <footer className="flex flex-col lg:flex-row lg:gap-2">
+          <Button variant="light" asChild>
+            <a
+              href="https://www.daily.co/blog/the-worlds-fastest-voice-bot/"
+              className="text-indigo-600"
+            >
+              <Info className="size-6" />
+              About this demo
+            </a>
+          </Button>
+          <Button variant="light" asChild>
+            <a
+              href="https://github.com/CerebriumAI/examples/tree/master/18-realtime-voice-agent"
+              className="text-indigo-600"
+            >
+              <Book className="size-6" />
+              View source code
+            </a>
+          </Button>
           <Button variant="light" asChild>
-            <a href="https://www.daily.co/blog/the-worlds-fastest-voice-bot/">
-              Read blog post
+            <a
+              href="https://docs.cerebrium.ai/v4/examples/realtime-voice-agents"
+              className="text-indigo-600"
+            >
+              <Rocket className="size-6" />
+              Deploy your own
             </a>
           </Button>
         </footer>

diff --git a/src/assets/logos/cerebrium.png b/src/assets/logos/cerebrium.png
diff --git a/src/assets/logos/daily.png b/src/assets/logos/daily.png
diff --git a/src/assets/logos/deepgram.png b/src/assets/logos/deepgram.png
diff --git a/src/assets/logos/llama3.png b/src/assets/logos/llama3.png