COMP1649M02202324 Human Computer Interaction and Design

<span class="text_page_counter">Trang 1</span><div class="page_container" data-page="1">

<b>Human Computer Interaction and Design (COMP1649) </b>

<b>Full Name: DAO VINH KHANG </b>

<b>ID: Khangdvgcs200222 </b>

<b><small>( Email: </small></b><small></small><b><small> ) </small></b>

</div><span class="text_page_counter">Trang 3</span><div class="page_container" data-page="3">

Greetings, and welcome to this coursework, where we embark on a compelling exploration of the intricacies involved in developing an innovative project. In this report, we will delve into the comprehensive journey of creating an application named Diving Pal. This introduction aims to provide a brief overview of what to expect in the subsequent sections and the overall structure of the report.

<b>2 Background literature </b>

<b>2.1 HCI Research: </b>

The literature review for the Diving Pal project delved into Human-Computer Interaction (HCI), concentrating on user experience, interface design, and analogous products in adventure and outdoor settings. The goal was to guide the conceptual design and requirements of the app, especially in prototyping.

A key insight from the research emphasized the importance of Visibility in outdoor applications. This led to the inclusion of a visually captivating underwater scene in Diving Pal's introduction, aligning with the principle of creating a clear conceptual model for a positive first impression.

Additionally, the research highlighted the crucial role of Feedback in dynamic and outdoor apps. This influenced the design of features like Dive Log and Camera in Diving Pal, ensuring users receive immediate responses to enhance their interactive experience with the underwater environment.

<b>2.2 HCI Theory: </b>

Diving Pal's design strategy is influenced by key HCI theories, including concepts from cognitive psychology and interaction design. Inspired by Donald Norman's principles, a visually immersive introduction emphasizes creating a clear conceptual model for an engaging underwater experience. Feedback is integrated into features like Dive Log and Camera, ensuring immediate user responses for enhanced control and connection.

Constraints in the signup process follow HCI theories, aiming for structured and predictable user experiences. The Mapping principle organizes the Gallery feature for effective navigation of underwater memories. Consistency across features promotes a seamless user experience, aligning with HCI theories. Diving Pal leverages Affordances for intuitive interactions, emphasizing user understanding.

<b>3 Design Process </b>

<b>Conceptual Design: </b>

The conceptual design of Diving Pal envisions an immersive and user-centric platform that goes beyond the digital interface. Drawing inspiration from HCI Research and Theory, the design prioritizes intuitive interactions and a seamless underwater exploration experience.

</div><span class="text_page_counter">Trang 4</span><div class="page_container" data-page="4">

<b>Underwater Introduction: </b>

Concept: A visually captivating underwater scene serves as the entry point, aligning with the Visibility principle. This not only engages users aesthetically but also provides a clear conceptual model for the application.

HCI Research Influence: Informed by the emphasis on visual engagement in outdoor applications from HCI Research.

<b>MenuPage: </b>

Concept: The MenuPage acts as the central hub, featuring intuitive icons for Dive Log, Equipment, Gallery, Camera, Reports, and more. This design ensures consistency and clear affordances, enabling users to navigate effortlessly.

HCI Theory Influence: Aligned with HCI Theory's emphasis on consistent design and clear affordances for intuitive interactions.

<b>Dive Log: </b>

Concept: Dive Log serves as a digital diary, allowing users to input dive details and attach images. This feature transforms data into a narrative, aligning with Feedback principles by providing users with a real-time record of their underwater experiences.

HCI Research Influence: Inspired by the importance of creating a personal connection through digital diaries from HCI Research.

<b>Gallery: </b>

Concept: The Gallery feature organizes underwater images, employing the Mapping principle. Users can personalize their visual dive diary with captions, enhancing their understanding and control over memories.

HCI Theory Influence: Informed by HCI Theory's emphasis on spatial organization and mapping principles.

<b>Camera: </b>

Concept: The Camera feature turns the app into a diving companion, allowing users to capture underwater moments in real-time. This aligns with Feedback principles by providing an immediate visual outcome of their actions.

HCI Research Influence: Driven by the HCI Research emphasis on the importance of real-time feedback in outdoor applications.

3.2 Design Principles:

<b>Visibility: </b>

Integration: Visible and engaging underwater introduction, ensuring users understand the application's purpose.

Evidence: Visualizations of the underwater scene and a captivating introduction contribute to a clear conceptual model.

</div><span class="text_page_counter">Trang 5</span><div class="page_container" data-page="5">

<b>Feedback: </b>

Integration: Real-time features like Dive Log and Camera for immediate user responses.

Evidence: Users can instantly see dive details and images, providing constant feedback during their underwater exploration.

<b>Constraints: </b>

Integration: User-friendly signup form, guiding users through the registration process.

Evidence: A structured and predictable onboarding experience that aligns with HCI Theory's emphasis on Constraints.

<b>Consistency: </b>

Integration: Consistent design across MenuPage and features for a cohesive user experience. Evidence: Uniform navigation and interaction patterns contribute to a predictable and learnable interface.

