diff --git a/domain/Project.ts b/domain/Project.ts
deleted file mode 100644
index 130b0e1b..00000000
--- a/domain/Project.ts
+++ /dev/null
@@ -1,20 +0,0 @@
-import PEGS from "./PEGS";
-import type System from "../modules/system/domain/System";
-import type Task from "./Task";
-import type { Properties } from "./Properties";
-
-/**
- * The set of human processes involved in the plannimg, construction,
- * revision, and operation of a system
- */
-export class Project extends PEGS {
-    system!: System
-    tasks!: Task[]
-
-    constructor({ system, tasks, ...rest }: Properties<Project>) {
-        super(rest)
-
-        this.system = system
-        this.tasks = tasks
-    }
-}
diff --git a/modules/project/application/CreatePersonUseCase.ts b/modules/project/application/CreatePersonUseCase.ts
new file mode 100644
index 00000000..44361cb8
--- /dev/null
+++ b/modules/project/application/CreatePersonUseCase.ts
@@ -0,0 +1,25 @@
+import type Repository from "~/application/Repository"
+import UseCase from "~/application/UseCase"
+import Person from "../domain/Person"
+import { emptyUuid, type Uuid } from "~/domain/Uuid"
+
+type In = Pick<Person, 'projectId' | 'email' | 'roleId' | 'name'>
+
+export default class CreatePersonUseCase extends UseCase<In, Uuid> {
+    constructor(readonly repository: Repository<Person>) {
+        super()
+    }
+
+    async execute({ name, projectId, email, roleId }: In): Promise<Uuid> {
+        return await this.repository.add(new Person({
+            id: crypto.randomUUID(),
+            projectId,
+            email,
+            roleId,
+            name,
+            parentId: emptyUuid,
+            property: '',
+            statement: ''
+        }))
+    }
+}
\ No newline at end of file
diff --git a/modules/project/application/CreateProjectUseCase.ts b/modules/project/application/CreateProjectUseCase.ts
new file mode 100644
index 00000000..31835561
--- /dev/null
+++ b/modules/project/application/CreateProjectUseCase.ts
@@ -0,0 +1,19 @@
+import type Repository from "~/application/Repository";
+import UseCase from "~/application/UseCase";
+import type { Uuid } from "~/domain/Uuid";
+import Project from "../domain/Project";
+
+export default class CreateProjectUseCase extends UseCase<Uuid, Uuid> {
+    constructor(readonly repository: Repository<Project>) {
+        super()
+    }
+
+    async execute(solutionId: Uuid): Promise<Uuid> {
+        return await this.repository.add(new Project({
+            id: crypto.randomUUID(),
+            solutionId,
+            componentIds: [],
+            limitationIds: []
+        }))
+    }
+}
\ No newline at end of file
diff --git a/modules/project/application/DeletePersonUseCase.ts b/modules/project/application/DeletePersonUseCase.ts
new file mode 100644
index 00000000..4eb312b9
--- /dev/null
+++ b/modules/project/application/DeletePersonUseCase.ts
@@ -0,0 +1,14 @@
+import UseCase from "~/application/UseCase"
+import type { Uuid } from "~/domain/Uuid"
+import type Person from "../domain/Person"
+import type Repository from "~/application/Repository"
+
+export default class DeletePersonUseCase extends UseCase<Uuid, void> {
+    constructor(readonly repository: Repository<Person>) {
+        super()
+    }
+
+    async execute(id: Uuid): Promise<void> {
+        return await this.repository.delete(id)
+    }
+}
\ No newline at end of file
diff --git a/modules/project/application/GetPersonnelUseCase.ts b/modules/project/application/GetPersonnelUseCase.ts
new file mode 100644
index 00000000..fd9afd5e
--- /dev/null
+++ b/modules/project/application/GetPersonnelUseCase.ts
@@ -0,0 +1,14 @@
+import UseCase from "~/application/UseCase";
+import type Person from "../domain/Person";
+import type { Uuid } from "~/domain/Uuid";
+import type Repository from "~/application/Repository";
+
+export default class GetPersonnelUseCase extends UseCase<Uuid, Person[] | undefined> {
+    constructor(readonly repository: Repository<Person>) {
+        super()
+    }
+
+    async execute(projectId: Uuid): Promise<Person[] | undefined> {
+        return this.repository.getAll(p => p.projectId === projectId)
+    }
+}
\ No newline at end of file
diff --git a/modules/project/application/GetProjectBySolutionIdUseCase.ts b/modules/project/application/GetProjectBySolutionIdUseCase.ts
new file mode 100644
index 00000000..d33a7134
--- /dev/null
+++ b/modules/project/application/GetProjectBySolutionIdUseCase.ts
@@ -0,0 +1,16 @@
+import UseCase from "~/application/UseCase";
+import type Repository from "~/application/Repository";
+import type Project from "../domain/Project";
+import type { Uuid } from "~/domain/Uuid";
+
+export default class GetProjectBySolutionIdUseCase extends UseCase<Uuid, Project | undefined> {
+    constructor(readonly repository: Repository<Project>) {
+        super()
+    }
+
+    async execute(solutionId: Uuid): Promise<Project | undefined> {
+        const projects = await this.repository.getAll(g => g.solutionId === solutionId)
+
+        return projects[0]
+    }
+}
\ No newline at end of file
diff --git a/modules/project/application/UpdatePersonUseCase.ts b/modules/project/application/UpdatePersonUseCase.ts
new file mode 100644
index 00000000..734aa5c6
--- /dev/null
+++ b/modules/project/application/UpdatePersonUseCase.ts
@@ -0,0 +1,25 @@
+import UseCase from "~/application/UseCase";
+import Person from "../domain/Person";
+import type Repository from "~/application/Repository";
+import { emptyUuid } from "~/domain/Uuid";
+
+type In = Pick<Person, 'id' | 'projectId' | 'email' | 'roleId' | 'name'>
+
+export default class UpdatePersonUseCase extends UseCase<In, void> {
+    constructor(readonly repository: Repository<Person>) {
+        super()
+    }
+
+    async execute({ id, name, projectId, email, roleId }: In): Promise<void> {
+        return await this.repository.update(new Person({
+            id,
+            projectId,
+            email,
+            roleId,
+            name,
+            parentId: emptyUuid,
+            property: '',
+            statement: ''
+        }))
+    }
+}
\ No newline at end of file
diff --git a/modules/project/data/PersonRepository.ts b/modules/project/data/PersonRepository.ts
new file mode 100644
index 00000000..3736c503
--- /dev/null
+++ b/modules/project/data/PersonRepository.ts
@@ -0,0 +1,16 @@
+import type { Properties } from "~/domain/Properties";
+import StorageRepository from "~/data/StorageRepository.js";
+import type Person from "../domain/Person";
+import PersonToJsonMapper from "../mappers/PersonToJsonMapper";
+
+const { serializationVersion } = useAppConfig()
+
+export default class PersonRepository extends StorageRepository<Person> {
+    constructor(properties: Properties<Omit<PersonRepository, 'storageKey' | 'mapper'>> = {}) {
+        super({
+            ...properties,
+            storageKey: 'person',
+            mapper: new PersonToJsonMapper(serializationVersion)
+        })
+    }
+}
\ No newline at end of file
diff --git a/modules/project/data/ProjectRepository.ts b/modules/project/data/ProjectRepository.ts
new file mode 100644
index 00000000..d290e7dc
--- /dev/null
+++ b/modules/project/data/ProjectRepository.ts
@@ -0,0 +1,16 @@
+import type Project from "../domain/Project";
+import type { Properties } from "~/domain/Properties";
+import StorageRepository from "~/data/StorageRepository.js";
+import ProjectToJsonMapper from "../mappers/ProjectToJsonMapper";
+
+const { serializationVersion } = useAppConfig()
+
+export default class ProjectRepository extends StorageRepository<Project> {
+    constructor(properties: Properties<Omit<ProjectRepository, 'storageKey' | 'mapper'>> = {}) {
+        super({
+            ...properties,
+            storageKey: 'project',
+            mapper: new ProjectToJsonMapper(serializationVersion)
+        })
+    }
+}
\ No newline at end of file
diff --git a/modules/project/domain/Person.ts b/modules/project/domain/Person.ts
new file mode 100644
index 00000000..96c51cd8
--- /dev/null
+++ b/modules/project/domain/Person.ts
@@ -0,0 +1,15 @@
+import Actor from "~/domain/Actor";
+import type { Properties } from "~/domain/Properties";
+import type { Uuid } from "~/domain/Uuid";
+
+export default class Person extends Actor {
+    constructor({ email, roleId, projectId, ...rest }: Properties<Person>) {
+        super(rest);
+
+        Object.assign(this, { email, roleId, projectId });
+    }
+
+    email!: string;
+    roleId!: Uuid;
+    projectId!: Uuid;
+}
\ No newline at end of file
diff --git a/modules/project/domain/Project.ts b/modules/project/domain/Project.ts
new file mode 100644
index 00000000..b5d9ca30
--- /dev/null
+++ b/modules/project/domain/Project.ts
@@ -0,0 +1,7 @@
+import PEGS from "../../../domain/PEGS";
+
+/**
+ * The set of human processes involved in the plannimg, construction,
+ * revision, and operation of a system
+ */
+export default class Project extends PEGS { }
diff --git a/modules/project/index.ts b/modules/project/index.ts
index fe534a4e..7271f270 100644
--- a/modules/project/index.ts
+++ b/modules/project/index.ts
@@ -11,7 +11,11 @@ export default defineNuxtModule({
             pages.push({
                 name: 'Project',
                 path: '/solution/:solutionSlug/project',
-                file: resolve('./ui/pages/ProjectIndex.vue')
+                file: resolve('./ui/pages/Index.vue')
+            }, {
+                name: 'Roles & Personnel',
+                path: '/solution/:solutionSlug/project/roles-personnel',
+                file: resolve('./ui/pages/RolesPersonnel.vue')
             })
         })
     }
