diff --git a/common/portfolio.formSchema.js b/common/portfolio.formSchema.js
new file mode 100644
index 0000000..3e6641b
--- /dev/null
+++ b/common/portfolio.formSchema.js
@@ -0,0 +1,113 @@
+import SchemaForm from 'formvuelatte';
+import { FormInput, FormTextArea } from '../management-ui/src/components/form/';
+
+export default {
+	schema: {
+		name: {
+			component: SchemaForm,
+			schema: {
+				firstName: {
+					component: FormInput,
+					label: "Your first name",
+					required: true
+				},
+				lastName: {
+					component: FormInput,
+					label: "Your last name",
+					required: true
+				},
+			}
+		},
+		profession: {
+			component: FormInput,
+			label: "Your profession",
+			reqiured: true
+		},
+		aboutMe: {
+			component: FormTextArea,
+			label: "A brief description of yourself",
+			required: true
+		},
+		profileImageUrl: {
+			component: FormInput,
+			label: "Web url to access the provided profile image"
+		},
+		contact: {
+			component: SchemaForm,
+			schema: {
+				email: {
+					component: FormInput,
+					label: "Public email address",
+					config: {
+						type: "email"
+					}
+				},
+				telephone: {
+					component: FormInput,
+					label: "Public telephone number"
+				}
+			}
+		},
+		externalProfiles: {
+			component: SchemaForm,
+			schema: {
+				github: {
+					component: FormInput,
+					label: "Github profile name"
+				},
+				linkedIn: {
+					component: FormInput,
+					label: "LinkedIn profile name"
+				},
+				stackOverflow: {
+					component: FormInput,
+					label: "Stack Overflow profile name"
+				}
+			}
+		},
+		education: {
+			component: SchemaForm,
+			schema: {
+				institution: {
+					component: FormInput,
+					label: "Name of the education establishment",
+					required: true
+				},
+				date: {
+					component: FormInput,
+					label: "When the institution was attended",
+					required: true
+				},
+				qualifications: {
+					component: FormInput,
+					label: "Qualification achieved at the instution",
+					required: true
+				}
+			}
+		},
+		experience: {
+			component: SchemaForm,
+			schema: {
+				organisation: {
+					component: FormInput,
+					label: "Name of the organisation",
+					required: true
+				},
+				date: {
+					component: FormInput,
+					label: "When work was done with the organisation",
+					required: true
+				},
+				description: {
+					component: FormInput,
+					label: "Brief description of the role",
+					required: true
+				},
+				projects: {
+					component: FormInput,
+					label: "Projects worked on at the organisation"
+				}
+			}
+		}
+	}
+}
\ No newline at end of file
diff --git a/management-ui/package-lock.json b/management-ui/package-lock.json
index 14cd26f..9d42875 100644
--- a/management-ui/package-lock.json
+++ b/management-ui/package-lock.json
@@ -1916,6 +1916,7 @@
       "version": "6.10.0",
       "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.10.0.tgz",
       "integrity": "sha512-nffhOpkymDECQyR0mnsUtoCE8RlX38G0rYP+wgLWFyZuUyuuojSSvi/+euOiQBIn63whYwYVIIH1TvE3tu4OEg==",
+      "dev": true,
       "requires": {
         "fast-deep-equal": "^2.0.1",
         "fast-json-stable-stringify": "^2.0.0",
@@ -3165,8 +3166,7 @@
       "version": "4.6.0",
       "resolved": "https://registry.npmjs.org/co/-/co-4.6.0.tgz",
       "integrity": "sha1-bqa989hTrlTMuOR7+gvz+QMfsYQ=",
-      "dev": true,
-      "optional": true
+      "dev": true
     },
     "coa": {
       "version": "2.0.2",
@@ -5315,7 +5315,8 @@
     "fast-deep-equal": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-2.0.1.tgz",
-      "integrity": "sha1-ewUhjd+WZ79/Nwv3/bLLFf3Qqkk="
+      "integrity": "sha1-ewUhjd+WZ79/Nwv3/bLLFf3Qqkk=",
+      "dev": true
     },
     "fast-glob": {
       "version": "2.2.7",
@@ -5334,7 +5335,8 @@
     "fast-json-stable-stringify": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/fast-json-stable-stringify/-/fast-json-stable-stringify-2.0.0.tgz",
-      "integrity": "sha1-1RQsDK7msRifh9OnYREGT4bIu/I="
+      "integrity": "sha1-1RQsDK7msRifh9OnYREGT4bIu/I=",
+      "dev": true
     },
     "fast-levenshtein": {
       "version": "2.0.6",
@@ -5593,11 +5595,6 @@
         "for-in": "^1.0.1"
       }
     },
-    "foreach": {
-      "version": "2.0.5",
-      "resolved": "https://registry.npmjs.org/foreach/-/foreach-2.0.5.tgz",
-      "integrity": "sha1-C+4AUBiusmDQo6865ljdATbsG5k="
-    },
     "forever-agent": {
       "version": "0.6.1",
       "resolved": "https://registry.npmjs.org/forever-agent/-/forever-agent-0.6.1.tgz",
@@ -5615,6 +5612,11 @@
         "mime-types": "^2.1.12"
       }
     },
