User Experience Design on Visualization of Mobile-Based Land Monitoring System Using a User-Centered Design Approach

—The use of information and communication technology could increase the quantity and quality of agricultural production, including horticulture. This study focuses on the development of a mobile-based interface that makes it easier for farmers to view the data obtained from the results of land monitoring. In designing mobile devices, applications, and user interfaces, it is important to consider the user experience. This paper focuses on UX design which is based on User-Centered Design approach that focuses on user needs and prioritizes empathy for users, so as to accommodate the identification of user needs and produce high fidelity prototype. Based on the System Usability Scale and the User Experience Questionnaire testing on the prototype, it was found that the level of acceptance of horticultural farmers was positive with the level of the value of all UX elements above the average.


Introduction
There are 38.2 millions people in Indonesia working in agriculture, forestry and fishery in 2020 [1]. The agricultural group is divided into several sub-sectors, namely food crops, livestock and horticulture. Data from the Indonesian Statistical Bureau shows that horticultural yields for each type of plant have increased in 2019, although the harvested areas tends to decrease except for the harvested area of garlic which has increased by 140% [2]. This reveals that the Indonesia horticultural commodities have the potential as export commodities products [3]. The annual exported vegetables and fruit in 2017 approximately 1000 ton [2]. Moreover, the Indonesia non-oil and gas export commodities increase by 11 % in 2019 and horticulture is part of it [4]. In order to improve the non-oil and gas export commodities, there are several things that must be considered, such as quality assurance, supply, and on time delivery [3], [5], [6].
The utilize of information and communication in agriculture increase the quality and quantity of agricultural production [7], [8]. It play a significant role in agricultural development and agricultural entrepreneurship by improving the information delivery as well as disseminations of agricultural technology and services [9]. It also improving the management of agricultural resources where efforts can be made by unite the aspects that determine the quality and quantity of agricultural production [7].
The implementation of information and communication in agriculture have been applied in various countries [10]- [13]. The implementation including the use of Internet of Things (IoT) to monitor agriculture land and crop development [14]- [17]. Commonly monitored variable are light intencity, soil pH, soil moisture, soil temperature, humidity and rainfall [17]. Intensive monitoring will provide many benefits to farmers such as reducing risks and increasing production [18]. The system can support farmers in the decision-making process by providing approprite data at the right time so that the level of risk during the horticultural planting and maintenance process can be minimized.
The use of mobile application increases the accessibility of monitoring system. In designing mobile devices, applications, and user interfaces, it is important to consider the user experience [19]- [21]. The user experience (UX) perspective gain more attention by practitioner and scientist along with the rapid integration of mobile information technology in daily lifestyles, including in the agricultural sector. UX is the entirety effects felt by the user as a result of the interaction, the context of use, the influence of usability, the emotional impact during the interaction, and the memory formed after the interaction. UX is a combination of visual, aesthetic, and emotional aspects that depend on usability and personalization. An important concept in UX is the process by which users shape the experience of using a product since they first encountered the product, where it is translated ISO 9241-210:2019 as user perceptions and responses resulting from the use of the system, product or service.
UX design has an important role in designing and building applications as it presenting considerations of user capabilities and limitations. In this research, a UX design for mobile-based horticultural land monitoring application is proposed. The design aims to: 1) produce applications that have good usability and accessibility, and are sustainable; 2) produce applications that are able to encourage users' positive feelings such as fun and satisfaction, and minimize negative feelings such as frustration. The UX design is conducted using User-Centered Design approach that focuses on user needs and prioritizes empathy for users, so that it accommodate the identification of user needs [22]. The rest of the paper is as follow: the proposed design is described in section 2. The analysis of the design is given in section 3 and conclusion is given in section 4.