<b>Affordance: </b>

Integration: Interactive elements throughout the app providing clear affordances.

Evidence: Users can intuitively understand and interact with features, aligning with HCI Theory's emphasis on clear affordances.

In summary, the conceptual design of Diving Pal integrates principles from HCI Research and Theory, creating an immersive and user-friendly platform for underwater exploration. The design principles of Visibility, Feedback, Constraints, Consistency, and Affordance are evident throughout the proposed solution, contributing to a holistic and intuitive user experience.

<b>Design Principles: </b>

<b>Visibility: </b>

Integration: Visible and engaging underwater introduction, ensuring users understand the application's purpose.

Evidence: Visualizations of the underwater scene and a captivating introduction contribute to a clear conceptual model.

<b>Feedback: </b>

Integration: Real-time features like Dive Log and Camera for immediate user responses. Evidence: Users can instantly see dive details and images, providing constant feedback during their underwater exploration.

<b>Constraints: </b>

Integration: User-friendly signup form, guiding users through the registration process. Evidence: A structured and predictable onboarding experience that aligns with HCI Theory's emphasis on Constraints.

</div><span class="text_page_counter">Trang 6</span><div class="page_container" data-page="6">

<b>Consistency: </b>

Integration: Consistent design across MenuPage and features for a cohesive user experience. Evidence: Uniform navigation and interaction patterns contribute to a predictable and learnable interface.

Affordance:

Integration: Interactive elements throughout the app providing clear affordances. Evidence: Users can intuitively understand and interact with features, aligning with HCI Theory's emphasis on clear affordances.

<b>4 Prototype </b>

The mid-fidelity prototype for Diving Pal represents a significant milestone in the design process, embodying the culmination of research, conceptualization, and iterative

development. The prototype is a tangible manifestation of the principles and concepts derived from Human-Computer Interaction (HCI) research and theory.

<b>Design Process: </b>

<b>Initial Wireframes: </b>

Began with low-fidelity wireframes to outline the basic structure and flow.

Incorporated key features like Login, Menu, Dive Log, Equipment, Gallery, Camera, Reports, and Account Recovery.

Transitioned to mid-fidelity prototypes using Axure RP to incorporate interactivity and simulate real-world user experiences.

Applied consistent visual design elements and refined user flows based on usability testing results.

<b>User Testing: </b>

Conducted user testing sessions with the mid-fidelity prototype to identify pain points and gather feedback.

Addressed issues related to visibility, feedback, and consistency based on user input.

<b>Refinement and Finalization: </b>

Incorporated insights from user testing to refine the prototype further.

Ensured that the design adhered to HCI principles, offering a user-friendly and engaging experience.

<b>Key Features: </b>

<b>Login Page: </b>

</div><span class="text_page_counter">Trang 7</span><div class="page_container" data-page="7">

Smooth transition from the login page to the main menu. Social media login options for user convenience.

Design: Users can smoothly navigate to the signup section from the login page through a visible and intuitive link or button.

HCI Principle: This integration aligns with the Consistency principle, providing a coherent and expected flow for users moving between login and signup.

<i><small>Figure 1 Login </small></i>

</div><span class="text_page_counter">Trang 8</span><div class="page_container" data-page="8">

<i><small>Figure 2 Sigup </small></i>

<b>MenuPage: </b>

Visually intuitive menu with icons for seamless navigation. Clear links between each feature, maintaining consistency.

</div><span class="text_page_counter">Trang 9</span><div class="page_container" data-page="9">

<i><small>Figure 3 Menu </small></i>

<b>Dive Log Page: </b>

Interactive input forms for dive details.

Immediate feedback on saving dive log entries.

</div><span class="text_page_counter">Trang 10</span><div class="page_container" data-page="10">

<i><small>Figure 4 Dive Log </small></i>

<b>Equipment Page: </b>

Visual representation of diving gear.

Interactive options to add, edit, or remove equipment details.

</div><span class="text_page_counter">Trang 11</span><div class="page_container" data-page="11">

<i><small>Figure 5 Equipment </small></i>

<b>Gallery Display Page: </b>

Grid layout showcasing images and videos from dives. Interactive elements for expanding and viewing details.

</div><span class="text_page_counter">Trang 12</span><div class="page_container" data-page="12">

<i><small>Figure 6 Gallery </small></i>

<b>Camera Capture Page: </b>

Real-time camera integration for capturing underwater moments. Interactive buttons for snapping photos or recording videos.

</div><span class="text_page_counter">Trang 13</span><div class="page_container" data-page="13">

<i><small>Figure 7 Camera </small></i>

<b>Reports Overview Page: </b>

Graphical representation of dive statistics and patterns. Interactive details for in-depth analysis.

</div><span class="text_page_counter">Trang 14</span><div class="page_container" data-page="14">

<i><small>Figure 8 Reports </small></i>

<b>Account Recovery Page: </b>

