diff --git a/README.md b/README.md index b906fc1..1c787e9 100644 --- a/README.md +++ b/README.md @@ -56,10 +56,10 @@ Here's a quick overview of how to use Songscribe: - File Upload - YouTube Link - Choose the preset that best suits the song you're transcribing - - **Solo** (1 instrument) - - **Duet** (vocals, no vocals) - - **Small Band** (vocals, drums, bass, and other instruments) - - **Full Band** (vocals, drums, bass, guitar, piano, and other instruments) + - **Solo**- (1 instrument) + - **Duet**- (vocals, no vocals) + - **Small Band**- (vocals, drums, bass, and other instruments) + - **Full Band**- (vocals, drums, bass, guitar, piano, and other instruments) - Optionally, select the tempo and the start time and end time of the song to be transcribed - Click the **Transcribe** button - Adjust the MIDI parameters to regenerate the transcription for each instrument to your liking diff --git a/app/BenefitSection.tsx b/app/BenefitSection.tsx index 8bb16dd..b418df5 100644 --- a/app/BenefitSection.tsx +++ b/app/BenefitSection.tsx @@ -2,6 +2,7 @@ import BenefitCard from "@/components/BenefitCard"; import { useScreenSize } from "@/hooks/use-screen-size"; import { useEffect, useRef, useState } from "react"; +import Image from "next/image"; export default function BenefitSection() { const screenSize = useScreenSize(); @@ -10,8 +11,14 @@ export default function BenefitSection() { const [observer, setObserver] = useState(null); const [focusedCard, setFocusedCard] = useState(1); + const [isMounted, setIsMounted] = useState(false); const videoRef = useRef(null); + // Handle component mount + useEffect(() => { + setIsMounted(true); + }, []); + useEffect(() => { const callback = (entries: IntersectionObserverEntry[]) => { entries.forEach((entry) => { @@ -55,7 +62,16 @@ export default function BenefitSection() { when you need it. {isMobile && ( -
+
+ Demo 1 +
)} {isMobile && ( -
+
+ Demo 2 +
)} {isMobile && ( -
+
+ Demo 3 +
)} {isMobile && ( -
+
+ Demo 4 +
)} {!isMobile && (
- {focusedCard} + {isMounted && ( + {`Demo + )}
)} diff --git a/public/logo-dark.png b/public/logo-dark.png index 1cda6ee..9ae5b05 100644 Binary files a/public/logo-dark.png and b/public/logo-dark.png differ diff --git a/public/logo-light.png b/public/logo-light.png index ff464f7..2fb7ec9 100644 Binary files a/public/logo-light.png and b/public/logo-light.png differ diff --git a/public/videos/demo-1.gif b/public/videos/demo-1.gif new file mode 100644 index 0000000..b83fd05 Binary files /dev/null and b/public/videos/demo-1.gif differ diff --git a/public/videos/demo-2.gif b/public/videos/demo-2.gif new file mode 100644 index 0000000..a84afb1 Binary files /dev/null and b/public/videos/demo-2.gif differ diff --git a/public/videos/demo-3.gif b/public/videos/demo-3.gif new file mode 100644 index 0000000..0c2d18d Binary files /dev/null and b/public/videos/demo-3.gif differ diff --git a/public/videos/demo-4.gif b/public/videos/demo-4.gif new file mode 100644 index 0000000..ed774c3 Binary files /dev/null and b/public/videos/demo-4.gif differ diff --git a/utils/infoList.ts b/utils/infoList.ts index b6b666d..106cd51 100644 --- a/utils/infoList.ts +++ b/utils/infoList.ts @@ -1,9 +1,12 @@ export const infoList = [ - "You can adjust the volume and pan of the midi audio and original audio while it's playing.", + "You can adjust the volume and pan of the MIDI audio and original audio while it's playing.", "It is recommended when uploading a solo instrument recording to provide a tempo. Otherwise, the tempo will automatically be calculated.", "If the tempo was not able to be detected properly, it will default to 120 BPM.", "Hey, I hope you're having a great day. Thank you so much for taking the time to check out my project! ^_^", - "If there are any unnecessarily high or low notes in the midi, you can adjust the min and max frequencies and regenerate it.", - "If you want the midi output to be more like static chords, try increasing the minimum note length and note segmentation, and decrease the confidence threshold.", + "If there are any unnecessarily high or low notes in the MIDI, you can adjust the min and max frequencies and regenerate it.", + "If you want the MIDI output to be more like static chords, try increasing the minimum note length and note segmentation, and decrease the confidence threshold.", "The backdoor dominant is the five chord in the relative major of the parallel minor.", + "If you want to remove the MIDI transcription for an instrument that isn't part of the song, set the confidence threshold all the way up and regenerate it.", + "To continue working on the transcription, you can download the MIDI file and upload it to your music notation editor of choice.", + "If the automatic transcription isn't very accurate, you can download the isolated audio for each instrument and continue to transcribe it yourself.", ];