diff --git a/components/Projects/(classifications)/Annotating/Annotator.tsx b/components/Projects/(classifications)/Annotating/Annotator.tsx
index 011762f3..d88660d3 100644
--- a/components/Projects/(classifications)/Annotating/Annotator.tsx
+++ b/components/Projects/(classifications)/Annotating/Annotator.tsx
@@ -2,7 +2,7 @@
 
 import { useRef, useState } from 'react';
 import { Button } from '@/components/ui/button';
-import { Download, Upload } from 'lucide-react';
+import { Download } from 'lucide-react';
 import { ImageUploader } from './ImageUploader';
 import { DrawingCanvas } from './DrawingCanvas';
 import { DrawingControls } from './DrawingControls';
@@ -10,8 +10,8 @@ import { downloadAnnotatedImage } from './DrawingUtils';
 import type { Point, Line, Shape, DrawingMode } from '@/types/Annotation';
 import { useToast } from "@/hooks/toast";
 
-export function ImageAnnotator() {
-  const [imageUrl, setImageUrl] = useState<string | null>(null);
+export function ImageAnnotator({ initialImageUrl }: { initialImageUrl?: string }) {
+  const [imageUrl, setImageUrl] = useState<string | null>(initialImageUrl || null);
   const [isDrawing, setIsDrawing] = useState(false);
   const [currentLine, setCurrentLine] = useState<Line>({ points: [], color: '#ff0000', width: 2 });
   const [currentShape, setCurrentShape] = useState<Shape | null>(null);
@@ -104,10 +104,10 @@ export function ImageAnnotator() {
       });
       return;
     }
