{"id":104,"date":"2021-07-10T10:51:45","date_gmt":"2021-07-10T08:51:45","guid":{"rendered":"http:\/\/portfolio.balthasar-von-weymarn.de\/?post_type=portfolio&#038;p=104"},"modified":"2022-01-18T11:12:05","modified_gmt":"2022-01-18T10:12:05","slug":"case-study-hammerhead-1","status":"publish","type":"portfolio","link":"https:\/\/portfolio.balthasar-von-weymarn.de\/?portfolio=case-study-hammerhead-1","title":{"rendered":"Case Study: Hammerhead"},"content":{"rendered":"\n<figure class=\"wp-block-pullquote has-background is-style-solid-color\" style=\"background-color:#496ba6\"><blockquote class=\"has-text-color has-white-color\"><p>UX Design: the craft of supporting user behaviour by designing interaction to make it easier for them.<\/p><\/blockquote><\/figure>\n\n\n\n<p>For the main project in my CF course on UX design I had chosen a so-called \u00bbexpert app\u00ab, the framework of which was to provide a means of interaction between a body of \u00bbusers\u00ab and a range of \u00bbexperts\u00ab.<br>Students were challenged to come up with ideas and answers for the following:<\/p>\n\n\n\n<ul class=\"has-medium-font-size wp-block-list\"><li><strong>A suitable &#8222;theme&#8220; for the app narrowing down the areas of expertise needed and a name to go with it<\/strong><\/li><li><strong>Research on probable users and conceptualizing incentives to get them interested<\/strong><\/li><li><strong>Identifying and designing flows significant enough to introduce future users and developers to viability of the concept<\/strong><\/li><\/ul>\n\n\n\n<p>Now this resembles a real-life situation for UX designers in some regards &#8212; you may have ideas, but unless they are weighted against market realities and potential audiences, what is their worth?<br>Many market ideas have been explored already, and the market shares are bitterly fought over. Some seem intriguing, but there is no market big enough for them.My initial ideas quickly coalesced around having the unifying theme be<\/p>\n\n\n\n<p class=\"has-text-color has-large-font-size\" style=\"color:#496ba6\"><strong>DO IT YOURSELF WORK AROUND THE HOUSE<\/strong><\/p>\n\n\n\n<p>as competitive analysis suggested that this particular wheel had not been invented to satisfaction. And while expert apps exist on broad and limited subjects, <strong><em>DIY so far lacks a killer app.<\/em><\/strong><\/p>\n\n\n\n<p>My research narrowed the reasons for this down to the following:<\/p>\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 decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-layzr=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/FreeYT-1024x1024.png\" alt=\"\" data-id=\"41\" data-full-url=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/FreeYT.png\" data-link=\"http:\/\/portfolio.balthasar-von-weymarn.de\/portfolio\/ux-design-notes\/freeyt\/\" class=\"wp-image-41\"\/><\/figure><\/li><li class=\"blocks-gallery-item\"><figure><img decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-layzr=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/TargetAudience-1024x1024.png\" alt=\"\" data-id=\"42\" data-full-url=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/TargetAudience.png\" data-link=\"http:\/\/portfolio.balthasar-von-weymarn.de\/portfolio\/ux-design-notes\/targetaudience\/\" class=\"wp-image-42\"\/><\/figure><\/li><li class=\"blocks-gallery-item\"><figure><img decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-layzr=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/ux-1024x1024.png\" alt=\"\" data-id=\"43\" data-full-url=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/ux.png\" data-link=\"http:\/\/portfolio.balthasar-von-weymarn.de\/portfolio\/ux-design-notes\/ux\/\" class=\"wp-image-43\"\/><\/figure><\/li><\/ul><\/figure>\n\n\n\n<p class=\"has-large-font-size\"><strong>Hypotheses<\/strong><\/p>\n\n\n\n<p>UX for the app needs to address unique requirements of DIY users.<\/p>\n\n\n\n<p>Compensation for experts needs to account for the expectation and experience that &#8222;DIY advice should be free between comrades in need&#8220; (original quote).<\/p>\n\n\n\n<p>Expert pages should feature user-based feedback and ratings systems to build confidence and word of mouth.<\/p>\n\n\n\n<p class=\"has-text-color\" style=\"color:#496ba6\"><strong>HAMMERHEAD <\/strong>may be a good name for the project (once I had reluctantly said goodbye to &#8222;deus ex machina&#8220;).<\/p>\n\n\n\n<p class=\"has-large-font-size\"><strong>Research process and survey results<\/strong><\/p>\n\n\n\n<p>My UX survey questions touched on subjects like<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>Preferred kinds of DIY work \/ areas of own expertise, if any <\/li><li>Preferred methods of acquiring help<\/li><li>Ease or unease about paying or accepting payment for DIY advice<\/li><li>Definition of a &#8222;fair compensation&#8220; for DIY advice<\/li><li>Mobile app payment proficiency and preference, data privacy and bandwith use concerns<\/li><\/ul>\n\n\n\n<figure class=\"wp-block-gallery columns-4 is-cropped wp-block-gallery-2 is-layout-flex wp-block-gallery-is-layout-flex\"><ul class=\"blocks-gallery-grid\"><li class=\"blocks-gallery-item\"><figure><a href=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/Survey04.png\"><img decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-layzr=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/Survey04-1024x448.png\" alt=\"\" data-id=\"44\" data-full-url=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/Survey04.png\" data-link=\"http:\/\/portfolio.balthasar-von-weymarn.de\/portfolio\/ux-design-notes\/survey04\/\" class=\"wp-image-44\"\/><\/a><\/figure><\/li><li class=\"blocks-gallery-item\"><figure><a href=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/Survey01.png\"><img decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-layzr=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/Survey01-1024x534.png\" alt=\"\" data-id=\"46\" data-full-url=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/Survey01.png\" data-link=\"http:\/\/portfolio.balthasar-von-weymarn.de\/portfolio\/ux-design-notes\/survey01\/\" class=\"wp-image-46\"\/><\/a><\/figure><\/li><li class=\"blocks-gallery-item\"><figure><a href=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/Survey06.png\"><img decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-layzr=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/Survey06-1024x472.png\" alt=\"\" data-id=\"45\" data-full-url=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/Survey06.png\" data-link=\"http:\/\/portfolio.balthasar-von-weymarn.de\/portfolio\/ux-design-notes\/survey06\/\" class=\"wp-image-45\"\/><\/a><\/figure><\/li><li class=\"blocks-gallery-item\"><figure><a href=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/Survey05.png\"><img decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-layzr=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/Survey05-1024x503.png\" alt=\"\" data-id=\"47\" data-full-url=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/Survey05.png\" data-link=\"http:\/\/portfolio.balthasar-von-weymarn.de\/portfolio\/ux-design-notes\/survey05\/\" class=\"wp-image-47\"\/><\/a><\/figure><\/li><li class=\"blocks-gallery-item\"><figure><a href=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/Survey07.png\"><img decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-layzr=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/Survey07-1024x574.png\" alt=\"\" data-id=\"48\" data-full-url=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/Survey07.png\" data-link=\"http:\/\/portfolio.balthasar-von-weymarn.de\/portfolio\/ux-design-notes\/survey07\/\" class=\"wp-image-48\"\/><\/a><\/figure><\/li><li class=\"blocks-gallery-item\"><figure><a href=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/Survey03.png\"><img decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-layzr=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/Survey03-1024x522.png\" alt=\"\" data-id=\"49\" data-full-url=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/Survey03.png\" data-link=\"http:\/\/portfolio.balthasar-von-weymarn.de\/portfolio\/ux-design-notes\/survey03\/\" class=\"wp-image-49\"\/><\/a><\/figure><\/li><li class=\"blocks-gallery-item\"><figure><a href=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/Survey02.png\"><img decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-layzr=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/Survey02-1024x525.png\" alt=\"\" data-id=\"50\" data-full-url=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/Survey02.png\" data-link=\"http:\/\/portfolio.balthasar-von-weymarn.de\/portfolio\/ux-design-notes\/survey02\/\" class=\"wp-image-50\"\/><\/a><\/figure><\/li><\/ul><\/figure>\n\n\n\n<p>And what did users think of the name HAMMERHEAD?<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-layzr=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/Survey09-1024x478.png\" alt=\"\" class=\"wp-image-51\"\/><\/figure>\n\n\n\n<p>Oh well. <\/p>\n\n\n\n<p class=\"has-black-color has-text-color\">Better to have a controversial name than one that is easily forgotten. I decided to stick to it for now and commission a <\/p>\n\n\n\n<p class=\"has-text-align-center has-text-color has-medium-font-size\" style=\"color:#496ba6\"><strong>MASCOT<\/strong><\/p>\n\n\n\n<figure class=\"wp-block-gallery columns-2 wp-block-gallery-3 is-layout-flex wp-block-gallery-is-layout-flex\"><ul class=\"blocks-gallery-grid\"><li class=\"blocks-gallery-item\"><figure><img decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-layzr=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/hammerheadsketch.png\" alt=\"\" data-id=\"53\" data-full-url=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/hammerheadsketch.png\" data-link=\"http:\/\/portfolio.balthasar-von-weymarn.de\/portfolio\/ux-design-notes\/hammerheadsketch\/\" class=\"wp-image-53\"\/><\/figure><\/li><li class=\"blocks-gallery-item\"><figure><img decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-layzr=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/Hammerhead1.png\" alt=\"\" data-id=\"52\" data-full-url=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/Hammerhead1.png\" data-link=\"http:\/\/portfolio.balthasar-von-weymarn.de\/portfolio\/ux-design-notes\/hammerhead1\/\" class=\"wp-image-52\"\/><\/figure><\/li><\/ul><\/figure>\n\n\n\n<p class=\"has-text-color has-large-font-size\" style=\"color:#496ba6\"><strong>USER PERSONAE<\/strong><\/p>\n\n\n\n<p>The next step had me think about people to keep in mind before I would set out to create architecture and flow, leading to a sequence of screen design iterations.<\/p>\n\n\n\n<p><strong>So who would I see here that would ask themselves if they should avail themselves to this expert app? <\/strong><\/p>\n\n\n\n<p>While the clich\u00e9 appears to be true that the majority of DIY enthusiasts are male, their backgrounds would be different. So using photos from friends, I re-envisioned them as members of a particular subset of users with different, sometimes opposing viewpoints and approaches:<\/p>\n\n\n\n<figure class=\"wp-block-gallery columns-3 is-cropped wp-block-gallery-4 is-layout-flex wp-block-gallery-is-layout-flex\"><ul class=\"blocks-gallery-grid\"><li class=\"blocks-gallery-item\"><figure><a href=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/Task24-1-scaled.jpg\"><img decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-layzr=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/Task24-1-1024x724.jpg\" alt=\"\" data-id=\"55\" data-full-url=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/Task24-1-scaled.jpg\" data-link=\"http:\/\/portfolio.balthasar-von-weymarn.de\/?attachment_id=55\" class=\"wp-image-55\"\/><\/a><\/figure><\/li><li class=\"blocks-gallery-item\"><figure><a href=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/Task24-2.jpg\"><img decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-layzr=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/Task24-2-1024x724.jpg\" alt=\"\" data-id=\"56\" data-full-url=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/Task24-2.jpg\" data-link=\"http:\/\/portfolio.balthasar-von-weymarn.de\/?attachment_id=56\" class=\"wp-image-56\"\/><\/a><\/figure><\/li><li class=\"blocks-gallery-item\"><figure><a href=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/Task24-3.jpg\"><img decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-layzr=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/Task24-3-1024x724.jpg\" alt=\"\" data-id=\"57\" data-full-url=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/Task24-3.jpg\" data-link=\"http:\/\/portfolio.balthasar-von-weymarn.de\/?attachment_id=57\" class=\"wp-image-57\"\/><\/a><\/figure><\/li><\/ul><\/figure>\n\n\n\n<p><strong>These imaginations helped me on the way to start creating information architecture which would set me on the path towards the <\/strong><\/p>\n\n\n\n<p class=\"has-text-color has-large-font-size\" style=\"color:#496ba6\"><strong>ITERATIONS OF WIREFRAMES<\/strong><\/p>\n\n\n\n<p class=\"has-large-font-size\"><strong>Onboarding<\/strong><\/p>\n\n\n\n<p><strong>Saying hello to one&#8217;s audience is the only chance to make a good first impression. Steps in the evolution of the first screen involved the positioning and look of the &#8222;Hammerhead mascot&#8220; and experiments with fonts and color schemes.<\/strong><\/p>\n\n\n\n<figure class=\"wp-block-gallery columns-3 is-cropped wp-block-gallery-5 is-layout-flex wp-block-gallery-is-layout-flex\"><ul class=\"blocks-gallery-grid\"><li class=\"blocks-gallery-item\"><figure><img decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-layzr=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/HH-MF-Onboarding-Mobile-Intro.png\" alt=\"\" data-id=\"58\" data-full-url=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/HH-MF-Onboarding-Mobile-Intro.png\" data-link=\"http:\/\/portfolio.balthasar-von-weymarn.de\/?attachment_id=58\" class=\"wp-image-58\"\/><\/figure><\/li><li class=\"blocks-gallery-item\"><figure><img decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-layzr=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/HH-MF-Onboarding-Mobile-Intro-2.png\" alt=\"\" data-id=\"59\" data-full-url=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/HH-MF-Onboarding-Mobile-Intro-2.png\" data-link=\"http:\/\/portfolio.balthasar-von-weymarn.de\/?attachment_id=59\" class=\"wp-image-59\"\/><\/figure><\/li><li class=\"blocks-gallery-item\"><figure><img decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-layzr=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/Onboarding-Mobile-Intro-Redesign-new.png\" alt=\"\" data-id=\"60\" data-full-url=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/Onboarding-Mobile-Intro-Redesign-new.png\" data-link=\"http:\/\/portfolio.balthasar-von-weymarn.de\/?attachment_id=60\" class=\"wp-image-60\"\/><\/figure><\/li><\/ul><figcaption class=\"blocks-gallery-caption\">Progressive steps between mid- and high level wireframing<\/figcaption><\/figure>\n\n\n\n<p class=\"has-large-font-size\"><strong>Main menu (user wing)<\/strong><\/p>\n\n\n\n<p>Very early on I wanted to help users who had just come off working with tools (and thereby had just engaged their gross motor skills) not miss the main buttons. That is why I chose <strong>big square buttons<\/strong>, eventually scaling them differently to allow for a &#8222;size = importance&#8220; look. The change in color scheme from blues to browns relegated the mascot to the background.<\/p>\n\n\n\n<figure class=\"wp-block-gallery columns-3 is-cropped wp-block-gallery-6 is-layout-flex wp-block-gallery-is-layout-flex\"><ul class=\"blocks-gallery-grid\"><li class=\"blocks-gallery-item\"><figure><img decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-layzr=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/HH-LF-1580-540x1024.jpg\" alt=\"\" data-id=\"63\" data-full-url=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/HH-LF-1580.jpg\" data-link=\"http:\/\/portfolio.balthasar-von-weymarn.de\/?attachment_id=63\" class=\"wp-image-63\"\/><\/figure><\/li><li class=\"blocks-gallery-item\"><figure><img decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-layzr=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/HH-HF-Mobile-0-Home.png\" alt=\"\" data-id=\"62\" data-full-url=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/HH-HF-Mobile-0-Home.png\" data-link=\"http:\/\/portfolio.balthasar-von-weymarn.de\/?attachment_id=62\" class=\"wp-image-62\"\/><\/figure><\/li><li class=\"blocks-gallery-item\"><figure><img decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-layzr=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/HH-HF-Mobile-0-Home-Grid10-2.png\" alt=\"\" data-id=\"61\" data-full-url=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/HH-HF-Mobile-0-Home-Grid10-2.png\" data-link=\"http:\/\/portfolio.balthasar-von-weymarn.de\/?attachment_id=61\" class=\"wp-image-61\"\/><\/figure><\/li><\/ul><\/figure>\n\n\n\n<p class=\"has-large-font-size\"><strong>Expert database (categories)<\/strong><\/p>\n\n\n\n<p>Once a user starts looking, having them first choose the DIY category seemed like a logical choice. When the initial design began to look a bit boring to me, I experimented with backgrounds until I adopted the square buttons idea for these screens, too, and made the leap to hint at &#8222;more to see&#8220; below the fold in the final iteration.<\/p>\n\n\n\n<figure class=\"wp-block-gallery columns-3 is-cropped wp-block-gallery-7 is-layout-flex wp-block-gallery-is-layout-flex\"><ul class=\"blocks-gallery-grid\"><li class=\"blocks-gallery-item\"><figure><img decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-layzr=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/Hi-Fidelity-Mobile-2-Scr0.png\" alt=\"\" data-id=\"81\" data-full-url=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/Hi-Fidelity-Mobile-2-Scr0.png\" data-link=\"http:\/\/portfolio.balthasar-von-weymarn.de\/?attachment_id=81\" class=\"wp-image-81\"\/><\/figure><\/li><li class=\"blocks-gallery-item\"><figure><img decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-layzr=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/Hammerhead-HF-WF-20210301-Mobile-2-Scr0.png\" alt=\"\" data-id=\"80\" data-full-url=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/Hammerhead-HF-WF-20210301-Mobile-2-Scr0.png\" data-link=\"http:\/\/portfolio.balthasar-von-weymarn.de\/?attachment_id=80\" class=\"wp-image-80\"\/><\/figure><\/li><li class=\"blocks-gallery-item\"><figure><img decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-layzr=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/Hi-Fidelity-Mobile-2-SearchExpert-1.png\" alt=\"\" data-id=\"82\" data-full-url=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/Hi-Fidelity-Mobile-2-SearchExpert-1.png\" data-link=\"http:\/\/portfolio.balthasar-von-weymarn.de\/?attachment_id=82\" class=\"wp-image-82\"\/><\/figure><\/li><\/ul><figcaption class=\"blocks-gallery-caption\">Note how the bg changed from plain white to unobtrusive woodplank (with a detour)<\/figcaption><\/figure>\n\n\n\n<p class=\"has-large-font-size\"><strong>Expert database (listing)<\/strong><\/p>\n\n\n\n<p>It was actually peer review that alerted me to a major oversight: the early screens had shown a simple all letters listing of names and (self-styled) professional assessments of experts. That was a no-no, not just because it would violate guidelines in both iOS and Material Design, but it would also look boring and not engaging enough. <\/p>\n\n\n\n<p>The solution presented itself quicky: take the square buttons for consistency and fill them with nice portrait pictures of the experts-in-waiting.<\/p>\n\n\n\n<figure class=\"wp-block-gallery columns-3 is-cropped wp-block-gallery-8 is-layout-flex wp-block-gallery-is-layout-flex\"><ul class=\"blocks-gallery-grid\"><li class=\"blocks-gallery-item\"><figure><img decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-layzr=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/Hi-Fidelity-Mobile-2-Scr0-\u2013-1.png\" alt=\"\" data-id=\"84\" data-full-url=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/Hi-Fidelity-Mobile-2-Scr0-\u2013-1.png\" data-link=\"http:\/\/portfolio.balthasar-von-weymarn.de\/?attachment_id=84\" class=\"wp-image-84\"\/><\/figure><\/li><li class=\"blocks-gallery-item\"><figure><img decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-layzr=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/Hi-Fidelity-Mobile-2-Scr0-\u2013-1-2.png\" alt=\"\" data-id=\"83\" data-full-url=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/Hi-Fidelity-Mobile-2-Scr0-\u2013-1-2.png\" data-link=\"http:\/\/portfolio.balthasar-von-weymarn.de\/?attachment_id=83\" class=\"wp-image-83\"\/><\/figure><\/li><li class=\"blocks-gallery-item\"><figure><img decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-layzr=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/Hi-Fidelity-Mobile-2-SearchExpert-2.png\" alt=\"\" data-id=\"85\" data-full-url=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/Hi-Fidelity-Mobile-2-SearchExpert-2.png\" data-link=\"http:\/\/portfolio.balthasar-von-weymarn.de\/?attachment_id=85\" class=\"wp-image-85\"\/><\/figure><\/li><\/ul><figcaption class=\"blocks-gallery-caption\">I loved sneaking in placeholder character names from obscure movies. Can you spot any of them?<\/figcaption><\/figure>\n\n\n\n<p class=\"has-large-font-size\"><strong>Expert profile screen<\/strong><\/p>\n\n\n\n<p>The challenge for me here was <em>screen real estate<\/em>. <strong>How would a user see and react to what kind of info about an expert, and how could all of that possibly look good?<\/strong> In the final iteration the square buttons and the idea that not all would need to be seen at first glance came to the rescue. By having the footer menu cut the appearance of the lower buttons in half, the user would logically assume that there was more to be seen and scroll down &#8230;<\/p>\n\n\n\n<figure class=\"wp-block-gallery columns-3 is-cropped wp-block-gallery-9 is-layout-flex wp-block-gallery-is-layout-flex\"><ul class=\"blocks-gallery-grid\"><li class=\"blocks-gallery-item\"><figure><img decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-layzr=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/IMG_1578-563x1024.jpg\" alt=\"\" data-id=\"87\" data-full-url=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/IMG_1578.jpg\" data-link=\"http:\/\/portfolio.balthasar-von-weymarn.de\/?attachment_id=87\" class=\"wp-image-87\"\/><\/figure><\/li><li class=\"blocks-gallery-item\"><figure><img decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-layzr=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/Mid-Fidelity-Mobile-2-Scr2.png\" alt=\"\" data-id=\"88\" data-full-url=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/Mid-Fidelity-Mobile-2-Scr2.png\" data-link=\"http:\/\/portfolio.balthasar-von-weymarn.de\/?attachment_id=88\" class=\"wp-image-88\"\/><\/figure><\/li><li class=\"blocks-gallery-item\"><figure><img decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-layzr=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/Hi-Fidelity-Mobile-2-SearchExpert-3.png\" alt=\"\" data-id=\"86\" data-full-url=\"http:\/\/portfolio.balthasar-von-weymarn.de\/wp-content\/uploads\/Hi-Fidelity-Mobile-2-SearchExpert-3.png\" data-link=\"http:\/\/portfolio.balthasar-von-weymarn.de\/?attachment_id=86\" class=\"wp-image-86\"\/><\/figure><\/li><\/ul><\/figure>\n\n\n\n<p><strong>Want to see for yourself?<\/strong><\/p>\n\n\n\n<div class=\"wp-block-buttons is-layout-flex wp-block-buttons-is-layout-flex\">\n<div class=\"wp-block-button\"><a class=\"wp-block-button__link has-background\" href=\"https:\/\/xd.adobe.com\/view\/693941cd-408a-4d6a-9354-add45aafad03-3c6a\/?fullscreen\" style=\"background-color:#496ba6\" target=\"_blank\" rel=\"noreferrer noopener\">Partial interactive prototype (@Adobe) <\/a><\/div>\n<\/div>\n\n\n\n<p><\/p>\n","protected":false},"excerpt":{"rendered":"<p>UX Design: the craft of supporting user behaviour by designing interaction to make it easier for them. For the main project in my CF course on UX design I had chosen a so-called \u00bbexpert app\u00ab, the framework of which was to provide a means of interaction between a body of \u00bbusers\u00ab and a range of &hellip; <\/p>\n","protected":false},"author":1,"featured_media":0,"menu_order":1,"comment_status":"closed","ping_status":"closed","template":"","format":"standard","meta":{"_vp_format_video_url":"","_vp_image_focal_point":[],"footnotes":""},"portfolio_category":[],"portfolio_tag":[],"class_list":["post-104","portfolio","type-portfolio","status-publish","format-standard","hentry","latest_post","grid-sizer"],"_links":{"self":[{"href":"https:\/\/portfolio.balthasar-von-weymarn.de\/index.php?rest_route=\/wp\/v2\/portfolio\/104","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/portfolio.balthasar-von-weymarn.de\/index.php?rest_route=\/wp\/v2\/portfolio"}],"about":[{"href":"https:\/\/portfolio.balthasar-von-weymarn.de\/index.php?rest_route=\/wp\/v2\/types\/portfolio"}],"author":[{"embeddable":true,"href":"https:\/\/portfolio.balthasar-von-weymarn.de\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/portfolio.balthasar-von-weymarn.de\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=104"}],"version-history":[{"count":3,"href":"https:\/\/portfolio.balthasar-von-weymarn.de\/index.php?rest_route=\/wp\/v2\/portfolio\/104\/revisions"}],"predecessor-version":[{"id":214,"href":"https:\/\/portfolio.balthasar-von-weymarn.de\/index.php?rest_route=\/wp\/v2\/portfolio\/104\/revisions\/214"}],"wp:attachment":[{"href":"https:\/\/portfolio.balthasar-von-weymarn.de\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=104"}],"wp:term":[{"taxonomy":"portfolio_category","embeddable":true,"href":"https:\/\/portfolio.balthasar-von-weymarn.de\/index.php?rest_route=%2Fwp%2Fv2%2Fportfolio_category&post=104"},{"taxonomy":"portfolio_tag","embeddable":true,"href":"https:\/\/portfolio.balthasar-von-weymarn.de\/index.php?rest_route=%2Fwp%2Fv2%2Fportfolio_tag&post=104"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}