{"id":618,"date":"2019-01-14T06:06:58","date_gmt":"2019-01-14T06:06:58","guid":{"rendered":"http:\/\/marissaroesijadi.com\/?p=618"},"modified":"2022-02-16T19:51:52","modified_gmt":"2022-02-16T19:51:52","slug":"booking-accomodations","status":"publish","type":"post","link":"https:\/\/marissaroesijadi.com\/morework\/2019\/01\/14\/booking-accomodations\/","title":{"rendered":"Booking Accommodations"},"content":{"rendered":"<p class=\"p1\"><span class=\"s1\">This concept project examined how to improve the user experience for searching and choosing travel accommodations. Through conversational interviews, I learned about user preferences, interests, habits, and experiences with currently available booking apps. I learned what worked for them and what didn&#8217;t. In order to improve the process for booking accommodations, a new app was designed to allow users to search with their top priorities up front. I found that while many users liked apps they used, they also used separate apps because there are some key search filters web applications do not feature. Additionally, some more personalized filters could be introduced for results to be better tailored to user interests and styles. I used this information to design an interface to streamline a more efficient and personalized user experience.<\/span><\/p>\n<p class=\"p1\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-620\" src=\"http:\/\/marissaroesijadi.com\/wp-content\/uploads\/2019\/01\/rental-image.jpg\" alt=\"rental image\" width=\"920\" height=\"434\" srcset=\"https:\/\/marissaroesijadi.com\/morework\/wp-content\/uploads\/2019\/01\/rental-image.jpg 920w, https:\/\/marissaroesijadi.com\/morework\/wp-content\/uploads\/2019\/01\/rental-image-300x142.jpg 300w, https:\/\/marissaroesijadi.com\/morework\/wp-content\/uploads\/2019\/01\/rental-image-768x362.jpg 768w, https:\/\/marissaroesijadi.com\/morework\/wp-content\/uploads\/2019\/01\/rental-image-280x132.jpg 280w\" sizes=\"auto, (max-width: 920px) 100vw, 920px\" \/><\/p>\n<h3 class=\"p3\"><strong><span class=\"s2\">What you\u2019re looking at<\/span><\/strong><\/h3>\n<p class=\"p3\"><strong>User Interviews, Affinity Mapping, Competitive Analysis, Persona with User Goals, Storyboard,&nbsp;Feature Prioritization,&nbsp;User Flow, Site Map, Paper Prototypes, Annotated Wireframes, Usability Testing, and Iterative versions of HiFi Prototypes<\/strong><\/p>\n<p><strong>Determining the Problem<br \/>\n<\/strong><span class=\"s1\">Through user interviews, it was determined that travelers need a way to perform a comparison based on all of their needs in a single application because most search options do not include all their stated needs and interests.<\/span><\/p>\n<p><strong>RESEARCH<br \/>\n<\/strong><span class=\"s1\">Competitive analysis and user interviews highlighted&nbsp;certain features as points of interest and areas for possible improvement. It was determined that many expected features common with different users that are included in current applications but a couple key interests that could be integrated into the design for higher customer satisfaction.<\/span><\/p>\n<p><strong>User Interviews<br \/>\n<\/strong><span class=\"s1\">Several interviews were conducted. Here are some highlights:<\/span><\/p>\n<ul class=\"ul1\">\n<li class=\"li1\"><span class=\"s1\">Users generally feel that searching is easy<\/span><\/li>\n<li class=\"li1\"><span class=\"s1\">About 50% are interested in reviews and find them very important<\/span><\/li>\n<li class=\"li1\"><span class=\"s1\">Users want a better way to search with rewards programs<\/span><\/li>\n<li class=\"li1\"><span class=\"s1\">Users would like to be able to search by the architectural and decorating styles of accommodations<\/span><\/li>\n<li class=\"li2\"><span class=\"s1\">Users like using maps and filter features<\/span><\/li>\n<\/ul>\n<p><strong>Affinity Mapping<\/strong><br \/>\nSorting user statements determined patterns in user needs and pain points.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-634\" src=\"http:\/\/marissaroesijadi.com\/wp-content\/uploads\/2019\/01\/affinity-mapping.jpg\" alt=\"\" width=\"920\" height=\"601\" srcset=\"https:\/\/marissaroesijadi.com\/morework\/wp-content\/uploads\/2019\/01\/affinity-mapping.jpg 920w, https:\/\/marissaroesijadi.com\/morework\/wp-content\/uploads\/2019\/01\/affinity-mapping-300x196.jpg 300w, https:\/\/marissaroesijadi.com\/morework\/wp-content\/uploads\/2019\/01\/affinity-mapping-768x502.jpg 768w, https:\/\/marissaroesijadi.com\/morework\/wp-content\/uploads\/2019\/01\/affinity-mapping-280x183.jpg 280w\" sizes=\"auto, (max-width: 920px) 100vw, 920px\" \/><\/p>\n<p><strong>Competitive Analysis<br \/>\n<\/strong><span class=\"s1\">This chart shows the feature inventory for a number of competitors currently available on the market. It shows features that all competitors include and may be expected by users, as well as some features not included by most competitors. Note that there is only one application that includes a search filter for rewards programs.<\/span><\/p>\n<p><a href=\"http:\/\/marissaroesijadi.com\/wp-content\/uploads\/2019\/01\/feature-inventory.jpg\" target=\"_blank\" rel=\"noopener noreferrer\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-624 size-full\" src=\"http:\/\/marissaroesijadi.com\/wp-content\/uploads\/2019\/01\/feature-inventory.jpg\" alt=\"feature inventory\" width=\"1100\" height=\"331\" srcset=\"https:\/\/marissaroesijadi.com\/morework\/wp-content\/uploads\/2019\/01\/feature-inventory.jpg 1100w, https:\/\/marissaroesijadi.com\/morework\/wp-content\/uploads\/2019\/01\/feature-inventory-300x90.jpg 300w, https:\/\/marissaroesijadi.com\/morework\/wp-content\/uploads\/2019\/01\/feature-inventory-768x231.jpg 768w, https:\/\/marissaroesijadi.com\/morework\/wp-content\/uploads\/2019\/01\/feature-inventory-1024x308.jpg 1024w, https:\/\/marissaroesijadi.com\/morework\/wp-content\/uploads\/2019\/01\/feature-inventory-280x84.jpg 280w, https:\/\/marissaroesijadi.com\/morework\/wp-content\/uploads\/2019\/01\/feature-inventory-920x277.jpg 920w\" sizes=\"auto, (max-width: 1100px) 100vw, 1100px\" \/><\/a><\/p>\n<p>&nbsp;<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-625\" src=\"http:\/\/marissaroesijadi.com\/wp-content\/uploads\/2019\/01\/competitors.jpg\" alt=\"competitors\" width=\"920\" height=\"294\" srcset=\"https:\/\/marissaroesijadi.com\/morework\/wp-content\/uploads\/2019\/01\/competitors.jpg 920w, https:\/\/marissaroesijadi.com\/morework\/wp-content\/uploads\/2019\/01\/competitors-300x96.jpg 300w, https:\/\/marissaroesijadi.com\/morework\/wp-content\/uploads\/2019\/01\/competitors-768x245.jpg 768w, https:\/\/marissaroesijadi.com\/morework\/wp-content\/uploads\/2019\/01\/competitors-280x89.jpg 280w\" sizes=\"auto, (max-width: 920px) 100vw, 920px\" \/><\/p>\n<p><strong>Persona<br \/>\n<\/strong><span class=\"s1\">A persona was developed based on the insights gleaned from user interviews. The following slides show the user persona, needs, problems, goals, and a possible solution to improve the&nbsp;user experience.<\/span><\/p>\n<p><a href=\"http:\/\/marissaroesijadi.com\/wp-content\/uploads\/2019\/01\/user-persona.jpg\" target=\"_blank\" rel=\"noopener noreferrer\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-630 size-full\" src=\"http:\/\/marissaroesijadi.com\/wp-content\/uploads\/2019\/01\/user-persona.jpg\" alt=\"User Persona\" width=\"920\" height=\"520\" srcset=\"https:\/\/marissaroesijadi.com\/morework\/wp-content\/uploads\/2019\/01\/user-persona.jpg 920w, https:\/\/marissaroesijadi.com\/morework\/wp-content\/uploads\/2019\/01\/user-persona-300x170.jpg 300w, https:\/\/marissaroesijadi.com\/morework\/wp-content\/uploads\/2019\/01\/user-persona-768x434.jpg 768w, https:\/\/marissaroesijadi.com\/morework\/wp-content\/uploads\/2019\/01\/user-persona-280x158.jpg 280w\" sizes=\"auto, (max-width: 920px) 100vw, 920px\" \/><\/a><\/p>\n<p><strong>User Needs, Problems, and Goals<\/strong><\/p>\n<ul class=\"ul1\">\n<li class=\"li1\"><span class=\"s2\">Avery would like to find accommodations available in her rewards program that matches her style preferences and meets a decent level of quality in a good location<\/span><\/li>\n<li class=\"li1\"><span class=\"s2\">Finding reviews that have relevant and reliable information is difficult but can be very helpful<\/span><\/li>\n<li class=\"li2\"><span class=\"s2\">Avery would like to have the details and rules of bookings organized and accessible for her trips<\/span><\/li>\n<\/ul>\n<p><strong>What Feature Will be Helpful?<br \/>\n<\/strong><span class=\"s1\">It was determined that creating a search with custom advanced filters based on stated user needs will achieve better-tailored search results for users like Avery. This will be proven to be true when users spend less time searching for their ideal accommodation. While current applications include advanced filters, I found that including more personalized filters as an option for users is key.<\/span><\/p>\n<p><strong>Feature Prioritization<br \/>\n<\/strong>A storyboard was created to further examine persona needs and how these features might solve Avery&#8217;s problem.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-763\" src=\"http:\/\/marissaroesijadi.com\/wp-content\/uploads\/2019\/01\/storyboard_.jpg\" alt=\"storyboard\" width=\"920\" height=\"533\" srcset=\"https:\/\/marissaroesijadi.com\/morework\/wp-content\/uploads\/2019\/01\/storyboard_.jpg 920w, https:\/\/marissaroesijadi.com\/morework\/wp-content\/uploads\/2019\/01\/storyboard_-300x174.jpg 300w, https:\/\/marissaroesijadi.com\/morework\/wp-content\/uploads\/2019\/01\/storyboard_-768x445.jpg 768w, https:\/\/marissaroesijadi.com\/morework\/wp-content\/uploads\/2019\/01\/storyboard_-280x162.jpg 280w\" sizes=\"auto, (max-width: 920px) 100vw, 920px\" \/><\/p>\n<p class=\"p1\"><span class=\"s1\">Creating a storyboard helped to determine all useful features. <\/span><\/p>\n<p class=\"p1\"><span class=\"s1\">Next, a <strong>matrix<\/strong> and an <strong>initial user flow<\/strong> helped to sort through&nbsp;useful\/impactful features and&nbsp;<\/span><span class=\"s1\">expected features. The level of impact was determined by user desires and pain points.<\/span><\/p>\n<p><span class=\"s1\"><strong>Here are the features found to be the most important:<\/strong> Style Filters, Interactive Map, Roll Over for Details, Bookmark for Favorites, Location Details, Location Reviews, Host Photos, Accommodation Reviews with Ratings, Rewards Filter<\/span><\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-650\" src=\"http:\/\/marissaroesijadi.com\/wp-content\/uploads\/2019\/01\/matrix-user-flow.jpg\" alt=\"matrix and user flow\" width=\"920\" height=\"416\" srcset=\"https:\/\/marissaroesijadi.com\/morework\/wp-content\/uploads\/2019\/01\/matrix-user-flow.jpg 920w, https:\/\/marissaroesijadi.com\/morework\/wp-content\/uploads\/2019\/01\/matrix-user-flow-300x136.jpg 300w, https:\/\/marissaroesijadi.com\/morework\/wp-content\/uploads\/2019\/01\/matrix-user-flow-768x347.jpg 768w, https:\/\/marissaroesijadi.com\/morework\/wp-content\/uploads\/2019\/01\/matrix-user-flow-280x127.jpg 280w\" sizes=\"auto, (max-width: 920px) 100vw, 920px\" \/><\/p>\n<p>Determining features to include and the user flow helped to develop a site map and paper prototype.<\/p>\n<p><strong>Sitemap<\/strong><strong><br \/>\n<\/strong><\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-646\" src=\"http:\/\/marissaroesijadi.com\/wp-content\/uploads\/2019\/01\/sitemap.jpg\" alt=\"\" width=\"920\" height=\"528\" srcset=\"https:\/\/marissaroesijadi.com\/morework\/wp-content\/uploads\/2019\/01\/sitemap.jpg 920w, https:\/\/marissaroesijadi.com\/morework\/wp-content\/uploads\/2019\/01\/sitemap-300x172.jpg 300w, https:\/\/marissaroesijadi.com\/morework\/wp-content\/uploads\/2019\/01\/sitemap-768x441.jpg 768w, https:\/\/marissaroesijadi.com\/morework\/wp-content\/uploads\/2019\/01\/sitemap-280x161.jpg 280w\" sizes=\"auto, (max-width: 920px) 100vw, 920px\" \/><\/p>\n<p>Below is the second iteration of the paper prototype. User testing with the initial version led to changes based on confusion about some of the filters, price range, and the need to add in more info on the property details page. Once these changes were determined wireframes were put together and then hi-fi&nbsp;prototypes for testing in Invision. Note key highlights in the search filters include searching by rewards programs and searching by property styles.<\/p>\n<p><strong>Paper Prototype<br \/>\n<\/strong><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-644\" src=\"http:\/\/marissaroesijadi.com\/wp-content\/uploads\/2019\/01\/paper-prototypes.jpg\" alt=\"paper prototypes\" width=\"920\" height=\"733\" srcset=\"https:\/\/marissaroesijadi.com\/morework\/wp-content\/uploads\/2019\/01\/paper-prototypes.jpg 920w, https:\/\/marissaroesijadi.com\/morework\/wp-content\/uploads\/2019\/01\/paper-prototypes-300x239.jpg 300w, https:\/\/marissaroesijadi.com\/morework\/wp-content\/uploads\/2019\/01\/paper-prototypes-768x612.jpg 768w, https:\/\/marissaroesijadi.com\/morework\/wp-content\/uploads\/2019\/01\/paper-prototypes-280x223.jpg 280w\" sizes=\"auto, (max-width: 920px) 100vw, 920px\" \/><\/p>\n<p><strong>Annotated Wireframes<\/strong><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-653\" src=\"http:\/\/marissaroesijadi.com\/wp-content\/uploads\/2019\/01\/annotated-wireframes.jpg\" alt=\"annotated wireframes\" width=\"920\" height=\"990\" srcset=\"https:\/\/marissaroesijadi.com\/morework\/wp-content\/uploads\/2019\/01\/annotated-wireframes.jpg 920w, https:\/\/marissaroesijadi.com\/morework\/wp-content\/uploads\/2019\/01\/annotated-wireframes-279x300.jpg 279w, https:\/\/marissaroesijadi.com\/morework\/wp-content\/uploads\/2019\/01\/annotated-wireframes-768x826.jpg 768w, https:\/\/marissaroesijadi.com\/morework\/wp-content\/uploads\/2019\/01\/annotated-wireframes-280x301.jpg 280w\" sizes=\"auto, (max-width: 920px) 100vw, 920px\" \/><\/p>\n<p><strong>View the first hi-fi clickable prototype in Invision&nbsp;<a href=\"https:\/\/invis.io\/C6P6HJINB7V\" target=\"_blank\" rel=\"noopener noreferrer\">here<\/a><\/strong><\/p>\n<p><strong>USER TESTING<br \/>\n<\/strong>The example linked above shows the flow for one of three tasks used for the initial round of testing. The task in this example is to book fun a trip for two for 10 nights. See the test participants in action below!<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-652\" src=\"http:\/\/marissaroesijadi.com\/wp-content\/uploads\/2019\/01\/user-testing.jpg\" alt=\"user testing\" width=\"920\" height=\"282\" srcset=\"https:\/\/marissaroesijadi.com\/morework\/wp-content\/uploads\/2019\/01\/user-testing.jpg 920w, https:\/\/marissaroesijadi.com\/morework\/wp-content\/uploads\/2019\/01\/user-testing-300x92.jpg 300w, https:\/\/marissaroesijadi.com\/morework\/wp-content\/uploads\/2019\/01\/user-testing-768x235.jpg 768w, https:\/\/marissaroesijadi.com\/morework\/wp-content\/uploads\/2019\/01\/user-testing-280x86.jpg 280w\" sizes=\"auto, (max-width: 920px) 100vw, 920px\" \/><\/p>\n<p>Testing led to some great insights that helped to eliminate excess screens, streamline the process and make commands and user options more clear. This lead to a simpler user flow and a new prototype for testing.<\/p>\n<p><strong>Updated User Flow<br \/>\n<\/strong>The user flow shows the happy path to confirming a reservation regardless of user desires and needs.<\/p>\n<p><a href=\"http:\/\/marissaroesijadi.com\/wp-content\/uploads\/2019\/01\/user-flow.jpg\" target=\"_blank\" rel=\"noopener noreferrer\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-637 size-full\" src=\"http:\/\/marissaroesijadi.com\/wp-content\/uploads\/2019\/01\/user-flow.jpg\" alt=\"User Flow\" width=\"1100\" height=\"626\" srcset=\"https:\/\/marissaroesijadi.com\/morework\/wp-content\/uploads\/2019\/01\/user-flow.jpg 1100w, https:\/\/marissaroesijadi.com\/morework\/wp-content\/uploads\/2019\/01\/user-flow-300x171.jpg 300w, https:\/\/marissaroesijadi.com\/morework\/wp-content\/uploads\/2019\/01\/user-flow-768x437.jpg 768w, https:\/\/marissaroesijadi.com\/morework\/wp-content\/uploads\/2019\/01\/user-flow-1024x583.jpg 1024w, https:\/\/marissaroesijadi.com\/morework\/wp-content\/uploads\/2019\/01\/user-flow-280x159.jpg 280w, https:\/\/marissaroesijadi.com\/morework\/wp-content\/uploads\/2019\/01\/user-flow-920x524.jpg 920w\" sizes=\"auto, (max-width: 1100px) 100vw, 1100px\" \/><\/a><\/p>\n<p><strong>Updated Screens<br \/>\n<\/strong><span style=\"font-weight: 400;\">The biggest change was combining the options for viewing the map and list into a single page that can adjust according to user preferences.&nbsp;<\/span>Additionally navigation language such as &#8220;Enlarge Map&#8221;, &#8220;List View&#8221;, &#8220;Rewards Programs&#8221; was adjusted. And extras such as the &#8220;Apply&#8221; button in filters section was removed so that filters are applied without an additional step.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-649\" src=\"http:\/\/marissaroesijadi.com\/wp-content\/uploads\/2019\/01\/updated-screens.jpg\" alt=\"\" width=\"920\" height=\"370\" srcset=\"https:\/\/marissaroesijadi.com\/morework\/wp-content\/uploads\/2019\/01\/updated-screens.jpg 920w, https:\/\/marissaroesijadi.com\/morework\/wp-content\/uploads\/2019\/01\/updated-screens-300x121.jpg 300w, https:\/\/marissaroesijadi.com\/morework\/wp-content\/uploads\/2019\/01\/updated-screens-768x309.jpg 768w, https:\/\/marissaroesijadi.com\/morework\/wp-content\/uploads\/2019\/01\/updated-screens-280x113.jpg 280w\" sizes=\"auto, (max-width: 920px) 100vw, 920px\" \/><\/p>\n<p><strong>View the updated clickable prototype in Invision&nbsp;<a href=\"https:\/\/invis.io\/TYPN8A33URF\" target=\"_blank\" rel=\"noopener noreferrer\">here<\/a><\/strong><\/p>\n<p><span style=\"font-weight: 400;\">User testing with the new prototype was a smoother process. Users demonstrated a better understanding of how to navigate and apply filters. The goal of confirming a booking was easily reached. This round of testing did, however, reveal additional features desired by users. These features could be evaluated for inclusion based on the needs to create an&nbsp;mvp and then tested in the next round.<\/span><\/p>\n","protected":false},"excerpt":{"rendered":"<p>This concept project examined how to improve the user experience for searching and choosing travel&hellip;<\/p>\n","protected":false},"author":1,"featured_media":620,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[28,19],"tags":[29,7],"class_list":["post-618","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-research","category-user-experience","tag-research","tag-user-experience"],"_links":{"self":[{"href":"https:\/\/marissaroesijadi.com\/morework\/wp-json\/wp\/v2\/posts\/618","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/marissaroesijadi.com\/morework\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/marissaroesijadi.com\/morework\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/marissaroesijadi.com\/morework\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/marissaroesijadi.com\/morework\/wp-json\/wp\/v2\/comments?post=618"}],"version-history":[{"count":61,"href":"https:\/\/marissaroesijadi.com\/morework\/wp-json\/wp\/v2\/posts\/618\/revisions"}],"predecessor-version":[{"id":872,"href":"https:\/\/marissaroesijadi.com\/morework\/wp-json\/wp\/v2\/posts\/618\/revisions\/872"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/marissaroesijadi.com\/morework\/wp-json\/wp\/v2\/media\/620"}],"wp:attachment":[{"href":"https:\/\/marissaroesijadi.com\/morework\/wp-json\/wp\/v2\/media?parent=618"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/marissaroesijadi.com\/morework\/wp-json\/wp\/v2\/categories?post=618"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/marissaroesijadi.com\/morework\/wp-json\/wp\/v2\/tags?post=618"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}