Design and Usability Study of Hypertension Management Guideline Mobile Application with Hypertension and Non-hypertension Patients

—Hypertension is currently rising steadily among the world population. The first level of screening to know whether one is suffering from hypertension is essential as this lays the foundation for the actual diagnosis. This research details the user interface design and usability evaluation of the hypertension management guideline. The proposed mobile application prototype assists people in screening themselves with regards to hypertension based on symptoms. This prototype also acts as a sharing platform for hypertension patients to help them share their concerns and advice within the related online community. The eye-tracker experiment was used to support the visual strategy of the prototype design. In studying the usability of the mobile application, an experiment carried out with two groups of people, of which one group of people have hypertension. In contrast, the other group of people do not have hypertension. An independent-samples t-test conducted to compare the user performance scores using the proposed prototype. Based on the usability study, both user groups understood and used the applications with ease. However, the findings revealed there was a significant difference in overall scores for hypertension patients and non-hypertension patients. The findings of this study could help software developer design an effective application for hypertension guideline tool for monitoring health and well-being.


I. INTRODUCTION
High blood pressure (hypertension) is not usually something that one can feel or notice. It does not give any symptoms ahead or apparent signs. The only way to know that one is suffering from high blood pressure is to have it measured [1][2]. Recently in 2015, a survey was conducted by National Health and Morbidity concerning hypertension. Based on the overall prevalence of hypertension, 30.3% hypertensionrelated disease is among adults of 18 years and above in Malaysia. Apart from age, hypertension patients are also categorized based on the grouping of areas. In rural areas, the prevalence of people suffering from hypertension is 33.5% compared to an urban area with a percentage of 29.3%. Other findings from the survey are that the overall percentage prevalence of people suffering from hypertension according to their gender is lower among females with 29.7% whereas higher among males with 30.8%. The survey result provides the observation that hypertension diseases can attack anyone regardless of their age, gender, and even their place [3]. This evidence directs that hypertension is a severe and dangerous disease and should be firmly dealt with as it can also lead to death.
The information gathered helps to conduct an in-depth study which in turn helps in creating an application that can help hypertension patients [4]. Various difference methods have used to build a related mobile app [5][6][7][8][9]. However, based on previous studies, it is found that most related applications provide guidance that is too general and less helpful for patients with different symptoms. In this study, a user-centred approach is adopted in designing Hypertension Management Guideline mobile app for helping the hypertensive patients. Interviews were conducted with hypertension patients as used in Jolles et al. [10] to get to know more about the hypertension disease and how they handled the condition. Also, two different groups of people were invited, one group that suffers from hypertension disease and another group that does not suffer from hypertension disease. This study also used the visual strategy with an eye tracker in order to find out the pattern behaviour of the selected users looking at the proposed mobile app design. The proposed framework also supports a simpler user interaction through the user interface. In the following section, the brief description of Hypertension Management Guideline mobile app prototype is developed as MYHpGuide and the methods used to complete this study are discussed.
The rest of the article is structured as follows. Section 2 details the recent literatures of the prototypes used for selfdiagnosis of hypertension; Section 3 illustrates the materials and methods used for the development of proposed prototype design; Section 4 describes the prototype design and user experimental results; and finally, Section 5 concludes the paper.

