diff --git a/app/assets/javascripts/projects/new_v2/components/app.vue b/app/assets/javascripts/projects/new_v2/components/app.vue
index 6f912ed7a548db1cb7b658ccb00c46f1ab1060f3..7de862a21aeafe1ebbf15cb74502219fe156f8ad 100644
--- a/app/assets/javascripts/projects/new_v2/components/app.vue
+++ b/app/assets/javascripts/projects/new_v2/components/app.vue
@@ -6,59 +6,17 @@ import MultiStepFormTemplate from '~/vue_shared/components/multi_step_form_templ
 import SingleChoiceSelector from '~/vue_shared/components/single_choice_selector.vue';
 import SingleChoiceSelectorItem from '~/vue_shared/components/single_choice_selector_item.vue';
 
+import { OPTIONS } from '../constants';
 import NewProjectDestinationSelect from './project_destination_select.vue';
 import Breadcrumb from './form_breadcrumb.vue';
 import CommandLine from './command_line.vue';
-
-const OPTIONS = {
-  blank: {
-    key: 'blank',
-    value: 'blank_project',
-    selector: '#blank-project-pane',
-    title: s__('ProjectsNew|Create blank project'),
-    description: s__(
-      'ProjectsNew|Create a blank project to store your files, plan your work, and collaborate on code, among other things.',
-    ),
-  },
-  template: {
-    key: 'template',
-    value: 'create_from_template',
-    selector: '#create-from-template-pane',
-    title: s__('ProjectsNew|Create from template'),
-    description: s__(
-      'ProjectsNew|Create a project pre-populated with the necessary files to get you started quickly.',
-    ),
-  },
-  ci: {
-    key: 'ci',
-    value: 'cicd_for_external_repo',
-    selector: '#ci-cd-project-pane',
-    title: s__('ProjectsNew|Run CI/CD for external repository'),
-    description: s__('ProjectsNew|Connect your external repository to GitLab CI/CD.'),
-  },
-  import: {
-    key: 'import',
-    value: 'import_project',
-    selector: '#import-project-pane',
-    title: s__('ProjectsNew|Import project'),
-    description: s__(
-      'ProjectsNew|Migrate your data from an external source like GitHub, Bitbucket, or another instance of GitLab.',
-    ),
-    disabledMessage: s__(
-      'ProjectsNew|Contact an administrator to enable options for importing your project',
-    ),
-  },
-  transfer: {
-    key: 'transfer',
-    value: 'transfer_project',
-    selector: '#transfer-project-pane',
-    title: s__('ProjectsNew|Direct transfer projects with a top-level Group'),
-    description: s__('ProjectsNew|Migrate your data from another GitLab instance.'),
-    disabledMessage: s__('ProjectsNew|Available only for projects within groups'),
-  },
-};
+import BlankProjectForm from './blank_project_form.vue';
+import TemplateProjectForm from './template_project_form.vue';
+import CiCdProjectForm from './ci_cd_project_form.vue';
+import ImportProjectForm from './import_project_form.vue';
 
 export default {
+  OPTIONS,
   components: {
     GlButton,
     GlButtonGroup,
@@ -71,6 +29,10 @@ export default {
     NewProjectDestinationSelect,
     Breadcrumb,
     CommandLine,
+    BlankProjectForm,
+    TemplateProjectForm,
+    CiCdProjectForm,
+    ImportProjectForm,
   },
   directives: {
     SafeHtml,
@@ -154,6 +116,7 @@ export default {
       rootUrl: this.rootPath,
     };
   },
+
   computed: {
     isPersonalProject() {
       return this.selectedNamespace === this.userNamespaceId;
@@ -177,7 +140,17 @@ export default {
         },
       );
     },
+    availableProjectTypes() {
+      return [
+        OPTIONS.blank,
+        OPTIONS.template,
+        ...(this.canImportProjects && this.importSourcesEnabled ? [OPTIONS.import] : []),
+        ...(this.isCiCdAvailable ? [OPTIONS.ci] : []),
+        OPTIONS.transfer,
+      ];
+    },
   },
+
   methods: {
     choosePersonalNamespace() {
       this.selectedNamespace = this.userNamespaceId;
@@ -186,7 +159,6 @@ export default {
       this.selectedNamespace = null;
     },
   },
-  OPTIONS,
 };
 </script>
 
@@ -196,10 +168,7 @@ export default {
 
     <multi-step-form-template :title="__('Create new project')" :current-step="1">
       <template #form>
-        <gl-form-group
-          v-if="canSelectNamespace"
-          :label="s__('ProjectNew|What do you want to create?')"
-        >
+        <gl-form-group :label="s__('ProjectNew|What do you want to create?')">
           <gl-button-group class="gl-w-full">
             <gl-button
               category="primary"
@@ -238,31 +207,35 @@ export default {
         </gl-form-group>
 
         <single-choice-selector v-if="canChooseOption" checked="blank_project">
-          <single-choice-selector-item v-bind="$options.OPTIONS.blank" />
-          <single-choice-selector-item v-bind="$options.OPTIONS.template" />
           <single-choice-selector-item
-            v-if="canImportProjects && importSourcesEnabled"
-            v-bind="$options.OPTIONS.ci"
-          />
-          <single-choice-selector-item v-if="isCiCdAvailable" v-bind="$options.OPTIONS.import">
-            {{ $options.OPTIONS.import.title }}
-            <div class="gl-flex gl-gap-2">
-              <gl-icon name="tanuki" />
-              <gl-icon name="github" />
-              <gl-icon name="bitbucket" />
-              <gl-icon name="gitea" />
+            v-for="type in availableProjectTypes"
+            v-bind="type"
+            :key="type.key"
+          >
+            {{ type.title }}
+            <div v-if="type.icons" class="gl-flex gl-gap-2">
+              <gl-icon v-for="icon in type.icons" :key="icon" :name="icon" />
             </div>
           </single-choice-selector-item>
-          <single-choice-selector-item v-bind="$options.OPTIONS.transfer" :disabled="true" />
         </single-choice-selector>
         <gl-alert v-else variant="danger" :dismissible="false">
           {{ errorMessage }}
         </gl-alert>
       </template>
+      <template #next>
+        <gl-button category="primary" variant="confirm" size="medium">
+          {{ __('Next step') }}
+        </gl-button>
+      </template>
       <template #footer>
         <div v-if="newProjectGuidelines" v-safe-html="newProjectGuidelines" class="gl-mb-6"></div>
         <command-line v-if="isPersonalProject" />
       </template>
     </multi-step-form-template>
+
+    <blank-project-form :title="$options.OPTIONS.blank.title" />
+    <template-project-form :title="$options.OPTIONS.template.title" />
+    <ci-cd-project-form :title="$options.OPTIONS.ci.title" />
+    <import-project-form :title="$options.OPTIONS.import.title" />
   </div>
 </template>
diff --git a/app/assets/javascripts/projects/new_v2/components/blank_project_form.vue b/app/assets/javascripts/projects/new_v2/components/blank_project_form.vue
new file mode 100644
index 0000000000000000000000000000000000000000..c7a98d71ab745f0ae30dbd39d90e3c0fef04a32a
--- /dev/null
+++ b/app/assets/javascripts/projects/new_v2/components/blank_project_form.vue
@@ -0,0 +1,32 @@
+<script>
+import { GlButton } from '@gitlab/ui';
+import MultiStepFormTemplate from '~/vue_shared/components/multi_step_form_template.vue';
+
+export default {
+  components: {
+    GlButton,
+    MultiStepFormTemplate,
+  },
+  props: {
+    title: {
+      type: String,
+      required: true,
+    },
+  },
+};
+</script>
+
+<template>
+  <multi-step-form-template :title="title" :current-step="2" :steps-total="2">
+    <template #next>
+      <gl-button category="primary" variant="confirm" size="medium" :disabled="true">
+        {{ __('Create project') }}
+      </gl-button>
+    </template>
+    <template #back>
+      <gl-button category="primary" variant="default" size="medium">
+        {{ __('Go back') }}
+      </gl-button>
+    </template>
+  </multi-step-form-template>
+</template>
diff --git a/app/assets/javascripts/projects/new_v2/components/ci_cd_project_form.vue b/app/assets/javascripts/projects/new_v2/components/ci_cd_project_form.vue
new file mode 100644
index 0000000000000000000000000000000000000000..c7a98d71ab745f0ae30dbd39d90e3c0fef04a32a
--- /dev/null
+++ b/app/assets/javascripts/projects/new_v2/components/ci_cd_project_form.vue
@@ -0,0 +1,32 @@
+<script>
+import { GlButton } from '@gitlab/ui';
+import MultiStepFormTemplate from '~/vue_shared/components/multi_step_form_template.vue';
+
+export default {
+  components: {
+    GlButton,
+    MultiStepFormTemplate,
+  },
+  props: {
+    title: {
+      type: String,
+      required: true,
+    },
+  },
+};
+</script>
+
+<template>
+  <multi-step-form-template :title="title" :current-step="2" :steps-total="2">
+    <template #next>
+      <gl-button category="primary" variant="confirm" size="medium" :disabled="true">
+        {{ __('Create project') }}
+      </gl-button>
+    </template>
+    <template #back>
+      <gl-button category="primary" variant="default" size="medium">
+        {{ __('Go back') }}
+      </gl-button>
+    </template>
+  </multi-step-form-template>
+</template>
diff --git a/app/assets/javascripts/projects/new_v2/components/import_project_form.vue b/app/assets/javascripts/projects/new_v2/components/import_project_form.vue
new file mode 100644
index 0000000000000000000000000000000000000000..e3d7df53a68c7ee8da0aaa5f0dcf6bc687ab6195
--- /dev/null
+++ b/app/assets/javascripts/projects/new_v2/components/import_project_form.vue
@@ -0,0 +1,32 @@
+<script>
+import { GlButton } from '@gitlab/ui';
+import MultiStepFormTemplate from '~/vue_shared/components/multi_step_form_template.vue';
+
+export default {
+  components: {
+    GlButton,
+    MultiStepFormTemplate,
+  },
+  props: {
+    title: {
+      type: String,
+      required: true,
+    },
+  },
+};
+</script>
+
+<template>
+  <multi-step-form-template :title="title" :current-step="2">
+    <template #next>
+      <gl-button category="primary" variant="confirm" size="medium" :disabled="true">
+        {{ __('Next step') }}
+      </gl-button>
+    </template>
+    <template #back>
+      <gl-button category="primary" variant="default" size="medium">
+        {{ __('Go back') }}
+      </gl-button>
+    </template>
+  </multi-step-form-template>
+</template>
diff --git a/app/assets/javascripts/projects/new_v2/components/template_project_form.vue b/app/assets/javascripts/projects/new_v2/components/template_project_form.vue
new file mode 100644
index 0000000000000000000000000000000000000000..97bf6d5744adc9509a0da2843c71f88e911051c9
--- /dev/null
+++ b/app/assets/javascripts/projects/new_v2/components/template_project_form.vue
@@ -0,0 +1,32 @@
+<script>
+import { GlButton } from '@gitlab/ui';
+import MultiStepFormTemplate from '~/vue_shared/components/multi_step_form_template.vue';
+
+export default {
+  components: {
+    GlButton,
+    MultiStepFormTemplate,
+  },
+  props: {
+    title: {
+      type: String,
+      required: true,
+    },
+  },
+};
+</script>
+
+<template>
+  <multi-step-form-template :title="title" :current-step="2" :steps-total="3">
+    <template #next>
+      <gl-button category="primary" variant="confirm" :disabled="true">
+        {{ __('Next step') }}
+      </gl-button>
+    </template>
+    <template #back>
+      <gl-button category="primary" variant="default">
+        {{ __('Go back') }}
+      </gl-button>
+    </template>
+  </multi-step-form-template>
+</template>
diff --git a/app/assets/javascripts/projects/new_v2/constants.js b/app/assets/javascripts/projects/new_v2/constants.js
new file mode 100644
index 0000000000000000000000000000000000000000..5aed0d15bce68d26d6823d27c3492df551a05a59
--- /dev/null
+++ b/app/assets/javascripts/projects/new_v2/constants.js
@@ -0,0 +1,51 @@
+import { s__ } from '~/locale';
+
+export const OPTIONS = {
+  blank: {
+    key: 'blank',
+    value: 'blank_project',
+    selector: '#blank-project-pane',
+    title: s__('ProjectsNew|Create blank project'),
+    description: s__(
+      'ProjectsNew|Create a blank project to store your files, plan your work, and collaborate on code, among other things.',
+    ),
+  },
+  template: {
+    key: 'template',
+    value: 'create_from_template',
+    selector: '#create-from-template-pane',
+    title: s__('ProjectsNew|Create from template'),
+    description: s__(
+      'ProjectsNew|Create a project pre-populated with the necessary files to get you started quickly.',
+    ),
+  },
+  ci: {
+    key: 'ci',
+    value: 'cicd_for_external_repo',
+    selector: '#ci-cd-project-pane',
+    title: s__('ProjectsNew|Run CI/CD for external repository'),
+    description: s__('ProjectsNew|Connect your external repository to GitLab CI/CD.'),
+  },
+  import: {
+    key: 'import',
+    value: 'import_project',
+    selector: '#import-project-pane',
+    title: s__('ProjectsNew|Import project'),
+    description: s__(
+      'ProjectsNew|Migrate your data from an external source like GitHub, Bitbucket, or another instance of GitLab.',
+    ),
+    icons: ['tanuki', 'github', 'bitbucket', 'gitea'],
+    disabledMessage: s__(
+      'ProjectsNew|Contact an administrator to enable options for importing your project',
+    ),
+  },
+  transfer: {
+    key: 'transfer',
+    value: 'transfer_project',
+    selector: '#transfer-project-pane',
+    title: s__('ProjectsNew|Direct transfer projects with a top-level Group'),
+    description: s__('ProjectsNew|Migrate your data from another GitLab instance.'),
+    disabled: true,
+    disabledMessage: s__('ProjectsNew|Available only for projects within groups'),
+  },
+};
diff --git a/app/assets/javascripts/vue_shared/components/single_choice_selector.vue b/app/assets/javascripts/vue_shared/components/single_choice_selector.vue
index b5c9a5d2cefa6f80183eb780c06a34a4dd42cc16..9d7716a794c20276b577edcd4fd62552bf2f7b9d 100644
--- a/app/assets/javascripts/vue_shared/components/single_choice_selector.vue
+++ b/app/assets/javascripts/vue_shared/components/single_choice_selector.vue
@@ -6,21 +6,23 @@ export default {
   props: {
     checked: {
       type: String,
-      required: true,
+      required: false,
+      default: undefined,
     },
   },
-  data() {
-    return {
-      checkedOptions: this.checked,
-    };
+  methods: {
+    onChange(value) {
+      this.$emit('change', value);
+    },
   },
 };
 </script>
 
 <template>
   <gl-form-radio-group
-    v-model="checkedOptions"
+    :checked="checked"
     class="multiple-choice-selector gl-border gl-block gl-rounded-base"
+    @change="onChange"
   >
     <slot></slot>
   </gl-form-radio-group>