4.2 Data representations
4.2.1 Data Collection
We already described our data source and data types, and now we try to define the
enough, but we try to illustrate the data collection and preparing process in a standard flowchart (Figure 10).
Figure 10: Data collection stages.
Read data: Data collection process starting by reading data from the data-base; SELI project data add from their data cloud directly and google fit data from google storage collected via REST API.
Extract: Informations are in the cloud, or the database does not always struc-ture. There needs modification addition, additions, and substruction before ar-ranging them for analysis. For instant, user collection having information us-ers, their taken courses, and course teacher name. But we need the only course name with the user's information.
Arrangements: Prepare data for analysis with necessary data, makes an ob-ject, and pass them for illustrating in the chart.
gress depends on proper data analysis. Visual data presentations directly help target planning by improvising analyzing skills (Leitner et al., 2017).
Figure 11: Data Analysis and Planning Relation.
In this process, we help learners visualize their data on what they are performing in SELI and regular activity.
Figure 12a: Data Planning Model.
The dashboard uses a bar graph with numerical and plain text presentations of activi-ties to help users predict necessary improvements. According to predictions, a learner can plan for learning analytics (LA) (Figure 12a) and quantified self (QS) (Figure
Figure 12b: Data Planning Model.
4.2.3 Data and Goal
Some of the present generation dashboards used radar or spider graphs to present, which is not suited to our work (Jivet, 2016). Our health data brings some mixed (big and small) data where small data comparison and illustration are hard enough with radar charts. Active research on several visual patterns of charts, we find a bar chart is a suitable option for data presentation. The Bar graph provides a straightforward visualization of data to help evaluate, analyze, and decision-making processes.
performance in the SELI course or daily activity tracked by google. (ii). Righ bar is a goal set by the learner for their study and health improvements.
Numerical conversion: Each information set describes in numerical form. Although data have multiple forms of arrangements inside storages, all data convert to numeri-cal forms for clear understanding during the analysis and plan-making process. For instance, the dataset's assessment information presents as true/false ( True means task complete and false means incomplete). In this project, we convert data into a number and present it in the same unit and scale as data collected, to reduce extra hassle.
Figure 14: Health data and Goal data Presentation.
Color Presentation: The bar for performance and goal are presented in a different color to create a visual difference at first sight. Besides, the cursor hovers on the bar also presents the bar name, value, and types. This visual data analysis, comparison, and dashboard data reflection determine the necessary re-plan for the system. Ac-cording to requirements, the user reinforces some data to achieve the target.
Other data: In the goal dashboard, activities have timeline data besides other data.
Though there is no deadline in SELI course data, our system generates an auto date to maintain the work pace. Users can set a timeline plan for them, and then the sys-tem’s generated dates comparison operation show a reflection.
4.2.4 Reflection model
disciplinary platform (Govaerts et al., 2012; Keestra, 2017). The present generation research develops some computerized models, which can summarize the whole SDS process. It involves all the efforts between ease of each task to find the outcome of these activities. In this section, we try to present a brief description of our reflection model, its architecture, and its benefits.
Self-reflection can be considered a mirror image of individuals' actions. ICT devel-opments bring some dashboard that runs with the cognitive process, which intercon-nects all supporting entities to help controlling, managing, and self-awareness as parts of reflections of systematic processing of life. For self-reflection, some of this work compares learning data with previous years' learner data, and some other SDS model compares with standard data (Jivet, 2016; Majumdar et al., 2018).
Our system plan with student prediction and standard data as goal data and compare it with learning data.
Self-reflection model data arrangements, calculation, and presentation process:
Different reflection tracks, though there are presents separately for study and health, the operation process is quite similar (Figure: 16).
From both learning and health, regulation improvises self-direction skills.
Figure 16: Reflection model.
This reflection model is a standard approach chosen for this work entirely new in a feature. Study reflection (Figure: 16) contains four notifications are for four different activity; similarly, health reflection have three tasks. In the process, we try to main-tain the same sequence as the data present in the data vs. goal model (Figure: 13, 14).
In reflection, the system suggesting what a user should need to take as their next step to complete the course or tasks. The system also prefers any modification necessary it means any re-plan should need to do the course. Whither, Software congratulates users’ on task completion to motivate for future tasks.
4.3 Frameworks and Technologies
This work's outcome is a single-page web application with React.js, JavaScript, Bootstrap 4, UI design with Material UI, graph with chart.js. For back-end node.js, express.js, google fit rest services, OAuth 2.0 service, and MongoDB database.
Single Page application: Single page application is an application that does not require a refresh page for each user's action, such as page data loading- pictures, style, and databases. These applications just load for once, and each
the application is significantly lower. The operation of the web application always divides into very small sub-sections called components. According to necessary, only a small section update/reload, as the entire process is not bothering simultaneously, so the process is first and accurate (Jadhav et al., 2015).
JavaScript and React.js: JavaScript is one of the most powerful web lan-guages at present works. Around 95% of applications are directly or indirect-ly design with javascript (Luong, 2019). JavaScript developed as a script in 1995, and after the release of the ES6 version, it considers as a programming language. To make a web page dynamic, it has many frameworks and librar-ies for a client site and server site.
Reactjs is the most popular front-end component-based JavaScript library, used to make an interactive single-page user interface (Aggarwal, 2018). The working interface of Reactjs follows the MVC (Model View Controler) pat-tern. These three interconnecting interface works like user input received by the controller, managed by models to present the states, as lots of program-ming languages and their libraries used the same patterns, it's relatively easy to use Reactjs with other frameworks without any interferes.
Material UI and Bootstrap 4: Material UI is a mobile-based designing lan-guage, which components are isolated. Unlike regular CSS, they inject style according to displaying plans, and they are self-supporting. In material UI, the first code writes for mobile and then modifies components using CSS's media query. Google developed this language to give users realistic experi-ences with 3D effects, animations, and natural motions (MaterialUI, 2020).
Bootstrap 4 is an open-source framework for any web page; basically, it con-tains a template (HTML and CSS) (Luong, 2019). Bootstrap provides many styles to make a button, image carousel, navigation, modals, forms, typogra-phy, table, and mobile responsiveness for any front-end developments.
fronts of visual charts. Under the MIT license, it is the best data visualization library render in HTML canvas.
Nodejs and Express.js: Node.js is a runtime JavaScript environment written in C++, using Google Chrome’s V8 engine for server-side programming (Liang et al., 2017; Rimal, 2019). It operates asynchronously, which means without waiting for ope operation can process requests. Node.js create servers with the help of express and HTTP module, control users' requests ( receive that and process accordingly), connect them to database or cloud and finally provide a JSON output for render then direct inside an HTML file. In a sim-ple word, node.js creates a non-blocking event executing a platform with an excellent performance guarantee at a maximum speed.
Express is a framework for node.js applications for speeding the development process. It's a middleware group to control all kinds of requests and responses inside applications (Rimal, 2019). All applications might need deployments inside any server. Express is such a framework that is responsible for making a node.js server.
MongoDB: It is a non-relational cloud platform for data storing, editing, and updating. The data storing process of MongoDB is a schema base, and the da-ta type is BSON (Binary JSON). The dada-tabase can store any dada-ta such as string, number, date, and data that a user only needs to make a schema and define their data to reserve in a specific format. Besides, A user can find all data, specific one data (findOne), sort data (both ascending and descending order) also select particular data from the database.
4.4 Chapter Summary
This chapter actively described the architecture, prototypes, and design of our dash-board. Section 4.1 demonstrates the prominent architecture of this project. In section 4.2, the data presentation process, each stage is discussed separately (section 4.2.1 to section 4.2.4, discussed data collection process, data analysis, and planning process, data presentation against goal and reflection model simultaneously), and in section 4.3 discussed frameworks and technologies used in this project.
5 Research Methodology
A preliminary or pilot case study works as fundamental for formulating questions or hypothesis testing for any research (Noor, 2008). A questionnaire, survey, and inter-view conduct for the case study over participants to achieve more information in this research.
5.1 Sample
Analyzing the sample generates a friendly meeting with a few students from the dif-ferent Universities all over Finland. The meeting has two-part, in pre-meeting all supportive system attachments and presentation delivered. As part of the pre-meeting, we requested all users to download the “google fit application” into their mobile phones and subscribe to the SELI platform courses. Then we request them to make some plans for their study and health data improvement using the goal system.
After delivery, all but 12 participants attending us from different universities were under supervision for three consecutive days.
5.2 Introductory Presentation
The project was presented to all the participants thought out the online presentation on the ZOOM platform. The workflow of the system elaborately described and demonstrated full functionalities. All the participants monitored for three days and always tracked their performances, progress, and initiatives.
5.3 Piloting Study
We had conducted a pilot study to reach our research objectives. For research
ques-5.4 Interview Data Collection and Analysis
The research questions were divided into multiple sub-questions and added some support questions to make the research accessible and informative. These questions were answered by user opinion, descriptive opinion. In order to answer the opinion-based questions, the audience opinion was taken from five separate phases:
Strongly Agree
Agree
Neutral
disagree
Strongly Disagree
Descriptive opinion questions were created to ask 'yes,' 'no' questions, and 'yes' an-swers to additional questions about that.
5.4.1 Analysis question Based on RQ 1:
1. What kind of self-direction supportive system user used before the Goal system?
2. Why did they use it?
As: Education, Health, Other.
5.4.2 Analysis question Based on RQ 3:
1. Self-regulated learning is essential, according to the user?
2. Is health management is equally important?
3. These two: Health, Learning phase of self-direction are helping each oth-er?
5.5 Survey Data Collection and Analysis
The HPLP II survey (Majumdar et al., 2019) was performed to address a few study questions, with each survey question between 1 and 5. The method of addressing both problems provides a full picture of the usefulness of self-direction and its
sup-5.5.1 Analysis question Based on RQ 2:
We partition health data into two different categories Physical activity and stress management. The physical activity contains walking data and calories burning data, whereas stress management having sleep data.
Physical Activity
1. Check calories burning,
As: Users calories burning tracking process importance 2. Plan calories need to burning
As: Users calories burning planning process importance 3. Total walking steps
As: Users walking tracking importance 4. Your planned steps
As: Users walking planning importance Stress management
1. Sleeping plan
As: Sleep planning importance for stress management 2. Enough sleep
As: Sleep tracking essential for assuring enough sleep 3. Relax time
As: System effects on relaxation time
We had some supportive questions for this research. We present the user's response into a graph and demonstrate data in a percentage manner.
6 Result and discussion
The project implements inside the Seli platform as a student dashboard. For user in-tegration tests, an interview and a survey generated along with participants. There were 2 different types of questions but are mostly objective types of questions. Be-sides, there are some short and descriptive questions to know the user's thinking's deep level. The questions elaborately describe during the whole process to help users understanding precisely points of the questions.
6.1 Results
Interview organize in zoom platform, user feedback, and supportive question also added with the interviews. But the survey is performed via an online link, and at-tendees respond according to their time.
6.1.1 Research question 01
Figure 17: Self-directed supportive system users.
There was almost 92 percent, 11 out of 12 participants confirmed they were used several different platforms for their studying, health, and hobbies. As a follow-up question, they were asked, “What type of system did you use? If possible, give names?” among of ‘Yes’ answering participants.
91.67%
8.33%
0% 10% 20% 30% 40% 50% 60% 70% 80% 90% 100%
Use
Have you ever use any self-direction supportive system before the Goal system?
Not sure Yes No
In answer, all of the participants said different self-directed learning tools name.
Some of the participants had used more than one platform. According to the answer, there is a list of those platforms.
Duolingo
Science Zone
Mimo
Bookly
Fit
Mockup
There were asked another follow-up question, “Please explain the reason behind it.”
Almost all participants used Duolingo for their language learning application. As part of hobbies, a few of them used the Science Zone to learn scientific information.
Some participants mentioned Mimo, a programming learning platform, and Bookly as an e-reader note maker, marker. Also, 4 participants confirmed they were using fitness application for walking, cycling, sleep, calories, and workout tracking.
6.1.2 Research question 02
To answer this research question, we arrange a survey, and there were asked 7 differ-ent questions.
At first, we asked about our application, the value of a calorie visualization process to help the user track daily calories burn during cycling or workout.
A precise result total of 66.7 percent find helpful, 25 percent find averagely help-ful, and 8.3 percent find very much helpful.
They asked helpfulness of the regular participant’s walking step presentation process in this application.
Figure 19: Walk tracking survey result.
A clear visualization from bar 58.3 percent finds helpful, 33.3 percent find aver-agely helpful, and 8.3 percent find very helpful.
Planning from our application for step and calories helped them reach their daily personal calories burning and walking goal.
In the case of calories burning planning, visualization from bar exhibits 58.3 per-cent finds our application helpful, 33.3 perper-cent find it very helpful (Figure 20a).
In contrast, 8.3 percent find it not helpful (Figure 20a).
Figure 20b: Survey result on planning for Walk steps.
A clear visualization from bar 58.3 percent finds our application helpful, 33.3 percent find it very helpful during walking planning (Figure 20b). Another 8.3 percent find average helpfully (Figure 20b),
In this survey, there were two stress management-related questions in these questions; we try to understand users able to track their sleep correctly, make a healthy plan for them, and plan system helps in sound sleep observation.
Figure 21b: Stress Management: System Effect on Users.
There was some mixed answer to the question “By planning ‘I had’ enough sleep.” Around 75 percent find this application helpful, whereas 16.7 percent marks it as averagely helpful, and 8.3 percent find it not helpful at all (Figure 21a). For another question, “sleep tracking helps in sleep plan,”- around 41.7 percent says averagely helpful, 33 percent says helpful, 16.7 percent says not helpful, and 8.3 percent found not helpful at all (Figure 21b).
Planning Process helpfulness measure was one of our primary concerns. We try to find the user's opinions on the planning process helpfulness on their re-laxation time.
Figure 22: Planning Process Effect on Relaxation time.
Around 58.3 percent found it's helpful, 33.2 percent very helpful, and 8.3 percent
6.1.3 Research question 03
For this question, we asked the user to subscribe SELI course and continue with it.
But all the users complained there was a problem with getting course-related infor-mation; after analysis, a server problem had found. However, they can see their sub-scribed course not able to see any data. Then we updated the server and demonstrated data from my local machine before performing an interview.
Do you think self-regulated learning is essential?
Figure23: Importance of self-regulation to the participant.
We had 7 responses for these parts; the other 5 could not add to this part of the interview. Among the participant, 57.1 percent was agreed, 28.57 percent strongly agreed, and 14.28 percent was neutral.
Do you think health management is equally important?
We get the same results for health management, 57.1 percent was agreed,
Do you think self-regulation learning is essential?
Strongly Agree Agree Nutral Disagree Strongly Disagree
Figure 24: Importance of health management according to the user's.
Are they support each other?
From the first two question results, it was almost easy to imagine users have equal priority both for study and health. But we asked them are they find they are supportive of each other, almost 57 percent agreed, and around 33 percent strongly agreed with that (Figure 25).
Figure 25: Importance of Health and Study regulation.
29%
Do you think health management is equally important?
Strongly Agree Agree Nutral Disagree Strongly Disagree
57.00%
Are Health, Learning Regulation support each others?
Strongly Agree Agree Nutral Disagree Strongly Disagree
Supportive Questions
We had some supportive research questions. Around 11 participants asked these questions and found the following answer illustrated in the graph.
Figure 26: Supportive Research Questions.
Around 72 percent of the user found the application easy to use, another 28 per-cent not. Then 63 perper-cent said it’s user friendly, 37 perper-cent said no. Almost 100 percent said the login system was straightforward. For learning and a healthy lifestyle, around 55% found this application helpful, but 45 denied this. Finally, 81 percent believe this application helps in self-direction, and more than 90 per-cent would be willing to recommend others to use the application.
User experiences and feedback
The application's general view was liked by around 60 percent, and the user interface was acceptable to 70 percent.
However, there were multiple different feedback from the users—the key
o Server Student data missing: A small number of learners complained about server issues, which created a problem with their continuous da-ta tracking process from the SELI dada-tabase.
o The Reflection model was unique: The reflection model designed in this work got acceptance from learners because of real-time sugges-tions and feedbacks.
o Clear data presentation: The hover effect helps the learner to
o Clear data presentation: The hover effect helps the learner to