+    "formvuelatte": {
+      "version": "0.2.3",
+      "resolved": "https://registry.npmjs.org/formvuelatte/-/formvuelatte-0.2.3.tgz",
+      "integrity": "sha512-Mh2wN8sduW8lkKefw8+5knHPhEEtZNnb0CzsJMFLsatFXnH4EwZZrVl3NHKBcHyX9GzGXJMIwgpuUMQimuM3RQ=="
+    },
     "forwarded": {
       "version": "0.1.2",
       "resolved": "https://registry.npmjs.org/forwarded/-/forwarded-0.1.2.tgz",
@@ -7997,14 +7999,6 @@
       "integrity": "sha512-mrqyZKfX5EhL7hvqcV6WG1yYjnjeuYDzDhhcAAUrq8Po85NBQBJP+ZDUT75qZQ98IkUoBqdkExkukOU7Ts2wrw==",
       "dev": true
     },
-    "json-pointer": {
-      "version": "0.6.0",
-      "resolved": "https://registry.npmjs.org/json-pointer/-/json-pointer-0.6.0.tgz",
-      "integrity": "sha1-jlAFUKaqxUZKRzN32leqbMIoKNc=",
-      "requires": {
-        "foreach": "^2.0.4"
-      }
-    },
     "json-schema": {
       "version": "0.2.3",
       "resolved": "https://registry.npmjs.org/json-schema/-/json-schema-0.2.3.tgz",
@@ -8014,7 +8008,8 @@
     "json-schema-traverse": {
       "version": "0.4.1",
       "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-0.4.1.tgz",
-      "integrity": "sha512-xbbCH5dCYU5T8LcEhhuh7HJ88HXuW3qsI3Y0zOZFKfZEHcpWiHU/Jxzk629Brsab/mMiHQti9wMP+845RPe3Vg=="
+      "integrity": "sha512-xbbCH5dCYU5T8LcEhhuh7HJ88HXuW3qsI3Y0zOZFKfZEHcpWiHU/Jxzk629Brsab/mMiHQti9wMP+845RPe3Vg==",
+      "dev": true
     },
     "json-stable-stringify-without-jsonify": {
       "version": "1.0.1",
@@ -10475,7 +10470,8 @@
     "punycode": {
       "version": "2.1.1",
       "resolved": "https://registry.npmjs.org/punycode/-/punycode-2.1.1.tgz",
-      "integrity": "sha512-XRsRjdf+j5ml+y/6GKHPZbrF/8p2Yga0JPtdqTIY2Xe5ohJPD9saDJJLPvp9+NSBprVvevdXZybnj2cv8OEd0A=="
+      "integrity": "sha512-XRsRjdf+j5ml+y/6GKHPZbrF/8p2Yga0JPtdqTIY2Xe5ohJPD9saDJJLPvp9+NSBprVvevdXZybnj2cv8OEd0A==",
+      "dev": true
     },
     "q": {
       "version": "1.5.1",
@@ -11024,8 +11020,7 @@
       "version": "4.0.8",
       "resolved": "https://registry.npmjs.org/rx-lite/-/rx-lite-4.0.8.tgz",
       "integrity": "sha1-Cx4Rr4vESDbwSmQH6S2kJGe3lEQ=",
-      "dev": true,
-      "optional": true
+      "dev": true
     },
     "rx-lite-aggregates": {
       "version": "4.0.8",
@@ -12797,6 +12792,7 @@
       "version": "4.2.2",
       "resolved": "https://registry.npmjs.org/uri-js/-/uri-js-4.2.2.tgz",
       "integrity": "sha512-KY9Frmirql91X2Qgjry0Wd4Y+YTdrdZheS8TFwvkbLWf/G5KNJDCh6pKL5OZctEW4+0Baa5idK2ZQuELRwPznQ==",
+      "dev": true,
       "requires": {
         "punycode": "^2.1.0"
       }
@@ -13009,15 +13005,6 @@
       "resolved": "https://registry.npmjs.org/vue-icon/-/vue-icon-2.1.1.tgz",
       "integrity": "sha512-CWIOChSRQ2IW8LxLGRiryBYH+LAGRSB8ponIJEMNtwFs2fBLBnkhr7ofCnneaMnsovtbIJ09CDD5vzQuiRRukw=="
     },
-    "vue-json-schema-form": {
-      "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/vue-json-schema-form/-/vue-json-schema-form-1.0.4.tgz",
-      "integrity": "sha512-dZ8ujPFGWeFlVKO7AlY4FGZrAVxl1j4M9HNxuagb9Ol4r8XXKt6ZRdFg/Fc9I2jQECYdUZoZJRAOrPeVydhAIg==",
-      "requires": {
-        "ajv": "^6.5.4",
-        "json-pointer": "^0.6.0"
-      }
-    },
     "vue-loader": {
       "version": "15.7.0",
       "resolved": "https://registry.npmjs.org/vue-loader/-/vue-loader-15.7.0.tgz",
diff --git a/management-ui/package.json b/management-ui/package.json
index c8a7091..72d5057 100644
--- a/management-ui/package.json
+++ b/management-ui/package.json
@@ -12,9 +12,9 @@
     "buefy": "^0.7.7",
     "core-js": "^2.6.5",
     "firebase": "^6.1.0",
+    "formvuelatte": "^0.2.3",
     "vue": "^2.6.10",
     "vue-icon": "^2.1.1",
-    "vue-json-schema-form": "^1.0.4",
     "vue-router": "^3.0.3",
     "vue-toasted": "^1.1.27",
     "vuex": "^3.0.1",
diff --git a/management-ui/src/components/form/FormInput.vue b/management-ui/src/components/form/FormInput.vue
new file mode 100644
index 0000000..315e831
--- /dev/null
+++ b/management-ui/src/components/form/FormInput.vue
@@ -0,0 +1,23 @@
+<template>
+	<b-form-input :value="value"
+    @input="onInput($event.target.value)" />
+</template>
+
+<script>
+import { FormMixin } from 'formvuelatte';
+
+export default {
+	mixins: { FormMixin },
+	props: {
+		value: {
+			type: String,
+			required: true
+		}
+	},
+	methods: {
+		onInput(data) {
+			this.$emit('input', data);
+		}
+	}
+};
+</script>
diff --git a/management-ui/src/components/form/FormTextArea.vue b/management-ui/src/components/form/FormTextArea.vue
new file mode 100644
index 0000000..5c97b58
--- /dev/null
+++ b/management-ui/src/components/form/FormTextArea.vue
@@ -0,0 +1,23 @@
+<template>
+	<b-form-textarea :value="value"
+    @input="onInput($event.target.value)" />
+</template>
+
+<script>
+import { FormMixin } from 'formvuelatte';
+
+export default {
+	mixins: { FormMixin },
+	props: {
+		value: {
+			type: String,
+			required: true
+		}
+	},
+	methods: {
+		onInput(data) {
+			this.$emit('input', data);
+		}
+	}
+};
+</script>
diff --git a/management-ui/src/components/form/index.js b/management-ui/src/components/form/index.js
new file mode 100644
index 0000000..7f26618
--- /dev/null
+++ b/management-ui/src/components/form/index.js
@@ -0,0 +1,15 @@
+import FormInput from './FormInput.vue';
+import FormTextArea from './FormTextArea.vue';
+
+const components = [
+	{
+		name: 'form-input',
+		component: FormInput
+	},
+	{
+		name: 'form-text-area',
+		component: FormTextArea
+	}
+];
+
+export default components;
diff --git a/management-ui/src/containers/portfolio/Edit.vue b/management-ui/src/containers/portfolio/Edit.vue
index b4e030d..048bf8b 100644
--- a/management-ui/src/containers/portfolio/Edit.vue
+++ b/management-ui/src/containers/portfolio/Edit.vue
@@ -7,16 +7,19 @@
 			<b-btn variant="info" v-text="'detail'"/>
 		</router-link>
 
-		<schema-form v-if="portfolio" :schema="portfolioSchema" v-model="formData" @submit="onSubmitClick"/>
+		<SchemaForm v-if="portfolio" :schema="formSchema" v-model="formData" @submit="onSubmitClick"/>
 
 	</section>
 </template>
 
 <script>
 import { mapActions, mapGetters } from 'vuex';
+import { SchemaForm } from 'formvuelatte';
 import portfolioSchema from '../../../../common/portfolio.schema.json';
+import portfolioFormSchema from '../../../../common/portfolio.formSchema.js';
 
 export default {
+	components: { SchemaForm },
 	data() {
 		return {
 			portfolioSchema,
@@ -26,7 +29,10 @@ export default {
 	computed: {
 		...mapGetters({
 			portfolio: 'portfolio/portfolio'
-		})
+		}),
+		formSchema() {
+			return portfolioFormSchema;
+		}
 	},
 	methods: {
 		...mapActions({
diff --git a/management-ui/src/main.js b/management-ui/src/main.js
index fc1828a..6409513 100644
--- a/management-ui/src/main.js
+++ b/management-ui/src/main.js
@@ -2,7 +2,7 @@ import Vue from 'vue';
 import BootstrapVue from 'bootstrap-vue';
 import VueIcon from 'vue-icon';
 import VueToasted from 'vue-toasted';
-import VueJsonSchemaForm from 'vue-json-schema-form';
+import FormVueLatte from 'formvuelatte';
 import Buefy from 'buefy';
 import 'buefy/dist/buefy.css';
 import App from './App.vue';
@@ -13,7 +13,7 @@ Vue.config.productionTip = false;
 Vue.use(BootstrapVue);
 Vue.use(VueIcon, 'v-icon');
 Vue.use(VueToasted);
-Vue.use(VueJsonSchemaForm);
+Vue.use(FormVueLatte);
 Vue.use(Buefy);
 
 new Vue({