-
+  
     setIsDownloading(true);
     try {
-      await downloadAnnotatedImage(svgRef.current, imageRef.current);
+      await downloadAnnotatedImage(svgRef.current, imageRef.current, { returnBlob: true });
       toast({
         title: "Success",
         description: "Image downloaded successfully",
@@ -121,13 +121,16 @@ export function ImageAnnotator() {
     } finally {
       setIsDownloading(false);
     }
-  };
+  };  
 
   return (
     <div className="flex flex-col items-center gap-4 p-4">
-      <div className="flex gap-4">
+      {!initialImageUrl && !imageUrl && (
         <ImageUploader onImageUpload={handleImageUpload} />
-        {imageUrl && (
+      )}
+
+      {imageUrl && (
+        <>
           <Button 
             variant="outline" 
             onClick={handleDownload}
@@ -136,11 +139,6 @@ export function ImageAnnotator() {
             <Download className="mr-2 h-4 w-4" />
             {isDownloading ? 'Downloading...' : 'Download'}
           </Button>
-        )}
-      </div>
-
-      {imageUrl && (
-        <>
           <DrawingControls
             strokeColor={strokeColor}
             strokeWidth={strokeWidth}
@@ -178,10 +176,9 @@ export function ImageAnnotator() {
 
       {!imageUrl && (
         <div className="flex flex-col items-center justify-center w-full h-64 border-2 border-dashed rounded-lg bg-gray-50 dark:bg-gray-800">
-          <Upload className="h-12 w-12 text-gray-400" />
           <p className="mt-2 text-sm text-gray-500">Upload an image to begin annotating</p>
         </div>
       )}
     </div>
   );
-}
\ No newline at end of file
+};
\ No newline at end of file
diff --git a/components/Projects/(classifications)/Annotating/DrawingUtils.tsx b/components/Projects/(classifications)/Annotating/DrawingUtils.tsx
index 9703cd70..5c0055b5 100644
--- a/components/Projects/(classifications)/Annotating/DrawingUtils.tsx
+++ b/components/Projects/(classifications)/Annotating/DrawingUtils.tsx
@@ -50,9 +50,7 @@ export const getMousePosition = (
 };
 
 export const downloadAnnotatedImage = async (
-  svgElement: SVGSVGElement,
-  imageElement: HTMLImageElement
-): Promise<void> => {
+svgElement: SVGSVGElement, imageElement: HTMLImageElement, p0: { returnBlob: boolean; }): Promise<void> => {
   // Create canvas with the correct dimensions
   const canvas = document.createElement('canvas');
   const width = imageElement.naturalWidth;
diff --git a/components/Projects/Auto/AI4Mars.tsx b/components/Projects/Auto/AI4Mars.tsx
index 90311b5e..991a6e86 100644
--- a/components/Projects/Auto/AI4Mars.tsx
+++ b/components/Projects/Auto/AI4Mars.tsx
@@ -4,8 +4,9 @@ import React, { useState, useEffect } from "react";
 import { useSession, useSupabaseClient } from "@supabase/auth-helpers-react";
 import { useActivePlanet } from "@/context/ActivePlanet";
 import ClassificationForm from "../(classifications)/PostForm";
-
 import { Anomaly } from "../Zoodex/ClassifyOthersAnimals";
+import { ImageAnnotator } from "../(classifications)/Annotating/Annotator";
+
 interface Props {
     anomalyid: number | bigint;
 };
@@ -16,6 +17,7 @@ export function StarterAiForMars({ anomalyid }: Props) {
 
     const [part, setPart] = useState(1);
     const [line, setLine] = useState(1);
+
     const nextLine = () => setLine(prevLine => prevLine + 1);
     const nextPart = () => {
         setPart(2);
@@ -145,87 +147,80 @@ export function StarterAiForMars({ anomalyid }: Props) {
 export function AiForMarsProject() {
     const supabase = useSupabaseClient();
     const session = useSession();
-
     const { activePlanet } = useActivePlanet();
 
     const [anomaly, setAnomaly] = useState<Anomaly | null>(null);
-    const [showTutorial, setShowTutorial] = useState<boolean>(false);
+    const [showTutorial, setShowTutorial] = useState(false);
     const [imageUrl, setImageUrl] = useState<string | null>(null);
+    const [loading, setLoading] = useState(true);
+    const [hasMission20000006, setHasMission20000006] = useState<boolean | null>(null);
 
-    const [loading, setLoading] = useState<boolean>(true);
+    useEffect(() => {
+        const checkTutorialMission = async () => {
+            if (!session) return;
 
-    const [hasMission20000006, setHasMission20000006] = useState<boolean | null>(null);
+            try {
+                const { data: missionData, error: missionError } = await supabase
+                    .from("missions")
+                    .select("id")
+                    .eq("user", session.user.id)
+                    .eq("mission", "20000006")
+                    .limit(1);
+
+                if (missionError) {
+                    console.error("Error fetching mission data:", missionError);
+                    setHasMission20000006(false);
+                    return;
+                }
+
+                setHasMission20000006(missionData && missionData.length > 0);
+            } catch (error) {
+                console.error("Error checking user mission: ", error);
+                setHasMission20000006(false);
+            }
+        };
+
+        checkTutorialMission();
+    }, [session, supabase]);
 
-    // useEffect(() => {
-    //     const checkTutorialMission = async () => {
-    //         if (!session) return;
-    
-    //         try {
-    //             const { data: missionData, error: missionError } = await supabase
-    //                 .from('missions')
-    //                 .select('id')
-    //                 .eq('user', session.user.id)
-    //                 .eq('mission', '20000006')
-    //                 .limit(1);  
-    
-    //             if (missionError) {
-    //                 console.error("Error fetching mission data:", missionError);
-    //                 setHasMission20000006(false); 
-    //                 return;
-    //             };
-    
-    //             setHasMission20000006(missionData && missionData.length > 0);
-    //         } catch (error) {
-    //             console.error("Error checking user mission: ", error);
-    //             setHasMission20000006(false);
-    //         };
-    //     };
-    
-    //     checkTutorialMission();
-    // }, [session, supabase]);
-    
     useEffect(() => {
         async function fetchAnomaly() {
             if (!session) {
                 setLoading(false);
                 return;
-            };
-    
+            }
+
             try {
                 const { data: anomalyData, error: anomalyError } = await supabase
                     .from("anomalies")
                     .select("*")
-                    .eq("anomalySet", 'automaton-aiForMars')
-    
-                if (anomalyError) {
-                    throw anomalyError;
-                };
-    
+                    .eq("anomalySet", "automaton-aiForMars");
+
+                if (anomalyError) throw anomalyError;
+
                 const randomAnomaly = anomalyData[Math.floor(Math.random() * anomalyData.length)] as Anomaly;
                 setAnomaly(randomAnomaly);
-                setImageUrl(`${process.env.NEXT_PUBLIC_SUPABASE_URL}/storage/v1/object/public/telescope/automaton-aiForMars/${randomAnomaly.id}.jpeg`);
+                setImageUrl(
+                    `${process.env.NEXT_PUBLIC_SUPABASE_URL}/storage/v1/object/public/telescope/automaton-aiForMars/${randomAnomaly.id}.jpeg`
+                );
             } catch (error: any) {
                 console.error("Error fetching anomaly", error.message);
                 setAnomaly(null);
             } finally {
                 setLoading(false);
-            };
-        };
-    
-        if (session) { // && hasMission20000006) {
-            fetchAnomaly();
-        };
-    }, [session, hasMission20000006, supabase]);
-    
+            }
+        }
+
+        fetchAnomaly();
+    }, [session, supabase]);
+
     if (loading) {
         return (
             <div>
-                <p>
-                    Loading...
-                </p>
+                <p>Loading...</p>
             </div>
         );
-    };
+    }
 
     if (!anomaly) {
         return (
@@ -233,47 +228,36 @@ export function AiForMarsProject() {
                 <p>No anomaly found.</p>
             </div>
         );
-    };
+    }
 
     const startTutorial = () => setShowTutorial(true);
 
-    const content = !hasMission20000006 
-    ? <StarterAiForMars anomalyid={anomaly?.id || 69592674} />
-    : (
-        <>
-            {loading && <p>Loading...</p>}
-            {!loading && !anomaly && <p>No anomaly found.</p>}
-            {!loading && anomaly && (
+    return (
+        <div className="flex flex-col items-start gap-4 pb-4 relative w-full max-w-lg overflow-y-auto max-h-[90vh] rounded-lg">
+            {!hasMission20000006 ? (
+                <StarterAiForMars anomalyid={anomaly.id || 69592674} />
+            ) : (
                 <>
-                    <div className="p-4 rounded-md relative w-full">
-                        {imageUrl && <img src={imageUrl} alt="Anomaly" className="w-64 h-64 contained" />}
-                    </div>
                     {imageUrl && (
-                        <ClassificationForm
-                            anomalyId={anomaly?.id.toString() || ""}
-                            anomalyType='automaton-aiForMars'
-                            missionNumber={200000062}
-                            assetMentioned={imageUrl}
-                            structureItemId={3102} 
-                        />
+                        <>
+                            <ImageAnnotator initialImageUrl={imageUrl} />
+                            <ClassificationForm
+                                anomalyId={anomaly.id.toString()}
+                                anomalyType="automaton-aiForMars"
+                                missionNumber={200000062}
+                                assetMentioned={imageUrl}
+                                structureItemId={3102}
+                            />
+                        </>
                     )}
-                </>
-            )}
-            <button
+                    <button
                         onClick={startTutorial}
                         className="mt-4 px-4 py-2 bg-[#85DDA2] text-[#2C3A4A] rounded-md shadow-md"
                     >
                         Reopen Tutorial
                     </button>
-        </>
+                </>
+            )}
+        </div>
     );
-
-return (
-    <div className="flex flex-col items-start gap-4 pb-4 relative w-full max-w-lg overflow-y-auto max-h-[90vh] rounded-lg">
-        {content}
-    </div>
-);
-
-};
-
- // I did get conflicted between 3102 and 3103, going with 3102 until the satellite comes into play
\ No newline at end of file
+};
\ No newline at end of file