{"id":1576,"date":"2020-04-13T19:17:56","date_gmt":"2020-04-13T18:17:56","guid":{"rendered":"https:\/\/blogs.ncl.ac.uk\/digicivics-at-apl\/?p=1576"},"modified":"2020-04-13T19:20:23","modified_gmt":"2020-04-13T18:20:23","slug":"digital-civics-2020-blog-entry-8","status":"publish","type":"post","link":"https:\/\/blogs.ncl.ac.uk\/digicivics-at-apl\/2020\/04\/13\/digital-civics-2020-blog-entry-8\/","title":{"rendered":"Digital Civics 2020 Blog Entry 8"},"content":{"rendered":"\n<p>Having established a map for our application in the week before, this week we were introduced to prototyping and conducted an in-session practice of our chosen tool. Due to the circumstances related to the ongoing pandemic of Covid-19, this session was carried out via a remote video conference.<\/p>\n\n\n\n<p>Before creating a successful prototype for our\napplication, it is of essential importance to be familiar with the purpose of a\nprototype and what it means to the application to be prototyped. A prototype,\nin general,<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>Presents the target stakeholders\na sample of the final product<\/li><li>Allows the stakeholder to\nfamiliarise themselves with the product<\/li><li>Can be used to check for\nany significant issues that need to be taken care of for further development.<\/li><\/ul>\n\n\n\n<p>The term \u2018prototype\u2019 itself is ambiguous and broadly\ndefined given the wide range of different products that need to be prototyped \u2013\nthere can be interactive prototypes as well as static ones. In our case, the\nprototype will need to be interactive, as our product is a mobile application which\nis designed to be heavily interacted with by the intended clients. An\ninteractive prototype will allow the user to<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>Directly interact with the\napplication and discover its functions<\/li><li>Determine the quality of\nimplemented functions and suitability to the end user.<\/li><\/ul>\n\n\n\n<p>During the session, we were presented various methods\nof prototyping, as well as a range of different tools that can used for it,\neach with their advantages and shortcomings. When choosing an appropriate tool\nfor creating our prototype, several essential factors need to be considered,\nincluding the points regarding an interactive prototype above:<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li><strong>Fidelity<\/strong> \u2013 this determines the proximity\nof a prototype to the final product; high fidelity means greater proximity to\nthe final product in terms of appearance and functionality<\/li><li><strong>Functionality<\/strong> \u2013 what functions does the\ntool offer and can those be used to achieve the intended working of the\napplication<\/li><li><strong>Flexibility<\/strong> \u2013 the range of the tool\u2019s\nusability, e.g. whether the tools requires certain systems or specific software\nto be working<\/li><\/ul>\n\n\n\n<p>Based on these, we have decided to use a web-based\nprogram called \u2018Figma\u2019. It neither requires to be run on a certain operating\nsystem nor a specific program to be installed except for a browser, thus\nallowing to be run by a wide range of users. \u2018Figma\u2019 comes with numerous design\ntools that allow the creation of customisable visual assets, as well as a\nprototype function enabling to draw interactive connections between elements\nwhich can be tested using the presentation mode of the program. These make \u2018Figma\u2019\na high-fidelity prototyping program that can be used to test designs for mobile\napplications, and it also provides various aspect ratios, e.g. that of various mobile\nphones, tablet computers, to test the prototype on.<\/p>\n\n\n\n<p>Furthermore, \u2018Figma\u2019 allows a prototype design to be\nshared with others using invitations per E-Mail for anyone to view, edit, or\ninteract. <\/p>\n\n\n\n<p>There are a few steps remaining for us to complete the\nprototype of our application, which are<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>Finalising the storyboard\nof our app, including the creation of a persona<\/li><li>Decide upon which aspects\nof our design we want to prototype \u2013 consider the main objectives of our\napplication while also considering the stakeholders that will use it<\/li><li>Refine the prototype design\nbased on the focus aspects \u2013 flesh out navigational structure and user\ninterface design.<\/li><\/ul>\n\n\n\n<p><strong>Bibliography<\/strong><\/p>\n\n\n\n<p>Houde, S., Hill, C. (1997) <em>What do Prototypes Prototype?<\/em> In M. Helander, T.K. Landauer, and P. Prabhu, Handbook of Human-Computer Interaction 2<sup>nd<\/sup> Edition (1-16). Available from: <a href=\"https:\/\/hci.stanford.edu\/courses\/cs247\/2012\/readings\/WhatDoPrototypesPrototype.pdf\">https:\/\/hci.stanford.edu\/courses\/cs247\/2012\/readings\/WhatDoPrototypesPrototype.pdf<\/a>  [Accessed 10th April 2020]<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Having established a map for our application in the week before, this week we were introduced to prototyping and conducted an in-session practice of our chosen tool. Due to the circumstances related to the ongoing pandemic of Covid-19, this session was carried out via a remote video conference. Before creating a successful prototype for our &hellip; <a href=\"https:\/\/blogs.ncl.ac.uk\/digicivics-at-apl\/2020\/04\/13\/digital-civics-2020-blog-entry-8\/\" class=\"more-link\">Continue reading <span class=\"screen-reader-text\">Digital Civics 2020 Blog Entry 8<\/span><\/a><\/p>\n","protected":false},"author":8721,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[51,52,50,53],"class_list":["post-1576","post","type-post","status-publish","format-standard","hentry","category-uncategorised","tag-figma","tag-interactive-prototype","tag-prototype","tag-prototyping-tools"],"_links":{"self":[{"href":"https:\/\/blogs.ncl.ac.uk\/digicivics-at-apl\/wp-json\/wp\/v2\/posts\/1576","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/blogs.ncl.ac.uk\/digicivics-at-apl\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blogs.ncl.ac.uk\/digicivics-at-apl\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blogs.ncl.ac.uk\/digicivics-at-apl\/wp-json\/wp\/v2\/users\/8721"}],"replies":[{"embeddable":true,"href":"https:\/\/blogs.ncl.ac.uk\/digicivics-at-apl\/wp-json\/wp\/v2\/comments?post=1576"}],"version-history":[{"count":2,"href":"https:\/\/blogs.ncl.ac.uk\/digicivics-at-apl\/wp-json\/wp\/v2\/posts\/1576\/revisions"}],"predecessor-version":[{"id":1578,"href":"https:\/\/blogs.ncl.ac.uk\/digicivics-at-apl\/wp-json\/wp\/v2\/posts\/1576\/revisions\/1578"}],"wp:attachment":[{"href":"https:\/\/blogs.ncl.ac.uk\/digicivics-at-apl\/wp-json\/wp\/v2\/media?parent=1576"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blogs.ncl.ac.uk\/digicivics-at-apl\/wp-json\/wp\/v2\/categories?post=1576"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blogs.ncl.ac.uk\/digicivics-at-apl\/wp-json\/wp\/v2\/tags?post=1576"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}