Merge pull request #2 from instruct-lab/copy-updates

updates to text

Author: sstano

src/components/HowItWorks/Slideshow.module.scss

@@ -101,7 +101,7 @@
     display: flex;
     flex-direction: row;
     justify-content: center;
-    align-items: center;
+    align-items: flex-end;
 
     .order {
       @include type-style("heading-05");
@@ -119,10 +119,6 @@
       word-break: auto-phrase;
       padding-right: 1rem;
       margin-right: auto;
-
-      @include breakpoint(xlg) {
-        max-width: 50%;
-      }
     }
   }
 

src/components/HowItWorks/Slideshow.tsx

@@ -26,25 +26,45 @@ const steps = [
   {
     animationSize: 400,
     animationName: 'detect-gap',
-    description:
-      'Identifies skill and knowledge gaps in current model performance',
+    description: (
+      <>
+        Experiment locally, on a quantized version of the latest InstructLab
+        model, with adding new <strong>knowledge and skills</strong>
+      </>
+    ),
   },
   {
     animationSize: 450,
     animationName: 'taxonomy',
-    description: 'Define a taxonomy that describes a given gap',
+    description: (
+      <>
+        Once a synthetic data recipe is ready, submit a pull request to
+        contribute back to the InstructLab repository, which is organized in a
+        structured <strong>taxonomy</strong>
+      </>
+    ),
   },
   {
     animationSize: 320,
     animationName: 'synthetic-data',
-    description:
-      'Systematically generate synthetic data that covers all elements of the defined taxonomy',
+    description: (
+      <>
+        InstructLab uses the new recipes to systematically generate{' '}
+        <strong>synthetic data</strong> for the new capabilities - and this data
+        is released to the community
+      </>
+    ),
   },
   {
     animationSize: 400,
     animationName: 'fine-tune',
-    description:
-      'Fine-tune the model with the generated synthetic data to teach it the new skill',
+    description: (
+      <>
+        InstructLab <strong>merges</strong> the new skill back into the base
+        model by updating it using all synthetic data generated to date, and
+        releases a new model version to the community
+      </>
+    ),
   },
 ];
 
@@ -139,7 +159,7 @@ const Slideshow: FC<SlideshowProps> = () => {
         ) : null}
 
         <div className={styles.slideshow}>
-          <h2>How it works?</h2>
+          <h2>How it works</h2>
           <div className={styles.slideshow__slides}>
             <div className={styles.cardWrapper}>
               {steps.map((d, i) => (

src/components/Leadspace/Leadspace.tsx

@@ -27,8 +27,7 @@ const Leadspace: FC<LeadspaceProps> = ({
       >
         <h1 className={styles.content__header}>InstructLab</h1>
         <p className={styles.content__subhead}>
-          InstructLab is an open source project designed to change how LLMs are
-          developed
+        An new community-based approach to build truly open-source LLMs
         </p>
         <Link className={styles.action} onClick={onJoinCommunity}>
           <GitHub className={styles.icon} />

src/components/ReleaseCycle/ReleaseCycle.tsx

@@ -19,9 +19,10 @@ const ReleaseCycle: FC<ReleaseCycleProps> = () => (
       >
         <h2>Weekly release cycle for models and data</h2>
         <p>
-          Each week, the InstructLab model will be updated with the latest
-          contributions and shared on Hugging Face. All synthetic data generated
-          by the project to date will also be made available.
+        Each week, the InstructLab model will be updated with the latest contributions of skills and knowledge from the community, resulting in a new state of the art model.
+        </p>
+        <p>
+        Each latest version will be shared on Hugging Face, and all synthetic data generated by the project to date will also be made available. 
         </p>
       </Column>
       <Column

src/components/ReleaseCycle/graphics/ReleaseCycleDiagram.module.scss

@@ -1,8 +1,86 @@
+@use '@carbon/styles/scss/breakpoint' as *;
+@use '@carbon/type' as *;
+
 .releaseCycleDiagram {
   position: relative;
   display: flex;
   width: 100%;
   height: 100%;
   align-items: center;
   justify-content: center;
+
+  .labelsWrapper {
+    align-items: center;
+    position: absolute;
+    height: 100%;
+    width: 100%;
+    max-width: 559px;
+    display: flex;
+  }
+  .labels {
+    position: absolute;
+    aspect-ratio: 559/446;
+    width: 100%;
+
+    > div {
+      position: absolute;
+    }
+
+    .title {
+      width: 100%;
+      height: 100%;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      font-size: 210%;
+    }
+
+    .img1 {
+      top: 22%;
+      left: 50%;
+      transform: translateX(-50%);
+      max-width: 40%;
+      text-align: center;
+    }
+
+    .img2 {
+      top: 103%;
+      right: 11.5%;
+      max-width: 40%;
+      text-align: center;
+      transform: translateX(50%);
+    }
+    
+    .img3 {
+      top: 103%;
+      left: 11.5%;
+      max-width: 40%;
+      text-align: center;
+      transform: translateX(-50%);
+    }
+
+    .arrow1 {
+      top: 40%;
+      right: -4%;
+      transform: rotate(90deg);
+      max-width: 40%;
+      text-align: center;
+    }
+
+    .arrow2 {
+      bottom: 17%;
+      left: 50%;
+      transform: translateX(-50%);
+      max-width: 40%;
+      text-align: center;
+    }
+
+    .arrow3 {
+      top: 40%;
+      left: -8%;
+      transform: rotate(-90deg);
+      max-width: 40%;
+      text-align: center;
+    }
+  }
 }

src/components/ReleaseCycle/graphics/ReleaseCycleDiagram.tsx

@@ -58,12 +58,12 @@ const StartExperimenting: FC<StartExperimentingProps> = ({ onCtaClicked }) => (
       >
         <h2 className={styles.content__header}>Join the community</h2>
         <p className={styles.content__subhead}>
-          Downloading the CLI and experimenting with new skills and knowledge is
-          a great way to get involved. You can also contribute synthetic data
-          directly.
+          Downloading the Lab CLI and experimenting with adding new skills and
+          knowledge is a great way to get started. You can also get involved by
+          contributing new skills, knowledge, or synthetic data directly.
         </p>
         <Button className={styles.action} onClick={onCtaClicked}>
-          <label>Join</label> <ArrowRight />
+          <label>Join the community</label> <ArrowRight />
         </Button>
       </Column>
     </Grid>

src/components/StartExperimenting/StartExperimenting.tsx

@@ -55,6 +55,7 @@ h2 {
 
 p {
   @include type-style('heading-03', true);
+  margin-bottom: 24px;
 }
 
 .cds--btn {