II. RELATED WORK
In this technology era, people are quite advanced and prefer to self-diagnose their ailments with the help of the World Wide Web before visiting the doctors. In the case of hypertension, self-screening helps the patients to measure their blood pressure, symptoms, and diagnose their disease [11].
Carrera et al. [12] offer a user-friendly high blood pressure (HBP) app to monitor hypertensive patients. The HBP app called BP control is an Android and IOS app which allows the hypertensive patients to communicate their blood pressure measurements with their clinician, thus providing monitoring *Corresponding Author. www.ijacsa.thesai.org and diagnosis. Cruz et al., [13] propose a mobile application called HeartBeat+ for recording and monitoring blood pressure readings for hypertensive patients. It provides an easy way for self-monitoring. The application is a combination of a mobile application for patients and web applications for the clinician to monitor the status of their patients. The web application keeps track of the vital records of the patient, charts of the previous readings, medical history, allergies, habits, and medications. The mobile application can be used by hypertensive patients to feed and monitor their vital signs, daily activities, medications, and food intake. In turn, it helps in identifying what triggers the patients' high blood pressure every time.
Alvarez et al., [14] provide a hypertension prevention method in the lower economic region of Peru with information and communication technology. In this paper, a mobile application called Wondershare-MobileGo is used, which provides a record of the blood pressure of the patients in realtime. Some of the papers also focus on using smartwatch along with smartphone and mobile applications for blood pressure monitoring [15]. Schaeffer et al., [16] present a prototype in his paper that combines an Android application called Lifestyle App, a smartphone, and a smartwatch which all integrated with a Server Lifestyle. The data input from the smartwatch and the smartphone application integrates with the server which lets to several abstract concepts of connection and communication between different devices, which facilitates the development of better lifestyle for patients based on the blood pressure measurement and daily activities.
Meanwhile, Pulgarin et al., [17] study presents the integration of a physical arterial blood pressure monitor with a web server with the help of WIFI interconnection module. They use a wrist blood pressure monitor that measures the heart rate, systolic, and diastolic pressure data, which in turn stores the measured data in an EEPROM storage memory with I2C connectivity, integrates with a Wi-Fi interconnection module to enable communication with the server [18]. The major drawback of conventional hypertension management system is its higher cost of purchasing and system maintenance.

III. MATERIALS AND METHODS
The overview of the design, development and evaluation phase of the proposed model is illustrated in Fig. 1.

A. Identifying User Needs
An experiment was carried out to identify the user needs on the proposed prototype applications. Two main user groups were involved in this experiment. The first group comprises of hypertension patients who have experience with other hypertension applications previously, and the second group includes non-hypertension patients. To gain information and in-depth understanding of hypertension disease, a focus group discussion was conducted from the perspectives of hypertension patients. Each talk was audio recorded. A survey was also conducted with a set of questionnaires with other people on their requirements of the related applications.

B. Prototype Design
Low fidelity prototype has been designed based on the findings of identifying user requirements experiment and Gestalt Principle [19]. Also, the visual strategy is used by conducting eye tracker experiment for the proposed prototype screen and layout design. The proposed prototype design was also tested using an eye tracker device and software called Tobbi Pro. The device detected the movement of the user's eye during the testing of the application's user interface [20]. The device is linked to the software and generates a heat map based on the user's eyes focus during the testing of the user interface.

C. User Experiment
Ten participants are chosen for the usability study of MYHpGuide mobile application. Those who are nonhypertension patients were eager to take part to know more about this application. After the testing, the participants need to give their opinion about the app. Smartphones and laptops were used as a platform to do the testing. The instructions were given to each participant on how to use the proposed prototype mobile application. Below are the tasks that assigned to the participants for the experiment: Task1: Use the search bar and select headache symptom Task2: Browse and select headache symptom guidelines Task3: Bookmark, like and share headache symptom guidelines Task4: Give feedback on headache symptom guidelines by typing "The guidelines were very helpful" on the feedback box for bulleted list.

A. Identifying user Needs
The results from the interview indicate that most hypertension and non-hypertension patients come from various age ranges for both men and women. Thus, it is concluded that the proposed application design and directions should not be complicated and rather be friendly to the user so that the application is accessible among adults and elderly users. The main component is consisting of sets of guidelines to manage hypertension disease. The priority of proposed system feature and functionality of hypertension management guideline application is divided by hypertension and non-hypertension patients. Table I shows the percentages of hypertension and non-hypertension group who have chosen each component.

B. Prototype Design
Our proposed prototype is MYHpGuide application, as shown in Fig. 2(a), a hypertension management guideline application on a smart phone that designed specifically for patients diagnosed with hypertension. It has a database of hypertension guideline management for a patient to refer. Other than that, user can also like, share, save and give feedback for any guideline that they want as illustrated in Fig. 2(b). The task given to participants is to take note of the time in which they complete a task, their understanding of the tasks and tracking their eyes to understand their point of focus. These parameters were noted for both the participating groups.
In the first task, participants need to type "headache" as a symptom in the search box, as shown in Fig. 3 below. Participants can also browse through the symptoms already shown in the app and can choose the headache symptom and or choose any other additional symptoms as per their need. However, some participants were confused about attempting the first task, as most thought that they can only choose the symptoms shown in the list and not type in.
In the second task, the participants need to browse the headache symptom guidelines and select the proper guidelines, as shown in Fig. 3 (Task 1). A list of hypertension guidelines regarding the headache symptom is shown in a list (Task 2).
The list view of guidelines shows the title and a short description of the guideline, including the number of people who have read it. In the third task, the participants need to bookmark, like or share the headache symptom guidelines. The application allows the participants to like and share the guidelines if the participants think that the guidelines are helpful. A bookmark button provided so the participants can save the guidelines for future use. The final task for the participants was that the users could give feedback for the guideline that they choose. A feedback box was provided for the users to share their thoughts and comments regarding the guidelines.

