Copy tweaks

components/PromptPanel.tsx

@@ -162,6 +162,7 @@ export default function PromptPanel({
 
           {/* // Form trims spaces, and only submits if the remaining prompt is more than 0 characters */}
           <form
+            noValidate={true}
             onSubmit={(e) => {
               e.preventDefault();
               const prompt = e.currentTarget.prompt.value;
@@ -175,7 +176,7 @@ export default function PromptPanel({
             }}
           >
             <input
-              className="flex w-full md:fixed md:w-1/2 h-12 pl-3 pr-3 text-xl text-sky-900 dark:text-sky-100 rounded-lg border-sky-700 border-4 hover:border-sky-600 focus:outline-none focus:border-sky-400"
+              className="flex w-full md:fixed md:w-5/12 h-12 pl-3 pr-3 text-lg text-sky-900 dark:text-sky-100 rounded-lg border-sky-700 border-4 hover:border-sky-600 focus:outline-none focus:border-sky-400"
               ref={inputPrompt}
               type="text"
               id="prompt"

components/Settings.tsx

@@ -102,9 +102,11 @@ export default function Settings({
                   </Dialog.Title>
                   <div className="mt-1">
                     <p className=" text-gray-700 text-sm">
-                      Riffusion generates music from text prompts using a
-                      diffusion model. Try typing in your favorite artist or
-                      genre, and playing with the settings below to explore the
+                      Riffusion generates music from text prompts. Try your
+                      favorite artists, instruments like saxophone or violin,
+                      modifiers like arabic or jamaican, genres like jazz or
+                      gospel, sounds like church bells or rain, or any
+                      combination. Play with the settings below to explore the
                       latent space of sound.
                     </p>
 
@@ -130,7 +132,7 @@ export default function Settings({
                       }}
                     >
                       <span className="relative px-5 py-2 transition-all ease-in duration-75 bg-white rounded-md group-hover:bg-opacity-0">
-                        Tell me more
+                        💁🏻‍♀️ How does it work?
                       </span>
                     </button>
 
@@ -141,7 +143,7 @@ export default function Settings({
                         setOpen(false);
                       }}
                     >
-                      🎧 Done
+                      🎧 Riff
                     </button>
                   </div>
                 </div>

pages/about.tsx

@@ -405,7 +405,6 @@ export default function Home() {
             results in under five seconds, you can run the experience locally
             using our test flask server.
           </p>
-          <br />
           <h2 className="pt-10 pb-5 text-3xl font-bold">Code</h2>
           <ul className="mt-3 ml-10 list-disc">
             <li>
@@ -427,6 +426,46 @@ export default function Home() {
               </a>
             </li>
           </ul>
+
+          <h2 className="pt-10 pb-5 text-3xl font-bold">Prompt Guide</h2>
+          <p className="mb-2">
+            Like other diffusion models, the quality of the results depends on
+            the prompt and other settings. This section provides some tips for
+            getting good results.
+          </p>
+          <p className="mb-2">
+            <b>Seed image</b> - The app does image-to-image conditioning, and
+            the seed image used for conditioning locks in the BPM and overall
+            vibe of the prompt. There can still be a large amount of diversity
+            with a given seed image, but the effect is present. In the app
+            settings, you can change the seed image to explore this effect.
+          </p>
+          <p className="mb-2">
+            <b>Denoising</b> - The higher the denoising, the more creative the
+            results but the less they will resemble the seed image. The default
+            denoising is 0.75, which does a good job of keeping on beat for most
+            prompts. The settings allow raising the denoising, which is often
+            fun but can quickly result in chaotic transitions and tempos.
+          </p>
+          <p className="mb-2">
+            <b>Prompt</b> - When providing prompts, get creative! Try your
+            favorite artists, instruments like saxophone or violin, modifiers
+            like arabic or jamaican, genres like jazz or rock, sounds like
+            church bells or rain, or any combination. Many words that are not
+            present in the training data still work because the text encoder can
+            associate words with similar semantics. The closer a prompt is in
+            spirit to the seed image And BPM, the better the results. For
+            example, a prompt for a genre that is much faster BPM than the seed
+            image will result in poor, generic audio.
+          </p>
+          <p className="mb-2">
+            Parameters can also be specified via URL, for example:
+            <br/>
+            <a href="https://www.riffusion.com/?&prompt=rainy+day&denoising=0.85&seedImageId=og_beat">
+              https://www.riffusion.com/?&prompt=rainy+day&denoising=0.85&seedImageId=og_beat
+            </a>
+          </p>
+
           <h2 className="pt-10 pb-5 text-3xl font-bold">Samples</h2>
           <p>Some of our favorite prompts and results.</p>
           <CaptionedImage