diff --git a/modules/project/mappers/PersonToJsonMapper.ts b/modules/project/mappers/PersonToJsonMapper.ts
new file mode 100644
index 00000000..5be88246
--- /dev/null
+++ b/modules/project/mappers/PersonToJsonMapper.ts
@@ -0,0 +1,31 @@
+import RequirementToJsonMapper, { type RequirementJson } from "~/mappers/RequirementToJsonMapper";
+import Person from "../domain/Person";
+import type { Uuid } from "~/domain/Uuid";
+
+export interface PersonJson extends RequirementJson {
+    email: string;
+    roleId: Uuid;
+    projectId: Uuid;
+}
+
+export default class PersonToJsonMapper extends RequirementToJsonMapper {
+    override mapFrom(target: PersonJson): Person {
+        return new Person({
+            ...super.mapFrom(target),
+            email: target.email,
+            roleId: target.roleId,
+            projectId: target.projectId
+        })
+    }
+
+    override mapTo(source: Person): PersonJson {
+        const requirement = super.mapTo(source)
+
+        return {
+            ...requirement,
+            email: source.email,
+            roleId: source.roleId,
+            projectId: source.projectId
+        }
+    }
+}
\ No newline at end of file
diff --git a/modules/project/mappers/ProjectToJsonMapper.ts b/modules/project/mappers/ProjectToJsonMapper.ts
new file mode 100644
index 00000000..585af18e
--- /dev/null
+++ b/modules/project/mappers/ProjectToJsonMapper.ts
@@ -0,0 +1,23 @@
+import PEGSToJsonMapper, { type PEGSJson } from "~/mappers/PEGSToJsonMapper";
+import Project from "../domain/Project";
+
+export interface ProjectJson extends PEGSJson { }
+
+export default class ProjectToJsonMapper extends PEGSToJsonMapper {
+    override mapFrom(target: ProjectJson): Project {
+        const pegs = super.mapFrom(target)
+
+        return new Project({
+            id: pegs.id,
+            limitationIds: pegs.limitationIds,
+            solutionId: pegs.solutionId,
+            componentIds: pegs.componentIds
+        });
+    }
+
+    override mapTo(source: Project): ProjectJson {
+        return {
+            ...super.mapTo(source as any)
+        };
+    }
+}
\ No newline at end of file
diff --git a/modules/project/ui/pages/Index.vue b/modules/project/ui/pages/Index.vue
new file mode 100644
index 00000000..f6a3f87c
--- /dev/null
+++ b/modules/project/ui/pages/Index.vue
@@ -0,0 +1,61 @@
+<script lang="ts" setup>
+import GetSolutionBySlugUseCase from '~/modules/solution/application/GetSolutionBySlugUseCase';
+import UpdateSolutionUseCase from '~/modules/solution/application/UpdateSolutionUseCase';
+import SolutionRepository from '~/modules/solution/data/SolutionRepository';
+import ProjectRepository from '../../data/ProjectRepository';
+import GetProjectBySolutionIdUseCase from '../../application/GetProjectBySolutionIdUseCase';
+import CreateProjectUseCase from '../../application/CreateProjectUseCase';
+
+useHead({
+    title: 'Project'
+})
+
+const router = useRouter(),
+    route = useRoute(),
+    slug = route.params.solutionSlug as string,
+    solutionRepository = new SolutionRepository(),
+    projectRepository = new ProjectRepository(),
+    getProjectBySolutionIdUseCase = new GetProjectBySolutionIdUseCase(projectRepository),
+    getSolutionBySlugUseCase = new GetSolutionBySlugUseCase(solutionRepository),
+    createProjectUseCase = new CreateProjectUseCase(projectRepository),
+    updateSolutionUseCase = new UpdateSolutionUseCase(solutionRepository),
+    solution = await getSolutionBySlugUseCase.execute(slug)
+
+if (!solution) {
+    router.push({ name: 'Solutions' });
+} else {
+    const project = await getProjectBySolutionIdUseCase.execute(solution.id);
+
+    if (!project) {
+        const newId = await createProjectUseCase.execute(solution.id);
+
+        await updateSolutionUseCase.execute({
+            id: solution.id,
+            name: solution.name,
+            description: solution.description,
+            environmentId: solution.environmentId,
+            goalsId: solution.goalsId,
+            projectId: newId,
+            systemId: solution.systemId
+        });
+    }
+}
+
+const links = [
+    { name: 'Roles & Personnel', icon: 'pi-users', label: 'Roles & Personnel' }
+]
+</script>
+<template>
+    <p>
+        A Project is the set of human processes involved in the plannimg, construction,
+        revision, and operation of a system
+    </p>
+
+    <div class="grid">
+        <NuxtLink v-for="link in links" :key="link.name" :to="{ name: link.name, params: { solutionSlug: slug } }"
+            class="col-fixed w-2 mr-4">
+            <Button :label="link.label" class="w-full h-5rem text-1xl" :icon="`pi ${link.icon} text-3xl`" iconPos="top"
+                severity="secondary" />
+        </NuxtLink>
+    </div>
+</template>
\ No newline at end of file
diff --git a/modules/project/ui/pages/ProjectIndex.vue b/modules/project/ui/pages/ProjectIndex.vue
deleted file mode 100644
index 43fb8915..00000000
--- a/modules/project/ui/pages/ProjectIndex.vue
+++ /dev/null
@@ -1,8 +0,0 @@
-<script lang="ts" setup>
-useHead({
-    title: 'Project'
-})
-</script>
-<template>
-    <h1>Project</h1>
-</template>
\ No newline at end of file
diff --git a/modules/project/ui/pages/RolesPersonnel.vue b/modules/project/ui/pages/RolesPersonnel.vue
new file mode 100644
index 00000000..1a8a497e
--- /dev/null
+++ b/modules/project/ui/pages/RolesPersonnel.vue
@@ -0,0 +1,144 @@
+<script lang="ts" setup>
+import SolutionRepository from '~/modules/solution/data/SolutionRepository';
+import ProjectRepository from '../../data/ProjectRepository';
+import PersonRepository from '../../data/PersonRepository';
+import GetSolutionBySlugUseCase from '~/modules/solution/application/GetSolutionBySlugUseCase';
+import GetProjectBySolutionIdUseCase from '../../application/GetProjectBySolutionIdUseCase';
+import GetPersonnelUseCase from '../../application/GetPersonnelUseCase';
+import type Person from '../../domain/Person';
+import { emptyUuid, type Uuid } from '~/domain/Uuid';
+import { FilterMatchMode } from 'primevue/api';
+import CreatePersonUseCase from '../../application/CreatePersonUseCase';
+import UpdatePersonUseCase from '../../application/UpdatePersonUseCase';
+import DeletePersonUseCase from '../../application/DeletePersonUseCase';
+import StakeholderRepository from '~/modules/goals/data/StakeholderRepository';
+import GetStakeHoldersUseCase from '~/modules/goals/application/GetStakeHoldersUseCase';
+import GoalsRepository from '~/modules/goals/data/GoalsRepository';
+import GetGoalsBySolutionIdUseCase from '~/modules/goals/application/GetGoalsBySolutionIdUseCase';
+import type Stakeholder from '~/modules/goals/domain/Stakeholder';
+
+useHead({
+    title: 'Roles & Personnel'
+})
+
+const router = useRouter(),
+    route = useRoute(),
+    slug = route.params.solutionSlug as string,
+    solutionRepository = new SolutionRepository(),
+    goalsRepository = new GoalsRepository(),
+    projectRepository = new ProjectRepository(),
+    personRepository = new PersonRepository(),
+    stakeholderRepository = new StakeholderRepository(),
+    getSolutionBySlugUseCase = new GetSolutionBySlugUseCase(solutionRepository),
+    solution = await getSolutionBySlugUseCase.execute(slug),
+    getProjectBySolutionIdUseCase = new GetProjectBySolutionIdUseCase(projectRepository),
+    project = solution?.id && await getProjectBySolutionIdUseCase.execute(solution.id),
+    getGoalsBySolutionIdUseCase = new GetGoalsBySolutionIdUseCase(goalsRepository),
+    goals = solution?.id && await getGoalsBySolutionIdUseCase.execute(solution.id),
+    getStakeholdersUseCase = new GetStakeHoldersUseCase(stakeholderRepository),
+    getPersonnelUseCase = new GetPersonnelUseCase(personRepository),
+    createPersonUseCase = new CreatePersonUseCase(personRepository),
+    updatePersonUseCase = new UpdatePersonUseCase(personRepository),
+    deletePersonUseCase = new DeletePersonUseCase(personRepository);
+
+if (!solution) {
+    router.push({ name: 'Solutions' })
+} else {
+    if (!project)
+        router.push({ name: 'Project', params: { solutionSlug: slug } });
+    if (!goals)
+        router.push({ name: 'Goals', params: { solutionSlug: slug } });
+}
+
+type StakeholderViewModel = Pick<Stakeholder, 'id' | 'name'>
+type PersonnelViewModel = Pick<Person, 'id' | 'name' | 'email' | 'roleId'>;
+
+const personnel = ref<PersonnelViewModel[]>([]),
+    stakeholders = ref<StakeholderViewModel[]>([]),
+    emptyPersonnel: PersonnelViewModel = { id: emptyUuid, name: '', email: '', roleId: emptyUuid };
+
+onMounted(async () => {
+    stakeholders.value = await getStakeholdersUseCase.execute(goals!.id) ?? []
+    personnel.value = await getPersonnelUseCase.execute(project!.id) ?? []
+})
+
+const filters = ref({
+    'name': { value: null, matchMode: FilterMatchMode.CONTAINS },
+    'email': { value: null, matchMode: FilterMatchMode.CONTAINS },
+    'roleId': { value: null, matchMode: FilterMatchMode.CONTAINS }
+});
+
+const onCreate = async (data: PersonnelViewModel) => {
+    const newId = await createPersonUseCase.execute({
+        projectId: project!.id,
+        name: data.name,
+        email: data.email,
+        roleId: data.roleId
+    })
+
+    personnel.value = await getPersonnelUseCase.execute(project!.id) ?? []
+}
+
+const onUpdate = async (data: PersonnelViewModel) => {
+    await updatePersonUseCase.execute({
+        id: data.id,
+        projectId: project!.id,
+        name: data.name,
+        email: data.email,
+        roleId: data.roleId
+    })
+
+    personnel.value = await getPersonnelUseCase.execute(project!.id) ?? []
+}
+
+const onDelete = async (id: Uuid) => {
+    await deletePersonUseCase.execute(id)
+
+    personnel.value = await getPersonnelUseCase.execute(project!.id) ?? []
+}
+</script>
+<template>
+    <p>
+        Roles & Personnel lists the roles and personnel involved in the project
+        along with their responsibilities, availability, and contact information.
+    </p>
+
+    <XDataTable :datasource="personnel" :empty-record="emptyPersonnel" :filters="filters" :on-create="onCreate"
+        :on-update="onUpdate" :on-delete="onDelete">
+        <Column field="name" header="Name" sortable>
+            <template #filter="{ filterModel, filterCallback }">
+                <InputText v-model.trim="filterModel.value" @input="filterCallback()" placeholder="Search by name" />
+            </template>
+            <template #body="{ data }">
+                {{ data.name }}
+            </template>
+            <template #editor="{ data, field }">
+                <InputText v-model.trim="data[field]" required />
+            </template>
+        </Column>
+        <Column field="email" header="Email" sortable>
+            <template #filter="{ filterModel, filterCallback }">
+                <InputText v-model.trim="filterModel.value" @input="filterCallback()" placeholder="Search by name" />
+            </template>
+            <template #body="{ data }">
+                {{ data.name }}
+            </template>
+            <template #editor="{ data, field }">
+                <InputText v-model.trim="data[field]" required />
+            </template>
+        </Column>
+        <Column field="roleId" header="Role" sortable>
+            <template #filter="{ filterModel, filterCallback }">
+                <Dropdown v-model.trim="filterModel.value" @input="filterCallback()" optionLabel="name" optionValue="id"
+                    :options="stakeholders" placeholder="Search by Role" />
+            </template>
+            <template #body="{ data, field }">
+                {{ stakeholders.find(s => s.id === data[field])?.name }}
+            </template>
+            <template #editor="{ data, field }">
+                <Dropdown v-model.trim="data[field]" optionLabel="name" optionValue="id" :options="stakeholders"
+                    required="true" placeholder="Select an Role" />
+            </template>
+        </Column>
+    </XDataTable>
+</template>
\ No newline at end of file