{"id":196,"date":"2024-12-03T15:03:18","date_gmt":"2024-12-03T15:03:18","guid":{"rendered":"https:\/\/sites.wsagames.com\/fr1n24\/?p=196"},"modified":"2025-01-09T13:15:57","modified_gmt":"2025-01-09T13:15:57","slug":"week-9-ui-concept-finalisation","status":"publish","type":"post","link":"https:\/\/sites.wsagames.com\/fr1n24\/2024\/12\/03\/week-9-ui-concept-finalisation\/","title":{"rendered":"Week 9 &#8211; UI concept finalisation"},"content":{"rendered":"\n<p class=\"wp-block-paragraph\">This week I have focused on making my UI concept more lifelike. I have started with a very rudimentary sketch that needed some colours and more in-depth explanantions.<\/p>\n\n\n\n<div data-wp-interactive=\"core\/file\" class=\"wp-block-file\"><object data-wp-bind--hidden=\"!state.hasPdfPreview\" hidden class=\"wp-block-file__embed\" data=\"https:\/\/sites.wsagames.com\/fr1n24\/wp-content\/uploads\/sites\/31\/2024\/11\/gamescreen_14112024_152017-1.pdf\" type=\"application\/pdf\" style=\"width:100%;height:600px\" aria-label=\"Embed of gamescreen_14112024_152017.\"><\/object><a id=\"wp-block-file--media-7d5ffbf2-4b47-4647-b7ee-0e22decb9280\" href=\"https:\/\/sites.wsagames.com\/fr1n24\/wp-content\/uploads\/sites\/31\/2024\/11\/gamescreen_14112024_152017-1.pdf\">gamescreen_14112024_152017<\/a><a href=\"https:\/\/sites.wsagames.com\/fr1n24\/wp-content\/uploads\/sites\/31\/2024\/11\/gamescreen_14112024_152017-1.pdf\" class=\"wp-block-file__button wp-element-button\" download aria-describedby=\"wp-block-file--media-7d5ffbf2-4b47-4647-b7ee-0e22decb9280\">Download<\/a><\/div>\n\n\n\n<p class=\"wp-block-paragraph\">In my game the UI is the most vital element. As a management game it should rely on the numbers, statuses and visual clarity of available assets.<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full is-resized\"><img fetchpriority=\"high\" decoding=\"async\" width=\"612\" height=\"408\" src=\"https:\/\/sites.wsagames.com\/fr1n24\/wp-content\/uploads\/sites\/31\/2024\/11\/image-11.png\" alt=\"\" class=\"wp-image-212\" style=\"width:669px;height:auto\" srcset=\"https:\/\/sites.wsagames.com\/fr1n24\/wp-content\/uploads\/sites\/31\/2024\/11\/image-11.png 612w, https:\/\/sites.wsagames.com\/fr1n24\/wp-content\/uploads\/sites\/31\/2024\/11\/image-11-300x200.png 300w\" sizes=\"(max-width: 612px) 100vw, 612px\" \/><\/figure>\n<\/div>\n\n\n<figure class=\"wp-block-image size-full is-resized\"><img decoding=\"async\" width=\"590\" height=\"453\" src=\"https:\/\/sites.wsagames.com\/fr1n24\/wp-content\/uploads\/sites\/31\/2024\/11\/image-12.png\" alt=\"\" class=\"wp-image-213\" style=\"width:581px;height:auto\" srcset=\"https:\/\/sites.wsagames.com\/fr1n24\/wp-content\/uploads\/sites\/31\/2024\/11\/image-12.png 590w, https:\/\/sites.wsagames.com\/fr1n24\/wp-content\/uploads\/sites\/31\/2024\/11\/image-12-300x230.png 300w\" sizes=\"(max-width: 590px) 100vw, 590px\" \/><\/figure>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"alignright size-full is-resized\"><img decoding=\"async\" width=\"735\" height=\"481\" src=\"https:\/\/sites.wsagames.com\/fr1n24\/wp-content\/uploads\/sites\/31\/2024\/12\/image.png\" alt=\"\" class=\"wp-image-214\" style=\"width:509px;height:auto\" srcset=\"https:\/\/sites.wsagames.com\/fr1n24\/wp-content\/uploads\/sites\/31\/2024\/12\/image.png 735w, https:\/\/sites.wsagames.com\/fr1n24\/wp-content\/uploads\/sites\/31\/2024\/12\/image-300x196.png 300w, https:\/\/sites.wsagames.com\/fr1n24\/wp-content\/uploads\/sites\/31\/2024\/12\/image-350x230.png 350w\" sizes=\"(max-width: 735px) 100vw, 735px\" \/><\/figure>\n<\/div>\n\n\n<p class=\"wp-block-paragraph\">The blueprints serve as a memory of grand designs, the leftover pieces from the old launch pad designs that litter the workspace but can also be used as a new blueprints, to design the future for the survivors. <\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Blueprints make me think about planning, future, design work and that is what the player should be thinking about while making choices &#8211; everything will be a building block for the future of survival.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"alignleft size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" width=\"538\" height=\"717\" src=\"https:\/\/sites.wsagames.com\/fr1n24\/wp-content\/uploads\/sites\/31\/2024\/12\/image-1.png\" alt=\"\" class=\"wp-image-215\" style=\"width:299px;height:auto\" srcset=\"https:\/\/sites.wsagames.com\/fr1n24\/wp-content\/uploads\/sites\/31\/2024\/12\/image-1.png 538w, https:\/\/sites.wsagames.com\/fr1n24\/wp-content\/uploads\/sites\/31\/2024\/12\/image-1-225x300.png 225w, https:\/\/sites.wsagames.com\/fr1n24\/wp-content\/uploads\/sites\/31\/2024\/12\/image-1-300x400.png 300w\" sizes=\"(max-width: 538px) 100vw, 538px\" \/><\/figure>\n<\/div>\n\n<div class=\"wp-block-image\">\n<figure class=\"alignright size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" width=\"736\" height=\"920\" src=\"https:\/\/sites.wsagames.com\/fr1n24\/wp-content\/uploads\/sites\/31\/2024\/12\/image-2.png\" alt=\"\" class=\"wp-image-216\" style=\"width:448px;height:auto\" srcset=\"https:\/\/sites.wsagames.com\/fr1n24\/wp-content\/uploads\/sites\/31\/2024\/12\/image-2.png 736w, https:\/\/sites.wsagames.com\/fr1n24\/wp-content\/uploads\/sites\/31\/2024\/12\/image-2-240x300.png 240w, https:\/\/sites.wsagames.com\/fr1n24\/wp-content\/uploads\/sites\/31\/2024\/12\/image-2-300x375.png 300w\" sizes=\"(max-width: 736px) 100vw, 736px\" \/><\/figure>\n<\/div>\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">The satelite computers are the inspiration behind how I invision the UI and how I approach creating the experience. Limited space, big frames and nonexistant graphics is what I strive for in the design, maximum use of space and resources.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"alignleft size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" width=\"469\" height=\"600\" src=\"https:\/\/sites.wsagames.com\/fr1n24\/wp-content\/uploads\/sites\/31\/2024\/12\/image-3.png\" alt=\"\" class=\"wp-image-217\" style=\"width:271px;height:auto\" srcset=\"https:\/\/sites.wsagames.com\/fr1n24\/wp-content\/uploads\/sites\/31\/2024\/12\/image-3.png 469w, https:\/\/sites.wsagames.com\/fr1n24\/wp-content\/uploads\/sites\/31\/2024\/12\/image-3-235x300.png 235w, https:\/\/sites.wsagames.com\/fr1n24\/wp-content\/uploads\/sites\/31\/2024\/12\/image-3-300x384.png 300w\" sizes=\"(max-width: 469px) 100vw, 469px\" \/><\/figure>\n<\/div>\n\n\n<p class=\"wp-block-paragraph\">The graph paper symbolises the engineering process, innovation and economical side of the ideation proccess and it serves me as a place to store numerical data.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">There is an important thing to keep in mind. While UI and text boxes can be scaled, they cannot be scaled indefinetly. As I am trying to make a text and narrative heavy game it cannot be contained on a small screen &#8211; such as phone or portable consoles. TI have found three key things that need to be considered when debating the UI and the screen:<br>&#8211; text based games as focused on text and pondering the text, game that needs a constant game space that allow for longer reading, understanding derives from calm and quiet enviroment;<br>&#8211; text based games as text focused interface &#8211; clear fast reading, bigger screen, legibility and the spacing allowing for faster looking through and finding the key information;<br>&#8211; text based games as rpgs that combine detailed graphics and detaild encounters (combination of information and graphical information too compex fo small screens), to make good decisions you need to make informed decisions &#8211; at one glance you should see the most important statuses of your game, resources, background information and you should easily find any other detailed information from that screen. <br>In my game I want to use two screen solutions &#8211; status screen and the decision screen. The first one is to survey the details of active storylines, the decisions we have made regarding the week and to se the resources and the family members. The other screen is strictly to make narrative decisions and it pops up, covering only a part of the status screen &#8211; family members and the resurces counters should still be visible. The decision screen gives us all the information about the choice, narrative and presumable outcomes and the unobscured elements of the status screen should give us the basic background information &#8211; family members&#8217; opinions and the resources available.<\/p>\n\n\n\n<div data-wp-interactive=\"core\/file\" class=\"wp-block-file\"><object data-wp-bind--hidden=\"!state.hasPdfPreview\" hidden class=\"wp-block-file__embed\" data=\"https:\/\/sites.wsagames.com\/fr1n24\/wp-content\/uploads\/sites\/31\/2024\/12\/Untitled_04122024_141911.pdf\" type=\"application\/pdf\" style=\"width:100%;height:600px\" aria-label=\"Embed of Untitled_04122024_141911.\"><\/object><a id=\"wp-block-file--media-92021d08-f853-4642-8a1b-6d27997b2e40\" href=\"https:\/\/sites.wsagames.com\/fr1n24\/wp-content\/uploads\/sites\/31\/2024\/12\/Untitled_04122024_141911.pdf\">Untitled_04122024_141911<\/a><a href=\"https:\/\/sites.wsagames.com\/fr1n24\/wp-content\/uploads\/sites\/31\/2024\/12\/Untitled_04122024_141911.pdf\" class=\"wp-block-file__button wp-element-button\" download aria-describedby=\"wp-block-file--media-92021d08-f853-4642-8a1b-6d27997b2e40\">Download<\/a><\/div>\n\n\n\n<div data-wp-interactive=\"core\/file\" class=\"wp-block-file\"><object data-wp-bind--hidden=\"!state.hasPdfPreview\" hidden class=\"wp-block-file__embed\" data=\"https:\/\/sites.wsagames.com\/fr1n24\/wp-content\/uploads\/sites\/31\/2024\/12\/smallscreen_04122024_141936.pdf\" type=\"application\/pdf\" style=\"width:100%;height:600px\" aria-label=\"Embed of smallscreen_04122024_141936.\"><\/object><a id=\"wp-block-file--media-070895d2-790f-4eb5-9d3a-b79b6f5daebc\" href=\"https:\/\/sites.wsagames.com\/fr1n24\/wp-content\/uploads\/sites\/31\/2024\/12\/smallscreen_04122024_141936.pdf\">smallscreen_04122024_141936<\/a><a href=\"https:\/\/sites.wsagames.com\/fr1n24\/wp-content\/uploads\/sites\/31\/2024\/12\/smallscreen_04122024_141936.pdf\" class=\"wp-block-file__button wp-element-button\" download aria-describedby=\"wp-block-file--media-070895d2-790f-4eb5-9d3a-b79b6f5daebc\">Download<\/a><\/div>\n\n\n\n<div data-wp-interactive=\"core\/file\" class=\"wp-block-file\"><object data-wp-bind--hidden=\"!state.hasPdfPreview\" hidden class=\"wp-block-file__embed\" data=\"https:\/\/sites.wsagames.com\/fr1n24\/wp-content\/uploads\/sites\/31\/2024\/12\/bothscreens_04122024_142014.pdf\" type=\"application\/pdf\" style=\"width:100%;height:600px\" aria-label=\"Embed of bothscreens_04122024_142014.\"><\/object><a id=\"wp-block-file--media-878dadc6-e787-4ca1-834b-9dc6245c0c07\" href=\"https:\/\/sites.wsagames.com\/fr1n24\/wp-content\/uploads\/sites\/31\/2024\/12\/bothscreens_04122024_142014.pdf\">bothscreens_04122024_142014<\/a><a href=\"https:\/\/sites.wsagames.com\/fr1n24\/wp-content\/uploads\/sites\/31\/2024\/12\/bothscreens_04122024_142014.pdf\" class=\"wp-block-file__button wp-element-button\" download aria-describedby=\"wp-block-file--media-878dadc6-e787-4ca1-834b-9dc6245c0c07\">Download<\/a><\/div>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"756\" src=\"https:\/\/sites.wsagames.com\/fr1n24\/wp-content\/uploads\/sites\/31\/2024\/12\/image-12-1024x756.png\" alt=\"\" class=\"wp-image-264\" srcset=\"https:\/\/sites.wsagames.com\/fr1n24\/wp-content\/uploads\/sites\/31\/2024\/12\/image-12-1024x756.png 1024w, https:\/\/sites.wsagames.com\/fr1n24\/wp-content\/uploads\/sites\/31\/2024\/12\/image-12-300x222.png 300w, https:\/\/sites.wsagames.com\/fr1n24\/wp-content\/uploads\/sites\/31\/2024\/12\/image-12-768x567.png 768w, https:\/\/sites.wsagames.com\/fr1n24\/wp-content\/uploads\/sites\/31\/2024\/12\/image-12-850x628.png 850w, https:\/\/sites.wsagames.com\/fr1n24\/wp-content\/uploads\/sites\/31\/2024\/12\/image-12.png 1060w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">The choice screen: <\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"721\" src=\"https:\/\/sites.wsagames.com\/fr1n24\/wp-content\/uploads\/sites\/31\/2024\/12\/image-14-1024x721.png\" alt=\"\" class=\"wp-image-266\" srcset=\"https:\/\/sites.wsagames.com\/fr1n24\/wp-content\/uploads\/sites\/31\/2024\/12\/image-14-1024x721.png 1024w, https:\/\/sites.wsagames.com\/fr1n24\/wp-content\/uploads\/sites\/31\/2024\/12\/image-14-300x211.png 300w, https:\/\/sites.wsagames.com\/fr1n24\/wp-content\/uploads\/sites\/31\/2024\/12\/image-14-768x541.png 768w, https:\/\/sites.wsagames.com\/fr1n24\/wp-content\/uploads\/sites\/31\/2024\/12\/image-14-850x598.png 850w, https:\/\/sites.wsagames.com\/fr1n24\/wp-content\/uploads\/sites\/31\/2024\/12\/image-14.png 1291w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">The assignment screen:<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"725\" src=\"https:\/\/sites.wsagames.com\/fr1n24\/wp-content\/uploads\/sites\/31\/2024\/12\/image-13-1024x725.png\" alt=\"\" class=\"wp-image-265\" srcset=\"https:\/\/sites.wsagames.com\/fr1n24\/wp-content\/uploads\/sites\/31\/2024\/12\/image-13-1024x725.png 1024w, https:\/\/sites.wsagames.com\/fr1n24\/wp-content\/uploads\/sites\/31\/2024\/12\/image-13-300x212.png 300w, https:\/\/sites.wsagames.com\/fr1n24\/wp-content\/uploads\/sites\/31\/2024\/12\/image-13-768x544.png 768w, https:\/\/sites.wsagames.com\/fr1n24\/wp-content\/uploads\/sites\/31\/2024\/12\/image-13-850x602.png 850w, https:\/\/sites.wsagames.com\/fr1n24\/wp-content\/uploads\/sites\/31\/2024\/12\/image-13.png 1288w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n","protected":false},"excerpt":{"rendered":"<p>This week I have focused on making my UI concept more lifelike. I have started with a very rudimentary sketch that needed some colours and more in-depth explanantions. In my game the UI is the most vital element. As a management game it should rely on the numbers, statuses and visual clarity of available assets&#8230;.<\/p>\n","protected":false},"author":35,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[5,15],"tags":[],"class_list":["post-196","post","type-post","status-publish","format-standard","hentry","category-design-journal","category-research"],"_links":{"self":[{"href":"https:\/\/sites.wsagames.com\/fr1n24\/wp-json\/wp\/v2\/posts\/196","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/sites.wsagames.com\/fr1n24\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/sites.wsagames.com\/fr1n24\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/sites.wsagames.com\/fr1n24\/wp-json\/wp\/v2\/users\/35"}],"replies":[{"embeddable":true,"href":"https:\/\/sites.wsagames.com\/fr1n24\/wp-json\/wp\/v2\/comments?post=196"}],"version-history":[{"count":17,"href":"https:\/\/sites.wsagames.com\/fr1n24\/wp-json\/wp\/v2\/posts\/196\/revisions"}],"predecessor-version":[{"id":476,"href":"https:\/\/sites.wsagames.com\/fr1n24\/wp-json\/wp\/v2\/posts\/196\/revisions\/476"}],"wp:attachment":[{"href":"https:\/\/sites.wsagames.com\/fr1n24\/wp-json\/wp\/v2\/media?parent=196"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/sites.wsagames.com\/fr1n24\/wp-json\/wp\/v2\/categories?post=196"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/sites.wsagames.com\/fr1n24\/wp-json\/wp\/v2\/tags?post=196"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}