The proposed UX design
IoT based monitoring agricultural land is part of precision agriculture which is a modern agricultural management concept that uses digital techniques to monitor and optimize agricultural production processes [23]. Precision agriculture is able to significantly increase crop yields and reduce costs and optimize agricultural production processes [24]. The use of IoT can provide important data to supports farmers in providing fertilizers, pesticides, soil management and irrigation water effectively.
In this study, a land monitoring system is built for organic vegetable farmer. The data aquitition model is given in Figure 1. In order to intepret the data, the application should also consider the vizualitation of the data. In this research, a vizualitation on Android mobile-based application is proposed so that the application appropriate and meet the users needs. The common parameters used in vizualitation design are effectiveness, efficiency, utility and learability of the applications [25]. Moreover, the design should also consider the user's emotions such as enjoyment, memorability, and engagement [26], [27]. Therefore UX can be interpreted as the entire user experience on a software product [28], which includes not only functionality, but also how attractive and pleasant the application is to use. In order to ensure that the mobile-based organic vegetable land monitoring application that is built has a good UX, the UX design will be carried out using a User-Centered Design (UCD) approach. UCD is an ergonomic approach that focuses on users and their characteristics and needs [29] throughout planning, design, and evaluation [30]. Because it focuses on users, the thing that underlies UCD is user involvement to determine the requirements of a system, which occurs mainly in the early stages of conceptualization and ideas activities [31]. It supports design concepts that are based on an explicit understanding of the user, task, and environment; driven and refined by user-centred evaluation; and discusses the entire user experience [32]. The UCD process is shown in Figure 2. The first phase of UX design using UCD is analysis. In this stage, the context of use is determined by identifying the people who will use the product, the purpose of using it, and under what conditions they will use it. In addition, identification of user targets that must be met is also carried out, so that a review of the constraints, problems, and limitations of potential users is carried out. In this case study, the application will be used by farmers groups consists of 30 men whose age range is between 18-38 years. This group manages an area of 10 ha which is planted with various types of vegetables ranging from flower vegetables, fruit vegetables, root vegetables, leaf vegetables, and others. Almost every member has an intermediate level of technological prowess and is familiar with smartphones running the Android operating system. Some of the main requirements obtained at this stage are as follows: 1. Farmers need to know the condition of soil pH and humidity of agricultural soil to mitigate plant diseases and pests 2. Farmers need to know soil temperature, ambient temperature, light intensity and rainfall rate to prevent plants from experiencing stress and optimize plant growth 3. Farmers must be able to see the comparison of existing data within a certain time span 4. Farmers must know when land conditions are outside the normal range 5. There are several blocks of land that must be monitored 6. It is difficult to find labor to handle the land The requirements specifications collected at this stage are used as the basis for carrying out task analysis [33]- [35]. Task analysis is the breakdown of tasks and subtasks required to successfully operate a system [36] in which user goals and user work can be learned [37]. One of the task analysis techniques is Hierarchical Task Analysis (HTA) which can map user interface elements to a very low and detailed level [38]. The HTA is shown in Figure 3.  The second phase of UCD is Design where the specification of existing requirements is used to create a conceptual design solution. This phase begins with designing a user flow based on the HTA. The user flow is shown in Figure 4.
From the existing user flow, a wireframe of a mobile-based monitoring application is made. Wireframe is a screen sketch of a system, or commonly referred to as a blueprint or framework that presents and explains system design ideas to customers, which ultimately leads to consensus on the proposed ideas [39]. In UCD, where the user and their needs are essential, communication is an attempt to understand the user's needs. However, it is common to find users who can't convey what they need and don't even understand their needs. Therefore, wireframe is the right tool to communicate user needs that will be poured in the application. Wireframes can also bridge ambiguity and trigger deeper information from users. This is because rough and loose wireframes provide space for brainstorming and encourage users to be actively involved in providing feedback. An important part in monitoring applications is the visualization of land conditions where there are several crucial things that must be considered, considering the purpose of visual representations is helping users to understand and to explore data, emphasize certain aspects of the data, and tell a story [40]. Data visualization, which is generally understood as presenting data in image or graphic format, also allows decision makers to view the analysis presented visually, thus helping them to understand difficulty or previously unknown concepts [41], [42] and identify new patterns [43]. Therefore, it is important to decide what will be communicated in the data visualization before wireframing. Table 1 shows several stages that need to be reviewed in designing data visualization in order to achieve the principles of UX. Defining the problem [40], [44] By paying attention to the needs of horticultural farmers, seeing and tracking changes in land conditions continuously, selected graphic representation as a line chart.
Determine the data to be represented [42] Quantitative data Specifies the dimensions required to represent the data [42] Univariate dimension Define the data structure Temporal relationship, where the system will display data that represents the condition of the land at a certain time.

Determine the required interaction of the vizualization
Manipulable model, where the user can control the display based on the time range From the conceptual design solution that has been determined, a mock up is designed which is then formed as an interactive prototype at the Prototype stage. As for the Evaluation stage, the prototype that has been produced will be tested on members of the organic vegetable farmer group who then fill out the User Experience Questionnaire (UEQ) and System Usability Scale (SUS).

Wireframe
The design solution is outlined in a wireframe that describes the core form and function of the application to be built. The resulting wireframe is shown in Figures 5 to 7. The wireframe was the first version produced which consisted of basic black and white lines and shapes to give clues as to where navigation, text, and graphic elements would be placed in the application layer. However, these wireframes already provide a comprehensive outline of all application modules so that users can experience how the application works.
There are several menus that are the main part in this application: 1) Home menu which is the main page after farmers enter the application. This page shows the results of monitoring the condition of each land owned by farmers. 2) Graph menu which is a historical visualization of land conditions at a certain time.
3) The Land Menu is a page where farmers can manage the monitored land. Farmers can enter more than one land to monitor in this application. 4) Profile menu is a page for managing profiles of farmers and for managing application accounts.

