{"id":597,"date":"2026-02-12T15:59:51","date_gmt":"2026-02-12T15:59:51","guid":{"rendered":"https:\/\/clark2025.hulldesign.co.uk\/?p=597"},"modified":"2026-05-02T13:34:32","modified_gmt":"2026-05-02T13:34:32","slug":"post-three-high-fidelity-mobile-prototype","status":"publish","type":"post","link":"https:\/\/clark2025.hulldesign.co.uk\/?p=597","title":{"rendered":"Post Three : High-Fidelity Mobile Prototype"},"content":{"rendered":"\n<p>For My Final designs I wanted to have pages that fit well together in colour scheme and all felt like they were meant to be there and they were needed I tried to do this by having them functional and ready for the way the customer  would be using them. <\/p>\n\n\n\n<div style=\"height:100px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<div class=\"wp-block-group alignfull is-content-justification-center is-nowrap is-layout-flex wp-container-core-group-is-layout-23441af8 wp-block-group-is-layout-flex\">\n<iframe loading=\"lazy\" style=\"border: 1px solid rgba(0, 0, 0, 0.1);\" width=\"800\" height=\"450\" src=\"https:\/\/embed.figma.com\/proto\/0ZMfm17rvoYyOxrdPZBNZV\/Prototyping-uI-7-pages?node-id=92-827&#038;viewport=156%2C-1070%2C0.38&#038;scaling=scale-down&#038;content-scaling=fixed&#038;starting-point-node-id=92%3A827&#038;show-proto-sidebar=1&#038;page-id=1%3A5&#038;embed-host=share\" allowfullscreen><\/iframe>\n<\/div>\n\n\n\n<div style=\"height:100px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<p><strong><span style=\"text-decoration: underline;\"><em>Home Page<\/em><\/span><\/strong><\/p>\n\n\n\n<figure class=\"wp-block-gallery has-nested-images columns-default is-cropped wp-block-gallery-1 is-layout-flex wp-block-gallery-is-layout-flex\">\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"365\" height=\"786\" data-id=\"733\" src=\"https:\/\/clark2025.hulldesign.co.uk\/wp-content\/uploads\/2026\/02\/image-19.png\" alt=\"\" class=\"wp-image-733\" srcset=\"https:\/\/clark2025.hulldesign.co.uk\/wp-content\/uploads\/2026\/02\/image-19.png 365w, https:\/\/clark2025.hulldesign.co.uk\/wp-content\/uploads\/2026\/02\/image-19-139x300.png 139w\" sizes=\"auto, (max-width: 365px) 100vw, 365px\" \/><\/figure>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"494\" height=\"1024\" data-id=\"780\" src=\"https:\/\/clark2025.hulldesign.co.uk\/wp-content\/uploads\/2026\/02\/image-23-494x1024.png\" alt=\"\" class=\"wp-image-780\" srcset=\"https:\/\/clark2025.hulldesign.co.uk\/wp-content\/uploads\/2026\/02\/image-23-494x1024.png 494w, https:\/\/clark2025.hulldesign.co.uk\/wp-content\/uploads\/2026\/02\/image-23-145x300.png 145w, https:\/\/clark2025.hulldesign.co.uk\/wp-content\/uploads\/2026\/02\/image-23-768x1591.png 768w, https:\/\/clark2025.hulldesign.co.uk\/wp-content\/uploads\/2026\/02\/image-23-741x1536.png 741w, https:\/\/clark2025.hulldesign.co.uk\/wp-content\/uploads\/2026\/02\/image-23.png 780w\" sizes=\"auto, (max-width: 494px) 100vw, 494px\" \/><\/figure>\n<\/figure>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"714\" src=\"https:\/\/clark2025.hulldesign.co.uk\/wp-content\/uploads\/2026\/02\/image-24-1024x714.png\" alt=\"\" class=\"wp-image-781\" srcset=\"https:\/\/clark2025.hulldesign.co.uk\/wp-content\/uploads\/2026\/02\/image-24-1024x714.png 1024w, https:\/\/clark2025.hulldesign.co.uk\/wp-content\/uploads\/2026\/02\/image-24-300x209.png 300w, https:\/\/clark2025.hulldesign.co.uk\/wp-content\/uploads\/2026\/02\/image-24-768x536.png 768w, https:\/\/clark2025.hulldesign.co.uk\/wp-content\/uploads\/2026\/02\/image-24-1536x1071.png 1536w, https:\/\/clark2025.hulldesign.co.uk\/wp-content\/uploads\/2026\/02\/image-24.png 1870w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n<\/div>\n\n\n<div class=\"wp-block-group alignwide is-content-justification-center is-nowrap is-layout-flex wp-container-core-group-is-layout-23441af8 wp-block-group-is-layout-flex\">\n<p>For my home page, the page is laid out in a bento box style, hovering over the different boxes in the bento gives them a hover state where the box darkens and the text moves to the center. The page also features a search bar that takes you to the page related to your search. The artist results also have their own unique pages listing some of their albums and songs . The page features a hamburger menu and a profile button, which with further development would open to a settings page and a profile page.<\/p>\n<\/div>\n\n\n\n<p><strong><span style=\"text-decoration: underline;\"><em>Tickest page <\/em><\/span><\/strong><\/p>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-28f84493 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:100%\"><\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-group is-nowrap is-layout-flex wp-container-core-group-is-layout-6c531013 wp-block-group-is-layout-flex\">\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"474\" height=\"1024\" src=\"https:\/\/clark2025.hulldesign.co.uk\/wp-content\/uploads\/2026\/02\/image-13-474x1024.png\" alt=\"\" class=\"wp-image-724\" srcset=\"https:\/\/clark2025.hulldesign.co.uk\/wp-content\/uploads\/2026\/02\/image-13-474x1024.png 474w, https:\/\/clark2025.hulldesign.co.uk\/wp-content\/uploads\/2026\/02\/image-13-139x300.png 139w, https:\/\/clark2025.hulldesign.co.uk\/wp-content\/uploads\/2026\/02\/image-13.png 568w\" sizes=\"auto, (max-width: 474px) 100vw, 474px\" \/><\/figure>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"484\" height=\"1024\" src=\"https:\/\/clark2025.hulldesign.co.uk\/wp-content\/uploads\/2026\/02\/image-9-484x1024.png\" alt=\"\" class=\"wp-image-720\" srcset=\"https:\/\/clark2025.hulldesign.co.uk\/wp-content\/uploads\/2026\/02\/image-9-484x1024.png 484w, https:\/\/clark2025.hulldesign.co.uk\/wp-content\/uploads\/2026\/02\/image-9-142x300.png 142w, https:\/\/clark2025.hulldesign.co.uk\/wp-content\/uploads\/2026\/02\/image-9.png 648w\" sizes=\"auto, (max-width: 484px) 100vw, 484px\" \/><\/figure>\n<\/div>\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"479\" height=\"1024\" src=\"https:\/\/clark2025.hulldesign.co.uk\/wp-content\/uploads\/2026\/02\/image-12-479x1024.png\" alt=\"\" class=\"wp-image-723\" srcset=\"https:\/\/clark2025.hulldesign.co.uk\/wp-content\/uploads\/2026\/02\/image-12-479x1024.png 479w, https:\/\/clark2025.hulldesign.co.uk\/wp-content\/uploads\/2026\/02\/image-12-140x300.png 140w, https:\/\/clark2025.hulldesign.co.uk\/wp-content\/uploads\/2026\/02\/image-12.png 578w\" sizes=\"auto, (max-width: 479px) 100vw, 479px\" \/><\/figure>\n<\/div>\n\n\n\n<p>When making this page, I wanted to include a couple of features, including filtration and a way to like and see which tickets have been purchased. This led me to make different pages for the section so a person could keep their flow while having something to come back to on the page. I wanted the pastel light colour scheme to be visible but not too harsh on this page, so I settled on the minimal colour changes.<\/p>\n\n\n\n<p><strong><span style=\"text-decoration: underline;\"><em>Artist Page<\/em><\/span><\/strong><\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-large is-resized\"><img loading=\"lazy\" decoding=\"async\" width=\"478\" height=\"1024\" src=\"https:\/\/clark2025.hulldesign.co.uk\/wp-content\/uploads\/2026\/02\/image-14-478x1024.png\" alt=\"\" class=\"wp-image-725\" style=\"aspect-ratio:0.46681112094485305;width:177px;height:auto\" srcset=\"https:\/\/clark2025.hulldesign.co.uk\/wp-content\/uploads\/2026\/02\/image-14-478x1024.png 478w, https:\/\/clark2025.hulldesign.co.uk\/wp-content\/uploads\/2026\/02\/image-14-140x300.png 140w, https:\/\/clark2025.hulldesign.co.uk\/wp-content\/uploads\/2026\/02\/image-14.png 578w\" sizes=\"auto, (max-width: 478px) 100vw, 478px\" \/><\/figure>\n<\/div>\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"302\" src=\"https:\/\/clark2025.hulldesign.co.uk\/wp-content\/uploads\/2026\/02\/image-15-1024x302.png\" alt=\"\" class=\"wp-image-726\" srcset=\"https:\/\/clark2025.hulldesign.co.uk\/wp-content\/uploads\/2026\/02\/image-15-1024x302.png 1024w, https:\/\/clark2025.hulldesign.co.uk\/wp-content\/uploads\/2026\/02\/image-15-300x88.png 300w, https:\/\/clark2025.hulldesign.co.uk\/wp-content\/uploads\/2026\/02\/image-15-768x226.png 768w, https:\/\/clark2025.hulldesign.co.uk\/wp-content\/uploads\/2026\/02\/image-15-1536x453.png 1536w, https:\/\/clark2025.hulldesign.co.uk\/wp-content\/uploads\/2026\/02\/image-15-2048x604.png 2048w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n<\/div>\n\n\n<p>This artist page is made for the user to explore through the different artists the main page opens on. James Marriott\u2019s ticket, and then you have the option to slide left to right to see each artist. All the separate tickets include a section with a made-up set list for the performance as well as a like button and a Spotify link going to the main page. Then the albums, when clicked on, take you to the link for that album on Spotify. All pages include a little information about the artist.\u00a0\u00a0<\/p>\n\n\n\n<p><strong><span style=\"text-decoration: underline;\"><em>Calander<\/em><\/span><\/strong><\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"488\" height=\"1024\" src=\"https:\/\/clark2025.hulldesign.co.uk\/wp-content\/uploads\/2026\/02\/image-16-488x1024.png\" alt=\"\" class=\"wp-image-728\" srcset=\"https:\/\/clark2025.hulldesign.co.uk\/wp-content\/uploads\/2026\/02\/image-16-488x1024.png 488w, https:\/\/clark2025.hulldesign.co.uk\/wp-content\/uploads\/2026\/02\/image-16-143x300.png 143w, https:\/\/clark2025.hulldesign.co.uk\/wp-content\/uploads\/2026\/02\/image-16-768x1612.png 768w, https:\/\/clark2025.hulldesign.co.uk\/wp-content\/uploads\/2026\/02\/image-16-732x1536.png 732w, https:\/\/clark2025.hulldesign.co.uk\/wp-content\/uploads\/2026\/02\/image-16.png 810w\" sizes=\"auto, (max-width: 488px) 100vw, 488px\" \/><\/figure>\n<\/div>\n\n\n<p>For my calendar, I wanted the page to have some unique features for the artist demonstration, so I drew custom tickets for each of the artists based on some of their most notable albums. I think this gave the calendar a nice and fun feeling, separating it from the rest of the app in a fun way. The calendar has a heart system with the idea being that a system page would be kept with a list of the people\u2019s favorites to go see them. The page also has a calendar week bar with the intention being that they would be able to go through the different days to see who was playing.\u00a0<\/p>\n\n\n\n<p><strong><span style=\"text-decoration: underline;\"><em>Map<\/em><\/span><\/strong><\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"499\" height=\"1024\" src=\"https:\/\/clark2025.hulldesign.co.uk\/wp-content\/uploads\/2026\/02\/image-17-499x1024.png\" alt=\"\" class=\"wp-image-729\" srcset=\"https:\/\/clark2025.hulldesign.co.uk\/wp-content\/uploads\/2026\/02\/image-17-499x1024.png 499w, https:\/\/clark2025.hulldesign.co.uk\/wp-content\/uploads\/2026\/02\/image-17-146x300.png 146w, https:\/\/clark2025.hulldesign.co.uk\/wp-content\/uploads\/2026\/02\/image-17.png 716w\" sizes=\"auto, (max-width: 499px) 100vw, 499px\" \/><\/figure>\n<\/div>\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"525\" src=\"https:\/\/clark2025.hulldesign.co.uk\/wp-content\/uploads\/2026\/02\/image-18-1024x525.png\" alt=\"\" class=\"wp-image-730\" srcset=\"https:\/\/clark2025.hulldesign.co.uk\/wp-content\/uploads\/2026\/02\/image-18-1024x525.png 1024w, https:\/\/clark2025.hulldesign.co.uk\/wp-content\/uploads\/2026\/02\/image-18-300x154.png 300w, https:\/\/clark2025.hulldesign.co.uk\/wp-content\/uploads\/2026\/02\/image-18-768x394.png 768w, https:\/\/clark2025.hulldesign.co.uk\/wp-content\/uploads\/2026\/02\/image-18-1536x788.png 1536w, https:\/\/clark2025.hulldesign.co.uk\/wp-content\/uploads\/2026\/02\/image-18.png 1950w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n<\/div>\n\n\n<p>Finally, my map was made to be simple. It has four filters for the person to find exactly what they want from the stages to the rest spots. I thought about having a pinch and zoom system but decided against it as the colour co-ordinated filter system worked better for such a small area in my opinion, allowing the person to see exactly what they wanted without having to have a cluttered map.\u00a0<\/p>\n\n\n\n<p><\/p>\n","protected":false},"excerpt":{"rendered":"<p>For My Final designs I wanted to have pages that fit well together in colour scheme and all felt like they were meant to be there and they were needed I tried to do this by having them functional and ready for the way the customer would be using them. Home Page For my home [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[17],"tags":[],"class_list":["post-597","post","type-post","status-publish","format-standard","hentry","category-posts-for-prototyping-user-interfaces"],"_links":{"self":[{"href":"https:\/\/clark2025.hulldesign.co.uk\/index.php?rest_route=\/wp\/v2\/posts\/597","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/clark2025.hulldesign.co.uk\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/clark2025.hulldesign.co.uk\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/clark2025.hulldesign.co.uk\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/clark2025.hulldesign.co.uk\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=597"}],"version-history":[{"count":18,"href":"https:\/\/clark2025.hulldesign.co.uk\/index.php?rest_route=\/wp\/v2\/posts\/597\/revisions"}],"predecessor-version":[{"id":782,"href":"https:\/\/clark2025.hulldesign.co.uk\/index.php?rest_route=\/wp\/v2\/posts\/597\/revisions\/782"}],"wp:attachment":[{"href":"https:\/\/clark2025.hulldesign.co.uk\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=597"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/clark2025.hulldesign.co.uk\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=597"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/clark2025.hulldesign.co.uk\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=597"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}