{"id":64,"date":"2020-12-01T06:19:54","date_gmt":"2020-12-01T06:19:54","guid":{"rendered":"https:\/\/comdma.com\/barracoc\/?p=64"},"modified":"2020-12-01T22:24:07","modified_gmt":"2020-12-01T22:24:07","slug":"project-2-an-app-for-social-distancing","status":"publish","type":"post","link":"https:\/\/comdma.com\/barracoc\/2020\/12\/01\/project-2-an-app-for-social-distancing\/","title":{"rendered":"Project 2: An App for Social Distancing"},"content":{"rendered":"\n<h2 class=\"has-text-align-center wp-block-heading\">Links to Project and App Testing Results<\/h2>\n\n\n\n<p class=\"has-text-align-center\"><a href=\"https:\/\/www.figma.com\/proto\/945EE1uw0tLGtcHr9dEf0x\/Project-2?node-id=18%3A0&amp;viewport=275%2C514%2C0.050452474504709244&amp;scaling=scale-down\">My Figma file link click here to see my prototype<\/a><\/p>\n\n\n\n<p><\/p>\n\n\n\n<p class=\"has-text-align-center\">The results I received from having my friends and family that tested out my app with maze.design:<\/p>\n\n\n\n<p><a href=\"https:\/\/app.maze.design\/report\/1krl26ki595bju#intro\">https:\/\/app.maze.design\/report\/1krl26ki595bju#intro<\/a><\/p>\n\n\n\n<h2 class=\"has-text-align-center wp-block-heading\">Sketches:<\/h2>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"737\" height=\"1024\" src=\"https:\/\/comdma.com\/barracoc\/wp-content\/uploads\/sites\/113\/2020\/12\/IMG_4608-737x1024.jpg\" alt=\"\" class=\"wp-image-65\" srcset=\"https:\/\/comdma.com\/barracoc\/wp-content\/uploads\/sites\/113\/2020\/12\/IMG_4608-737x1024.jpg 737w, https:\/\/comdma.com\/barracoc\/wp-content\/uploads\/sites\/113\/2020\/12\/IMG_4608-216x300.jpg 216w, https:\/\/comdma.com\/barracoc\/wp-content\/uploads\/sites\/113\/2020\/12\/IMG_4608-768x1068.jpg 768w, https:\/\/comdma.com\/barracoc\/wp-content\/uploads\/sites\/113\/2020\/12\/IMG_4608-1105x1536.jpg 1105w, https:\/\/comdma.com\/barracoc\/wp-content\/uploads\/sites\/113\/2020\/12\/IMG_4608.jpg 1125w\" sizes=\"auto, (max-width: 737px) 100vw, 737px\" \/><\/figure>\n\n\n\n<h2 class=\"has-text-align-center wp-block-heading\">Reflection:<\/h2>\n\n\n\n<ul class=\"wp-block-list\"><li>What did you learn?<\/li><\/ul>\n\n\n\n<p>I learned how to do animations in Figma and how to smoothly design an app with the amount of prototype work we are allowed to do on Figma. The animation that I did was the menu pop up it, which was very helpful and a good thing to learn because instead of making individual screens to show the menu, the animation made it available on all the screens that I wanted it on without the extra steps. On top of that, I learned when working with multiples of one element and doing smart animations in Figma you need to keep track of the names on your because it can mess up and won\u2019t do what you intended on doing.<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>What was easy?<\/li><\/ul>\n\n\n\n<p>It was easy coming up with the app concept I wanted. I already had the app envisioned in my mind before I even started. I premade sketches of what I wanted the gameplay to look like and how the menu would be set up.<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>What was challenging<\/li><\/ul>\n\n\n\n<p>It was challenging to keep track of the duplicate elements since there were multiple players. I had to slightly change the names so that each player had their own elements dedicated just to them, and they wouldn\u2019t be switching with one another throughout the animations. It was also challenging figuring out the layout to make it not only look good but to make sense to players.<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>How could your submission be improved?<\/li><\/ul>\n\n\n\n<p>I think my submission could be improved if I could transfer everything I did but onto the size of an iPad, maybe, so I had more room to do the first layout that I had in my sketches, but I liked how the layout turned out in the end. Overall I had to make sure that the layout could workout with every screen size anyway, so it worked out.<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>How could I improve the assignment for the next class?<\/li><\/ul>\n\n\n\n<p>I don\u2019t think there needs to be any improvements.<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>How might you apply your knowledge in future assignments or work scenarios?<\/li><\/ul>\n\n\n\n<p>If I ever work with Figma again in the future or if a program I use is similar to Figma, I\u2019ll label my elements right when I start my first frame so that I don\u2019t have to go back and make adjustments later on.<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>How did a specific reading or video inspire or help you?<\/li><\/ul>\n\n\n\n<p>When we were doing Lab 9, and we visited the animate.css website seeing all the different types of animations that can be done and how they\u2019re programmed helped me have a better understanding of where these elements could work within my app. Like when we programmed the error message to pop up if there was nothing typed in the username or password forms. Although I couldn\u2019t use them in my app because they didn\u2019t fit with the theme, they helped me have a better understanding of the coding process. Also, with our lab ten that I mentioned before, I added in the menu animation, which helped me out a lot. I took a look at the website Stephanie Walter and read \u201cEnhancing User Experience With CSS Animation\u201d (<a href=\"https:\/\/stephaniewalter.design\/blog\/enhancing-user-experience-with-css-animations\/\">https:\/\/stephaniewalter.design\/blog\/enhancing-user-experience-with-css-animations\/<\/a>) to have an idea of animations that would help the users experience be better nor worse.<\/p>\n\n\n\n<h2 class=\"has-text-align-center wp-block-heading\">App Pix<\/h2>\n\n\n\n<figure class=\"wp-block-gallery columns-3 is-cropped wp-block-gallery-1 is-layout-flex wp-block-gallery-is-layout-flex\"><ul class=\"blocks-gallery-grid\"><li class=\"blocks-gallery-item\"><figure><img loading=\"lazy\" decoding=\"async\" width=\"376\" height=\"812\" src=\"https:\/\/comdma.com\/barracoc\/wp-content\/uploads\/sites\/113\/2020\/12\/Game-Center.png\" alt=\"\" data-id=\"69\" data-link=\"https:\/\/comdma.com\/barracoc\/2020\/12\/01\/project-2-an-app-for-social-distancing\/game-center\/\" class=\"wp-image-69\" srcset=\"https:\/\/comdma.com\/barracoc\/wp-content\/uploads\/sites\/113\/2020\/12\/Game-Center.png 376w, https:\/\/comdma.com\/barracoc\/wp-content\/uploads\/sites\/113\/2020\/12\/Game-Center-139x300.png 139w\" sizes=\"auto, (max-width: 376px) 100vw, 376px\" \/><\/figure><\/li><li class=\"blocks-gallery-item\"><figure><img loading=\"lazy\" decoding=\"async\" width=\"376\" height=\"812\" src=\"https:\/\/comdma.com\/barracoc\/wp-content\/uploads\/sites\/113\/2020\/12\/Start.png\" alt=\"\" data-id=\"70\" data-link=\"https:\/\/comdma.com\/barracoc\/2020\/12\/01\/project-2-an-app-for-social-distancing\/start\/\" class=\"wp-image-70\" srcset=\"https:\/\/comdma.com\/barracoc\/wp-content\/uploads\/sites\/113\/2020\/12\/Start.png 376w, https:\/\/comdma.com\/barracoc\/wp-content\/uploads\/sites\/113\/2020\/12\/Start-139x300.png 139w\" sizes=\"auto, (max-width: 376px) 100vw, 376px\" \/><\/figure><\/li><li class=\"blocks-gallery-item\"><figure><img loading=\"lazy\" decoding=\"async\" width=\"375\" height=\"812\" src=\"https:\/\/comdma.com\/barracoc\/wp-content\/uploads\/sites\/113\/2020\/12\/family.png\" alt=\"\" data-id=\"71\" data-link=\"https:\/\/comdma.com\/barracoc\/2020\/12\/01\/project-2-an-app-for-social-distancing\/family\/\" class=\"wp-image-71\" srcset=\"https:\/\/comdma.com\/barracoc\/wp-content\/uploads\/sites\/113\/2020\/12\/family.png 375w, https:\/\/comdma.com\/barracoc\/wp-content\/uploads\/sites\/113\/2020\/12\/family-139x300.png 139w\" sizes=\"auto, (max-width: 375px) 100vw, 375px\" \/><\/figure><\/li><li class=\"blocks-gallery-item\"><figure><img loading=\"lazy\" decoding=\"async\" width=\"376\" height=\"812\" src=\"https:\/\/comdma.com\/barracoc\/wp-content\/uploads\/sites\/113\/2020\/12\/Game.png\" alt=\"\" data-id=\"72\" data-link=\"https:\/\/comdma.com\/barracoc\/2020\/12\/01\/project-2-an-app-for-social-distancing\/game\/\" class=\"wp-image-72\" srcset=\"https:\/\/comdma.com\/barracoc\/wp-content\/uploads\/sites\/113\/2020\/12\/Game.png 376w, https:\/\/comdma.com\/barracoc\/wp-content\/uploads\/sites\/113\/2020\/12\/Game-139x300.png 139w\" sizes=\"auto, (max-width: 376px) 100vw, 376px\" \/><\/figure><\/li><li class=\"blocks-gallery-item\"><figure><img loading=\"lazy\" decoding=\"async\" width=\"376\" height=\"812\" src=\"https:\/\/comdma.com\/barracoc\/wp-content\/uploads\/sites\/113\/2020\/12\/Game_end.png\" alt=\"\" data-id=\"73\" data-link=\"https:\/\/comdma.com\/barracoc\/2020\/12\/01\/project-2-an-app-for-social-distancing\/game_end\/\" class=\"wp-image-73\" srcset=\"https:\/\/comdma.com\/barracoc\/wp-content\/uploads\/sites\/113\/2020\/12\/Game_end.png 376w, https:\/\/comdma.com\/barracoc\/wp-content\/uploads\/sites\/113\/2020\/12\/Game_end-139x300.png 139w\" sizes=\"auto, (max-width: 376px) 100vw, 376px\" \/><\/figure><\/li><li class=\"blocks-gallery-item\"><figure><img loading=\"lazy\" decoding=\"async\" width=\"376\" height=\"812\" src=\"https:\/\/comdma.com\/barracoc\/wp-content\/uploads\/sites\/113\/2020\/12\/How-to-play-1.png\" alt=\"\" data-id=\"74\" data-link=\"https:\/\/comdma.com\/barracoc\/2020\/12\/01\/project-2-an-app-for-social-distancing\/how-to-play-1\/\" class=\"wp-image-74\" srcset=\"https:\/\/comdma.com\/barracoc\/wp-content\/uploads\/sites\/113\/2020\/12\/How-to-play-1.png 376w, https:\/\/comdma.com\/barracoc\/wp-content\/uploads\/sites\/113\/2020\/12\/How-to-play-1-139x300.png 139w\" sizes=\"auto, (max-width: 376px) 100vw, 376px\" \/><\/figure><\/li><li class=\"blocks-gallery-item\"><figure><img loading=\"lazy\" decoding=\"async\" width=\"376\" height=\"812\" src=\"https:\/\/comdma.com\/barracoc\/wp-content\/uploads\/sites\/113\/2020\/12\/Game-info.png\" alt=\"\" data-id=\"75\" data-link=\"https:\/\/comdma.com\/barracoc\/2020\/12\/01\/project-2-an-app-for-social-distancing\/game-info\/\" class=\"wp-image-75\" srcset=\"https:\/\/comdma.com\/barracoc\/wp-content\/uploads\/sites\/113\/2020\/12\/Game-info.png 376w, https:\/\/comdma.com\/barracoc\/wp-content\/uploads\/sites\/113\/2020\/12\/Game-info-139x300.png 139w\" sizes=\"auto, (max-width: 376px) 100vw, 376px\" \/><\/figure><\/li><li class=\"blocks-gallery-item\"><figure><img loading=\"lazy\" decoding=\"async\" width=\"376\" height=\"812\" src=\"https:\/\/comdma.com\/barracoc\/wp-content\/uploads\/sites\/113\/2020\/12\/skip-bo-card-info-1.png\" alt=\"\" data-id=\"79\" data-full-url=\"https:\/\/comdma.com\/barracoc\/wp-content\/uploads\/sites\/113\/2020\/12\/skip-bo-card-info-1.png\" data-link=\"https:\/\/comdma.com\/barracoc\/2020\/12\/01\/project-2-an-app-for-social-distancing\/skip-bo-card-info-1\/\" class=\"wp-image-79\" srcset=\"https:\/\/comdma.com\/barracoc\/wp-content\/uploads\/sites\/113\/2020\/12\/skip-bo-card-info-1.png 376w, https:\/\/comdma.com\/barracoc\/wp-content\/uploads\/sites\/113\/2020\/12\/skip-bo-card-info-1-139x300.png 139w\" sizes=\"auto, (max-width: 376px) 100vw, 376px\" \/><\/figure><\/li><\/ul><\/figure>\n","protected":false},"excerpt":{"rendered":"<p>Links to Project and App Testing Results My Figma file link click here to see my prototype The results I received from having my friends and family that tested out my app with maze.design: https:\/\/app.maze.design\/report\/1krl26ki595bju#intro Sketches: Reflection: What did you learn? I learned how to do animations in Figma and how to smoothly design an [&hellip;]<\/p>\n","protected":false},"author":107,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"inline_featured_image":false,"_kad_blocks_custom_css":"","_kad_blocks_head_custom_js":"","_kad_blocks_body_custom_js":"","_kad_blocks_footer_custom_js":"","_kadence_starter_templates_imported_post":false,"footnotes":""},"categories":[3],"tags":[],"class_list":["post-64","post","type-post","status-publish","format-standard","hentry","category-dma-217"],"taxonomy_info":{"category":[{"value":3,"label":"DMA 217"}]},"featured_image_src_large":false,"author_info":{"display_name":"barracoc","author_link":"https:\/\/comdma.com\/barracoc\/author\/barracoc\/"},"comment_info":"","category_info":[{"term_id":3,"name":"DMA 217","slug":"dma-217","term_group":0,"term_taxonomy_id":3,"taxonomy":"category","description":"Hi everyone! These are all the projects that I completed in my DMA 217 course that I took in the Fall of 2020!","parent":0,"count":3,"filter":"raw","cat_ID":3,"category_count":3,"category_description":"Hi everyone! These are all the projects that I completed in my DMA 217 course that I took in the Fall of 2020!","cat_name":"DMA 217","category_nicename":"dma-217","category_parent":0}],"tag_info":false,"_links":{"self":[{"href":"https:\/\/comdma.com\/barracoc\/wp-json\/wp\/v2\/posts\/64","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/comdma.com\/barracoc\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/comdma.com\/barracoc\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/comdma.com\/barracoc\/wp-json\/wp\/v2\/users\/107"}],"replies":[{"embeddable":true,"href":"https:\/\/comdma.com\/barracoc\/wp-json\/wp\/v2\/comments?post=64"}],"version-history":[{"count":5,"href":"https:\/\/comdma.com\/barracoc\/wp-json\/wp\/v2\/posts\/64\/revisions"}],"predecessor-version":[{"id":80,"href":"https:\/\/comdma.com\/barracoc\/wp-json\/wp\/v2\/posts\/64\/revisions\/80"}],"wp:attachment":[{"href":"https:\/\/comdma.com\/barracoc\/wp-json\/wp\/v2\/media?parent=64"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/comdma.com\/barracoc\/wp-json\/wp\/v2\/categories?post=64"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/comdma.com\/barracoc\/wp-json\/wp\/v2\/tags?post=64"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}