Parlay Concepts

Parlay Concepts Milestone 3 Deliverable: Lo-Fi Prototype & Guerilla Usability Testing Team UXL Sol Choi Monica Lee Neha Nuguru Tuyen Truong

Overview In the previous “Ideation” phase, we sketched possible design solutions for the three pages we focused on in our usability study: Project Overview, Phase Overview Page, and Phase Subpage. We involved our client in a participatory design approach to gather feedback on our sketches. Using the client’s feedback as guidance, we created final sketches of the solution, designed wireframes, and conducted guerilla usability testing with seven participants. We then conducted an affinity analysis to organize the results and feedback from the tests for ideas for improving our solution further for the final deliverable. Table of Contents Lo-Fi Prototype 3 Guerilla Usability Testing: Tasks 4 Guerilla Usability Testing: Results 5 Summary of Findings 6 General Issues 7 General Issues (cont.) 8 General Positive Findings 9 Future Improvements 10 Next Steps 11 2

Lo-Fi Prototype Based on the finalized sketches that were created in the previous phase, “Ideation,” we created low-fidelity wireframes of the three main pages (Project Overview, Phase Overview, Phase Subpage) using Figma. We then added interactivity to a few features of these wireframes using Marvel. View the interactive lo-fi prototype made using Marvel here. View the static lo-fi wireframes made using Figma here. The screens of our lo-fi wireframes, created using Figma 3

Guerilla Usability Testing: Tasks We created a usability test kit to conduct guerilla usability tests of our lo-fi wireframes following the procedure shown in the image below. We based our tasks off of the three key usability issues from our first phase, “Evaluation.” Task 1: You and your team are ready to begin working on the first part of your project. Please navigate to the first phase on the web app. Task 2: You land on the page for your first phase, and you are confused of how to proceed. You want to learn more information about this phase. Find a way to view additional details about what you should do for this first phase. Task 3: You want to fill out more details about the “Customer” portion of the first phase. Proceed to the Customer section. Task 4: You’ve finished filling out all of the sections on the Customer page. Find a way to indicate completion of the page. Task 5: You’ve finished filling out all the information about your project, and now you want to send a deliverable to your stakeholder. Please generate a finalized document of your team’s project. The general steps we took for preparing and executing our guerilla usability tests Source: usability-testing-diy-us ability-testing-method 4

Guerilla Usability Testing: Results As shown on the right, we used a color-coded point designation to mark the degree to which participants struggled when completing the tasks. We calculated the average points of each task in a spreadsheet to quickly determine which task(s) presented the most challenge. Based on the quick analysis, Tasks 3 and 4 were easiest to complete as both had point averages of 1. Tasks 1, 5, and 2 presented the most difficulties as those tasks received the highest point averages. This indicates that the features involved in those specific tasks, such as finding the “i” button, pitching the completed project, and navigating between phases contributed most towards the participants’ struggles. The spreadsheet showing the point designations we gave based on each participant’s performance of the tasks 5

Summary of Findings We conducted an affinity analysis to consolidate individual findings from the guerilla usability test sessions. Collectively, we identified eight themes of general issues that summarize our findings: 1. 2. 3. 4. 5. 6. 7. 8. Terminology Edit Button Information Button Mark Complete Stickiness Organization Navigation Suggestions The affinity analysis we conducted based on our guerilla usability testing results in order to find common themes 6

General Issues 1 Terminology Despite our attempts to use simplified terms, some participants were still confused by certain terms used in our prototype, especially for the “Pitch Concept” button. This indicates that we must make an effort to further clarify and simplify the terms used. 3 Information Button Reception to the “i” information button was mixed. Some participants easily located this button and understood its purpose, while other participants had difficulty finding where the button was and what information it would present. This indicates that we should reconsider the current sizing and placement of where we currently have the “i” buttons. 2 Edit Button Reception to the “Edit” button that we added was mixed. A few participants were confused about the button’s purpose - for instance, one participant thought it was only used to add extra notes rather than to fill out the page. This indicates that we should rethink the inclusion of the button on the page. 4 Mark Complete Though all of the participants were able to successfully mark the page complete using the toggle button, some were confused about the purpose of switching on the “Mark Complete” toggle button and what marking the page as complete really means. This indicates that we should incorporate something into the design to clarify the purpose and importance of this feature. 7

General Issues (cont.) 5 Stickiness Some of our participants mentioned that they would be interested in using Parlay in the future if other team members were also using it, whereas others expressed confusion as to how collaboration works on the platform. 7 Navigation Many of our participants seemed confused as to where to start. Many didn’t understand which phase came first, and many also commented that they were uncertain which fields and elements were clickable. 6 Organization Several participants experienced difficulty locating the Pitch button, despite our revision. This reveals to us that we need to rethink where to place this button for our final hi-fi mockups. 8 Suggestions We received several improvement suggestions from our participants. More details can be referenced in the “Further Improvement” section (page 10) of this document. 8

General Positive Findings From the findings and general feedback that we obtained through the guerilla usability testing, we also identified several features that worked well in our lo-fi prototype: The purpose of the “Mark Complete” feature was generally clear The order of the phases was generally intuitive The tasks were generally easy to complete The sidebar on the left was useful in showing content hierarchy 9

Future Improvements In addition to the suggestions that our participants provided, we’ve identified the following areas for improving our prototype as we head into the final phase: Make it clear about what is and is not clickable Change the wording of “Phase Timeline” to something more intuitive like “Project Cycle” Make each section of the Phase Timeline cohesive by eliminating the breaks between each block Add multiple cards for Sub-Groups like Customer (where there might be more than one customer as a target) Add options to preview, export, or send the concept pitch Make the placement of the “i” icon and Pitch Concept button more obvious Consider moving the “Mark Complete” toggle to the bottom of the page to replicate completion towards the end of an experience Consider switching the sidebar menu content (move the team names to the left to replicate messaging apps layouts like Slack, and move the “Pitch Concept” and product cycle content to the right to reflect a user starting from left to right.) We’ve determined that improvements relating to the “i” icon, Pitch Concept button, and navigation are of the highest priority in our next step because these features had the highest point averages in terms of the difficulty level for the participants to complete the tasks that involved each of these features. 10

Next Steps We will use findings from the guerilla usability tests of our lo-fi prototype to inform changes that should be made to the wireframes. This will help us refine our solutions before moving forward with the final step and deliverable: designing the hi-fi mockups of the Parlay web app. 11

Guerilla Usability Testing: Tasks We created a usability test kit to conduct guerilla usability tests of our lo-fi wireframes following the procedure shown in the image below. We based our tasks off of the three key usability issues from our first phase, "Evaluation." 4 The general steps we took for preparing and executing our