{"id":47,"date":"2021-05-25T10:55:58","date_gmt":"2021-05-25T17:55:58","guid":{"rendered":"https:\/\/blogs.ubc.ca\/mediastudiesubco\/?p=47"},"modified":"2022-06-28T12:15:33","modified_gmt":"2022-06-28T19:15:33","slug":"noggn","status":"publish","type":"post","link":"https:\/\/blogs.ubc.ca\/mediastudiesubco\/noggn\/","title":{"rendered":"Noggn brainstorming app by Nick Hemingway &#038; Paige Latimer"},"content":{"rendered":"<p style=\"padding-top: 1.5em;\">\u00a0 <img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-134 size-full\" src=\"https:\/\/blogs.ubc.ca\/mediastudiesubco\/files\/2021\/03\/blog_header_image.png\" alt=\"\" width=\"960\" height=\"290\" srcset=\"https:\/\/blogs.ubc.ca\/mediastudiesubco\/files\/2021\/03\/blog_header_image.png 960w, https:\/\/blogs.ubc.ca\/mediastudiesubco\/files\/2021\/03\/blog_header_image-300x91.png 300w, https:\/\/blogs.ubc.ca\/mediastudiesubco\/files\/2021\/03\/blog_header_image-768x232.png 768w\" sizes=\"auto, (max-width: 960px) 100vw, 960px\" \/><\/p>\n<p>\u00a0Noggn is a collaborative web-based brainstorming application that helps students work together more efficiently. Our main goal with Noggn is to foster a collaborative online environment for students and their teams to encourage creativity and idea development.<\/p>\n<p>Noggn\u2019s main feature is our Ideaboard. In Noggn\u2019s case, an Ideaboard is a mind map that is made up of nodes that act as ideas and are connected by arrows. Whenever you create a team, you will have access to an unlimited canvas where you can create and customize your Ideaboard to fit whatever project you are working on. You can add links, change the color, and add photos.<\/p>\n<p>Another important feature of Noggn is the chat feature. Each team will have access to a real-time chat which you can be found on the left of the canvas. Students can use this to ask questions, suggest ideas, and coordinate plans.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-131 alignleft\" src=\"https:\/\/blogs.ubc.ca\/mediastudiesubco\/files\/2021\/03\/logo.png\" alt=\"\" width=\"451\" height=\"240\" \/><img loading=\"lazy\" decoding=\"async\" class=\"alignleft wp-image-132\" src=\"https:\/\/blogs.ubc.ca\/mediastudiesubco\/files\/2021\/03\/Group-15.png\" alt=\"\" width=\"371\" height=\"240\" \/><\/p>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<p><strong>Branding<\/strong><\/p>\n<p>We designed and created Noggn from scratch with the intention of creating an upbeat,\u00a0modern brand that would be appealing and relatable for students.<\/p>\n<p>Our logo and colours represent this directly. We are modern, and friendly. Productive, and quirky. We achieve our persona through bright colours that are reminiscent of technology; the bright colours of LED and multicolored wires. Our logo can be seen as both a brain and a cloud signifying our achievement of creating brainstorming on the cloud.<\/p>\n<p>Check out our<a href=\"https:\/\/docs.google.com\/presentation\/d\/1qDqOuByFAT7D56cICN3hd62oc9rw1p2x0-vtG1SX9V0\/edit#slide=id.gcc33a7ec5a_0_27\"> pitch deck<\/a> to see all of Noggn\u2019s branding in action.<\/p>\n<p style=\"text-align: left;\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-133\" style=\"color: #333333; font-size: 1rem;\" src=\"https:\/\/blogs.ubc.ca\/mediastudiesubco\/files\/2021\/03\/UI_screensohts.png\" alt=\"\" width=\"960\" height=\"363\" srcset=\"https:\/\/blogs.ubc.ca\/mediastudiesubco\/files\/2021\/03\/UI_screensohts.png 5337w, https:\/\/blogs.ubc.ca\/mediastudiesubco\/files\/2021\/03\/UI_screensohts-300x113.png 300w, https:\/\/blogs.ubc.ca\/mediastudiesubco\/files\/2021\/03\/UI_screensohts-1024x387.png 1024w, https:\/\/blogs.ubc.ca\/mediastudiesubco\/files\/2021\/03\/UI_screensohts-768x290.png 768w, https:\/\/blogs.ubc.ca\/mediastudiesubco\/files\/2021\/03\/UI_screensohts-1536x580.png 1536w, https:\/\/blogs.ubc.ca\/mediastudiesubco\/files\/2021\/03\/UI_screensohts-2048x774.png 2048w\" sizes=\"auto, (max-width: 960px) 100vw, 960px\" \/><strong>Technology &amp; Design<\/strong><\/p>\n<p>We chose Node.js in combination with React.js to build Noggn. Material UI works great with React as a front-end library with tons of elegantly designed models.<\/p>\n<p>Our database is built with Firebase, a Google NoSQL database for quick updates and great scaling.<\/p>\n<p><strong>User Feedback\u00a0<\/strong><\/p>\n<p>After conducting user testing, we found that we had achieved our ultimate goal of making Noggn easy to use. The majority of our testers also said that they would be likely to use Noggn. Finally, they responded very positively to the colors and overall\u00a0design of the interface.<\/p>\n<p><strong>Demo\u00a0<\/strong><\/p>\n<p>To see an overview of how Noggn works, check out our<a href=\"https:\/\/drive.google.com\/file\/d\/1-1I9HgrqKAVPLkgbl8wJXmtT1L_-vtzx\/view?usp=sharing\"> promotional video<\/a>.<\/p>\n<p><strong>Addressing the problem<\/strong><\/p>\n<p>For the past year, university has been\u00a0almost entirely online. This alone was a huge change for students, but on top of that, many professors were still assigning group projects. After conducting a survey of 32 university students, we found that almost three-quarters of students were required to work in group projects online. It was really no surprise that students found their group projects more difficult when working remotely. In summation, we discovered that students were having problems communicating and brainstorming as a group remotely.<\/p>\n<p><strong>Noggn Team<\/strong><\/p>\n<p><strong>Nick Hemingway<\/strong> is a Digital Media specialist focusing on process improvement for the user through application design. Nick specializes in application development with experience in a wide range of media development technologies. With a strong ability to think systematically, combined with the power of a creative mindset, Nick is capable of creating unique yet functional digital media.<\/p>\n<p><strong>Paige Latimer<\/strong> is a Digital Media artist and designer with a passion for human-centered design. Her designs are focused on creating an amazing experience for the user. Paige works across multipleprogramming languages and digital design tools and enjoys developing projects that solve unique user experience problems. Website: <a href=\"https:\/\/paigelatimer.ca\/\"><strong>paigelatimer.ca<\/strong><\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p class=\"post-excerpt\">\u00a0 \u00a0Noggn is a collaborative web-based brainstorming application that helps students work together more efficiently. Our main goal with Noggn&#8230;<\/p>\n","protected":false},"author":76179,"featured_media":134,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[6],"tags":[11],"class_list":["post-47","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-capstone-2021","tag-11"],"_links":{"self":[{"href":"https:\/\/blogs.ubc.ca\/mediastudiesubco\/wp-json\/wp\/v2\/posts\/47","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/blogs.ubc.ca\/mediastudiesubco\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blogs.ubc.ca\/mediastudiesubco\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blogs.ubc.ca\/mediastudiesubco\/wp-json\/wp\/v2\/users\/76179"}],"replies":[{"embeddable":true,"href":"https:\/\/blogs.ubc.ca\/mediastudiesubco\/wp-json\/wp\/v2\/comments?post=47"}],"version-history":[{"count":26,"href":"https:\/\/blogs.ubc.ca\/mediastudiesubco\/wp-json\/wp\/v2\/posts\/47\/revisions"}],"predecessor-version":[{"id":218,"href":"https:\/\/blogs.ubc.ca\/mediastudiesubco\/wp-json\/wp\/v2\/posts\/47\/revisions\/218"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/blogs.ubc.ca\/mediastudiesubco\/wp-json\/wp\/v2\/media\/134"}],"wp:attachment":[{"href":"https:\/\/blogs.ubc.ca\/mediastudiesubco\/wp-json\/wp\/v2\/media?parent=47"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blogs.ubc.ca\/mediastudiesubco\/wp-json\/wp\/v2\/categories?post=47"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blogs.ubc.ca\/mediastudiesubco\/wp-json\/wp\/v2\/tags?post=47"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}