King Faisal University
College of Computer Sciences and Information
Human Computer Interaction
Ms. Abeer Alkulaib (email@example.com)
Dr. Amna Asif
Table of Contents
2.1.Problem and design concept 4
3.Report contents 6
4.Learning outcomes. 6
King Faisal University College of Computer Sciences and Information Technology Human Computer Interaction Project
by Dr. Amna Asif
DATE SET: 25/3/2021
DATE OF SUBMISSION AND PRESENTATION : 3 milestones
PROJECT VALUE: 20%
SUBMISSION: Deadlines can be found in this documents
Hardcopy should be submitted, and softcopy should be uploaded in blackboard
NUMBER OF TEAM MEMBERS: 4-5
|2.1||Evaluate various technologies used for computer interaction as well as the issues and opportunities associated with these technologies.[H]|
|2.2||Interact with the software design process in order to create computer interfaces. [C,I,J]|
|3.1||Apply contemporary techniques to design and evaluate computer interfaces both individually and as part of a team. [C, D, I]|
|3.2||Apply a number of design techniques, including scenario-based design and prototyping. [C,I,J]|
|3.3||Design, implement and evaluate effective computer interfaces. [C, I]|
The semester project is a major emphasis of the course. The project provides an opportunity to integrate and practice the concepts from all the course materials taught in the classroom and lab. This activity is teamwork to address an existing problem, design and evaluate a potential solution, and implement a final software product. This is an opportunity to make a real contribution and develop your portfolio.
Aim of this project that students will be able to apply process of interaction design practically and experience all of its phases: (1) Establishing Requirements, (2) Designing Alternatives, (3) prototyping, and (4) Evaluation. In many cases, the students must adapt the user-centered design process by involving users early in the design, empirical measurements early by defining the scenarios and later by interacting with prototypes and performing many iterations.
|Understanding the problem space|
There are various steps involve in the interaction design process presented as follows. It is also summarized in appendix I.
students are required to perform the following steps in order to complete their projects:
The Students are required to:
The students are required to define the problem and report it in an appropriate way. There are various methods available for understanding the problem space i.e. (1) Apply framework of understanding the problem space see Appendix (B), (2) Make claims and assumptions.
For this purpose, the students must use the above two methods to report the problem. In addition, the concept video will be adding advantage. The scenarios can be used for the conceptualization of the problem by providing in textual, Figure, or video form. Understanding the users of the system is considered as the basis of user-centered design process. Therefore, the project could contain the users’ personas.
Teamwork tip: Each member of the team should contribute by stating their claims and assumption. Each member should select a question from problem framework and answer it. Lastly, the contribution of each member will be combined in unified report.
Many types of requirements can be collected by adapting one or a combination of requirements gathering methods such as interviews, focus groups, questionnaires, direct observations, indirect observations, studying documentations, and researching similar systems. In this project the requirements should be collected by studying the related systems on defined criteria. These criteria can be adapted from available usability guidelines and heuristics. Some of them are provided the appendix C-E. First, the team is required to define the criteria of related system study. Later, they have to select the related system to study on defined criteria. Appendix F provide the template of related system study.
Teamwork tip: Each member of team is required to select one related system and study it on unified criteria. The results will be written in unified report.
In the next step, the good aspects and limitation of related systems can be used to define the functional and non-functional requirements. It is required to define non-functional requirements related to usability and user experience of application that can be evaluated in the last step.
The scenarios or use case diagrams can be used to analyze the collected requirements. Task analysis can be used if the project aimed to improve the usability of the existing system.
Teamwork tip: The team should assign each member to make one persona of each user of the system. The remaining members should write scenario of the defined personas.
There are various activities involved in finding the design alternative solutions for the system. Low fidelity prototyping is recommended way of designing alternatives that consist of storyboarding, sketching, prototyping with cards, and Wizard of Oz techniques. The students can adapt one or a combination of these techniques in brainstorming sessions.
Teamwork tip: Each member of the group must produce at least one low fidelity prototype for the proposed system. e.g. if there are four members in the group, then there will be four low fidelity prototypes. You are also required to evaluate these low-fidelity prototypes on good and bad aspects.
Teamwork tip: If there are four members A,B,C,D in one group. Then member A can evaluate the low fidelity design of member B. Member B can evaluate the low-fidelity design of member C. Member C can evaluate the low-fidelity design of member A.
At this stage, the project will be evolved from conceptual design towards concrete design. The user experience journey can be incorporated by using the techniques of:
Formative evaluation is recommended for these stages of design. The experimentation or expert evaluation can be used to compare between various proposed alternatives designs.
This stage involved the development of high-fidelity prototyping by using the computer tool or SDKs such Axure, invision etc. The high-fidelity prototype design can be chosen by combining good aspects of all alternative design, or choose the best alternative designs among all etc. As a result, the interactive prototype can be developed for further evaluation. In the report, it should be mentioned that how you have selected the design for a high-fidelity prototype.
Teamwork tip: Various screens, components, and parts of the high-fidelity prototype can be developed by various team members.
Summative evaluation can be done on this stage of the project. The high-fidelity prototype developed in the previous step will be evaluated adapting (1) with users evaluation, (2) without users evaluation.
In case, if the students have availability of real users, then they can conduct:
In most of the cases, the students can act as experts and evaluate the high-fidelity prototype using:
The students can adapt usability testing to evaluate the system with end-users or expert evaluation to evaluate the system with experts in the field. It is recommended to follow the appropriate methodology of evaluation in this stage.
Teamwork tip: Each group member can act as an expert to conduct heuristic evaluation or cognitive walkthrough.
Teamwork tip: For usability evaluation, first, the team has to design the unified evaluation method; later, they can evaluate by finding the users in their family and friends.
The data can be gathered as follow:
|Effectiveness||No. of errors, accuracy|
|Efficiency||Time to complete the task|
|Usability||SUS, SEQ Appendix G,H|
|Milestone 1: problem and design concept & requirements||Deadline 6th April 2021|
|Milestone 2: Designing alternatives||Deadline 14th April 2021|
|Milestone 3: Prototyping and evaluation, Full report submission, and presentation||Deadline 20th April 2021|
Table of Contents
List of Figures
List of Tables
|Introduction & problem||10 marks|
|Requirements gathering (Previous system analysis, expert evaluation etc.)||20 marks|
|Analysis of requirement|
|Alternative solutions, Proposed Designs solutions (with prototyping), UX design journey||30 Marks|
|Evaluation (Methodology, variables or Tasks, apparatus, procedure, results)||30 Marks|
|Organization of report and technical contents, demo||12 Marks|
|Teams work contribution||3 Marks|
|Questions and Answers||3 Marks|
|Time management with system demonstration||2 Marks|
|Total Marks||20 Marks|
Sharp, Helen, et al. Interaction design: beyond human-Computer interaction. Wiley, 2016.
|Visualization of classification results from Quanic Text|
|Usable Learning Management System|
|Moving in smart kitchen or smart food|
|User Experience in Mobile gaming or social media gaming|
|Designing for accessibility|
|Interactive visualization of health/fitness data|
|Apps for smart watch|
|Secure usability: Towards designing enjoyable interfaces of device security system|
|Disaster management systems visualization or dashboard|
|Community based apps interfaces|
|Transportation related artificial intelligence user interfaces|
|Speech interfaces correction|
|Interactive photobooks systems from the photos collections|
|Interactive Agriculture in KSA|
|Smart tourist management applications|
|Any other topic with the permission of instructor.|
|Coronavirus interactive visualization|
|Smart health system|
|Smart news system|
#1: Visibility of system status
The system should always keep users informed about what is going on, through appropriate feedback within reasonable time.
#2: Match between system and the real world
The system should speak the users’ language, with words, phrases and concepts familiar to the user, rather than system-oriented terms. Follow real-world conventions, making information appear in a natural and logical order.
#3: User control and freedom
Users often choose system functions by mistake and will need a clearly marked “emergency exit” to leave the unwanted state without having to go through an extended dialogue. Support undo and redo.
#4: Consistency and standards
Users should not have to wonder whether different words, situations, or actions mean the same thing.
#5: Error prevention
Even better than good error messages is a careful design which prevents a problem from occurring in the first place. Either eliminate error-prone conditions or check for them and present users with a confirmation option before they commit to the action.
#6: Recognition rather than recall
Minimize the user’s memory load by making objects, actions, and options visible. The user should not have to remember information from one part of the dialogue to another. Instructions for use of the system should be visible or easily retrievable whenever appropriate.
#7: Flexibility and efficiency of use
Accelerators — unseen by the novice user — may often speed up the interaction for the expert user such that the system can cater to both inexperienced and experienced users. Allow users to tailor frequent actions.
#8: Aesthetic and minimalist design
Dialogues should not contain information which is irrelevant or rarely needed. Every extra unit of information in a dialogue competes with the relevant units of information and diminishes their relative visibility.
#9: Help users recognize, diagnose, and recover from errors
Error messages should be expressed in plain language (no codes), precisely indicate the problem, and constructively suggest a solution.
#10: Help and documentation
Even though it is better if the system can be used without documentation, it may be necessary to provide help and documentation. Any such information should be easy to search, focused on the user’s task, list concrete steps to be carried out, and not be too large.
Extract from the Heuristics Developed by Budd (2007) that Emphasize Web Design Issues
Make the system as clear, concise, and meaningful as possible for the intended audience.
Minimize unnecessary complexity and cognitive load
Make the system as simple as possible for users to accomplish their tasks.
Provide users with context
Interfaces should provide users with a sense of context in time and space.
Promote a pleasurable and positive user experience
The user should be treated with respect and the design should be aesthetically pleasing and promote a pleasurable and
|Persuasive Systems Design Principle|
|1. Reduction: A system that reduces complex behavior into simple tasks helps users perform the target behavior and it may increase the benefit/cost ratio of a behavior.|
|2. Tunneling: Using the system to guide users through a process or experience provides opportunities to persuade along the way.|
|3. Tailoring: Information provided by the system will be more persuasive if it is tailored to the potential needs, interests, personality, usage context, or other factors relevant to a user group.|
|4. Personalization: A system that offers personalized content or services has a greater capability for persuasion.|
|5. Self-monitoring: A system that helps track one’s own performance or status supports in achieving goals.|
|6. Simulation: Systems that provide simulations can persuade by enabling them to observe immediately the link between the cause and its effect.|
|7.Rehearsal: A system providing means with which to rehearse a behavior can enable people to change their attitudes or behavior in the real world.|
|8. Praise: By offering praise a system can make users more open to persuasion.|
|9. Rewards: Systems that reward target may have great persuasive powers.|
|10. Reminders: If a system reminds users of their target behavior, the users will more likely achieve their goals.|
|11. Suggestion: Systems offering suggestions at opportune moments will have greater persuasive powers.|
|12. Similarity: People are more readily persuaded through systems that remind themselves in some meaningful way.|
|13. Liking: A system that is visually attractive for its users is likely to be more persuasive.|
|14. Social role: If a system adopts a social role, users will more likely use it for persuasive purposes.|
|15. Trustworthiness: A system that is viewed as trustworthy (truthful, fair, and unbiased) will have increased powers of persuasion.|
|16. Expertise: A system that is viewed as incorporating expertise (knowledge, experience, and competence) will have increased powers of persuasion.|
|17. Surface credibility: People make initial assessments of the system credibility based on a firsthand inspection.|
|18. Real-world feel: A system that highlights people or organization behind its content or services will have more credibility.|
|19. Authority: A system that leverages roles of authority will have enhanced powers of persuasion.|
|20. Third-party endorsements: Third-party endorsements, especially from well-known and respected sources, boost perceptions on system credibility.|
|21. Verifiability: Credibility perceptions will be enhanced if a system makes it easy to verify the accuracy of site content via outside sources.|
|22. Social learning: A person will be more motivated to perform a target behavior if he or she can use a system to observe others performing the behavior.|
|23. Social comparison: System users will have a greater motivation to perform the target behavior if they can compare their performance with the performance of others.|
|24. Normative influence: A system can leverage normative influence or peer pressure to increase the likelihood that a person will adopt a target behavior.|
|25. Social facilitation: System users are more likely to perform target behavior if they discern via the system that others are performing the behavior along with them.|
|26. Cooperation: A system can motivate users to adopt a target attitude or behavior by leveraging human beings’ natural drive to co-operate.|
|27. Competition: A system can motivate users to adopt a target attitude or behavior by leveraging human beings’ natural drive to compete.|
|28. Recognition: By offering public recognition, a system can increase the likelihood that a person or group will adopt a target attitude or behavior|
Sources: Oinas-Kukkonen, Harri & Harjumaa, Marja. (2009). Persuasive Systems Design: Key Issues, Process Model, and System Features. Communications of the Association for Information Systems. 24. 10.17705/1CAIS.02428.
Related systems study template
|Related system1||Related system 2||…||..||Related system m|
System Usability Scale
|Name: __________________________________||Age: ________||Gender: Male/Female|
|Strongly Disagree||Strongly Agree|
|1.||I think that I would like to use this system frequently.||□||□||□||□||□|
|2.||I found the system unnecessarily complex.||□||□||□||□||□|
|3.||I thought the system was easy to use.||□||□||□||□||□|
|4.||I think that I would need the support of a technical person to be able to use this system.||□||□||□||□||□|
|5.||I found the various functions in this system were well integrated.||□||□||□||□||□|
|6.||I thought there was too much inconsistency in this system.||□||□||□||□||□|
|7.||I would imagine that most people would learn to use this system very quickly.||□||□||□||□||□|
|8.||I found the system very cumbersome to use.||□||□||□||□||□|
|9.||I felt very confident using the system.||□||□||□||□||□|
|10.||I needed to learn a lot of things before I could get going with this system.||□||□||□||□||□|
|Name: _____________________________||Age: ________||Gender: Male/Female|
Overall, how difficult or easy was the task to complete?
|Tasks||Very Difficult||_______________________||Very Easy||Failed to perform|
Table of reference
|Problem understanding||Problem||Framework for understanding the problem space, clams and assumptions|
|Need Finding||Requirements||Requirements gathering (interviews, study related systems, focus group, surveys, direct and indirect observation, study related documentation), reporting functional and non-functional requirements, personas, scenarios, use cases, task analysis|
|Conceptual design||Design||Selecting metaphor, system operations, interaction and interface types, proposing alternative designs using low fidelity prototyping, high fidelity prototyping, UX design using Wheel or timeline presentation|
|Evaluation||Formative Evaluation||Usability testing, experimentation, heuristic evaluation, cognitive walkthrough|
Such a cheap price for your free time and healthy sleep
All online transactions are done using all major Credit Cards or Electronic Check through PayPal. These are safe, secure, and efficient online payment methods.