diff --git a/ui/src/pages/AppsTab/AppDeploymentPage/AppDeploymentPage.module.css b/ui/src/pages/AppsTab/AppDeploymentPage/AppDeploymentPage.module.css
new file mode 100644
index 00000000..c8d8cef7
--- /dev/null
+++ b/ui/src/pages/AppsTab/AppDeploymentPage/AppDeploymentPage.module.css
@@ -0,0 +1,7 @@
+.container {
+  display: flex;
+  flex-direction: column;
+  gap: 16px;
+  padding: 16px 24px;
+  min-height: 100%;
+}
diff --git a/ui/src/pages/AppsTab/AppDeploymentPage/index.tsx b/ui/src/pages/AppsTab/AppDeploymentPage/index.tsx
new file mode 100644
index 00000000..c0a73228
--- /dev/null
+++ b/ui/src/pages/AppsTab/AppDeploymentPage/index.tsx
@@ -0,0 +1,26 @@
+import { useParams, useLocation } from 'react-router';
+import { useEnvironmentStore } from '../../../api/environment-store';
+import { useEnvironments } from '../../../api/queries/admin/environments';
+import { useApps } from '../../../api/queries/admin/apps';
+import { PageLoader } from '../../../components/PageLoader';
+import styles from './AppDeploymentPage.module.css';
+
+export default function AppDeploymentPage() {
+  const { appId } = useParams<{ appId?: string }>();
+  const location = useLocation();
+  const selectedEnv = useEnvironmentStore((s) => s.environment);
+  const { data: environments = [], isLoading: envLoading } = useEnvironments();
+  const { data: apps = [], isLoading: appsLoading } = useApps(selectedEnv);
+
+  const isNetNew = location.pathname.endsWith('/apps/new');
+  const app = isNetNew ? null : apps.find((a) => a.slug === appId) ?? null;
+
+  if (envLoading || appsLoading) return <PageLoader />;
+
+  return (
+    <div className={styles.container}>
+      <h2>{app ? app.displayName : 'Create Application'}</h2>
+      {/* Identity section, tabs, primary button land in subsequent tasks */}
+    </div>
+  );
+}
diff --git a/ui/src/router.tsx b/ui/src/router.tsx
index 0fbd88e6..6f42aaac 100644
--- a/ui/src/router.tsx
+++ b/ui/src/router.tsx
@@ -22,6 +22,7 @@ const OutboundConnectionsPage = lazy(() => import('./pages/Admin/OutboundConnect
 const OutboundConnectionEditor = lazy(() => import('./pages/Admin/OutboundConnectionEditor'));
 const SensitiveKeysPage = lazy(() => import('./pages/Admin/SensitiveKeysPage'));
 const AppsTab = lazy(() => import('./pages/AppsTab/AppsTab'));
+const AppDeploymentPage = lazy(() => import('./pages/AppsTab/AppDeploymentPage'));
 const SwaggerPage = lazy(() => import('./pages/Swagger/SwaggerPage'));
 const InboxPage        = lazy(() => import('./pages/Alerts/InboxPage'));
 const RulesListPage    = lazy(() => import('./pages/Alerts/RulesListPage'));
@@ -76,8 +77,8 @@ export const router = createBrowserRouter([
 
           // Apps tab (OPERATOR+ via UI guard, shows all or single app)
           { path: 'apps', element: <SuspenseWrapper><AppsTab /></SuspenseWrapper> },
-          { path: 'apps/new', element: <SuspenseWrapper><AppsTab /></SuspenseWrapper> },
-          { path: 'apps/:appId', element: <SuspenseWrapper><AppsTab /></SuspenseWrapper> },
+          { path: 'apps/new', element: <SuspenseWrapper><AppDeploymentPage /></SuspenseWrapper> },
+          { path: 'apps/:appId', element: <SuspenseWrapper><AppDeploymentPage /></SuspenseWrapper> },
 
           // Alerts
           { path: 'alerts', element: <Navigate to="/alerts/inbox" replace /> },