{"data":{"site":{"siteMetadata":{"title":"Kai's Awesome Dev Blog","author":"Kai Lovingfoss"}},"markdownRemark":{"id":"80d152f1-b1f3-5098-9d74-0eff27e95fc6","excerpt":"Part 1 - Individual Accomplishments this Week Github Handle:  tryingtokeepup Week 4! What a month it has been. Been extremely enjoyable working with my team…","html":"<h1>Part 1 - Individual Accomplishments this Week</h1>\n<p>Github Handle: <a href=\"https://github.com/tryingtokeepup\">tryingtokeepup</a></p>\n<p>Week 4! What a month it has been. Been extremely enjoyable working with my team until now, but as we are reaching the end.</p>\n<h2>Tasks Pulled</h2>\n<p>This week, in Technical Accomplishments:</p>\n<p>Technical accomplishments? A bunch, but the biggest was helping Bondor with the brand-new, ultra cool Activity Timeline. Compared to the old one, which was really just something that tracked the current state of data on the database, this activity timeline actually now tracks what actions a user is doing inside the document and message components. It was a lot of backend work, a lot of sweat and tears, but we got it to work. Screencaps in the detailed area.</p>\n<h3>Ticket 1: Fixed a bunch of bugs in Event.js in backend</h3>\n<ul>\n<li><a href=\"https://github.com/Lambda-School-Labs/labs-team-home/pull/362\">Github</a></li>\n<li><a href=\"https://trello.com/c/QW8mvUpD/85-testing-and-fixing-folder-functions-from-last-week\">Trello</a></li>\n</ul>\n<h3>Ticket 2: Rebuilt, with Bondor, all the schemas for Event handling. Bugs squashed aplenty.</h3>\n<ul>\n<li><a href=\"https://github.com/Lambda-School-Labs/labs-team-home/pull/370\">Github</a></li>\n<li><a href=\"https://trello.com/c/QW8mvUpD/85-testing-and-fixing-folder-functions-from-last-week\">Trello</a></li>\n</ul>\n<h3>Ticket 3: Fixed a bunch of nulls being passed from our GraphQL resolvers.</h3>\n<ul>\n<li><a href=\"https://github.com/Lambda-School-Labs/labs-team-home/pull/384\">Github</a></li>\n<li><a href=\"https://trello.com/c/QW8mvUpD/85-testing-and-fixing-folder-functions-from-last-week\">Trello</a></li>\n</ul>\n<h3>Ticket 4: Quality of life fixes: better and cleaner returns from resolvers, and removed some annoying alerts.</h3>\n<ul>\n<li><a href=\"https://github.com/Lambda-School-Labs/labs-team-home/pull/395\">Github</a></li>\n<li><a href=\"https://trello.com/c/QW8mvUpD/85-testing-and-fixing-folder-functions-from-last-week\">Trello</a></li>\n</ul>\n<p>Was a good week. </p>\n<h2>Detailed Analysis</h2>\n<p>This week can be boiled down to: Help Bondor with Activity Timeline, and then try to get some testing done. Honestly, I kind of failed at getting testing implemented: its a bit more complicated than I realized, as it uses packages that we were not taught here in at Lambda. But it seems doable, so I will tackle it over the weekend. </p>\n<p>For the activity timeline, there were all kinds of important things we had to go through, mostly schema related. We built a completely new resolver, schema, and model system to replace what we had before, and Bondor went ahead and removed most of the unnecessary code from the front-end. I am proud that I was able to parlay my limited knowledge of the backend into helping Bondor’s Herculean task of making a real Activity Timeline, and I hope everyone can play around with it in the future. </p>\n<p>Note: current screenshots are not updated, making new ones</p>\n<p>Screenshots:</p>\n<p>\n  <a\n    class=\"gatsby-resp-image-link\"\n    href=\"/static/d90edbb0e2732a9cc2c4f01ccc6db3c6/819be/activity-timeline-1.png\"\n    style=\"display: block\"\n    target=\"_blank\"\n    rel=\"noopener\"\n  >\n  \n  <span\n    class=\"gatsby-resp-image-wrapper\"\n    style=\"position: relative; display: block;  max-width: 590px; margin-left: auto; margin-right: auto;\"\n  >\n    <span\n      class=\"gatsby-resp-image-background-image\"\n      style=\"padding-bottom: 82.2742474916388%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAQCAYAAAAWGF8bAAAACXBIWXMAAAsSAAALEgHS3X78AAACN0lEQVQ4y41U227TQBC1yg8g8QCp7d31NetbEl8SO2luQJqoCFAR/EhBQkIIHvgvQKn4r8N4nbRpEkV9OJrdsX32zJzxaowxcM7BTANOFKFzMUecl4irCaJyimQ4hexm4ILBNE2F+hu1psj2oG0JtwiTDHExRBSnCGSCblEi6Y8ge314voRlOxvCQ7IDQsZMREQyfPMJFy/fYzC+xGSxQjEcw20HzTvqPXZU3QPC3SijLrLpEvnyA8rxEJNXM/TGC/gypNbcl7ot/yShEBw2ZxCWBYfU+rKNdhgphXUFp8o9LJlO9IIY0WAEP0khQwnZ6cH2G2WMiwOCfZX3Cu/6yNDOCuSLt8hnS2TzK/Qml0iqGZFnMPRzGIYO0zCOOn6kh6ZyMsxK5awjIwja2+RwvXaodMcPYFOOC3FC4QO3GTpJjnJ5jap6jX45J7evkJZjtKkVXhjD8XzV58cRkimWsJDOVihXH1GtrjFavkPezyDjGJYnqexHltyYw+DaLjxS4dCouL4Pr+2rcndn8bQpdax7QicL14bn+jQ+luppraaBfvf7NThGqFQJhfphEHYQFRUcmj1mOZtR4QrmBvv73ZzGjXMIU0cdbUcgpIaH5KbnedRHofJMb4EZrSYSzA3YXqyh6TKFHmTQZQabbhpeDGCEXTC6YWrwXkExh0gLGHEBM0jBw0yhXjPCNsfCFNrZ5z/Y4snXNc6+/MVubhfazW88+77Gi5+3aBGe/7jF029rlRO//qn9fz2N1lr2cz4ZAAAAAElFTkSuQmCC'); background-size: cover; display: block;\"\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        alt=\"activity timeline 1\"\n        title=\"Activity Timeline - This shows the first part of the fix.\"\n        src=\"/static/d90edbb0e2732a9cc2c4f01ccc6db3c6/40fad/activity-timeline-1.png\"\n        srcset=\"/static/d90edbb0e2732a9cc2c4f01ccc6db3c6/707e9/activity-timeline-1.png 148w,\n/static/d90edbb0e2732a9cc2c4f01ccc6db3c6/649e0/activity-timeline-1.png 295w,\n/static/d90edbb0e2732a9cc2c4f01ccc6db3c6/40fad/activity-timeline-1.png 590w,\n/static/d90edbb0e2732a9cc2c4f01ccc6db3c6/b3fef/activity-timeline-1.png 885w,\n/static/d90edbb0e2732a9cc2c4f01ccc6db3c6/819be/activity-timeline-1.png 897w\"\n        sizes=\"(max-width: 590px) 100vw, 590px\"\n      />\n    </span>\n  </span>\n  \n  </a>\n    </p>\n<p>\n  <a\n    class=\"gatsby-resp-image-link\"\n    href=\"/static/d22bb6af06544c2314738d1e27600068/ddb76/activity-timeline2.png\"\n    style=\"display: block\"\n    target=\"_blank\"\n    rel=\"noopener\"\n  >\n  \n  <span\n    class=\"gatsby-resp-image-wrapper\"\n    style=\"position: relative; display: block;  max-width: 590px; margin-left: auto; margin-right: auto;\"\n  >\n    <span\n      class=\"gatsby-resp-image-background-image\"\n      style=\"padding-bottom: 86.86210640608034%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAARCAYAAADdRIy+AAAACXBIWXMAAAsSAAALEgHS3X78AAACXElEQVQ4y4VU21LbMBT0Z5T4bkvyLb4mJLIDJXToFGiHx/b/v2S7UgqJwUwfds6xLK/Oas+x0/cttNYWQ99j2PTMR9R1Db3foWs75LnENE52PcsyJEmKNE1tPOcJ9xVwsiyHlJILMYQQyIcGshSQWYq8UlAF8zwhhIUfBPB9fxGe5xnCDGEYIiB834PsOlS7A6rhGiVjubvBmlEWFcm8t48DEi/BUSpDFEUnUi4kicB6M6LaaBTrgehRX08oB42s7iGoJooT7j0TXx7iSKlmhCY2JJl+/cF0+IH97QNuHx7RsGKhcqsk+Ld3qVLHXOgl4Wte9Xtsjk/YPLzg8HXEdH9ErY+8Zzkjek/qGCM+EgaIKSlOJURR0z2FbF0j5fUYqZ9Vd6qQJ0ZReCZkVFWN8lpDVi2KqkTe9IhljjCKLd6TXJI7aVbMCU2FRKkPGO6f0R/uGZ/QHL5R8h0PaeCuruB7c8cvTJEfJAdsn5QV1btbVNsJqmxglGTr1uaypHwWkvD+wzCaV7hEaHIjve126OnyttXotyP2N3co6u5Exu6I49junREqpRYJTS7ZJka2fv6N8fEF+vtPHlLbJo9o2Kvs/0o2ecg8NbPKD2OhkAjmlB1zzRpjpX4cQ1vha+mXbZMUGVRKIuNscJrTmRGftY3izyHmn+LUEpElLOvBjp5xNCKpqeY0IYxBeJ6WBTgqjRH7LiJvhdC9guAfpcgUcikgUpoT8F3Ad/6VRUQEHrH6sggn2R7h1iNW6z2hEdFVbxjhtjt4nbYINhP8boTfj8yJboLL/R7hXsA8/wX5x+WlYRa8NAAAAABJRU5ErkJggg=='); background-size: cover; display: block;\"\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        alt=\"activity timeline2\"\n        title=\"This is the 2nd part.\"\n        src=\"/static/d22bb6af06544c2314738d1e27600068/40fad/activity-timeline2.png\"\n        srcset=\"/static/d22bb6af06544c2314738d1e27600068/707e9/activity-timeline2.png 148w,\n/static/d22bb6af06544c2314738d1e27600068/649e0/activity-timeline2.png 295w,\n/static/d22bb6af06544c2314738d1e27600068/40fad/activity-timeline2.png 590w,\n/static/d22bb6af06544c2314738d1e27600068/b3fef/activity-timeline2.png 885w,\n/static/d22bb6af06544c2314738d1e27600068/ddb76/activity-timeline2.png 921w\"\n        sizes=\"(max-width: 590px) 100vw, 590px\"\n      />\n    </span>\n  </span>\n  \n  </a>\n    </p>\n<p>\n  <a\n    class=\"gatsby-resp-image-link\"\n    href=\"/static/4739acdeb61b2003d84339545a804357/c8178/subscribe-function.png\"\n    style=\"display: block\"\n    target=\"_blank\"\n    rel=\"noopener\"\n  >\n  \n  <span\n    class=\"gatsby-resp-image-wrapper\"\n    style=\"position: relative; display: block;  max-width: 590px; margin-left: auto; margin-right: auto;\"\n  >\n    <span\n      class=\"gatsby-resp-image-background-image\"\n      style=\"padding-bottom: 77.71966527196652%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAQCAYAAAAWGF8bAAAACXBIWXMAAAsSAAALEgHS3X78AAAB1ElEQVQ4y5VUy5KbMBD0f6xADySQkcUbDN6E3apUag855f8/pjOScbK1ayfk0DUINO2emR4f5nnGsiyoKo++bwlDfJ7nM8K3rmtRlg5FYaFUBpVl17ghi2cF5xysPeJgjIEQAppipjVdUNAUw1kqEc+FLWBygyRJHoIxFnGQUoJzDh5IfUFQkIYjKzhyTwqsgtACQnGkdC8kp2n6EIcgNygMpO5ywfntO5q+gbEWQtL7lBSwP0pC0j2FnwnpkNsS/fIF9XCGHy/w3YBj1YBLRUnsd9LfVEbCoC6QCp6ipiGMX1dU/QiRUR83cGpNQj16r/IBoYz9u5VtSOV5XdEsL3DDBWU7wU/P8POKLLc7FUbCoFKibU9kowblyVEPs3gpTC8JCe+G8rF3d0sOfbS+wfT2E8O3H8idhzJkGaOj/wT5TsR+7u4hj0Y9NiNsM5BlXCwzePBKqAn/QajzIzRtxNWXkn4gWOYJ7IltJbJ9Jd8GUrgqDsHWA07Dgnqa4zv+ocxdCuOEqbSlO6G2+TaI63b8i+QuoSIVemxRTB1kVJR+Km0PadxlQdCOVk0l1DtGkVGZCRk6IXMHhXy/wtufg6XNcMNMWOCXdYuv0DRpRoPZQxbwCzzPwNgLQw2lAAAAAElFTkSuQmCC'); background-size: cover; display: block;\"\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        alt=\"subscribe function\"\n        title=\"I assisted Nedim too this week on the subscribe functionality. Final implementation was done by Bondor.\"\n        src=\"/static/4739acdeb61b2003d84339545a804357/40fad/subscribe-function.png\"\n        srcset=\"/static/4739acdeb61b2003d84339545a804357/707e9/subscribe-function.png 148w,\n/static/4739acdeb61b2003d84339545a804357/649e0/subscribe-function.png 295w,\n/static/4739acdeb61b2003d84339545a804357/40fad/subscribe-function.png 590w,\n/static/4739acdeb61b2003d84339545a804357/b3fef/subscribe-function.png 885w,\n/static/4739acdeb61b2003d84339545a804357/c8178/subscribe-function.png 956w\"\n        sizes=\"(max-width: 590px) 100vw, 590px\"\n      />\n    </span>\n  </span>\n  \n  </a>\n    </p>\n<p>\n  <a\n    class=\"gatsby-resp-image-link\"\n    href=\"/static/8c69150a2408527f6d87ee02d776906e/de1ce/tag-function.png\"\n    style=\"display: block\"\n    target=\"_blank\"\n    rel=\"noopener\"\n  >\n  \n  <span\n    class=\"gatsby-resp-image-wrapper\"\n    style=\"position: relative; display: block;  max-width: 590px; margin-left: auto; margin-right: auto;\"\n  >\n    <span\n      class=\"gatsby-resp-image-background-image\"\n      style=\"padding-bottom: 82.15417106652586%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAQCAYAAAAWGF8bAAAACXBIWXMAAAsSAAALEgHS3X78AAAB8klEQVQ4y42U6Y6bQBCEeQ+bY4C5GO7FB2a9ib3ZaCNFyvs/TaVnglljg5QfrRHS8Kmquns8Y3IIIcBihiSOkWgF9dKgrBrsDgNMVSLVAgljCHwfm80GPp1Ltd1u4VlgTLAgCP5VGCLrjqiGdxTDB8FP4EVD0BxhxKii8a7/9c9deUppAsbuIySYrTQVqPpvqLoeZd6hO51x/P4Bmdd0N3F3rCL7z71CB+Sc7DI2Aa1CFoSo6wPZ7SCFARcKjNQ9/nw7Zwo55xNwgtqTALKo0exsngopjyijzXRvCfakcAYcv8v+FfXbO6pjj0Qq+BT8EmgCug4vKoxcV83+DL2/or38drlGLF5VNwIl4iWgbRCdWXuAqHuIvEFMbmwU21HlfZ5fllcUBtQY232eZVBNTZaPMK2Fpu7+aoaScmFrCqmELlEe3lDsBrTnH9A0k3nzAk5zuZSnJ9U60GYoaGQKmkNTNxCmdJ23tm8b89jxVcu3MyLbp+uA6+dPNNc/6C6/UJQGSnFE0bN1siynTVmyHPgBRBpTcyqyqSF1RpsUu3rcmP9SKBOJMqtQNAR0j0jiumxraXM8pfXscZgBx9Ex9Q7l/hU5zWRO++0ehmka5pvjHodoekGeLftk2eY1nGgF2xaK9nt3+aQI9jBFhZSadg/8C9Yaw3Dc6DD5AAAAAElFTkSuQmCC'); background-size: cover; display: block;\"\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        alt=\"tag function\"\n        title=\"Not all of the code (of course), but this was my primary duty. Eileen helped tremendously.\"\n        src=\"/static/8c69150a2408527f6d87ee02d776906e/40fad/tag-function.png\"\n        srcset=\"/static/8c69150a2408527f6d87ee02d776906e/707e9/tag-function.png 148w,\n/static/8c69150a2408527f6d87ee02d776906e/649e0/tag-function.png 295w,\n/static/8c69150a2408527f6d87ee02d776906e/40fad/tag-function.png 590w,\n/static/8c69150a2408527f6d87ee02d776906e/b3fef/tag-function.png 885w,\n/static/8c69150a2408527f6d87ee02d776906e/de1ce/tag-function.png 947w\"\n        sizes=\"(max-width: 590px) 100vw, 590px\"\n      />\n    </span>\n  </span>\n  \n  </a>\n    </p>\n<h1>Part 2 - The Challenges of Making a Great UI/UX Experience</h1>\n<p>This will have to be some what abbreviated, as there are a ton of stuff I want to add here, along with pictures, to truly explain what I have yet to learn, but the biggest one was simple: the core team will have difficulty finding UI UX issues, simply because they will have gotten used to those issues. </p>\n<p>It is like someone who teaches a course on some esoteric subject (or math) for a long time; the teacher will not be able to easily gauge what part of the course would be especially daunting to a newcomer without a large amount of input from those students, REGARDLESS of how much initial difficulty that teacher had in understanding the material when they were first introduced to it. You simply acclimate to the difficulty over time, and what was difficult becomes simple with repetition.</p>\n<p>This is normally a great thing: look, the thing that was impossible a month ago is now trivial! Look Mah, no hands! But this destroys your sense of perspective, and makes it all the more necessary to drag others completely fresh to your precious project and watch them use your site. Watching those around my hacker house interact with the Sveza app helped me understand that the majority of the problems with the initial had nothing to do with ugly styling (although thats something we worked on too), but had more to do with counter-intuitive app design, like having a pull down button floating at the mid-top of our app instead of being bottom-left as standard, not having the Enter key being the standard button to input text in a input field box, and other little things that seem small at first but add up to a frustrating user experience quickly.</p>\n<p>We also worked furiously to make an actually responsive and “real” activity timeline so that our users could actually see what was happening in their team space, and this required a tremendous amount of work in the backend, making new resolvers and models to allow for the new component to do what it says on the can. </p>","frontmatter":{"title":"Labs 4 Retrospective - UIUX Crucible","date":"March 15, 2019"}}},"pageContext":{"slug":"/2019-03-15-labs-4-retrospective-uiux-crucible/","previous":{"fields":{"slug":"/2019-03-15-labs-5-retrospective-the-final-week-part-1/"},"frontmatter":{"title":"Labs 5 Retrospective - The Final Week, Part 1"}},"next":{"fields":{"slug":"/2019-03-19-cs-week-1-gameplan-ideas-on-the-pioneer-challenge-and-what-i-need-to-focus-on/"},"frontmatter":{"title":"CS Week 1 - Gameplan, Ideas on the Pioneer challenge, and what I need to focus on"}}}}