diff --git a/apps/opik-frontend/src/components/layout/PartialPageLayout/PartialPageLayout.tsx b/apps/opik-frontend/src/components/layout/PartialPageLayout/PartialPageLayout.tsx
index 0f5a794017..e577df9098 100644
--- a/apps/opik-frontend/src/components/layout/PartialPageLayout/PartialPageLayout.tsx
+++ b/apps/opik-frontend/src/components/layout/PartialPageLayout/PartialPageLayout.tsx
@@ -24,7 +24,7 @@ export const PartialPageLayout = ({
       <main>
         <nav className="comet-header-height flex w-full items-center justify-between gap-6 border-b pl-4 pr-6">
           <div className="flex-1">
-            <Link to="/$workspaceName/projects" params={{ workspaceName }}>
+            <Link to="/$workspaceName/home" params={{ workspaceName }}>
               {logo}
             </Link>
           </div>
diff --git a/apps/opik-frontend/src/components/layout/SideBar/SideBar.tsx b/apps/opik-frontend/src/components/layout/SideBar/SideBar.tsx
index dae8a1e4b9..5354603ded 100644
--- a/apps/opik-frontend/src/components/layout/SideBar/SideBar.tsx
+++ b/apps/opik-frontend/src/components/layout/SideBar/SideBar.tsx
@@ -12,6 +12,7 @@ import {
   PanelLeftClose,
   MessageCircleQuestion,
   FileTerminal,
+  LucideHome,
 } from "lucide-react";
 import { keepPreviousData } from "@tanstack/react-query";
 
@@ -47,6 +48,13 @@ type MenuItem = {
 };
 
 const MAIN_MENU_ITEMS: MenuItem[] = [
+  {
+    id: "home",
+    path: "/$workspaceName/home",
+    type: MENU_ITEM_TYPE.router,
+    icon: LucideHome,
+    label: "Home",
+  },
   {
     id: "projects",
     path: "/$workspaceName/projects",
@@ -89,7 +97,7 @@ const MAIN_MENU_ITEMS: MenuItem[] = [
   },
 ];
 
-const HOME_PATH = "/$workspaceName/projects";
+const HOME_PATH = "/$workspaceName/home";
 
 type SideBarProps = {
   expanded: boolean;
diff --git a/apps/opik-frontend/src/components/pages/ExperimentsPage/ExperimentsPage.tsx b/apps/opik-frontend/src/components/pages/ExperimentsPage/ExperimentsPage.tsx
index 64f3089556..c1c5a58391 100644
--- a/apps/opik-frontend/src/components/pages/ExperimentsPage/ExperimentsPage.tsx
+++ b/apps/opik-frontend/src/components/pages/ExperimentsPage/ExperimentsPage.tsx
@@ -28,7 +28,7 @@ import {
 } from "@/types/shared";
 import { convertColumnDataToColumn } from "@/lib/table";
 import ColumnsButton from "@/components/shared/ColumnsButton/ColumnsButton";
-import AddExperimentDialog from "@/components/pages/ExperimentsPage/AddExperimentDialog";
+import AddExperimentDialog from "@/components/pages/ExperimentsShared/AddExperimentDialog";
 import ExperimentsActionsPanel from "@/components/pages/ExperimentsShared/ExperimentsActionsPanel";
 import ExperimentsFiltersButton from "@/components/pages/ExperimentsShared/ExperimentsFiltersButton";
 import ExperimentRowActionsCell from "@/components/pages/ExperimentsPage/ExperimentRowActionsCell";
diff --git a/apps/opik-frontend/src/components/pages/ExperimentsPage/AddExperimentDialog.tsx b/apps/opik-frontend/src/components/pages/ExperimentsShared/AddExperimentDialog.tsx
similarity index 100%
rename from apps/opik-frontend/src/components/pages/ExperimentsPage/AddExperimentDialog.tsx
rename to apps/opik-frontend/src/components/pages/ExperimentsShared/AddExperimentDialog.tsx
diff --git a/apps/opik-frontend/src/components/pages/HomePage/EvaluationSection.tsx b/apps/opik-frontend/src/components/pages/HomePage/EvaluationSection.tsx
new file mode 100644
index 0000000000..6ccef9ac85
--- /dev/null
+++ b/apps/opik-frontend/src/components/pages/HomePage/EvaluationSection.tsx
@@ -0,0 +1,183 @@
+import React, { useCallback, useMemo, useRef, useState } from "react";
+import { keepPreviousData } from "@tanstack/react-query";
+import useLocalStorageState from "use-local-storage-state";
+import { ColumnPinningState } from "@tanstack/react-table";
+import { Link } from "@tanstack/react-router";
+import { Book } from "lucide-react";
+import get from "lodash/get";
+
+import DataTable from "@/components/shared/DataTable/DataTable";
+import DataTableNoData from "@/components/shared/DataTableNoData/DataTableNoData";
+import ResourceCell from "@/components/shared/DataTableCells/ResourceCell";
+import useExperimentsList from "@/api/datasets/useExperimentsList";
+import Loader from "@/components/shared/Loader/Loader";
+import AddExperimentDialog from "@/components/pages/ExperimentsShared/AddExperimentDialog";
+import { Button } from "@/components/ui/button";
+import useAppStore from "@/store/AppStore";
+import { COLUMN_NAME_ID, COLUMN_SELECT_ID, COLUMN_TYPE } from "@/types/shared";
+import { RESOURCE_TYPE } from "@/components/shared/ResourceLink/ResourceLink";
+import { Experiment } from "@/types/datasets";
+import { convertColumnDataToColumn } from "@/lib/table";
+import { buildDocsUrl } from "@/lib/utils";
+import { formatDate } from "@/lib/date";
+
+const COLUMNS_WIDTH_KEY = "home-experiments-columns-width";
+
+export const COLUMNS = convertColumnDataToColumn<Experiment, Experiment>(
+  [
+    {
+      id: COLUMN_NAME_ID,
+      label: "Experiment",
+      type: COLUMN_TYPE.string,
+      cell: ResourceCell as never,
+      sortable: true,
+      customMeta: {
+        nameKey: "name",
+        idKey: "id",
+        resource: RESOURCE_TYPE.experiment,
+      },
+    },
+    {
+      id: "dataset",
+      label: "Dataset",
+      type: COLUMN_TYPE.string,
+      cell: ResourceCell as never,
+      customMeta: {
+        nameKey: "dataset_name",
+        idKey: "dataset_id",
+        resource: RESOURCE_TYPE.dataset,
+      },
+    },
+    {
+      id: "prompt",
+      label: "Prompt commit",
+      type: COLUMN_TYPE.string,
+      cell: ResourceCell as never,
+      customMeta: {
+        nameKey: "prompt_version.commit",
+        idKey: "prompt_version.prompt_id",
+        resource: RESOURCE_TYPE.prompt,
+        getSearch: (data: Experiment) => ({
+          activeVersionId: get(data, "prompt_version.id", null),
+        }),
+      },
+    },
+    {
+      id: "trace_count",
+      label: "Trace count",
+      type: COLUMN_TYPE.number,
+    },
+    {
+      id: "created_at",
+      label: "Created",
+      type: COLUMN_TYPE.time,
+      accessorFn: (row) => formatDate(row.created_at),
+      sortable: true,
+    },
+    {
+      id: "last_updated_at",
+      label: "Last updated",
+      type: COLUMN_TYPE.time,
+      accessorFn: (row) => formatDate(row.last_updated_at),
+      sortable: true,
+    },
+  ],
+  {},
+);
+
+export const DEFAULT_COLUMN_PINNING: ColumnPinningState = {
+  left: [COLUMN_SELECT_ID, COLUMN_NAME_ID],
+  right: [],
+};
+
+const EvaluationSection: React.FunctionComponent = () => {
+  const workspaceName = useAppStore((state) => state.activeWorkspaceName);
+
+  const resetDialogKeyRef = useRef(0);
+  const [openDialog, setOpenDialog] = useState<boolean>(false);
+
+  const { data, isPending } = useExperimentsList(
+    {
+      workspaceName,
+      page: 1,
+      size: 5,
+    },
+    {
+      placeholderData: keepPreviousData,
+    },
+  );
+
+  const experiments = useMemo(() => data?.content ?? [], [data?.content]);
+  const noDataText = "There are no experiments yet";
+
+  const [columnsWidth, setColumnsWidth] = useLocalStorageState<
+    Record<string, number>
+  >(COLUMNS_WIDTH_KEY, {
+    defaultValue: {},
+  });
+
+  const resizeConfig = useMemo(
+    () => ({
+      enabled: true,
+      columnSizing: columnsWidth,
+      onColumnResize: setColumnsWidth,
+    }),
+    [columnsWidth, setColumnsWidth],
+  );
+
+  const handleNewExperimentClick = useCallback(() => {
+    setOpenDialog(true);
+    resetDialogKeyRef.current = resetDialogKeyRef.current + 1;
+  }, []);
+
+  if (isPending) {
+    return <Loader />;
+  }
+
+  return (
+    <div className="pb-4">
+      <div className="flex items-center justify-between gap-8 pb-4 pt-2">
+        <div className="flex items-center gap-2">
+          <h2 className="comet-body-accented truncate break-words">
+            Evaluation
+          </h2>
+        </div>
+        <div className="flex items-center gap-2">
+          <Button variant="outline" asChild>
+            <a
+              href={buildDocsUrl("/evaluation/concepts")}
+              target="_blank"
+              rel="noreferrer"
+            >
+              <Book className="mr-2 size-4 shrink-0" />
+              Learn more
+            </a>
+          </Button>
+          <Link to="/$workspaceName/experiments" params={{ workspaceName }}>
+            <Button variant="outline">View all experiments</Button>
+          </Link>
+        </div>
+      </div>
+      <DataTable
+        columns={COLUMNS}
+        data={experiments}
+        resizeConfig={resizeConfig}
+        columnPinning={DEFAULT_COLUMN_PINNING}
+        noData={
+          <DataTableNoData title={noDataText}>
+            <Button variant="link" onClick={handleNewExperimentClick}>
+              Create new experiment
+            </Button>
+          </DataTableNoData>
+        }
+      />
+      <AddExperimentDialog
+        key={resetDialogKeyRef.current}
+        open={openDialog}
+        setOpen={setOpenDialog}
+      />
+    </div>
+  );
+};
+
+export default EvaluationSection;
diff --git a/apps/opik-frontend/src/components/pages/HomePage/GetStartedSection.tsx b/apps/opik-frontend/src/components/pages/HomePage/GetStartedSection.tsx
new file mode 100644
index 0000000000..80dfa65f94
--- /dev/null
+++ b/apps/opik-frontend/src/components/pages/HomePage/GetStartedSection.tsx
@@ -0,0 +1,102 @@
+import React from "react";
+import { ArrowRight, MessageCircle, MousePointer, X } from "lucide-react";
+import useLocalStorageState from "use-local-storage-state";
+
+import { Separator } from "@/components/ui/separator";
+import { Button } from "@/components/ui/button";
+import { Alert, AlertDescription, AlertTitle } from "@/components/ui/alert";
+import { Link } from "@tanstack/react-router";
+import useAppStore from "@/store/AppStore";
+import { DEMO_PROJECT_NAME } from "@/constants/shared";
+import { buildDocsUrl } from "@/lib/utils";
+
+const GetStartedSection = () => {
+  const workspaceName = useAppStore((state) => state.activeWorkspaceName);
+  const [hide, setHide] = useLocalStorageState<boolean>(
+    "home-get-started-section",
+    {
+      defaultValue: false,
+    },
+  );
+
+  if (hide) return null;
+
+  return (
+    <div>
+      <div className="flex items-center justify-between gap-8 pb-4 pt-2">
+        <div className="flex items-center gap-2">
+          <h2 className="comet-body-accented truncate break-words">
+            Get started with Opik
+          </h2>
+        </div>
+        <div className="flex items-center gap-2">
+          <Button
+            variant="minimal"
+            size="icon-xs"
+            onClick={() => setHide(true)}
+          >
+            <X className="size-4" />
+          </Button>
+        </div>
+      </div>
+      <div className="flex gap-x-4">
+        <Alert className="mt-4">
+          <MousePointer className="size-4" />
+          <AlertTitle>Explore our demo project</AlertTitle>
+          <AlertDescription>
+            Browse our curated examples to draw inspiration for your own LLM
+            projects.
+          </AlertDescription>
+          <Link
+            to="/$workspaceName/redirect/projects"
+            params={{ workspaceName }}
+            search={{ name: DEMO_PROJECT_NAME }}
+          >
+            <Button variant="ghost" size="sm" className="-ml-2">
+              Go to demo project
+              <ArrowRight className="ml-1 size-4 shrink-0" />
+            </Button>
+          </Link>
+        </Alert>
+        <Alert className="mt-4">
+          <MessageCircle className="size-4" />
+          <AlertTitle>Log a trace</AlertTitle>
+          <AlertDescription>
+            The first step in integrating Opik with your codebase is to track
+            your LLM calls.
+          </AlertDescription>
+          <Button variant="ghost" size="sm" asChild>
+            <a
+              href={buildDocsUrl("/tracing/log_traces")}
+              target="_blank"
+              rel="noreferrer"
+            >
+              Start logging traces
+              <ArrowRight className="ml-1 size-4 shrink-0" />
+            </a>
+          </Button>
+        </Alert>
+        <Alert className="mt-4">
+          <MessageCircle className="size-4" />
+          <AlertTitle>Run an experiment</AlertTitle>
+          <AlertDescription>
+            An experiment is a single evaluation of your LLM application.
+          </AlertDescription>
+          <Button variant="ghost" size="sm" asChild>
+            <a
+              href={buildDocsUrl("/evaluation/evaluate_your_llm")}
+              target="_blank"
+              rel="noreferrer"
+            >
+              Start running experiments
+              <ArrowRight className="ml-1 size-4 shrink-0" />
+            </a>
+          </Button>
+        </Alert>
+      </div>
+      <Separator className="my-6" />
+    </div>
+  );
+};
+
+export default GetStartedSection;
diff --git a/apps/opik-frontend/src/components/pages/HomePage/HomePage.tsx b/apps/opik-frontend/src/components/pages/HomePage/HomePage.tsx
index 3e4eeb13c4..83c9800986 100644
--- a/apps/opik-frontend/src/components/pages/HomePage/HomePage.tsx
+++ b/apps/opik-frontend/src/components/pages/HomePage/HomePage.tsx
@@ -1,10 +1,25 @@
+import React from "react";
 import useAppStore from "@/store/AppStore";
-import { Navigate } from "@tanstack/react-router";
+import GetStartedSection from "@/components/pages/HomePage/GetStartedSection";
+import ObservabilitySection from "@/components/pages/HomePage/ObservabilitySection";
+import EvaluationSection from "@/components/pages/HomePage/EvaluationSection";
 
 const HomePage = () => {
   const workspaceName = useAppStore((state) => state.activeWorkspaceName);
 
-  return <Navigate to="/$workspaceName/projects" params={{ workspaceName }} />;
+  return (
+    <div className="pt-6">
+      <div className="mb-4 flex items-center justify-between">
+        <h1 className="comet-title-l truncate break-words">
+          Welcome to {workspaceName}
+        </h1>
+      </div>
+      <GetStartedSection />
+      <ObservabilitySection />
+      <div className="h-6"></div>
+      <EvaluationSection />
+    </div>
+  );
 };
 
 export default HomePage;
diff --git a/apps/opik-frontend/src/components/pages/HomePage/ObservabilitySection.tsx b/apps/opik-frontend/src/components/pages/HomePage/ObservabilitySection.tsx
new file mode 100644
index 0000000000..610d75daef
--- /dev/null
+++ b/apps/opik-frontend/src/components/pages/HomePage/ObservabilitySection.tsx
@@ -0,0 +1,159 @@
+import React, { useCallback, useMemo, useRef, useState } from "react";
+import { keepPreviousData } from "@tanstack/react-query";
+import useLocalStorageState from "use-local-storage-state";
+import { ColumnPinningState } from "@tanstack/react-table";
+import { Link } from "@tanstack/react-router";
+import { Book } from "lucide-react";
+
+import DataTable from "@/components/shared/DataTable/DataTable";
+import DataTableNoData from "@/components/shared/DataTableNoData/DataTableNoData";
+import ResourceCell from "@/components/shared/DataTableCells/ResourceCell";
+import useProjectsList from "@/api/projects/useProjectsList";
+import Loader from "@/components/shared/Loader/Loader";
+import AddEditProjectDialog from "@/components/pages/ProjectsPage/AddEditProjectDialog";
+import { Button } from "@/components/ui/button";
+import useAppStore from "@/store/AppStore";
+import { COLUMN_NAME_ID, COLUMN_SELECT_ID, COLUMN_TYPE } from "@/types/shared";
+import { RESOURCE_TYPE } from "@/components/shared/ResourceLink/ResourceLink";
+import { Project } from "@/types/projects";
+import { formatDate } from "@/lib/date";
+import { convertColumnDataToColumn } from "@/lib/table";
+import { buildDocsUrl } from "@/lib/utils";
+
+const COLUMNS_WIDTH_KEY = "home-projects-columns-width";
+
+export const COLUMNS = convertColumnDataToColumn<Project, Project>(
+  [
+    {
+      id: COLUMN_NAME_ID,
+      label: "Project",
+      type: COLUMN_TYPE.string,
+      cell: ResourceCell as never,
+      sortable: true,
+      customMeta: {
+        nameKey: "name",
+        idKey: "id",
+        resource: RESOURCE_TYPE.project,
+      },
+    },
+    {
+      id: "created_at",
+      label: "Created",
+      type: COLUMN_TYPE.time,
+      accessorFn: (row) => formatDate(row.created_at),
+      sortable: true,
+    },
+    {
+      id: "last_updated_at",
+      label: "Last updated",
+      type: COLUMN_TYPE.time,
+      accessorFn: (row) =>
+        formatDate(row.last_updated_trace_at ?? row.last_updated_at),
+      sortable: true,
+    },
+  ],
+  {},
+);
+
+export const DEFAULT_COLUMN_PINNING: ColumnPinningState = {
+  left: [COLUMN_SELECT_ID, COLUMN_NAME_ID],
+  right: [],
+};
+
+const ObservabilitySection: React.FunctionComponent = () => {
+  const workspaceName = useAppStore((state) => state.activeWorkspaceName);
+
+  const resetDialogKeyRef = useRef(0);
+  const [openDialog, setOpenDialog] = useState<boolean>(false);
+
+  const { data, isPending } = useProjectsList(
+    {
+      workspaceName,
+      sorting: [
+        {
+          id: "last_updated_trace_at",
+          desc: true,
+        },
+      ],
+      page: 1,
+      size: 5,
+    },
+    {
+      placeholderData: keepPreviousData,
+    },
+  );
+
+  const projects = useMemo(() => data?.content ?? [], [data?.content]);
+  const noDataText = "There are no projects yet";
+
+  const [columnsWidth, setColumnsWidth] = useLocalStorageState<
+    Record<string, number>
+  >(COLUMNS_WIDTH_KEY, {
+    defaultValue: {},
+  });
+
+  const resizeConfig = useMemo(
+    () => ({
+      enabled: true,
+      columnSizing: columnsWidth,
+      onColumnResize: setColumnsWidth,
+    }),
+    [columnsWidth, setColumnsWidth],
+  );
+
+  const handleNewProjectClick = useCallback(() => {
+    setOpenDialog(true);
+    resetDialogKeyRef.current = resetDialogKeyRef.current + 1;
+  }, []);
+
+  if (isPending) {
+    return <Loader />;
+  }
+
+  return (
+    <div className="pb-4">
+      <div className="flex items-center justify-between gap-8 pb-4 pt-2">
+        <div className="flex items-center gap-2">
+          <h2 className="comet-body-accented truncate break-words">
+            Observability
+          </h2>
+        </div>
+        <div className="flex items-center gap-2">
+          <Button variant="outline" asChild>
+            <a
+              href={buildDocsUrl("/tracing/log_traces")}
+              target="_blank"
+              rel="noreferrer"
+            >
+              <Book className="mr-2 size-4 shrink-0" />
+              Learn more
+            </a>
+          </Button>
+          <Link to="/$workspaceName/projects" params={{ workspaceName }}>
+            <Button variant="outline">View all projects</Button>
+          </Link>
+        </div>
+      </div>
+      <DataTable
+        columns={COLUMNS}
+        data={projects}
+        resizeConfig={resizeConfig}
+        columnPinning={DEFAULT_COLUMN_PINNING}
+        noData={
+          <DataTableNoData title={noDataText}>
+            <Button variant="link" onClick={handleNewProjectClick}>
+              Create new project
+            </Button>
+          </DataTableNoData>
+        }
+      />
+      <AddEditProjectDialog
+        key={resetDialogKeyRef.current}
+        open={openDialog}
+        setOpen={setOpenDialog}
+      />
+    </div>
+  );
+};
+
+export default ObservabilitySection;
diff --git a/apps/opik-frontend/src/components/pages/QuickstartPage/Quickstart.tsx b/apps/opik-frontend/src/components/pages/QuickstartPage/Quickstart.tsx
index 7e5c4f4ad5..d2635471bc 100644
--- a/apps/opik-frontend/src/components/pages/QuickstartPage/Quickstart.tsx
+++ b/apps/opik-frontend/src/components/pages/QuickstartPage/Quickstart.tsx
@@ -140,7 +140,7 @@ const Quickstart: React.FunctionComponent<QuickstartProps> = ({
         </div>
         <div className="flex flex-1 flex-col">
           <div className="sticky top-5 self-end">
-            <Link to="/$workspaceName/projects" params={{ workspaceName }}>
+            <Link to="/$workspaceName/home" params={{ workspaceName }}>
               <Button variant="secondary">
                 Explore the platform on my own
               </Button>
diff --git a/apps/opik-frontend/src/components/pages/WorkspacePage/WorkspacePage.tsx b/apps/opik-frontend/src/components/pages/WorkspacePage/WorkspacePage.tsx
index 91149e54d2..29a0d29610 100644
--- a/apps/opik-frontend/src/components/pages/WorkspacePage/WorkspacePage.tsx
+++ b/apps/opik-frontend/src/components/pages/WorkspacePage/WorkspacePage.tsx
@@ -10,7 +10,7 @@ const WorkspacePage = () => {
   if (isRootPage) {
     return (
       <Navigate
-        to="/$workspaceName/projects"
+        to="/$workspaceName/home"
         params={{ workspaceName: activeWorkspaceName }}
       />
     );
diff --git a/apps/opik-frontend/src/components/redirect/RedirectDatasets.tsx b/apps/opik-frontend/src/components/redirect/RedirectDatasets.tsx
index 19fea6c653..103f6b858a 100644
--- a/apps/opik-frontend/src/components/redirect/RedirectDatasets.tsx
+++ b/apps/opik-frontend/src/components/redirect/RedirectDatasets.tsx
@@ -1,10 +1,11 @@
-import { useEffect } from "react";
+import React, { useEffect } from "react";
 import Loader from "@/components/shared/Loader/Loader";
 import { StringParam, useQueryParams } from "use-query-params";
 import useAppStore from "@/store/AppStore";
-import { Navigate, useNavigate } from "@tanstack/react-router";
+import { Link, Navigate, useNavigate } from "@tanstack/react-router";
 import NoData from "@/components/shared/NoData/NoData";
 import useDatasetItemByName from "@/api/datasets/useDatasetItemByName";
+import { Button } from "@/components/ui/button";
 
 const RedirectDatasets = () => {
   const [query] = useQueryParams({
@@ -38,7 +39,19 @@ const RedirectDatasets = () => {
   }
 
   if (!isPendingDatasetByName && !datasetByName) {
-    return <NoData message="No dataset with this name" />;
+    return (
+      <NoData
+        icon={<div className="comet-title-m mb-1 text-foreground">404</div>}
+        title="This dataset could not be found"
+        message="The dataset you’re looking for doesn’t exist or has been deleted."
+      >
+        <div className="pt-5">
+          <Link to="/$workspaceName/home" params={{ workspaceName }}>
+            <Button>Back to Home</Button>
+          </Link>
+        </div>
+      </NoData>
+    );
   }
 
   if (!query.id && !query.name) {
diff --git a/apps/opik-frontend/src/components/redirect/RedirectProjects.tsx b/apps/opik-frontend/src/components/redirect/RedirectProjects.tsx
index 6328b5c930..3bd18a64dc 100644
--- a/apps/opik-frontend/src/components/redirect/RedirectProjects.tsx
+++ b/apps/opik-frontend/src/components/redirect/RedirectProjects.tsx
@@ -1,10 +1,11 @@
-import { useEffect } from "react";
+import React, { useEffect } from "react";
 import Loader from "@/components/shared/Loader/Loader";
 import { StringParam, useQueryParams } from "use-query-params";
 import useAppStore from "@/store/AppStore";
-import { Navigate, useNavigate } from "@tanstack/react-router";
+import { Link, Navigate, useNavigate } from "@tanstack/react-router";
 import useProjectByName from "@/api/projects/useProjectByName";
 import NoData from "@/components/shared/NoData/NoData";
+import { Button } from "@/components/ui/button";
 
 const RedirectProjects = () => {
   const [query] = useQueryParams({
@@ -38,7 +39,19 @@ const RedirectProjects = () => {
   }
 
   if (!isPendingProjectByName && !projectByName) {
-    return <NoData message="No project with this name" />;
+    return (
+      <NoData
+        icon={<div className="comet-title-m mb-1 text-foreground">404</div>}
+        title="This project could not be found"
+        message="The project you’re looking for doesn’t exist or has been deleted."
+      >
+        <div className="pt-5">
+          <Link to="/$workspaceName/home" params={{ workspaceName }}>
+            <Button>Back to Home</Button>
+          </Link>
+        </div>
+      </NoData>
+    );
   }
 
   if (!query.id && !query.name) {
diff --git a/apps/opik-frontend/src/components/shared/DataTableCells/ResourceCell.tsx b/apps/opik-frontend/src/components/shared/DataTableCells/ResourceCell.tsx
index cb2c9b28cc..0a78e68340 100644
--- a/apps/opik-frontend/src/components/shared/DataTableCells/ResourceCell.tsx
+++ b/apps/opik-frontend/src/components/shared/DataTableCells/ResourceCell.tsx
@@ -30,15 +30,17 @@ const ResourceCell = (context: CellContext<unknown, string>) => {
   const id = get(cellData, idKey, undefined);
   const search = isFunction(getSearch) ? getSearch(cellData) : undefined;
 
-  if (!id) return null;
-
   return (
     <CellWrapper
       metadata={context.column.columnDef.meta}
       tableMetadata={context.table.options.meta}
       className="py-1.5"
     >
-      <ResourceLink id={id} name={name} resource={resource} search={search} />
+      {id ? (
+        <ResourceLink id={id} name={name} resource={resource} search={search} />
+      ) : (
+        "-"
+      )}
     </CellWrapper>
   );
 };
diff --git a/apps/opik-frontend/src/components/shared/NoData/NoData.tsx b/apps/opik-frontend/src/components/shared/NoData/NoData.tsx
index 39486d3301..a09338975b 100644
--- a/apps/opik-frontend/src/components/shared/NoData/NoData.tsx
+++ b/apps/opik-frontend/src/components/shared/NoData/NoData.tsx
@@ -3,15 +3,19 @@ import { Ban } from "lucide-react";
 import { cn } from "@/lib/utils";
 
 type NoDataProps = {
+  icon?: React.ReactNode;
   title?: string;
   message?: string;
   className?: string;
+  children?: React.ReactNode;
 };
 
 const NoData: React.FunctionComponent<NoDataProps> = ({
+  icon = <Ban className="text-muted-slate" />,
   title,
   message = "No Data",
   className,
+  children,
 }) => {
   return (
     <div
@@ -20,9 +24,14 @@ const NoData: React.FunctionComponent<NoDataProps> = ({
         className,
       )}
     >
-      <Ban />
-      {title && <h3 className="comet-title-s">{title}</h3>}
-      {message}
+      {icon}
+      {title && (
+        <h3 className="comet-body-accented mb-1 text-foreground">{title}</h3>
+      )}
+      {message && (
+        <div className="comet-body-small text-muted-slate">{message}</div>
+      )}
+      {children}
     </div>
   );
 };
diff --git a/apps/opik-frontend/src/components/ui/alert.tsx b/apps/opik-frontend/src/components/ui/alert.tsx
index 46a4f29544..f6a81bf55f 100644
--- a/apps/opik-frontend/src/components/ui/alert.tsx
+++ b/apps/opik-frontend/src/components/ui/alert.tsx
@@ -38,7 +38,10 @@ const AlertTitle = React.forwardRef<
 >(({ className, ...props }, ref) => (
   <h5
     ref={ref}
-    className={cn("mb-1 font-medium leading-none tracking-tight", className)}
+    className={cn(
+      "mb-1 comet-body-s-accented text-foreground-secondary",
+      className,
+    )}
     {...props}
   />
 ));
@@ -50,7 +53,10 @@ const AlertDescription = React.forwardRef<
 >(({ className, ...props }, ref) => (
   <div
     ref={ref}
-    className={cn("text-sm leading-6 [&_p]:leading-relaxed", className)}
+    className={cn(
+      "comet-body-s text-light-slate leading-6 [&_p]:leading-relaxed",
+      className,
+    )}
     {...props}
   />
 ));
diff --git a/apps/opik-frontend/src/constants/shared.ts b/apps/opik-frontend/src/constants/shared.ts
index e50ff87943..ab34a0b6b8 100644
--- a/apps/opik-frontend/src/constants/shared.ts
+++ b/apps/opik-frontend/src/constants/shared.ts
@@ -5,6 +5,8 @@ import {
 } from "@/types/shared";
 import React from "react";
 
+export const DEMO_PROJECT_NAME = "Demo Project";
+
 export const TABLE_HEADER_Z_INDEX = 2;
 export const TABLE_ROW_Z_INDEX = 0;