Simple and guided process for recovering forgotten passwords. Purpose of the Prototype:

</div><span class="text_page_counter">Trang 15</span><div class="page_container" data-page="15">

<i><small>Figure 9 AccoundRecovery </small></i>

The mid-fidelity prototype serves as a dynamic representation of the Diving Pal application, offering an interactive experience for testing core concepts and validating the design. It allows for hands-on exploration of the user interface, demonstrating the application's flow,

responsiveness, and adherence to Interaction Design principles. The prototype acts as a

valuable learning tool for researchers and designers, enabling them to assess the effectiveness of the design and gather insights for further refinement.

</div><span class="text_page_counter">Trang 16</span><div class="page_container" data-page="16">

<b>5 Research Study </b>

<b>Main Research Question: </b>

"How does the inclusion of a personalized Dive Log feature in the Diving Pal application impact the overall user experience for diving enthusiasts aged 18 to 24?"

Sub-questions:

"To what extent does the Dive Log feature contribute to users' engagement with the application?"

"How does the Dive Log feature influence users' perception of their underwater experiences?" "What impact does the Dive Log feature have on users' satisfaction and sense of

accomplishment?" Hypothesis:

Null Hypothesis (H0): "The inclusion of the personalized Dive Log feature in the Diving Pal application does not significantly impact the overall user experience for diving enthusiasts aged 18 to 24."

Alternative Hypothesis (H1): "The inclusion of the personalized Dive Log feature in the Diving Pal application significantly enhances the overall user experience for diving enthusiasts aged

Participants will be recruited through local diving clubs, online forums, and social media groups related to diving, with a focus on those within the specified age range.

3. Materials Needed:

Diving Pal Application Prototype:

The prototype, including the Dive Log feature, will be used for the study. Underwater Simulation Environment:

Controlled underwater scenarios to simulate diving experiences. User Engagement Metrics:

Tools to measure engagement, such as time spent using the Dive Log and interaction frequency.

User Satisfaction Questionnaire:

A structured questionnaire to assess overall user satisfaction. Post-Task Interview Questions:

Open-ended questions for qualitative insights on the Dive Log feature. 4. Research Methodology:

Pre-Study Preparation:

</div><span class="text_page_counter">Trang 17</span><div class="page_container" data-page="17">

Participants will be provided with information about the study and consent forms for review. Informed Consent:

Participants will sign informed consent forms, clearly stating the nature and purpose of the study.

Participants will receive an orientation on using the Diving Pal application and its features, with a focus on the Dive Log.

Task-Based Interaction:

Participants will engage with the Dive Log feature, recording dive details and attaching images in a simulated underwater environment.

Underwater Simulation:

Participants will experience simulated underwater scenarios to interact with the Dive Log feature.

Post-Task Interview:

Participants will undergo post-task interviews to gather qualitative insights on their experience with the Dive Log.

User Satisfaction Questionnaire:

Participants will complete a structured questionnaire assessing their overall satisfaction with

3. User satisfaction scores will be compared between participants who used the Dive Log feature and those who did not.

Hypothesis Testing:

4. Statistical tests will be applied to determine if there is a significant difference in user satisfaction between the groups.

7. Ethical Considerations: Informed Consent:

Participants will be fully informed about the study's purpose, procedures, and any potential risks before providing consent.

A debriefing session will be conducted to ensure participants leave with a clear understanding of the study's goals and to address any questions or concerns.

Appendix: Research Study Instruments and Documentation

</div><span class="text_page_counter">Trang 18</span><div class="page_container" data-page="18">

<b>Informed Consent Form: </b>

Title: Informed Consent for Diving Pal User Experience Study

<b>User Satisfaction Questionnaire: </b>

Title: Diving Pal User Satisfaction Questionnaire Demographic Information:

Age: Gender:

Diving Experience Level: Beginner / Intermediate / Advanced Experience with Diving Applications: Yes / No

Diving Pal Experience:

Rate your overall satisfaction with the Diving Pal application on a scale of 1 to 10 (1 being very dissatisfied, 10 being very satisfied).

Dive Log Feature:

2. To what extent did the Dive Log feature contribute to your engagement with the application?

Perception of Underwater Experiences:

3. How did the Dive Log feature influence your perception of your underwater experiences? Impact on Satisfaction:

4. Describe any impact the Dive Log feature had on your overall satisfaction and sense of accomplishment.

Improvements and Suggestions:

5. Do you have any suggestions for improving the Dive Log feature or any other aspect of the Diving Pal application?

Title: Diving Pal User Satisfaction Questionnaire

<b>Post-Task Interview Questions: </b>

Title: Diving Pal User Study - Post-Task Interview Questions Introduction:

Thank the participant for their time and participation.

Ensure they are comfortable and open to sharing their thoughts. Experience with Dive Log:

What was your experience using the Dive Log feature in the Diving Pal application? Were there any challenges or difficulties you encountered?

Perceived Impact:

3. How do you think the Dive Log feature influenced your overall experience with the application?

</div>