{"componentChunkName":"component---src-templates-blog-post-js","path":"/kindrednotes/","result":{"data":{"site":{"siteMetadata":{"title":"ANNIE YINING WANG","author":"Annie Yining Wang"}},"markdownRemark":{"id":"70718e5e-aadc-5e4f-b27b-fc665564e20e","excerpt":"“I was extremely pleased with the results. I would recommend Annie (Yining) to anyone looking for UX/UI design services.” — Shelley Moore - Founder of…","html":"<blockquote>\n<p>“I was extremely pleased with the results. I would recommend Annie (Yining) to anyone looking for UX/UI design services.”</p>\n<p>— Shelley Moore - Founder of KindredNotes</p>\n</blockquote>\n<hr>\n<h6 style=\" font-size: 16px; margin-bottom:-30px; text-transform:uppercase\">\nBRIEF </h6>\n<h3 style=\"margin-bottom:20px; text-transform:uppercase\">\nA MOBILE EXPERIENCE ENABLE USERS SPREAD KINDNESS AT THE FINGERTIPS </h3>\n<p>KindredNotes is a Vancouver based start-up that aims to connect people around the world through sending and receiving kind notes. Even though there is an working website, the company hasn’t releasing an app yet. Our goal was to take a mobile-first approach to design an engaging experience for users sending and receiving notes in a deep psychological level and also be able to see their impact to the world.</p>\n<hr>\n<h6 style=\" font-size: 16px; margin-bottom:-30px; text-transform:uppercase\">\nResearch Process </h6>\n<h3 style=\"margin-bottom:20px; text-transform:uppercase\">\nDEFINE AND UNDERSTAND USERS' BEHAVIORS </h3>\n<p>First challenge is to find the liking and behavior of the users, and through 20 responses and 6 interviews, we learn that users fall to the age of 25 to 34, they like to type something short and quick with a positive tone and they would be happy to have a reward system (such as In-App services).</p>\n<hr>\n<h6 style=\" font-size: 16px; margin-bottom:-30px; text-transform:uppercase\">\nUser story </h6>\n<h3 style=\"margin-bottom:20px; text-transform:uppercase\">\nIMAGINING THE USERS' EXPERIENCE </h3>\n<p>I focused on creating a user story and user scenario to understand their experience. I wanted to allow users to tell us how they wanted their app delivered. If users can tailor it to fit their mentalities and interests, they are more likely to stick to the service.</p>\n<h4 style=\"margin-bottom:-60px; text-transform:uppercase\">\nMeet Doris! </h4>\n<h1>\n<p>\n  <span\n    class=\"gatsby-resp-image-wrapper\"\n    style=\"position: relative; display: block; margin: 7vw 0; max-width: 750px; margin-left: auto; margin-right: auto;\"\n  >\n    <span\n      class=\"gatsby-resp-image-background-image\"\n      style=\"padding-bottom: 28.82352941176471%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAGCAYAAADDl76dAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAxUlEQVQY02P4jwX8+/cPTP/9+/f/jrUr/pdlp/0/dGAvVOwfWB6mBh0wYDMMovTf/72bV/5f3Fn9f3pV9n8Hc4P/t84egFv0n1gDwYqB4Mqtq/+7Gov+b5/b///y+nn/g5ws/vdW5/z/8fk9ii+INvDGnev/5/fX/Z/TUv7/wPTW/y5WRv/9rA3/P753G0UdUV6GKT6yavp/R32V/6URrv8djLT+99VXIIKF+DAEYqiBr54++t9RVwF0Zdn/q6ePYUQaNgAAB3K131b0VbkAAAAASUVORK5CYII='); background-size: cover; display: block;\"\n    >\n      <picture>\n        <source\n          srcset=\"/static/8502d26393989a76d1a3205cc84b502d/51a8e/doris-thumbnail.webp 340w,\n/static/8502d26393989a76d1a3205cc84b502d/713b7/doris-thumbnail.webp 680w,\n/static/8502d26393989a76d1a3205cc84b502d/e28c4/doris-thumbnail.webp 750w\"\n          sizes=\"(max-width: 750px) 100vw, 750px\"\n          type=\"image/webp\"\n        />\n        <source\n          srcset=\"/static/8502d26393989a76d1a3205cc84b502d/ad208/doris-thumbnail.png 340w,\n/static/8502d26393989a76d1a3205cc84b502d/a5a26/doris-thumbnail.png 680w,\n/static/8502d26393989a76d1a3205cc84b502d/ef14d/doris-thumbnail.png 750w\"\n          sizes=\"(max-width: 750px) 100vw, 750px\"\n          type=\"image/png\"\n        />\n        <img\n          class=\"gatsby-resp-image-image\"\n          style=\"width: 100%; height: 100%; margin: 0; vertical-align: middle; position: absolute; top: 0; left: 0; box-shadow: inset 0px 0px 0px 400px white;\"\n          src=\"/static/8502d26393989a76d1a3205cc84b502d/ef14d/doris-thumbnail.png\"\n          alt=\"doris\"\n          title=\"\"\n          src=\"/static/8502d26393989a76d1a3205cc84b502d/ef14d/doris-thumbnail.png\"\n        />\n      </picture>\n      </span>\n  </span>\n  </p>\n</h1>\n<p>Doris is a 26-year-old illustrator who likes to read before going to sleep. She likes her job because she can work from home. However, she <strong>feels lonely sometimes</strong> and <strong>wish someone could encourage her</strong>. One day, after a long day, she especially urged for some comfort. While googling the keyword ‘how to get motivated’, she found KindredNotes that <strong>for people to spread kindness online</strong>…she was curious and would like to know more…</p>\n<hr>\n<h6 style=\" font-size: 16px; margin-bottom:-30px; text-transform:uppercase\">\nUser scenario & storyboard </h6>\n<h4 style=\"margin-bottom:-70px; text-transform:uppercase\">\nDoris's day </h4>\n<div style=\"margin-top:-20px\" class=\"kg-card kg-image-card kg-width-full\">\n<p>\n  <span\n    class=\"gatsby-resp-image-wrapper\"\n    style=\"position: relative; display: block; margin: 7vw 0; max-width: 1360px; margin-left: auto; margin-right: auto;\"\n  >\n    <span\n      class=\"gatsby-resp-image-background-image\"\n      style=\"padding-bottom: 46.76470588235294%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAJCAYAAAAywQxIAAAACXBIWXMAAAsTAAALEwEAmpwYAAABA0lEQVQoz42SiW4DIQxE8/+f2aZqqyjZg+WGdWcMRFGqjYJkLWs8zwec9n0XrlSr2JQllSrxDQv9qxpoucg6DSAPSt1hVTKDc1E//4fZmPR7X9DGUlT7D+hSkQDIdfNqswuy+igmpCaKGb4oNxvkPBn5XqzGEHYI9ACysgQAQT+rVQDHwGSE/q5OPgH8uBm5Wi8V+kMgBRRmtLWguq95kwuqnVzQJEw2IQEr4zkrfgHM99YWBF6M02ooSn2mjGmVJu3gDWBtlWK/AcwRjBvkhZnY/COm6iUeAEebCzLTDKpgEtvBFM04b0D4AGVHjMuPz2ZsxhNha7HPKzxZevL7Pu9Hxh9UVcLMhPmLuAAAAABJRU5ErkJggg=='); background-size: cover; display: block;\"\n    >\n      <picture>\n        <source\n          srcset=\"/static/63a6cb339391f64d3b4c7d49863ec05d/51a8e/user-scenario-1.webp 340w,\n/static/63a6cb339391f64d3b4c7d49863ec05d/713b7/user-scenario-1.webp 680w,\n/static/63a6cb339391f64d3b4c7d49863ec05d/54376/user-scenario-1.webp 1360w,\n/static/63a6cb339391f64d3b4c7d49863ec05d/e0aab/user-scenario-1.webp 1920w\"\n          sizes=\"(max-width: 1360px) 100vw, 1360px\"\n          type=\"image/webp\"\n        />\n        <source\n          srcset=\"/static/63a6cb339391f64d3b4c7d49863ec05d/ad208/user-scenario-1.png 340w,\n/static/63a6cb339391f64d3b4c7d49863ec05d/a5a26/user-scenario-1.png 680w,\n/static/63a6cb339391f64d3b4c7d49863ec05d/60356/user-scenario-1.png 1360w,\n/static/63a6cb339391f64d3b4c7d49863ec05d/e957c/user-scenario-1.png 1920w\"\n          sizes=\"(max-width: 1360px) 100vw, 1360px\"\n          type=\"image/png\"\n        />\n        <img\n          class=\"gatsby-resp-image-image\"\n          style=\"width: 100%; height: 100%; margin: 0; vertical-align: middle; position: absolute; top: 0; left: 0; box-shadow: inset 0px 0px 0px 400px white;\"\n          src=\"/static/63a6cb339391f64d3b4c7d49863ec05d/60356/user-scenario-1.png\"\n          alt=\"Doris's day\"\n          title=\"\"\n          src=\"/static/63a6cb339391f64d3b4c7d49863ec05d/60356/user-scenario-1.png\"\n        />\n      </picture>\n      </span>\n  </span>\n  </p>\n</div>\n<div style=\"margin-top:-20px\" class=\"kg-card kg-image-card kg-width-full\">\n<p>\n  <span\n    class=\"gatsby-resp-image-wrapper\"\n    style=\"position: relative; display: block; margin: 7vw 0; max-width: 1360px; margin-left: auto; margin-right: auto;\"\n  >\n    <span\n      class=\"gatsby-resp-image-background-image\"\n      style=\"padding-bottom: 46.76470588235294%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAJCAYAAAAywQxIAAAACXBIWXMAAAsTAAALEwEAmpwYAAABE0lEQVQoz3VSaW/DMAjt//9/66dJbaf1UA83ceL7YDzHiZLKQ0JgjgcGdjlnAiWWowtkYyQXE8WUyadU9JltlWHlQ86MAbmbH9pH8hwAgnyOhm2BPgmFYXchLrGm6htAxUEIxvv70dHX9UU3qZZAELr+7UY6viT9iIGkcZRrbhMQOkAABtDB+g3ggYFOQtJj0HRhYBQANwHxjcBzOTx72t8E3TkJNiSAhLLFh4LXXtFb26Vr/V+HqeiZAobPczlzF8pNXQJEKFNsvvoRD252iMFiMZqlCdMGJX95XhR8b55ZzzZs2dZLsCW+sRTInhOQ1DErPoepSChJkABDN2vGnDdnsx46K9wR7jCWL9kPbtnXYKA/W2vCSfeutncAAAAASUVORK5CYII='); background-size: cover; display: block;\"\n    >\n      <picture>\n        <source\n          srcset=\"/static/3ddea544b33b0bba021e29888c2c41a8/51a8e/user-scenario-2.webp 340w,\n/static/3ddea544b33b0bba021e29888c2c41a8/713b7/user-scenario-2.webp 680w,\n/static/3ddea544b33b0bba021e29888c2c41a8/54376/user-scenario-2.webp 1360w,\n/static/3ddea544b33b0bba021e29888c2c41a8/e0aab/user-scenario-2.webp 1920w\"\n          sizes=\"(max-width: 1360px) 100vw, 1360px\"\n          type=\"image/webp\"\n        />\n        <source\n          srcset=\"/static/3ddea544b33b0bba021e29888c2c41a8/ad208/user-scenario-2.png 340w,\n/static/3ddea544b33b0bba021e29888c2c41a8/a5a26/user-scenario-2.png 680w,\n/static/3ddea544b33b0bba021e29888c2c41a8/60356/user-scenario-2.png 1360w,\n/static/3ddea544b33b0bba021e29888c2c41a8/e957c/user-scenario-2.png 1920w\"\n          sizes=\"(max-width: 1360px) 100vw, 1360px\"\n          type=\"image/png\"\n        />\n        <img\n          class=\"gatsby-resp-image-image\"\n          style=\"width: 100%; height: 100%; margin: 0; vertical-align: middle; position: absolute; top: 0; left: 0; box-shadow: inset 0px 0px 0px 400px white;\"\n          src=\"/static/3ddea544b33b0bba021e29888c2c41a8/60356/user-scenario-2.png\"\n          alt=\"Doris's day\"\n          title=\"\"\n          src=\"/static/3ddea544b33b0bba021e29888c2c41a8/60356/user-scenario-2.png\"\n        />\n      </picture>\n      </span>\n  </span>\n  </p>\n</div>\n<div style=\"margin-top:-20px\" class=\"kg-card kg-image-card kg-width-full\">\n<p>\n  <span\n    class=\"gatsby-resp-image-wrapper\"\n    style=\"position: relative; display: block; margin: 7vw 0; max-width: 1360px; margin-left: auto; margin-right: auto;\"\n  >\n    <span\n      class=\"gatsby-resp-image-background-image\"\n      style=\"padding-bottom: 46.76470588235294%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAJCAYAAAAywQxIAAAACXBIWXMAAAsTAAALEwEAmpwYAAABCUlEQVQoz3WRjU7EIBCE+/7vaDTRxOh5d/2DAqVd99vSymndZLPA7M4M0KzrKsSidUyzpLxI1NxrneEXxn6Is80ScDU74TRncQoGrbZXcrC8bAR1pJwPErCpzPwh/BonaX2QISS5uSA+bQKQE1HXn4OXt/sgd+0jEHQFfyB05bqEV6cXHXzvnBHm5ccNoh+9M2zRc5yeEuJmVjUc0szgVbMP8RACR+j52smruuynaII+5XNCBlF/0QGaccq7cq397Tofrefp0lqF8NQhwAhByodbyKaizrXBLK1ve9/436dQW3V1Uwe9fgrkezJoH6UYPWMhJDmvOZp9scVq1+I36wylGpYfz2sy4hsQbMLrjBeC5QAAAABJRU5ErkJggg=='); background-size: cover; display: block;\"\n    >\n      <picture>\n        <source\n          srcset=\"/static/12d5ad96a6eb7a5f619d40c078999508/51a8e/user-scenario-3.webp 340w,\n/static/12d5ad96a6eb7a5f619d40c078999508/713b7/user-scenario-3.webp 680w,\n/static/12d5ad96a6eb7a5f619d40c078999508/54376/user-scenario-3.webp 1360w,\n/static/12d5ad96a6eb7a5f619d40c078999508/e0aab/user-scenario-3.webp 1920w\"\n          sizes=\"(max-width: 1360px) 100vw, 1360px\"\n          type=\"image/webp\"\n        />\n        <source\n          srcset=\"/static/12d5ad96a6eb7a5f619d40c078999508/ad208/user-scenario-3.png 340w,\n/static/12d5ad96a6eb7a5f619d40c078999508/a5a26/user-scenario-3.png 680w,\n/static/12d5ad96a6eb7a5f619d40c078999508/60356/user-scenario-3.png 1360w,\n/static/12d5ad96a6eb7a5f619d40c078999508/e957c/user-scenario-3.png 1920w\"\n          sizes=\"(max-width: 1360px) 100vw, 1360px\"\n          type=\"image/png\"\n        />\n        <img\n          class=\"gatsby-resp-image-image\"\n          style=\"width: 100%; height: 100%; margin: 0; vertical-align: middle; position: absolute; top: 0; left: 0; box-shadow: inset 0px 0px 0px 400px white;\"\n          src=\"/static/12d5ad96a6eb7a5f619d40c078999508/60356/user-scenario-3.png\"\n          alt=\"Doris's day\"\n          title=\"\"\n          src=\"/static/12d5ad96a6eb7a5f619d40c078999508/60356/user-scenario-3.png\"\n        />\n      </picture>\n      </span>\n  </span>\n  </p>\n</div>\n<h4>CREATE VALUE WITH IN-DEPTH CONNECTION</h4>\n<p>Before, people connect to each other but only talk about superficial things. Now, KindredNotes connects users with topics that they really care. The value of it is through the simple gesture, we can share in-depth understanding with great positivity power, but still able to keep the space and privacy that people need.</p>\n<div class=\"kg-card kg-image-card kg-width-wide\">\n<p>\n  <span\n    class=\"gatsby-resp-image-wrapper\"\n    style=\"position: relative; display: block; margin: 7vw 0; max-width: 1360px; margin-left: auto; margin-right: auto;\"\n  >\n    <span\n      class=\"gatsby-resp-image-background-image\"\n      style=\"padding-bottom: 44.411764705882355%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAJCAYAAAAywQxIAAAACXBIWXMAAAsTAAALEwEAmpwYAAAByElEQVQoz1WRv2/aUBDH+aPaPQtDpY6VsmfM1KFSO2REUX4oLUo6dGlTdUBEUfihSKRqk3ZoRZTKSqCQEGhiJxiCDdiY2n1gG/PtYeyHeNLJ7+597s73vch4PMbk6AMHLWuIljmAYg3It9FhDrrM9t9DTqNYk5gHMpX4yd2wXc5EQrBHBWqdHup9htueBZm+YtdA4y/z372Ak/sWLtsGarqFP2S3uomGZswKep7nO78uqtjLfkd4RmSp7AlUVZvCAbef+QZRlDlnDm28+5BCW+v7fiQEn7/OIPriPcrU0XZH+CypeLIcx+5xgScXWz08WlxD7OAnj6VKEqJLG9g/qwUFg1HOKzK+FO7gTF3opN3bvRyuFJ0na6TtdvIHvlaafsMjUcXvuoJ44hCS8S8oiDFmh80tAOYUmnihNIAFb8Swnq9h87QKz6WFNNtBHmYaHpwI2PyUBfOmxSTaXnwng8JVnbebbH1lO4F0vshj+XoHsfUkymJrXsOXb9J4+uojSrRh2/VwTCNFlzeQPL3myQW5i8fPVrGVE3gsV5awsBRDung3r6HSUHDfVMH/naxyI4E5Lk92bQeCcAndZDORBkMIpWvYwWT/AYMLllfdYmljAAAAAElFTkSuQmCC'); background-size: cover; display: block;\"\n    >\n      <picture>\n        <source\n          srcset=\"/static/fe8fdaadd2f04bf36bce78378b0fd940/51a8e/illustration.webp 340w,\n/static/fe8fdaadd2f04bf36bce78378b0fd940/713b7/illustration.webp 680w,\n/static/fe8fdaadd2f04bf36bce78378b0fd940/54376/illustration.webp 1360w,\n/static/fe8fdaadd2f04bf36bce78378b0fd940/e0aab/illustration.webp 1920w\"\n          sizes=\"(max-width: 1360px) 100vw, 1360px\"\n          type=\"image/webp\"\n        />\n        <source\n          srcset=\"/static/fe8fdaadd2f04bf36bce78378b0fd940/ad208/illustration.png 340w,\n/static/fe8fdaadd2f04bf36bce78378b0fd940/a5a26/illustration.png 680w,\n/static/fe8fdaadd2f04bf36bce78378b0fd940/60356/illustration.png 1360w,\n/static/fe8fdaadd2f04bf36bce78378b0fd940/e957c/illustration.png 1920w\"\n          sizes=\"(max-width: 1360px) 100vw, 1360px\"\n          type=\"image/png\"\n        />\n        <img\n          class=\"gatsby-resp-image-image\"\n          style=\"width: 100%; height: 100%; margin: 0; vertical-align: middle; position: absolute; top: 0; left: 0; box-shadow: inset 0px 0px 0px 400px white;\"\n          src=\"/static/fe8fdaadd2f04bf36bce78378b0fd940/60356/illustration.png\"\n          alt=\"It's all blue\"\n          title=\"\"\n          src=\"/static/fe8fdaadd2f04bf36bce78378b0fd940/60356/illustration.png\"\n        />\n      </picture>\n      </span>\n  </span>\n  </p>\n</div>\n<hr>\n<h6 style=\" font-size: 16px; margin-bottom:-30px; text-transform:uppercase\">\nInformation Architecture </h6>\n<h3 style=\"text-transform:uppercase\">\ndefine the logical structure of the app </h3>\n<div style=\"margin-top:-100px\" class=\"kg-card kg-image-card kg-width-full\">\n<p>\n  <span\n    class=\"gatsby-resp-image-wrapper\"\n    style=\"position: relative; display: block; margin: 7vw 0; max-width: 1360px; margin-left: auto; margin-right: auto;\"\n  >\n    <span\n      class=\"gatsby-resp-image-background-image\"\n      style=\"padding-bottom: 56.1764705882353%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAALCAYAAAB/Ca1DAAAACXBIWXMAAAsTAAALEwEAmpwYAAABRElEQVQoz4WS607DMAyF+/7PhhASIOAHQkxbd+tlSdpmTZMcjrt1bC1lkSw7jv3FdpLEGCGrcR766KAoVdtBU2znYagrdxbasp9bwkoG4GdR4WWn8JCW+MgN3jLd62f6HtclnjYl3ul73Ss4H+BDRBdOWiScOclAzpojVrpBYVusje1lXx/xfagIUrzQ4It23rRITYOlrrGtLM9rLFSN1vtb4IHJy9JAE5gJjEmK9oqQ3iZokWsUhGTcbwk5sIiU52vantXeABWBGwIrzlD2EhDYSpR2KIbwPRM1wTmBm7KClXlGOQ+I45YFmBYnYO/D/NoRvGK1Teumj3IBsnxp4wKkb056YPELHPyTGcqt18Dx7YOWlrecnXXdJPYKaLEUIGd1D5jpqxnOAeURWn5k+VP3gB3/oWNsiNPYZJz4F+w//9j3Awk2XU2F4sOCAAAAAElFTkSuQmCC'); background-size: cover; display: block;\"\n    >\n      <picture>\n        <source\n          srcset=\"/static/436c573b5277d2969f0d9d03b18009b9/51a8e/IA.webp 340w,\n/static/436c573b5277d2969f0d9d03b18009b9/713b7/IA.webp 680w,\n/static/436c573b5277d2969f0d9d03b18009b9/54376/IA.webp 1360w,\n/static/436c573b5277d2969f0d9d03b18009b9/e0aab/IA.webp 1920w\"\n          sizes=\"(max-width: 1360px) 100vw, 1360px\"\n          type=\"image/webp\"\n        />\n        <source\n          srcset=\"/static/436c573b5277d2969f0d9d03b18009b9/ad208/IA.png 340w,\n/static/436c573b5277d2969f0d9d03b18009b9/a5a26/IA.png 680w,\n/static/436c573b5277d2969f0d9d03b18009b9/60356/IA.png 1360w,\n/static/436c573b5277d2969f0d9d03b18009b9/e957c/IA.png 1920w\"\n          sizes=\"(max-width: 1360px) 100vw, 1360px\"\n          type=\"image/png\"\n        />\n        <img\n          class=\"gatsby-resp-image-image\"\n          style=\"width: 100%; height: 100%; margin: 0; vertical-align: middle; position: absolute; top: 0; left: 0; box-shadow: inset 0px 0px 0px 400px white;\"\n          src=\"/static/436c573b5277d2969f0d9d03b18009b9/60356/IA.png\"\n          alt=\"Information Architecture\"\n          title=\"\"\n          src=\"/static/436c573b5277d2969f0d9d03b18009b9/60356/IA.png\"\n        />\n      </picture>\n      </span>\n  </span>\n  </p>\n</div>\n<h6 style=\" font-size: 16px; margin-bottom:-30px; text-transform:uppercase\">\nUser flow & MVP </h6>\n<h3 style=\"text-transform:uppercase\">\nGet the best experience user want to have </h3>\n<div style=\"margin-top:-100px\" class=\"kg-card kg-image-card kg-width-full\">\n<p>\n  <span\n    class=\"gatsby-resp-image-wrapper\"\n    style=\"position: relative; display: block; margin: 7vw 0; max-width: 1360px; margin-left: auto; margin-right: auto;\"\n  >\n    <span\n      class=\"gatsby-resp-image-background-image\"\n      style=\"padding-bottom: 56.1764705882353%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAALCAYAAAB/Ca1DAAAACXBIWXMAAAsTAAALEwEAmpwYAAAB0UlEQVQoz6WSy27TQBSG8yDsEHvWvAIvgtjyBKxZIISgRdyEKihVaTcUpBYKCBZccjFBtGoip63kNolNWtuxHce3+Rh7HDdCbBBH+nX+c2bmn3NmTk0IpAnGUcpoKshQJubAnP+TVzklRG1Gjm2bw/4+WXgKcYDwB4ipI+EqHvuS25IPJZ8gwhNEYCEmIymWVqI1kamAw014fIFo6wrj9hO4f47g3TX8T9cLPm4uEm5dhYfncX6ukKxfRixdJF2+VFyoBLO8wky14B4QthZwOhvYx21Ovt7G1d9g69s4X27iGA3szmvcxl1O8/X2MqPmI9Ldp6qjqsJKUMdrS8EfDxjvrWC1Fgm6qzjaHbzumqz6Hra2gL//Crd+A6+3wdR4T9K+hXB7paCskJmgb+DuPic5eElmbOPuPJMP+5ZUfwHGJllvnUxfhf4HRG9N+o9gfibZW5ItH823rD7FjuW5EPIXjSTMSD2tTBe5pIQofSTm8mL28+JM0PvVITj6RjxoEJsa3kAjHrYKJGaryCmuEeV7JI9K5GeyiXU2NkX/dpdpv15szCytQGzmAk1S6VMZpzkv8pJb3wvklyXDuhwhUwnO5udvw/qvVv6yqIL/RW6/AQS6O1BhqBvmAAAAAElFTkSuQmCC'); background-size: cover; display: block;\"\n    >\n      <picture>\n        <source\n          srcset=\"/static/725fedd508b68a3af746aabe4e993d66/51a8e/MVP.webp 340w,\n/static/725fedd508b68a3af746aabe4e993d66/713b7/MVP.webp 680w,\n/static/725fedd508b68a3af746aabe4e993d66/54376/MVP.webp 1360w,\n/static/725fedd508b68a3af746aabe4e993d66/e0aab/MVP.webp 1920w\"\n          sizes=\"(max-width: 1360px) 100vw, 1360px\"\n          type=\"image/webp\"\n        />\n        <source\n          srcset=\"/static/725fedd508b68a3af746aabe4e993d66/ad208/MVP.png 340w,\n/static/725fedd508b68a3af746aabe4e993d66/a5a26/MVP.png 680w,\n/static/725fedd508b68a3af746aabe4e993d66/60356/MVP.png 1360w,\n/static/725fedd508b68a3af746aabe4e993d66/e957c/MVP.png 1920w\"\n          sizes=\"(max-width: 1360px) 100vw, 1360px\"\n          type=\"image/png\"\n        />\n        <img\n          class=\"gatsby-resp-image-image\"\n          style=\"width: 100%; height: 100%; margin: 0; vertical-align: middle; position: absolute; top: 0; left: 0; box-shadow: inset 0px 0px 0px 400px white;\"\n          src=\"/static/725fedd508b68a3af746aabe4e993d66/60356/MVP.png\"\n          alt=\"MVP\"\n          title=\"\"\n          src=\"/static/725fedd508b68a3af746aabe4e993d66/60356/MVP.png\"\n        />\n      </picture>\n      </span>\n  </span>\n  </p>\n</div>\n<h6 style=\" font-size: 16px; margin-bottom:-30px; text-transform:uppercase\">\nLo-fidelity wireframes </h6>\n<h3 style=\"text-transform:uppercase\">\nKick off and test the theory</h3>\n<div style=\"margin-top:-100px\" class=\"kg-card kg-image-card kg-width-full\">\n<p>\n  <span\n    class=\"gatsby-resp-image-wrapper\"\n    style=\"position: relative; display: block; margin: 7vw 0; max-width: 1360px; margin-left: auto; margin-right: auto;\"\n  >\n    <span\n      class=\"gatsby-resp-image-background-image\"\n      style=\"padding-bottom: 56.1764705882353%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAALCAYAAAB/Ca1DAAAACXBIWXMAAAsTAAALEwEAmpwYAAACL0lEQVQoz32S3U+ScRTH/e+67K6LbloXXdi6aGXiZswo0oUvKRMRn8y3EgKECLW2WIbO0mGaL/hkKMqLVICkaQgPPs+nB1Fyxjrb2Tm/89vvs+/57VulKArFkNWaOJDY3pf4flBQ6yG7h3lKoXA+lDN5Oimiqk6BR7LMejJKKBUlshNDTKZIZgvI8hGKrN4XDijk4ki5BFI+rQ4yUNhWM45SyFDCKH+B8lGWyLKF/bSf/J6f3M8pxJCfaCLAt/QKwc236B1GtEMdeCZ7WVx5hvtNLR6fhoUVZ4khnwKPmRImeys39Fo0bToW1xwEQhF+SxDKZNkIe9DauqjubmdkwsJYwM01wUy1uY3xWe/JlmcUQp7XE10Iw60MOB+zHXOQiT8gtVlHOnZf7V0YnS1o+5oYnbYwv+blzqCJ24KByQXPOaBSAva4BGpaOqg3dbIedrEbvERq6QLZ0GXCWy40w91cf2rGOjXIp+AId/ub0Q4YmF8dO7fyicJXPiOmoUaEFwZiESd74hV+iRfJrV9lc2uEepuFmz3tOHzdfBZd3BtopqG/ibmgt9If5hHUVWsf6dAaH/J1w8r7uTo8H24xsdBAKmrHYG2kxqLD7e9UFdrR9OrRPNExu+yuoFCRWBLH8c+85OO8l53UNMuh5wRW+1gN29n5MYv13Rhmr5upJR9ieBrBa6d31MaX8EzZy1XHvLK5ix9bqv9a+f9R9mGxKzHPeL84q5hyhbNcflssfwBOmgmcgV/nhgAAAABJRU5ErkJggg=='); background-size: cover; display: block;\"\n    >\n      <picture>\n        <source\n          srcset=\"/static/e28ebc582ee615915c25987df66e7088/51a8e/wireframes-2.webp 340w,\n/static/e28ebc582ee615915c25987df66e7088/713b7/wireframes-2.webp 680w,\n/static/e28ebc582ee615915c25987df66e7088/54376/wireframes-2.webp 1360w,\n/static/e28ebc582ee615915c25987df66e7088/e0aab/wireframes-2.webp 1920w\"\n          sizes=\"(max-width: 1360px) 100vw, 1360px\"\n          type=\"image/webp\"\n        />\n        <source\n          srcset=\"/static/e28ebc582ee615915c25987df66e7088/ad208/wireframes-2.png 340w,\n/static/e28ebc582ee615915c25987df66e7088/a5a26/wireframes-2.png 680w,\n/static/e28ebc582ee615915c25987df66e7088/60356/wireframes-2.png 1360w,\n/static/e28ebc582ee615915c25987df66e7088/e957c/wireframes-2.png 1920w\"\n          sizes=\"(max-width: 1360px) 100vw, 1360px\"\n          type=\"image/png\"\n        />\n        <img\n          class=\"gatsby-resp-image-image\"\n          style=\"width: 100%; height: 100%; margin: 0; vertical-align: middle; position: absolute; top: 0; left: 0; box-shadow: inset 0px 0px 0px 400px white;\"\n          src=\"/static/e28ebc582ee615915c25987df66e7088/60356/wireframes-2.png\"\n          alt=\"lo-fi\"\n          title=\"\"\n          src=\"/static/e28ebc582ee615915c25987df66e7088/60356/wireframes-2.png\"\n        />\n      </picture>\n      </span>\n  </span>\n  </p>\n</div>\n<h6 style=\" font-size: 16px; margin-bottom:-30px; text-transform:uppercase\">\nuser testing </h6>\n<h3 style=\"text-transform:uppercase\">\nTESTING TO FIND THE TRUE VALUE OF THE PRODUCT</h3>\n<p>After user testing, there are some improvements made, such as received and sent notes should all go under the same categories. Better to have avatar to recognize which section the user is at. They would like to know the impact of their messages. It is good to have a notification shown that reply is sent successfully, etc.</p>\n<div style=\"margin-top:-100px\" class=\"kg-card kg-image-card kg-width-full\">\n<p>\n  <span\n    class=\"gatsby-resp-image-wrapper\"\n    style=\"position: relative; display: block; margin: 7vw 0; max-width: 1360px; margin-left: auto; margin-right: auto;\"\n  >\n    <span\n      class=\"gatsby-resp-image-background-image\"\n      style=\"padding-bottom: 56.1764705882353%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAALCAYAAAB/Ca1DAAAACXBIWXMAAAsTAAALEwEAmpwYAAAB9UlEQVQoz3WTTW8SURSG++N06cY/YHTvzoVLjUQbK5IiFKgf5SNNwFAllTaRhdpG7UatUSgWKrSR4WugZYYyMwVmHi8t0GlLT3Jy5tx77pN7zrx3CmGWZTGKfdNkmB7no72BmaYlXKxz0UZ1U6MPTZOoNTZQ1Z9U5A2OjPq4uGc0UaT3gpgXSUbkFVqqRL35l8ZBEcNQxlABNI+TA+UPwfU4C2tJFlIRtE5hDDzSK0SWHITeeIiuelHaGb5+S1KTK9SUMqXmzhBongIVNYc7HuDx4jzety8wtL3TG3YbBOKzOLyPeBpy0tj/xW45JeImpeoatf2ti0BVAP3JCM8SUeZXFwVwdwzURfvemIsHczPMhFwoSga9eAsle5XD7StY7Y9DYN8O3Mb/7iXupSDPV4JiRgWaep96p0ujXSay7MMV9OCLzQlgFjlzm1b6GtUf1+mrHy4BrrzCnQiLGwbPtNztyjwJT3PXeY/7gYe0Wmmk3B1yv2+ST99AVz5PACpb+BJeZl/7CSz70bWibYYyiZSHsJhjNOmho6b5tOkksj5N7IsDufndPkNreEjhXzXPXmWHslyg3zu06a+HJP5osSxRkqv0ejoYRSwtK2IO0fOJNgeysYtyklgv3TvnA5hlF/bJYdPm1hmwKdZM8UzM4d6k2kH8DyDbKGp1OKW2AAAAAElFTkSuQmCC'); background-size: cover; display: block;\"\n    >\n      <picture>\n        <source\n          srcset=\"/static/8246e581b2d970fadf268aecaee057ea/51a8e/testing.webp 340w,\n/static/8246e581b2d970fadf268aecaee057ea/713b7/testing.webp 680w,\n/static/8246e581b2d970fadf268aecaee057ea/54376/testing.webp 1360w,\n/static/8246e581b2d970fadf268aecaee057ea/e0aab/testing.webp 1920w\"\n          sizes=\"(max-width: 1360px) 100vw, 1360px\"\n          type=\"image/webp\"\n        />\n        <source\n          srcset=\"/static/8246e581b2d970fadf268aecaee057ea/ad208/testing.png 340w,\n/static/8246e581b2d970fadf268aecaee057ea/a5a26/testing.png 680w,\n/static/8246e581b2d970fadf268aecaee057ea/60356/testing.png 1360w,\n/static/8246e581b2d970fadf268aecaee057ea/e957c/testing.png 1920w\"\n          sizes=\"(max-width: 1360px) 100vw, 1360px\"\n          type=\"image/png\"\n        />\n        <img\n          class=\"gatsby-resp-image-image\"\n          style=\"width: 100%; height: 100%; margin: 0; vertical-align: middle; position: absolute; top: 0; left: 0; box-shadow: inset 0px 0px 0px 400px white;\"\n          src=\"/static/8246e581b2d970fadf268aecaee057ea/60356/testing.png\"\n          alt=\"user testing\"\n          title=\"\"\n          src=\"/static/8246e581b2d970fadf268aecaee057ea/60356/testing.png\"\n        />\n      </picture>\n      </span>\n  </span>\n  </p>\n</div>\n<h6 style=\" font-size: 16px; margin-bottom:-30px; text-transform:uppercase\">\nhigh-fidelity wireframes </h6>\n<h3 style=\"text-transform:uppercase\">\nfinal design</h3>\n<div style=\"margin-top:-100px\" class=\"kg-card kg-image-card kg-width-full\">\n<p>\n  <span\n    class=\"gatsby-resp-image-wrapper\"\n    style=\"position: relative; display: block; margin: 7vw 0; max-width: 1360px; margin-left: auto; margin-right: auto;\"\n  >\n    <span\n      class=\"gatsby-resp-image-background-image\"\n      style=\"padding-bottom: 56.1764705882353%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAALCAYAAAB/Ca1DAAAACXBIWXMAAAsTAAALEwEAmpwYAAACPklEQVQoz62QS08TYRSG5x+xcOfGxIULjYkL/oAbjRsWmhgTQWPiQkM0xAVuiGEhMUgUKyDSoAIVDIVCIaUtLWU6vUyn0+l0ppex07k8TmvYuDLRNzn5zuJ8z3nfI3ieT01RUEplCPp2o05ZkvAdB13XyeVyGKZJs9kkL56i1+tYloUUzFRVFde20eQKuqLiuy7CRrnBzdAmI6FVXhyKPFmLc/9jmFBWQixXiMUPKFVr5JUakdg+x1KJdgDc3YkiFwtEqjqj4WXGwivsVDWEiGxwb0/mQTzDdCpLotFF6hgUTZkttcOS3GZX6+D4Pg5gByn6Osmm8W2L2ZLN9Y1Fhr9OsJjPIqzKJqPRPGPRAvOSMRi2eh7Bf54dlLi1nuFlIjhHH9jr4QSxXM+j2+vjXd5kbG6E1xgOrbCQbiGE8nVGNjLcjmSYSivUf9rsKzo1y+bO5gkX5vd4FBUHsE7XphcA/QBo2e5g+fRhk2uzJa6+W2deTCG8zapcDB1waeGIyUSFdrD51OhgOS6xqsmnvMah1sJxegNXXuC0avVIGfXAaY1X2zKXJwtcmfrOFymOMJdVOD+3w9BMmPHdo8FWJ7hTP9Y3scqH4zJxpcFmUQvcSHzOKbzO1HiY3CZfn2NieYtzz1MMPf3BTCKJsKc2Gd8v8jiWZOFE5EzNVgvZaKEF0ZWGiWq2MGwHrdWhUNNROl0alsns1imjSyJ336dZS1YQ+EO+7/MvEvqA/l1c3xu8Z9C/rcFf73f1e4H/rF+jECIzk55HLQAAAABJRU5ErkJggg=='); background-size: cover; display: block;\"\n    >\n      <picture>\n        <source\n          srcset=\"/static/a210be7265c70251f3d59ce75f955039/51a8e/kindrednotes040.webp 340w,\n/static/a210be7265c70251f3d59ce75f955039/713b7/kindrednotes040.webp 680w,\n/static/a210be7265c70251f3d59ce75f955039/54376/kindrednotes040.webp 1360w,\n/static/a210be7265c70251f3d59ce75f955039/e0aab/kindrednotes040.webp 1920w\"\n          sizes=\"(max-width: 1360px) 100vw, 1360px\"\n          type=\"image/webp\"\n        />\n        <source\n          srcset=\"/static/a210be7265c70251f3d59ce75f955039/ad208/kindrednotes040.png 340w,\n/static/a210be7265c70251f3d59ce75f955039/a5a26/kindrednotes040.png 680w,\n/static/a210be7265c70251f3d59ce75f955039/60356/kindrednotes040.png 1360w,\n/static/a210be7265c70251f3d59ce75f955039/e957c/kindrednotes040.png 1920w\"\n          sizes=\"(max-width: 1360px) 100vw, 1360px\"\n          type=\"image/png\"\n        />\n        <img\n          class=\"gatsby-resp-image-image\"\n          style=\"width: 100%; height: 100%; margin: 0; vertical-align: middle; position: absolute; top: 0; left: 0; box-shadow: inset 0px 0px 0px 400px white;\"\n          src=\"/static/a210be7265c70251f3d59ce75f955039/60356/kindrednotes040.png\"\n          alt=\"Final Design\"\n          title=\"\"\n          src=\"/static/a210be7265c70251f3d59ce75f955039/60356/kindrednotes040.png\"\n        />\n      </picture>\n      </span>\n  </span>\n  </p>\n</div>\n<h3 style=\"text-transform:uppercase\">\nCHECK OUT THE PROTOTYPE\n</h3>\n<div class=\"gatsby-resp-iframe-wrapper\" style=\"padding-bottom: 56.21827411167513%; position: relative; height: 0; overflow: hidden; margin-bottom: 1.0725rem\" > <iframe frameborder=\"0\" scrolling=\"no\" marginheight=\"0\" marginwidth=\"0\" type=\"text/html\" src=\"https://www.youtube.com/embed/WAA0SimkEZs?autoplay=0&amp;fs=0&amp;iv_load_policy=3&amp;showinfo=0&amp;rel=0&amp;cc_load_policy=0&amp;start=0&amp;end=0&amp;origin=https://youtubeembedcode.com\" style=\" position: absolute; top: 0; left: 0; width: 100%; height: 100%; \"><div><small><a href=\"https://youtubeembedcode.com/en\">youtubeembedcode en</a></small></div><div><small><a href=\"http://add-link-exchange.com\">Add-link-exchange</a></small></div><div><small><a href=\"https://youtubeembedcode.com/de/\">youtubeembedcode de</a></small></div><div><small><a href=\"http://add-link-exchange.com\">add-link-Exchange</a></small></div><div><small><a href=\"https://youtubeembedcode.com/de/\">youtubeembedcode.com/de/</a></small></div><div><small><a href=\"http://add-link-exchange.com\">www://add-link-exchange.com</a></small></div><div><small><a href=\"https://youtubeembedcode.com/en\">youtubeembedcode.com/en/</a></small></div><div><small><a href=\"http://add-link-exchange.com\">w://add-link-exchange.com</a></small></div><div><small><a href=\"https://youtubeembedcode.com/es/\">youtubeembedcode es</a></small></div><div><small><a href=\"http://add-link-exchange.com\">www://add-link-exchange.com</a></small></div><div><small><a href=\"https://youtubeembedcode.com/de/\">youtubeembedcode de</a></small></div><div><small><a href=\"http://add-link-exchange.com\">www://add-link-exchange.com</a></small></div></iframe> </div>\n<p><br/><br/><br/></p>\n<p><br/><br/></p>\n<div style=\"text-align-last:start;\">\n  <a href='/fireaware'>\n    <b>&#8592; FIREAWARE</b>\n  </a>\n</div>\n<div style=text-align-last:end>\n  \n<a href='/age-sister'>\n       <b>AGE SISTER</b> &#8594; \n      </a>\n</div>","frontmatter":{"title":"KINDREDNOTES","date":"May 07, 2019","description":"UXR & UX Design","thumbnail":{"childImageSharp":{"fluid":{"base64":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAMCAYAAABiDJ37AAAACXBIWXMAAAsTAAALEwEAmpwYAAABgUlEQVQoz6WSS0sCYRSG/THORWhdLSqCFoZUi6TINkW1LYR+gouuCEGEeZscHS1pim6UM+lYppRdaGkRFNGiXf+gtzNDIypiYouXczjn+57vPR/Hwov5bz6aB8mM4HSJV0bORAvgE0VDjNmnHveb18pSD8ibsEgO3WEFHR4fOj1+9AiqUas80zwwVgATysAVS2FOeYRb1TAu7YMJakavJaA1mMaUnMPq0xdWSp+YljWj1jKQocvORAbzxXfSB0YoZ/4D5Ghke0TBWPoZrvQLHBHVqJWBdaANgSxdHhAVONUShk7vYBcOCKiBa9YhZ75qHCaHYXIYOILz8B79e+fo9W2DD2dpZSoc1oCrHZr7pUfdIUWrNwnrQhTcYhy8dxfs1kXDXax2WAGzBVQMJrOYvX3DRO4VjrMS+o4f0CUXwQqX5a/h/nKoi5Fu0L4sYnItDLd0gpmQjNGNHQyvx+H0CmhbIsfSdZMjm6PQaJxfgXUzBZbEU24j8f4UbEK2/DW1wB/YdmsrNcd+hgAAAABJRU5ErkJggg==","aspectRatio":1.6666666666666667,"src":"/static/0b989f1500d058ee82022663b938bc98/40a76/kindrednotes-thumbnail-horizontal.png","srcSet":"/static/0b989f1500d058ee82022663b938bc98/c972b/kindrednotes-thumbnail-horizontal.png 340w,\n/static/0b989f1500d058ee82022663b938bc98/27625/kindrednotes-thumbnail-horizontal.png 680w,\n/static/0b989f1500d058ee82022663b938bc98/40a76/kindrednotes-thumbnail-horizontal.png 1360w,\n/static/0b989f1500d058ee82022663b938bc98/1e49b/kindrednotes-thumbnail-horizontal.png 2040w,\n/static/0b989f1500d058ee82022663b938bc98/3cea3/kindrednotes-thumbnail-horizontal.png 2500w","sizes":"(max-width: 1360px) 100vw, 1360px"}}}}}},"pageContext":{"slug":"/kindrednotes/","previous":{"fields":{"slug":"/sage-foundation/"},"frontmatter":{"title":"SAGE FOUNDATION"}},"next":{"fields":{"slug":"/age-sister/"},"frontmatter":{"title":"AGE SISTER"}}}},"staticQueryHashes":["63159454"]}