diff --git a/src/app/page.tsx b/src/app/page.tsx
index 6a90adc..5de3878 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -1,11 +1,61 @@
-import Image from 'next/image';
+import Image, { StaticImageData } from 'next/image';
import { Page } from '../components/Page';
+import { ReactNode } from 'react';
+
import AppPreviewSrc from '../assets/app-preview.png';
+import WorkerPopupSrc from '../assets/worker_popup.png';
+import ExportSrc from '../assets/export.png';
+import CorrectSrc from '../assets/correct.png';
+import clsx from 'clsx';
+
+
+
+export default function HomePage() {
+ return (
+
+
+
+ transcribee uses the open source Whisper machine-learning (ML) model to create high quality automated transcriptions.
+
+
+ Automatic transcripts can easily be manually corrected. Words that are likely not correct are highlighted for speedy corrections.
+
+
+ Completed documents can be exported as Text documents or for subtitle usage as WebVTT or SRT.
+
+
+ transcribee is open source and licensed under the AGPL-3.0 license. You can inspect the code, contribute to it and host your own instance.
+
+ );
+}
+
function Hero() {
return (
-
+
Transcriptions
@@ -39,10 +89,27 @@ function Hero() {
);
}
-export default function HomePage() {
+function Block({ children, heading, imageSrc, imageAlt, imageOnRight = false }: { children: ReactNode, heading: ReactNode, imageSrc: StaticImageData, imageAlt: string, imageOnRight?: boolean }) {
return (
-
-
-
- );
+
+
+
+
+
+
+ {heading}
+
+
+ {children}
+
+
+
+ )
}
diff --git a/src/assets/correct.png b/src/assets/correct.png
new file mode 100644
index 0000000..86ff002
Binary files /dev/null and b/src/assets/correct.png differ
diff --git a/src/assets/export.png b/src/assets/export.png
new file mode 100644
index 0000000..f4aa4dd
Binary files /dev/null and b/src/assets/export.png differ
diff --git a/src/assets/worker_popup.png b/src/assets/worker_popup.png
new file mode 100644
index 0000000..4dfc66e
Binary files /dev/null and b/src/assets/worker_popup.png differ