diff --git a/apps/web/content/articles/mac-productivity-apps.mdx b/apps/web/content/articles/mac-productivity-apps.mdx index e2db53b9d7..0889081e9f 100644 --- a/apps/web/content/articles/mac-productivity-apps.mdx +++ b/apps/web/content/articles/mac-productivity-apps.mdx @@ -13,7 +13,7 @@ author: - "n" - "g" featured: false -category: "Productivity Hack" +category: "Guides" date: "2026-02-13" --- diff --git a/apps/web/public/avatar.webp b/apps/web/public/avatar.webp new file mode 100644 index 0000000000..10cfb8cc6c Binary files /dev/null and b/apps/web/public/avatar.webp differ diff --git a/apps/web/public/contact_human.webp b/apps/web/public/contact_human.webp new file mode 100644 index 0000000000..19fa17e834 Binary files /dev/null and b/apps/web/public/contact_human.webp differ diff --git a/apps/web/public/handdrawing/bracket-left.svg b/apps/web/public/handdrawing/bracket-left.svg new file mode 100644 index 0000000000..9344c703d8 --- /dev/null +++ b/apps/web/public/handdrawing/bracket-left.svg @@ -0,0 +1,3 @@ + diff --git a/apps/web/public/handdrawing/bracket-right.svg b/apps/web/public/handdrawing/bracket-right.svg new file mode 100644 index 0000000000..caa86b3bc1 --- /dev/null +++ b/apps/web/public/handdrawing/bracket-right.svg @@ -0,0 +1,3 @@ + diff --git a/apps/web/public/handdrawing/char-signature.svg b/apps/web/public/handdrawing/char-signature.svg new file mode 100644 index 0000000000..287add07c2 --- /dev/null +++ b/apps/web/public/handdrawing/char-signature.svg @@ -0,0 +1,5 @@ + diff --git a/apps/web/public/handdrawing/hyprnote-signature.svg b/apps/web/public/handdrawing/hyprnote-signature.svg new file mode 100644 index 0000000000..cef6ee4727 --- /dev/null +++ b/apps/web/public/handdrawing/hyprnote-signature.svg @@ -0,0 +1,3 @@ + diff --git a/apps/web/public/handdrawing/important.svg b/apps/web/public/handdrawing/important.svg new file mode 100644 index 0000000000..05af89d41d --- /dev/null +++ b/apps/web/public/handdrawing/important.svg @@ -0,0 +1,3 @@ + diff --git a/apps/web/public/handdrawing/scribbling.svg b/apps/web/public/handdrawing/scribbling.svg new file mode 100644 index 0000000000..1bb15962d1 --- /dev/null +++ b/apps/web/public/handdrawing/scribbling.svg @@ -0,0 +1,3 @@ + diff --git a/apps/web/public/handdrawing/sleeping.svg b/apps/web/public/handdrawing/sleeping.svg new file mode 100644 index 0000000000..1e5ae0efc3 --- /dev/null +++ b/apps/web/public/handdrawing/sleeping.svg @@ -0,0 +1,5 @@ + diff --git a/apps/web/public/handdrawing/sunset.svg b/apps/web/public/handdrawing/sunset.svg new file mode 100644 index 0000000000..9afcb56cd7 --- /dev/null +++ b/apps/web/public/handdrawing/sunset.svg @@ -0,0 +1,8 @@ + diff --git a/apps/web/public/handdrawing/thinking.svg b/apps/web/public/handdrawing/thinking.svg new file mode 100644 index 0000000000..773bc73906 --- /dev/null +++ b/apps/web/public/handdrawing/thinking.svg @@ -0,0 +1,5 @@ + diff --git a/apps/web/public/icons/grabbed-cursor.svg b/apps/web/public/icons/grabbed-cursor.svg new file mode 100644 index 0000000000..55b3f7f9d2 --- /dev/null +++ b/apps/web/public/icons/grabbed-cursor.svg @@ -0,0 +1,20 @@ + diff --git a/apps/web/src/components/hero-interface.tsx b/apps/web/src/components/hero-interface.tsx new file mode 100644 index 0000000000..892887c26b --- /dev/null +++ b/apps/web/src/components/hero-interface.tsx @@ -0,0 +1,221 @@ +import { Icon } from "@iconify-icon/react"; +import { useState } from "react"; + +import { DancingSticks } from "@hypr/ui/components/ui/dancing-sticks"; +import { cn } from "@hypr/utils"; + +export function HeroInterface() { + const [activeTab, setActiveTab] = useState< + "notes" | "summary" | "transcript" + >("notes"); + + return ( +
+ We believe in the power of notetaking, not notetakers. Meetings should
+ be moments of presence, not passive attendance.{" "}
+
+
+ AI changes it. Instead of{" "} + + {" "} + scribbling{" "} + {" "} + notes, it gives us the power to be present. +
+
+ But we give it control over our meetings. What happens with all our
+ calls and chats then? Services sunset{" "}
+
+
+ {" "}
+ constantly, models change, progress is unstoppable.
+
+ We believe in owning your data, doesn't matter where it lives. More + + {" "} + important{" "} + {" "} + is what you bring from every meeting, every call, every chat. +
+
+
+
+ Char
+
+ {" "}
+ exists to preserve what makes us human: conversations that spark
+ ideas, collaborations that move work forward. We build tools that
+ amplify human agency, not replace it.
+
+ No ghost bots. No silent note lurkers. Just people,{" "}
+
+ thinking{" "}
+ {" "}
+
+ together.
+
+ Hyprnote +
+John Jeong, Yujong Lee
++
Loved by professionals at
@@ -712,6 +1030,9 @@ export function HowItWorksSection() { const [typedText1, setTypedText1] = useState(""); const [typedText2, setTypedText2] = useState(""); const [enhancedLines, setEnhancedLines] = useState(0); + const [activeTab, setActiveTab] = useState< + "notes" | "summary" | "transcription" + >("notes"); const text1 = "metrisc w/ john"; const text2 = "stakehlder mtg"; @@ -721,6 +1042,7 @@ export function HowItWorksSection() { setTypedText1(""); setTypedText2(""); setEnhancedLines(0); + setActiveTab("notes"); let currentIndex1 = 0; setTimeout(() => { @@ -740,27 +1062,31 @@ export function HowItWorksSection() { clearInterval(interval2); setTimeout(() => { - setEnhancedLines(1); + setActiveTab("summary"); + setTimeout(() => { - setEnhancedLines(2); + setEnhancedLines(1); setTimeout(() => { - setEnhancedLines(3); + setEnhancedLines(2); setTimeout(() => { - setEnhancedLines(4); + setEnhancedLines(3); setTimeout(() => { - setEnhancedLines(5); + setEnhancedLines(4); setTimeout(() => { - setEnhancedLines(6); + setEnhancedLines(5); setTimeout(() => { - setEnhancedLines(7); - setTimeout(() => runAnimation(), 1000); + setEnhancedLines(6); + setTimeout(() => { + setEnhancedLines(7); + setTimeout(() => runAnimation(), 2000); + }, 800); }, 800); }, 800); }, 800); }, 800); }, 800); - }, 800); - }, 500); + }, 300); + }, 800); } }, 50); } @@ -773,23 +1099,48 @@ export function HowItWorksSection() { return (- How it works +
+ We believe that file is more important than software.
+ All saves locally, in plain markdown
+ .md
- While you take notes, Char - listens and keeps track of everything that happens during the - meeting. -
+- After the meeting is over,{" "} - Char combines your notes with transcripts to create a perfect - summary. -
-- While you take notes, Char - listens and keeps track of everything that happens during the - meeting. +
+ Hyprnote work with various transcription models right on your + device, even without internet.
+ Meeting.12.03.26-11.32.wav +
+14:30:25
+ Hyprnote work with various transcription models right on your + device, even without internet +
+1-1 with Joanna
++ AI Notetaker joined the call. +
+ Char is connecting right to your system audio and get every word + perfectly, no faceless bots join your meetings. +
- After the meeting is over,{" "}
- Char combines your notes with transcripts to create a perfect
- summary.
+export function AISection() {
+ const researchStatuses = [
+ "Exploring meetings",
+ "Analysing",
+ "Generating summary",
+ ];
+ const [statusIndex, setStatusIndex] = useState(0);
+
+ useEffect(() => {
+ const interval = setInterval(() => {
+ setStatusIndex((prev) => (prev + 1) % researchStatuses.length);
+ }, 1200);
+ return () => clearInterval(interval);
+ }, []);
+
+ return (
+
+ Ask, give tasks to execute and grow your team knowledge base.
+
+ Automate follow-up tasks across your tools without manual data
+ entry.
+ Get instant answers from your current calls and previous meetings.
+
+ John Jeong's progress
+
+ Chat with your AI assistant to learn more about the people you're
+ meeting with.
+
+ Add people from meetings in contacts, grow knowledge about your chats
+ and context of previous meetings
+
+ Import contacts and watch them come alive with context once you
+ actually meet.
+
+ Connect your calendar for intelligent meeting preparation and
+ automatic note organization.
+
+ Today at 10:00 AM · 30 minutes
+
+ Discussed Q1 roadmap, decided to prioritize mobile app.
+ Sarah to review designs by Jan 15.
+
+
Prepare, engage, and follow through with AI-powered assistance
+ {feature.description}
+
- Chat with your AI assistant to learn more about the people you're
- meeting with. Search through past conversations, extract key
- insights, and understand context before you join.
+
+ {feature.description}
+ Mobile UI bug fix
+
- Create tailored meeting templates on the spot. Ask your AI
- assistant to generate agendas, question lists, or note structures
- specific to your meeting type.
+const CHAT_PANELS: Panel[] = [
+ {
+ type: "chat",
+ steps: [
+ {
+ delay: 200,
+ node: (
+
+ What did Sarah say about the timeline?
+ Char
+ In your Oct 12 meeting, Sarah mentioned the deadline is Q1 2026
+ with a soft launch in December.
+ Create a Jira ticket for the mobile bug and assign to Sarah
+ Char
+ What's the timeline for the mobile UI?
+ Char
+ Ben committed to auth module this week. Sarah estimates 2 sprints
+ for full API.
+ Before
+ the team talked about doing stuff with the dashboard and some api
+ things
+ After
+ The team agreed to prioritize the dashboard redesign and begin API
+ migration in Sprint 14.
+ Jennifer Kim Product Manager
+ Last 3 meetings focused on mobile launch timeline. Jennifer prefers
+ concise bullet-point summaries.
+
- Query your entire conversation history to refresh your memory. Find
- decisions, action items, or specific topics discussed in previous
- meetings—all in natural language.
-
- Type questions to your AI assistant during the meeting without
- interrupting the conversation. Get instant answers from the
- current transcript and past meeting context.
-
- AI-powered extensions provide live assistance during your meeting.
- Built on our extension framework, these tools adapt to your needs
- in realtime.
-
+ AI-powered extensions provide live assistance during your meeting.
+ Built on our extension framework, these tools adapt to your needs in
+ realtime.
+
Available realtime extensions
-
+
- Fix the mobile UI bug discussed in today's meeting. Check responsive
- layout on iOS devices.
- Jessica Lee
- Meeting summary attached as a file for review, including key
- decisions, action items, and next steps for the Q4 rollout.
- Follow-up meeting
- 2 guests · 1 yes, 1 awaiting
-
+ Create tailored meeting templates on the spot. Ask your AI assistant
+ to generate agendas, question lists, or note structures specific to
+ your meeting type.
+
+ We believe that file is more important than software. All saves
+ locally, in plain markdown
+ .md
+
- Describe what you want to do, and let your AI assistant handle the
- rest. Automate follow-up tasks across your tools without manual
- data entry.
-
- Your AI assistant builds memory from your interactions. It
- remembers preferences, learns from edits you make to summaries,
- and continuously improves its assistance based on your patterns.
+
+ Char works with various transcription models right on your device,
+ even without internet.
+ Meeting.12.03.26-11.32.wav
+ 14:30:25
+ Drag and drop audio files or paste existing transcripts to
+ generate summaries instantly.
+ 1-1 with Joanna
+ AI Notetaker joined the call.
+
+ Char connects right to your system audio and captures every word
+ perfectly, no faceless bots join your meetings.
+
+ Get more from every note with AI assistant
+
+
+ Workflows and integrations
+
+
- Mobile UI Update and API Adjustments
-
-
-
+ Ask questions in realtime
+
+
- New Dashboard – Urgent Priority
+
+ Deep research of your chats
+
+
+ Char grows with you
+
+
+ Your contacts in one place
+
+
+
+
+
+ Calendar
+
+
+
+
+ Weekly Team Sync
-
-
+
+ Last meeting context
+
+
AI Chat
-
for your meetings
+ {feature.title}
+
+
- Deep research with chat
+ {/* Mobile */}
+
+ {feature.title}
-
-
- Generate custom templates
-
-
-
+
- Ask about past conversations
-
-
- Ask questions in realtime
-
-
- Realtime insights via{" "}
-
- extensions
-
-
-
+ Realtime insights via{" "}
+
+ extensions
+
+
+
+
+ Generate custom templates
+
+
+ How Char works
+
+
- Execute workflows with natural language
-
-
- Learns and adapts with memory
-
-
+ Use local models or use Your Own key
+
+
-
-
- Learns from your edits to improve future summaries
-
-
-
+ Upload records or existing transcripts
+
+
+ No bot on calls
+
+