{"id":1253,"date":"2021-05-21T18:44:43","date_gmt":"2021-05-21T16:44:43","guid":{"rendered":"https:\/\/blogs.fu-berlin.de\/hci1-sose2021\/?p=1253"},"modified":"2021-05-23T14:22:20","modified_gmt":"2021-05-23T12:22:20","slug":"sleepy-heads-first-interactive-low-fidelity-prototype","status":"publish","type":"post","link":"https:\/\/blogs.fu-berlin.de\/hci1-sose2021\/2021\/05\/21\/sleepy-heads-first-interactive-low-fidelity-prototype\/","title":{"rendered":"[A#5, P5] Sleepy Heads &#8211; First interactive low-fidelity prototype"},"content":{"rendered":"\n<h2 class=\"wp-block-heading\">Feedback summary<\/h2>\n\n\n\n<ul class=\"wp-block-list\"><li>Night mode: No notifications or messages, mute certain calls -&gt; No distractions on the mobile phone (not in the prototype)<\/li><li>Dream diary with voice recording (not in the prototype)<\/li><li>Notifications to remind you about entering data, even if you haven&#8217;t tracked anything for a week (not in the prototype)<\/li><li>Perceived dialogue where the user is guided through the app<\/li><li>Entering factors is a good function, as these factors strongly influence the quality of sleep.<\/li><\/ul>\n\n\n\n<h2 class=\"wp-block-heading\">Development of an interactive paper prototype<\/h2>\n\n\n\n<h4 class=\"wp-block-heading\">the first version of our interactive prototype:<\/h4>\n\n\n\n<p><a href=\"https:\/\/www.figma.com\/proto\/2ajRymIg7sGKAu2kDzQI7L\/Prototype?node-id=6%3A52&amp;scaling=scale-down&amp;page-id=0%3A1\">https:\/\/www.figma.com\/proto\/2ajRymIg7sGKAu2kDzQI7L\/Prototype?node-id=6%3A52&amp;scaling=scale-down&amp;page-id=0%3A1<\/a><\/p>\n\n\n\n<h3 class=\"wp-block-heading\">The prototyping process<\/h3>\n\n\n\n<p>For our prototype we worked with Figma. As we had already agreed on the functions we wanted to provide, we didn\u2019t have to discuss them during the prototyping process and could simply concentrate on creating the pages.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Relation to our use cases<\/h3>\n\n\n\n<p>The use case our prototype relates to is the process of when the user wants to go sleep.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Storyboard reflection<\/h3>\n\n\n\n<p>For our prototype we followed the first part of our storyboard where the user is preparing to go to sleep.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Self-assessment<\/h3>\n\n\n\n<ul class=\"wp-block-list\"><li><em>We were happy with the fact that we used the system-internal back-button, so that we didn\u2019t have to build an extra back button into the design.<\/em><\/li><li><em>Our colour selection was spontaneous, we believe this could be improved in the future.<\/em><\/li><li><em>We weren\u2019t absolutely sure if the icons for the buttons and functions are unique &#8211; some might not fit so well or be difficult to understand.<\/em><\/li><\/ul>\n\n\n\n<h2 class=\"wp-block-heading\">Design rationales<\/h2>\n\n\n\n<h3 class=\"wp-block-heading\">Design Rationale 1: Categorisation of relaxation methods and sleeping sounds<\/h3>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"775\" src=\"https:\/\/blogs.fu-berlin.de\/hci1-sose2021\/files\/2021\/05\/Screenshot-2021-05-21-at-18.57.56-2-1024x775.png\" alt=\"\" class=\"wp-image-1259\" srcset=\"https:\/\/blogs.fu-berlin.de\/hci1-sose2021\/files\/2021\/05\/Screenshot-2021-05-21-at-18.57.56-2-1024x775.png 1024w, https:\/\/blogs.fu-berlin.de\/hci1-sose2021\/files\/2021\/05\/Screenshot-2021-05-21-at-18.57.56-2-300x227.png 300w, https:\/\/blogs.fu-berlin.de\/hci1-sose2021\/files\/2021\/05\/Screenshot-2021-05-21-at-18.57.56-2-768x581.png 768w, https:\/\/blogs.fu-berlin.de\/hci1-sose2021\/files\/2021\/05\/Screenshot-2021-05-21-at-18.57.56-2-1536x1162.png 1536w, https:\/\/blogs.fu-berlin.de\/hci1-sose2021\/files\/2021\/05\/Screenshot-2021-05-21-at-18.57.56-2-1200x908.png 1200w, https:\/\/blogs.fu-berlin.de\/hci1-sose2021\/files\/2021\/05\/Screenshot-2021-05-21-at-18.57.56-2.png 1560w\" sizes=\"auto, (max-width: 709px) 85vw, (max-width: 909px) 67vw, (max-width: 1362px) 62vw, 840px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\">Design Rationale 2: Sorting the two functions when combined in one category<\/h3>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"921\" src=\"https:\/\/blogs.fu-berlin.de\/hci1-sose2021\/files\/2021\/05\/Screenshot-2021-05-21-at-18.58.10-2-1024x921.png\" alt=\"\" class=\"wp-image-1260\" srcset=\"https:\/\/blogs.fu-berlin.de\/hci1-sose2021\/files\/2021\/05\/Screenshot-2021-05-21-at-18.58.10-2-1024x921.png 1024w, https:\/\/blogs.fu-berlin.de\/hci1-sose2021\/files\/2021\/05\/Screenshot-2021-05-21-at-18.58.10-2-300x270.png 300w, https:\/\/blogs.fu-berlin.de\/hci1-sose2021\/files\/2021\/05\/Screenshot-2021-05-21-at-18.58.10-2-768x691.png 768w, https:\/\/blogs.fu-berlin.de\/hci1-sose2021\/files\/2021\/05\/Screenshot-2021-05-21-at-18.58.10-2-1200x1080.png 1200w, https:\/\/blogs.fu-berlin.de\/hci1-sose2021\/files\/2021\/05\/Screenshot-2021-05-21-at-18.58.10-2.png 1438w\" sizes=\"auto, (max-width: 709px) 85vw, (max-width: 909px) 67vw, (max-width: 1362px) 62vw, 840px\" \/><\/figure>\n\n\n\n<p><em>Our design rationales were created using the process-oriented gIBIS technique.<\/em><\/p>\n\n\n\n<!--nextpage-->\n\n\n\n<h2 class=\"wp-block-heading\">Reflection<\/h2>\n\n\n\n<h3 class=\"wp-block-heading\">Who did what?<\/h3>\n\n\n\n<p>Yasemin created the blog post. We worked together using Figma for the prototype and Google Slides for the design rationales.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">What have we learned?<\/h3>\n\n\n\n<p>We learnt more about the software Figma, as some of us were not familiar with the particular software. <\/p>\n\n\n\n<p>We also found out about some points worth discussing in our design and prototype plans while creating the design rationales, thanks to the questions we came up with. We&#8217;re interested in solving these points in the best way possible.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">What went well?<\/h3>\n\n\n\n<p>We worked in sync while creating the prototype pages and as always, working together was a pleasure.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">What do we want to improve?<\/h3>\n\n\n\n<p>In future prototyping sessions we would like to improve the user experience of our design so that the button icons reflect their functions in the best way possible and maybe also improve the colour scheme.<\/p>\n\n\n\n<p>Overall, we are still happy with our results.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Feedback summary Night mode: No notifications or messages, mute certain calls -&gt; No distractions on the mobile phone (not in the prototype) Dream diary with voice recording (not in the prototype) Notifications to remind you about entering data, even if you haven&#8217;t tracked anything for a week (not in the prototype) Perceived dialogue where the &hellip; <a href=\"https:\/\/blogs.fu-berlin.de\/hci1-sose2021\/2021\/05\/21\/sleepy-heads-first-interactive-low-fidelity-prototype\/\" class=\"more-link\"><span class=\"screen-reader-text\">\u201e[A#5, P5] Sleepy Heads &#8211; First interactive low-fidelity prototype\u201c<\/span> weiterlesen<\/a><\/p>\n","protected":false},"author":6245,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_bbp_topic_count":0,"_bbp_reply_count":0,"_bbp_total_topic_count":0,"_bbp_total_reply_count":0,"_bbp_voice_count":0,"_bbp_anonymous_reply_count":0,"_bbp_topic_count_hidden":0,"_bbp_reply_count_hidden":0,"_bbp_forum_subforum_count":0,"footnotes":""},"categories":[383756,384908,400468],"tags":[],"class_list":["post-1253","post","type-post","status-publish","format-standard","hentry","category-projekt-5","category-blogbeitraege","category-assignment-5"],"_links":{"self":[{"href":"https:\/\/blogs.fu-berlin.de\/hci1-sose2021\/wp-json\/wp\/v2\/posts\/1253","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/blogs.fu-berlin.de\/hci1-sose2021\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blogs.fu-berlin.de\/hci1-sose2021\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blogs.fu-berlin.de\/hci1-sose2021\/wp-json\/wp\/v2\/users\/6245"}],"replies":[{"embeddable":true,"href":"https:\/\/blogs.fu-berlin.de\/hci1-sose2021\/wp-json\/wp\/v2\/comments?post=1253"}],"version-history":[{"count":5,"href":"https:\/\/blogs.fu-berlin.de\/hci1-sose2021\/wp-json\/wp\/v2\/posts\/1253\/revisions"}],"predecessor-version":[{"id":1297,"href":"https:\/\/blogs.fu-berlin.de\/hci1-sose2021\/wp-json\/wp\/v2\/posts\/1253\/revisions\/1297"}],"wp:attachment":[{"href":"https:\/\/blogs.fu-berlin.de\/hci1-sose2021\/wp-json\/wp\/v2\/media?parent=1253"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blogs.fu-berlin.de\/hci1-sose2021\/wp-json\/wp\/v2\/categories?post=1253"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blogs.fu-berlin.de\/hci1-sose2021\/wp-json\/wp\/v2\/tags?post=1253"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}