diff --git a/public/images/observabilityButton.gif b/public/images/observabilityButton.gif
new file mode 100644
index 000000000..06f668ac0
Binary files /dev/null and b/public/images/observabilityButton.gif differ
diff --git a/public/images/observabilityPanel.gif b/public/images/observabilityPanel.gif
new file mode 100644
index 000000000..68734ab9f
Binary files /dev/null and b/public/images/observabilityPanel.gif differ
diff --git a/public/images/runOrDebug.gif b/public/images/runOrDebug.gif
new file mode 100644
index 000000000..10e40b662
Binary files /dev/null and b/public/images/runOrDebug.gif differ
diff --git a/public/videos/observabilityButton.mp4 b/public/videos/observabilityButton.mp4
deleted file mode 100644
index 5a4095928..000000000
Binary files a/public/videos/observabilityButton.mp4 and /dev/null differ
diff --git a/public/videos/observabilityPanel.mp4 b/public/videos/observabilityPanel.mp4
deleted file mode 100644
index 6f96d8aa4..000000000
Binary files a/public/videos/observabilityPanel.mp4 and /dev/null differ
diff --git a/public/videos/runOrDebug.mp4 b/public/videos/runOrDebug.mp4
deleted file mode 100644
index 0d44589ea..000000000
Binary files a/public/videos/runOrDebug.mp4 and /dev/null differ
diff --git a/src/components/InstallationWizard/FinishStep/index.tsx b/src/components/InstallationWizard/FinishStep/index.tsx
index d2a9aa7d7..a8a8186b4 100644
--- a/src/components/InstallationWizard/FinishStep/index.tsx
+++ b/src/components/InstallationWizard/FinishStep/index.tsx
@@ -17,11 +17,7 @@ export const FinishStep = () => (
       observability.
     </SectionDescription>
     <s.IllustrationContainer>
-      <s.RunOrDebugIllustration
-        src={"/videos/runOrDebug.mp4"}
-        autoPlay={true}
-        loop={true}
-      />
+      <s.RunOrDebugIllustration src={"/images/runOrDebug.gif"} />
     </s.IllustrationContainer>
     <s.SectionTitle>
       <SectionIconContainer>
@@ -35,9 +31,7 @@ export const FinishStep = () => (
     </SectionDescription>
     <s.IllustrationContainer>
       <s.ObservabilityPanelIllustration
-        src={"/videos/observabilityPanel.mp4"}
-        autoPlay={true}
-        loop={true}
+        src={"/images/observabilityPanel.gif"}
       />
     </s.IllustrationContainer>
     <s.TipContainer>
diff --git a/src/components/InstallationWizard/FinishStep/styles.ts b/src/components/InstallationWizard/FinishStep/styles.ts
index 8b46bf166..789b31d4a 100644
--- a/src/components/InstallationWizard/FinishStep/styles.ts
+++ b/src/components/InstallationWizard/FinishStep/styles.ts
@@ -16,13 +16,13 @@ export const IllustrationContainer = styled(s.IllustrationContainer)`
   margin: 12px 0 12px;
 `;
 
-export const ObservabilityPanelIllustration = styled.video`
+export const ObservabilityPanelIllustration = styled.img`
   bottom: 0;
   position: absolute;
   width: 100%;
 `;
 
-export const RunOrDebugIllustration = styled.video`
+export const RunOrDebugIllustration = styled.img`
   width: 206px;
 `;
 
diff --git a/src/components/InstallationWizard/ObservabilityStep/index.tsx b/src/components/InstallationWizard/ObservabilityStep/index.tsx
index 8d49adf38..78ed1d70c 100644
--- a/src/components/InstallationWizard/ObservabilityStep/index.tsx
+++ b/src/components/InstallationWizard/ObservabilityStep/index.tsx
@@ -103,9 +103,7 @@ export const ObservabilityStep = (props: ObservabilityStepProps) => {
       </SectionDescription>
       <s.IllustrationContainer>
         <s.ObservabilityButtonIllustration
-          autoPlay={true}
-          loop={true}
-          src={"/videos/observabilityButton.mp4"}
+          src={"/images/observabilityButton.gif"}
         />
       </s.IllustrationContainer>
       <s.StepFooter>
diff --git a/src/components/InstallationWizard/ObservabilityStep/styles.ts b/src/components/InstallationWizard/ObservabilityStep/styles.ts
index 71e7a1854..ee24d3b20 100644
--- a/src/components/InstallationWizard/ObservabilityStep/styles.ts
+++ b/src/components/InstallationWizard/ObservabilityStep/styles.ts
@@ -69,7 +69,7 @@ export const IllustrationContainer = styled(s.IllustrationContainer)`
   margin-top: 8px;
 `;
 
-export const ObservabilityButtonIllustration = styled.video`
+export const ObservabilityButtonIllustration = styled.img`
   width: 100%;
 `;
 
diff --git a/src/components/InstallationWizard/styles.ts b/src/components/InstallationWizard/styles.ts
index 5d282ec4b..db4360afb 100644
--- a/src/components/InstallationWizard/styles.ts
+++ b/src/components/InstallationWizard/styles.ts
@@ -119,7 +119,7 @@ export const SectionDescription = styled.span`
 export const IllustrationContainer = styled.div`
   height: 123px;
   width: 312px;
-  background: #393739;
+  background: #313131;
   border-radius 4px;
   position: relative;
   overflow: hidden;