Prototyping
The wireframe is then interpreted in the form of mockup and proceeds to prototyping by providing interaction on the designed mockup. Mockups are an extended design approach that can improve the system requirements validation process. Meanwhile, high fidelity prototyping is designed to provide more realistic interactions. This prototype includes the necessary insights as a basis for actual farmer usability testing [45].
The results of the designed prototype can be seen in Figures 8 to 11. On the Home menu, there are no significant changes from the wireframe that has been designed, where on this page, farmers can monitor the condition of each registered land, see notifications if there are land conditions that are not correct. abnormal, and view the history of land conditions through graphs on each component of land conditions.  The Graph menu as shown in Figure 9 is a visualization of land condition data that displays the relationship between a land condition and time. Visualization with graphics was chosen so that information and patterns of land conditions can be explored further. The Land menu ( Figure 10) is a page where farmers can manage land, starting from adding, and changing information related to the land they own and need to be monitored through this application. iJIM -Vol. 16, No. 03, 2022 In the Profile menu ( Figure 11) there are 2 sub menus, namely Personal Info and Settings which are consoles where farmers have the option to make settings for activating the notification modality, starting from the appearance of notifications (visual modality), notification sound (audio modality) and vibrating from notifications (haptic modality).
In designing a land monitoring application mockup, there are several laws that are applied. The first UX law is Fitts Law, which states that moving towards a small target or a more distant target takes longer than moving towards a large target or a closer target [46], [47]. Fitts Law proved to be a strong predictor of pointer performance under various conditions [48]. The application of Fitts Law on the application mockup can be seen in the size of the large touch area on the menu and information on land conditions, which are in accordance with the recommendations of Google's Android UI Guidelines, namely a minimum of 48 square pixels [49]. In addition, icons or images with a little text are also used to speed up information processing by users [50].
The second law is Hick's Law, which discusses the relationship between choice reaction time and the number of stimulus-response alternatives (or the amount of uncertainty) in a task [51]. In the mockup design, Hicks's Law is applied to set the number of menus which only consists of 4 as well as the time options for visualizing land conditions in graphic form. The menu arrangement has been ordered to assist users in viewing the information hierarchy from the main page, where the land condition graph is an important information in this application. Setting the number of menus and the arrangement of the menus will affect a shorter time to select [52]. This is also based on Miller's Law, which says that average person's has the ability to store only 7 (plus or minus 2) items in their working memory [53].

Usability and user experience evaluation
The results of the prototyping in the previous process were tested in terms of usability and user experience. The usability is evaluated using the System Usability Scale (SUS) matrix, while the user experience is evaluated using the User Experience Questionnaire (UEQ). The test participants were members of the farmer group consist of 30 people. Usability testing is one of the best methods to systematically evaluate interfaces representative of end users, where participants are asked to perform tasks on the prototype of the Mobile-Based Land Monitoring Visualization Application [54], [55]. Usability testing is carried out as part of the UCD goal, called user preferences and needs. They are analyzed in the early process to maximize usability [56]. The list of SUS statements is shown in Figure 12.  The score results of the evaluation process using SUS is 86. Based on the SUS interpretation (Figure 13), it can be concluded that the Mobile-Based Organic Vegetable Land Monitoring Visualization Application prototype has an adjective rating of Excellent, the grade scale is B and its acceptability ranges is Acceptable.
In addition to usability evaluation, the prototype was tested in term of user experience using UEQ. User experience testing is conducted to ensure that the application meets general expectations about user experience [57]. The UEQ matrix is shown in Figure 14.  Based on the UEQ scale interpretation, impression is considered normal when the value is between -0.8 and 0.8, it is positive when the value is higher than 0.8 and negative when the value less than -0.8 [57], [58]. Based on the experiment result, as shown in Figure 15, it can be seen that the user experience evaluation resulted from the prototype of the Mobile-Based Organic Vegetable Land Monitoring Visualization Application for all UX aspects has a score > 0.8 which means the user has positive impression. The experiments shows that the aspect of, the attractiveness, perspicuity, efficiency, dependability, and novelty aspects are above average.

Conclusion
In this research, a prototype of user experience design on vizualization of mobilebased land monitoring system is proposed. The prototype interface design is produced based on the UCD. The experiment result show that the farmers received the application design with an excellent level of application design usability. In terms of user experience evaluation, all UX aspects of the prototype design had a positive impression and was above average.