C. Visual Strategy
The primary purpose of the visual strategy in the usability study was to identify the suitable user interface design. The group conducted the visual strategy by using the eye tracker test. In the Color mapping result, the region where the eye focused longer represented with an increasing degree of a warmer colour. For the front page, Fig. 4 shows the logo of the apps had the warmest tone because it had the most observation from the test by the users.
Other than that, the result for the guideline page shows that the author's name had the warmest tone because the users were inquisitive about the author app, as shown in Fig. 5.   Lastly, Fig. 6 shows the result of the guideline system main menu. The results show that the users were more keenly observing the logo of each menu as all the logos had the warmest tone, especially for bookmarks and guideline menu logo.

D. User Experimental Results
An independent-samples t-test conducted to compare the performance scores for hypertension patients and nonhypertension patients. There was a significant difference in scores for hypertension patients (M=3.33, SD=0.08) and nonhypertension patients [M=4.08, SD=0.33); t(8)=-5.41, p<0.01]. The magnitude of the differences in the means is (eta squared= 0.079). Based on the result, all participants successfully managed to complete all the task given. Table II shows the result of user performance. For task 1, 2, 3 and 4, the time difference between the users spending their time on the application was not too big between the two groups. All the data have been recorded in Table II as shown, the time users spend using the application (minutes) with the task given to two groups of hypertension patients and are non-hypertension patients are provided. The result shows that the mean difference between hypertension patients (m=3.3333) and nonhypertension patients (m=4.0750) is approximately 7 second apart. When compared with all the tasks, the value may seem significant, but in real life situation, the 7-second difference is not that big and noticeable. However, it still shows the difference between the performances of the two-user group to complete the task. The standard deviation of hypertension patients overall time taken to complete all tasks is more prominent (SD: 0.33040) than non-hypertension patients (SD: 0.08165). It proves that, in using the hypertension guideline management application, nonhypertension patients take more time than hypertension patients.
Usability testing result was analyzed; both groups can complete all given tasks successfully. In using the MYHpGuide application, non-hypertension patients take more time than hypertension patients to complete all task. An independent-samples t-test showed that there was a significant difference in time taken to complete all the tasks between hypertension patients and non for non-hypertension patients. This result may be due to the lack of experience of nonhypertension patients with hypertension symptoms and related terminology. Compared to non-hypertension users, patients with hypertension are using the proposed apps efficiently, and they took a shorter time to complete all task given because they already familiar and have some experienced with various hypertension symptoms.
The result from the eye tracker test shows that users focused more on visual content (e.g., icons and graphics) compared to words. It can also be concluded that user's eye is more focus on symbols rather than texts because users maybe need to identify and analyze the logo meaning. Other than that, the eye tracker test results also show that users may be more interested in looking at the name of the author's guideline because of their curiosity (see Fig. 5(B)).
It can also be concluded that the eye heat tracker test used on the visual strategy for the proposed design is sufficient to prove the understanding of the target user on the user interface features and the structure of the proposed application. Other than that, the result also shows the design strength and weakness that have on the user interface design, which can guide us to improve the user interface design of related applications.

V. CONCLUSION
The ability of user-centered design in considering the user's needs, devise a plan to meet them, and direct the elderly person's perspective to a positive attitude, has made it plays a significant role throughout the design phase of mobile application for hypertension management guideline. The result shows that the app presented in this paper has a higher engagement of user interaction with the features present in the user interface. Based on the heat map, it can be concluded that the visual engagement with icon and graphic has higher interaction and ease of use for the user. It is also observed that the hypertension group users spend less time on each task as they usually use other similar apps and are experienced with this, while the other non-hypertension group users take more time to get to know each feature in the app. The reported usability evaluation demonstrates that hypertension user performs positively with ease. The app can assist them and provide considerable benefit with the interaction with other similar hypertensions user. This study could help in designing an effective application for hypertension guideline and innovative tool for monitoring health and well-being during daily life activities.