Khóa luận tốt nghiệp: Tracking in-situ human behavior by using smartphone

The Happy App introduces a paradigm shift in behavioral research by activelysupporting the scientific community in comprehensively tracking human behavior,with a current emphasis on meti

VIETNAM NATIONAL UNIVERSITY HO CHI MINH CITY

UNIVERSITY OF INFORMATION TECHNOLOGY

ADVANCE PROGRAM IN INFORMATION SYSTEM

NGUYEN DUC TRONG - 19522409 NGUYEN ĐỨC TOAN - 19522362

PHD PHAN THANH TRUNG

HO CHI MINH CITY, 2023

ASSESSMENT COMMITTEE

date by the Rector of the University of Information

Technology

Lecce cee ee ence eee e nee n a ened — Chairman

¬ nce e eee e — Secretary

The thesis team sincerely thanks Dr Phan Thanh Trung for closely following theproject implementation process, and contributing useful ideas so that the group cancomplete the thesis topic in the most complete way

The group would like to thank family and friends for encouraging and encouragingthe group to complete the thesis

The team also would like to thank all the teachers of the University of InformationTechnology - Vietnam National University, Ho Chi Minh City, especially theteachers in the Information Systems Department for their help and support

Sincerely thank!

Ho Chi Minh City, January 31, 2024

Author team

Table of contents

Chapter 1: Introduction -5- 55555555 ssssesseeseeeseeseeeseesseeseessee LD

IV 7 6 12

1.2 Goals and Scopes Of Thesis <5 c5 5< 22 99991009004 040.030.040989669660800008040040880 13

Chapter 2 Literature R€VÏ€W -o-cĂSSSĂSSẰSSSSSSSSseseesssesessseseseseessee LF

2.1 Tracking Human Bi€liaVỈOLT o ó6 s9 9 9.9.4 99 0.0 0 0.400.000 00060010090 14 2.2 Tracking Human Behavior Apps d ó5 9 9 9 9.9904 0900.000090 90080968096 17 2.3 A DDIÍCAabÏÏÏẨy (5 << Họ TH THỌ THỌ THỌ TH TH TT 0.01000800090096 19

Chapter 3: Theoretical aSÍC G55 5 550955 989565865685899686996 s6 DL

3.1 Android ŠfUỞÏO - ó6 5 56 9 9 9.9 9.99 0 00.00 0.000 000090 8009 90080910096 21 4.2 JaVa c.ce.ccc./5:, 26,777 /5E5TTT ẦẰN CHÍ HH TỀẪ S.HỊỊHỊHỊỈÌỈÌỈHỈHZA 4088608606 23 4.3 Node ,JS c5 2550 Họ TH 010 00601900 000080000000000000000000800800004900000000000 25 3.4 ÌNO(€IAÌÏÏ€TF 705G G5 9 Họ T0 0.000.000 10000009 0000010090 29

3.6 MongolDB, o-o- cọ Ọ cọ Họ TH 0.0 000 0.00000400000000 0000001090 31

3.7 Cloudinary lbG im Vệ To ‹ốế? T77 71 o c0: 91c49160460660444006440600440060046000004006 33 3.8 RestfulAPl ccccsccsscsssscccsccssscccssescscssesssescessscscecssescsesssssssscesesessssssessssssessscsscsssessessseseesees 35

4.1 System ATFCÏ(€CẦUIT o- << 5< 9 9 Ọ 1 000.0006000 00090006000 10090 38 4.2 Feature (CÏÏ4ØT1T d 0 G5 6 5 9 9 9 9 0 0 0 0.0 00.0.0000 000040.0 0009 0000800010096 39 4.3 Database Diagram << << s cọ 0000.000000 000000060000010090 40

4.4 Use Case đÌÏagTaIm -c- << cọ 99.9.0900 0000010010010080800406000064000000001808018046 43

4.4.1 Use Case diagram oo cece 44 4.4.2 Description Of Á CẦOT G5 + TH HH HH TT TT Thọ TH TH TH TH HH 46 4.4.3 Use Case 0.oi on 46

4.5 Activity (ỈỈ3ØTAIT 7G G5 9 9 4 HH 0.0 0000.000060 0000 000080910090 49

4.5.1 System OVELVICW hố 50

4.5.2 View Profile Info to Change Name and Change PassWorrd se seeerrrrree 51

“A6 0) na ốố ốố ố ốố ố eẦ 52

4.6 Sequence (ÏÏAFAIM o- 0 G5 < 9 9 9 9.99 0 0.0.0 00.00006000 0000400000001 0090 53

4.6.1 Change Name occ 53 4.6.2 Change PaSSWOTC Gv nTH T gHHu t 54 4.6.3 Take PhOtO ececeescsscssesessessessessesseesceseeseeseeseeseescesaecessessessessessessessessesseeseeseeseesaseaeaseaseaseasease 54

6 ri 55

4.7 UI / UX D€SÏÿITn 5-5 <5 4 9 TH 0.0 000000004 000000010090001 0890 56

Chapter 5 Implementation and DeployImen( «5s «<<s«<5s<« OO

5.1 Snapshot main (Ì€SÌKOJD o5 5G 9 99 994 9.99 49.19.999.500 09.00.0000 9008091046 60

nu 60 b2 6l 5.1.3 Forgot password Go n1 991901 1h nh nh nh nh TT TT Thu TH TH TH TH TH HH HH ch ch hư 61 5.1.4 Screen create a tracking behavior CaIT€TA ¿+ 5< %2 E9E£EE#E£EESEEEEEEEErrrkrrrkrrrrree 62 5.1.5 Screen create a tracking behavior VIC€O -ó- -ó- 6 s13 E911 931 31 11 1 1 01 g1 vu nh nh nh nh nh gưy 64 5.1.6 Home Page SG HH HH HH HH TT TH Thọ Thọ TH TH TH HH HH TH TT ng gh 66 5.1.7 Profile nh ốc ố he 66

5.2 Deploy EnVÏFOIN€HIÍ, o- << 5 <9 5 90 9.50099000.00.00000000040056090000890 69

5.2.1 Client (Android Studio)

5.2 Backend (Node]S) 69 5.2.3 Nodemailer 72 5.2.4 Cloudinary 72

Figure 1 Pencil-and-questionnaire SUTVCY c 11312 1119 11 ren 15Figure 2 Telephone calls 01-4 16Figure 3 The ExtraSensory App [2] eccecseccsecceseceececeesceeseceaeceseceesaeeeaeseneseeeeaees 17Figure 4 System Approach of Human activity recognition using smartphone and

SMartwatch [2] - 2262222223353 011v 55x 18Figure 5 A sample raw time-series obtained with 3-axis accelerometer while a userwas taking a van, walking and resting [4] eeeeesceeeseeeeneeeseeeeseeceseeseeereaeersneeee 19Figure 6 Stack Overflow survey of the most used technologies by developers in

"0-0 25Figure 7 This example demonstrates sending a basic email using a Gmail SMTP

SCTVCT c c2 HEHHM T 31Figure 8 System ATrChIt€CfUTC G0 + 1E 99119111 ng HH ệt 39

Figure 9 Function Tree diagram eee + << + +91 31 19v ng ng ng nh 40

Figure 10 Use Case overviews the SYS{€IM 2c n1 9v vn ngư 44Figure 11 Detail Use Case 4: View Profile InfO - 5 + ++x£scseeeserseesers 45Figure 12 Detail Use Case 7: Take PhOfO - +56 c1 k*S+kEskEsskeseesseree 45Figure 13 Detail Use Case 8: Take Id€O - . c1 rưưn 46Figure 14 Activities Overview the System cecceesscesseeesseceseeeeeeeeeeseaeeseaeenseees 50Figure 15 Activities Diagram View Profile Info to Change Name and Change

1) 0n" 51Figure 16 Activities Diagram Create new Post with Take Photo and Take Video 52Figure 17 Sequence Diagram: Change Name - - s5 + ssseesrserese 53

Figure 18 Sequence Diagram: Change Password :ceescessecesceceteecencereeereneees 54

Figure 19 Sequence Diagram: Take Photo with Internet -‹ -««<+ss<+<<+ 54Figure 20 Sequence Diagram: Take Photo with Infernet - ‹ ««+-e<<sex++ 55Figure 21 Sequence Diagram: Take Video ccccesceescesceeseceeeeseceeeeeeeaeeeseeeeeeaees 55Figure 22 Sequence Diagram: Take Video without Internet «- 56

Figure 23 Sign up page & Figure 24 Get OTP to Sign up page - 57

Figure 25 Home Page to view History page c:ccescccesscesseceseceseeceeeceeeceaeersneeees 57Figure 26 User Profile page -.- Ăn Q1 HH HH ngư, 58

Figure 28 Do SUTV€Y Page Án HH HH HH HH nh TH HH nghệ 59Figure 29 LOGi1 07707877 5 5 60Figure 30 Register form & Figure 31 Verify OTP to Reg1sfer .‹ - 61

Figure 32 Fill email to reset password & Figure 33 Verify OTP to reset password

¬— Ầ 61Figure 34 Update new PaSSWOTC SG 1n 1S HH TH ng ng ng 62Figure 35 Tab Home, Create new post and Profile eee +s + scseeeeersessrs 62Figure 36 After click Create new post to Take a picture & Figure 37 Review

picture and select behaVIOT - - - c - Sc 3223321113931 33911 19111 1118 11 1H ng ng vn rưưn 63Figure 38 Fill Survey & Figure 39 Fill Survey 2 «se 63Figure 40 Submit Survey ccccecccccsccessscesseceesecececesecesseeesaecesaeceeeceaeeceaeeeeseeesaeee 64Figure 41 Popup tracking behavior video after success tracking behavior camera 64Figure 42 Record video with limit 10s & Figure 43 Review video and select

Figure 44 Fill behavior & Figure 45 Submit behavVIOT -««++« «+ ++<sx+ss>++ 65Figure 46 Home page see history behavior tracked - - «+ scsxceseesessesses 66

Figure 47 Profile page & Figure 48 Profile Information -.- «+ +-«<<ss«<+ 66

Figure 49 Change name & Figure 50 Change password -«+<<+<+2 67

Figure 51 Notification Setting & Figure 52 Security and DrIVACy - -«- 67

Figure 53 Send us your pTỌ€TH - - - 5 %1 119911 91011 930 1 930 190 ng ng ngư 68

Figure 56 Build to file APK 6 << +11 TH TH HT TH Hàn HH 69Figure 57 Deploy using T€TI€T 5 2 E1 19911189111 9101 30 19930 190 ng ng ngư 70Figure 58 Deploy using render 2 - - - - + + 3311831118111 9311 811 1 911111 x rrrn 71

Figure 59 Deploy using V€TC€Ï - - + k1 HH ng 71Figure 60 Send otp to email to register US€T - - 5c 3x 119 9 srsrereereree 72Figure 61 Send otp to email to reset password US€T 5c S2 +ssesreree 72Figure 62 Cloudinary is a cloud-based service, it provides an image management

solution including upload, storage, manipulation, optimization and delivery 72Figure 63 Store image and VI€O c3 3111911 111 301991119 ng ng ngư 73Figure 64 Store image 0n e 73Figure 65 Store VICÌ€O - - G1 HH HT HH 74Figure 66 Specifications Xiaomi Ï ÏÏÏ” - + s 31139113 1113811111 rrkerrree 75Figure 67 Specifications Oppo f11 [DTO - s6 + 3x 13913911 81111 kg 76

Figure 69 Specifications Realme ÏÍ - + - G1119 9x1 v.v ng ngư, 78

Table 1 Detail description of data collection S€TS - 555555 **++s++seesex 41Table 2 Detail description of data collection Sensors cceescesseeeseceteeeeteeeeaeeees 41Table 3 Detail description of data collection BehaviorCameras 42Table 4 Detail description of data collection BehaviorVideos - «+ 43Table 5 Table Description Of À COT - c1 11H ng như 46Table 6 Table Use Case Specification: Profile InfO - «se c+eceseeseesrs 46Table 7 Table Use Case Specification: Change name «+ +ss<+++sc+se+ 47Table 8 Table Use Case Specification: Change pasSWOrd -s<++<sxs+<s+ 47Table 9 Table Use Case Specification: Take a photo eceesceeseeesceeeneeeeneeeeneeeee 48Table 10 Table Use Case Specification: Take a photo cc«cccsscsse+ 49

Table 11 Specifications Xiaomi | ÏÏT” c- c c5 + E323 E*#EE+seeEsreeeeeeereree 75

Table 12 Specifications Oppo f11 Pro 5 2 311323113 113 EEEEsrsrereereree 76

Table 13 Specifications PocO X3 PO - «c1 TH ng ngư 77

Table 14 Specifications Realme T +2 2+ 1313911181111 11 re rrree 78Table 15 Results of using battery(%) from all devices used for testing 79

10

The Happy App introduces a paradigm shift in behavioral research by activelysupporting the scientific community in comprehensively tracking human behavior,with a current emphasis on meticulously monitoring eating and drinking behaviors.This focus provides invaluable insights into nutritional habits dimensions related tofood and beverage consumption, enhancing our understanding of human behaviorwithin specific contexts The app envisions future development as a versatile andevolving tool, expanding beyond its initial concentration to encompass a wider range

of life categories Grounded in the pivotal roles of eating and drinking in daily life,the Happy App aims to adapt to diverse research needs, becoming a multifacetedapplication Ethical considerations take center stage in its design, prioritizing userwell-being through a commitment to data privacy, informed consent, and an overallpositive user experience Future developments will emphasize user modes and featurelimitations, allowing customization to meet specific research needs while maintaining

a streamlined and user-friendly interface This user-conscious approach aims to strike

a balance between advanced functionalities and simplicity, aligning with userpreferences and avoiding unnecessary complexities in the pursuit of fosteringmeaningful contributions to behavioral science

11

Chapter 1: Introduction

1.1 Motivation

Collecting and understanding human behavior has always been a significant pursuit

in various fields such as psychology, sociology, marketing, and public health Theability to comprehend human behavior not only helps researchers and professionalsmake informed decisions but also paves the way for innovative solutions andimprovements in various aspects of our lives In the past, collecting behavioral data

often involved time-consuming and sometimes intrusive methods However, the

advent of smartphones has revolutionized the way we collect and analyze humanbehavior, making it more accessible and efficient than ever before

In the past, researchers and professionals relied on conventional methods such aspencil-and-questionnaire surveys, in-person interviews, and phone calls to collectdata about human behavior While these methods yielded valuable insights, they wereoften limited in scope and accuracy Pencil-and-questionnaire surveys, for example,

were susceptible to respondent bias and required significant time and resources toadminister and analyze Phone calls and in-person interviews, on the other hand, were

constrained by geographical and logistical limitations, making it difficult to capturereal-time behavior

The limitations of traditional data collection methods underscored the need for a moreadvanced and versatile approach As technology advanced, researchers andprofessionals began to explore the potential of smartphones as a tool for tracking andunderstanding human behavior Smartphones offered several advantages, includingthe ability to collect real-time data, access a larger and more diverse sample ofparticipants, and gather data passively, reducing the potential for bias Theseadvantages prompted researchers and developers to consider how smartphones could

be harnessed to create innovative apps and solutions for tracking and analyzinghuman behavior

The motivation for developing smartphone-based applications to track humanbehavior lies in the unparalleled potential that these devices offer Smartphones havebecome an integral part of our daily lives, serving as personal assistants,communication tools, and sources of information Their ubiquity and capabilitiesmake them ideal platforms for behavior tracking With the right applications,smartphones can collect a wide range of data, including location, activity, socialinteractions, and even physiological metrics Moreover, these apps can passivelycollect data, minimizing the intrusion on users' lives and providing a wealth ofinformation for researchers, businesses, and policymakers As a result, thedevelopment of smartphone-based behavior tracking apps has become a driving force

12

in the quest to better understand human behavior and harness that knowledge for thebenefit of society.

In conclusion, the use of smartphones to track human behavior represents asignificant leap forward in the field of data collection and analysis It offers

researchers, professionals, and businesses the opportunity to gain deeper insights into

human behavior, enabling them to make more informed decisions and developinnovative solutions With the continuous advancement of technology and theincreasing integration of smartphones into our lives, the potential for smartphone-based behavior tracking is only set to grow, opening up new possibilities forunderstanding and improving human behavior in various domains

1.2 Goals and Scopes of Thesis

This thesis investigates human behavior in the context of smartphone usage,

acknowledging the potential for tracking and analyzing these behaviors as a valuable

resource for research in social activities such as eating, drinking, health tracking,fitness, etc Recognizing that the understanding of human behavior in this digitalrealm extends beyond academia, it holds tangible real-world implications Byleveraging the data obtained from smartphone interactions, this research aims toprovide insights that can be harnessed to enhance public health, encouragesustainable practices, and stimulate community engagement In summary, humanbehavior in smartphone usage represents a multifaceted subject with significantimplications for research, offering a means to gain valuable insights into our actions

and their broader impact on society.The central concept behind this thesis revolves

around the development of a smartphone application designed to collect data onstudents’ eating and drinking behaviors

The central concept behind this thesis revolves around the development of asmartphone application designed to collect data on students’ eating and drinkingbehaviors Rather than engaging in the actual collection of behavioral data within thisthesis, the primary focus is to examine the motivations underpinning the creation ofsuch an app and to explore the potential benefits it can offer to behavioral researchers.Recognizing the profound implications of students' dietary choices, which extend topersonal health, academic performance, mental well-being, and the broadereducational institution's culture, this study aims to leverage smartphone technology

as a means to facilitate valuable insights for researchers in the field Thus, thisintroductory passage lays the foundation for an in-depth exploration of the app'sdevelopment and its potential contributions to behavioral research

13

Chapter 2 Literature Review

Understanding human behavior across various domains is a cornerstone of research,requiring the tracking and analysis of behavior patterns Leveraging diverse datacollection methods, including cutting-edge approaches like mobile applications withrecording sensors, enables us to gain invaluable insights into common behaviors

among individuals

The complexities of closed-loop behavior, which are more intricate than the loop situations often studied by psychologists[1] Additionally, it underscores thecomplications introduced by mediating responses and stimuli, which are crucialvariables in behavior tracking

open-Theoretical frameworks such as the Health Belief Model, Social Cognitive Theory,

and the Theory of Planned Behavior are crucial in shedding light on the factors that

shape human behavior, encompassing beliefs, social influences, and environmentalelements

2.1 Tracking Human Behavior

In historical contexts, scholars and practitioners heavily depended on traditionalapproaches, such as manual pencil-and-questionnaire surveys, face-to-faceinterviews, and telephone inquiries, to amass information regarding human behavior.Despite the significance of the findings derived from these methodologies, theireffectiveness was frequently constrained by limitations in both breadth and precision

The utilization of pencil-and-questionnaire surveys marked an era where researchers

painstakingly crafted paper-based instruments to gather data Participants, equipped

with writing implements, responded to a series of inquiries, generating tangible

records Although this approach allowed for a structured data collection process, itinherently suffered from the inherent constraints of paper-based surveys, such aspotential inaccuracies in recording and transcription errors

14

In-person interviews constituted another prevalent method wherein researchers

engaged directly with individuals to glean insights into their behavior This

interactive approach fostered a more nuanced understanding, as interviewers could

probe deeper into responses, capturing subtle nuances and context However, the

logistical challenges of coordinating face-to-face interviews, along with the potential

for interviewer bias and participant self-presentation, limited the generalizability and

objectivity of the obtained data.

Telephone calls emerged as a practical alternative, offering the advantage of remote

data collection while retaining a degree of personal interaction This method

facilitated a broader reach, overcoming geographical barriers associated with

in-person interviews Nevertheless, challenges including response rates, the absence of

visual cues, and potential communication barriers introduced impediments toachieving a comprehensive and accurate representation of human behavior

15

In conclusion, traditional methods like pencil-and-questionnaire surveys, in-personinterviews, and telephone calls played crucial roles in understanding human behavior

in the past However, their limitations prompted a dynamic evolution toward moreadvanced and technologically-driven approaches The assimilation of digital surveys,telephone interviews, and other modern techniques has not only overcome the

constraints of traditional methods but has also opened new avenues in the exploration

of human behavior This transformative shift signifies the dynamic intersection oftechnology and research methodologies, propelling the field toward more robust,efficient, and insightful practices

16

2.2 Tracking Human Behavior Apps

Tracking Human Behavior Apps have evolved significantly, with a notable example

being the ExtraSensory App Vaizman et al.'s research, titled "Extrasensory app: Data

collection in-the-wild with rich user interface to self-report behavior,"[2] focused on

collecting the ExtraSensory Dataset from 60 participants using everyday devices By

maintaining ecological validity, participants used their personal phones in natural

environments, engaging in unscripted and unobserved behavior The app successfullyutilized images, videos, and GPS to track a wide range of behaviors, providing over300,000 labeled minutes of rich, self-reported data However, it's important to notethat not all apps prioritize user tracking behavior or include actual survey samples,prompting the creation of the Happy App in Vietnam with a specific focus on trackingeating and drinking behavior

9% OY © B 11:28

Gap ~25 minutes

17

Another noteworthy app in the realm of tracking human behavior is the HumanActivity Recognition Using Smartphone and Smartwatch app Highlighted inresearch by H Ali and A Muslim, titled "Human activity recognition usingsmartphone and smartwatch,"[3] the study emphasizes the increasing role ofsmartphones in everyday life The app capitalizes on the growing sophistication ofsmartphones driven by advancements in computational power, network capabilities,and sensor technology Recognizing the diverse array of hardware sensors in

smartphones, including accelerometers, gyroscopes, compasses, barometers,

temperature and humidity sensors, light sensors, and GPS receivers, the app provesinstrumental in comprehensive human activity tracking

Web server

Internet

Figure 4 System Approach of Human activity recognition

using smartphone and smartwatch [3]

The pursuit of effective daily activity tracking through smartphones is furtherexemplified by the research conducted by J Chinrungrueng and S Sartsatit in

"Tracking daily activity using smartphones."[4] Focusing on four main activities —sleep, rest, walking, and driving — the research addresses critical issues such as batteryconsumption, variations in accelerometer chip specifications, and classification inuncontrolled, real-world environments By leveraging smartphones, this appsuccessfully contributes to the understanding of daily activities Yet, as with otherapps, the emphasis on user tracking behavior and the inclusion of survey samples are

18

paramount considerations, leading to the development of the Happy App in Vietnamwith its initial scope centered on tracking eating and drinking behavior.

Figure 5 A sample raw time-series obtained with 3-axis accelerometer

while a user was taking a van, walking and resting [4]

2.3 Applicability

The landscape of app Tracking human behavior is undergoing remarkabledevelopments, both in Vietnam and on a global scale While there is a shortage ofsuch software locally, efforts are underway to bridge this gap and contribute to the

field of research Simultaneously, internationally, various apps have already madesignificant strides in tracking human behavior, showcasing the global nature of this

technological advancement

In Vietnam, the initiative to create an App tracking human behavior has gained

prominence Recognizing the limited availability of such software in the country, weare growing focus on developing a homegrown solution This initiative is particularlyaimed at serving researchers in Vietnam, aligning with the specific needs and nuances

of the local context The goal is to establish an App with a server hosted locally,

19

enhancing accessibility and responsiveness to the unique requirements of researchersoperating within the Vietnamese framework.

Contrastingly, on a global scale, numerous apps have already established theirpresence in the domain of Tracking human behavior The ExtraSensory App, HumanActivity Recognition Using Smartphone and Smartwatch, and Tracking DailyActivity using Smartphones are prime examples of such advancements These appsleverage various technological features such as images, videos, and GPS tocomprehensively track and analyze human behavior While these internationalsolutions contribute significantly to the broader field of research, the need for alocalized App in Vietnam reflects the importance of tailoring technology to specific

regional contexts

Amidst this global and local perspective, the establishment of the “Happy App” inVietnam further underscores the commitment to filling the void in local software Thevision extends beyond merely tracking human behavior; it encompasses the creation

of an App with a self-hosted server, aligning with the extensive goal of providing atailored and efficient tool for researchers in Vietnam This initiative represents a

harmonious integration of global advancements and local needs, contributing to the

evolving landscape of app technology for tracking human behavior

20

Chapter 3: Theoretical Basic

In order to bring the best experience tracking human behavior, we have researchedand implemented a new project called "Happy App" In chapter 1, we provided anoverview of the urgency of the subject and the applicability of gathering andcomprehending human behavior has perpetually remained a paramount pursuit acrossdiverse disciplines like psychology, sociology, marketing, and public health Thecapacity to grasp human behavior not only empowers researchers and professionals

to make informed decisions but also serves as a catalyst for innovative solutions and

enhancements across various facets of our lives Historically, the collection of

behavioral data entailed methods that were often time-consuming and occasionallyintrusive However, the emergence of smartphones has ushered in a revolutionaryshift in how we collect and analyze human behavior, rendering the process moreaccessible and efficient than ever before In chapter 3, we will delve into the methodused to develop and implement the "Happy App" project This will include adiscussion of the technologies and frameworks used, such as Java, Nodejs, Expressjs,

MongoDB, Cloudinary and Nodemailer We will also discuss the steps taken to

ensure that "Happy App" is user-friendly and easy to use By the end of chapter 3,

readers will have a clear understanding of the technical aspects of the "Happy App"

project and how it was brought to life

3.1 Android Studio

Android Studio is the official unified developmentenvironment (IDE) for Android applicationdevelopment [5] Powered by IntelliJ IDEA'spowerful code editor and developer tools, AndroidStudio provides additional features that help you

21

increase your productivity when building Android apps, such as:

An active build system based on Gradle

A fast and feature-rich emulator

A unified environment where you can develop for any Android device

Live Edit feature for real-time merge updates of elements in the simulator andthe actual device

Code samples and GitHub integration to help you build popular apps as well

as imported code samplesTest a variety of frameworks and toolsThe tool searches the source code (lint) for errors to catch performance,usability, version compatibility, and other issues

Support C++ and NDK

Built-in Google Cloud Platform support features, making it easy to integrateGoogle Cloud Messaging and App Engine

*In Android Studio we using libraries:

GrenderG/Toasty: This library is an Android library used to display brief

notifications (toast) on the app's screen This library provides an easy way to

display toast notifications with customization options and beautiful effects.Toasty allows you to create toast notifications with properties such as text,

color, icon, display time, and display position on the screen You can use the

library's methods to create simple or customized toast notifications as desired.With Toasty, you can create more intuitive and interesting toast notificationsfor your app's users It helps improve the user interface and overall userexperience of the app

okhttp3: is an Android library for working with network requests and HTTP

communication in the application It provides tools and APIs for creating,sending, and processing network requests OkHttp helps you connect andcommunicate with remote servers via HTTP or HTTPS This library supportsfeatures such as creating and sending GET, POST, PUT, DELETE requestsand other HTTP methods It provides an easy way to add information such as

headers, parameters, request data, and handle responses from the server.

OkHttp also supports features like Cookie management, asynchronousexecution, data compression, caching, authentication and more It is highlycustomizable, allowing you to adjust and configure network-related settingssuch as timeouts, buffer sizes, and connection management With OkHttp, youcan create flexible and efficient network requests in your Android application

22

It provides powerful tools for interacting with remote servers and transferringdata over the HTTP protocol.

e Work Runtime: is an official library of Android Jetpack, providing tools and

APIs to handle asynchronous work in Android applications Android JetpackWork Runtime Library allows you to schedule and execute jobs in thebackground or while the application is inactive This is useful when you need

to perform long-term tasks, synchronize data, download data from thenetwork, or perform operations that do not affect the user interface

e picasso: is an Android library used to load and display images in the

application It provides an easy and convenient way to load images fromdifferent sources and display them in user interface components like

ImageView Picasso helps reduce the complexity of loading images in

Android apps by providing simple methods for loading and displaying images

It automatically manages image loading according to requirements, ensuringperformance and saving memory With Picasso, you can easily load anddisplay photos in your Android app easily and efficiently It helps optimizeimage loading, minimize hard work, and enhance your applicationperformance

e gms:play-services-location: is an Android library powered by Google Play

Services, and it provides tools and APIs for working with location and location

services in Android applications This library helps you access and use

geolocation and location-related features in your app.

We opt for Android Studio to develop the “Happy App” application because of itsofficial IDE status, comprehensive feature set, and seamless integration with theAndroid platform These factors collectively make it the preferred choice for Androidapp development

3.2 Java

Now we will introduced one of the most

é importan language that build our Happy App.

—J) And that is Java, as you know Java is a

high-= level, object-oriented programming language

Java that is designed to be platform-independent,

meaning that Java programs can run on any device that has the Java Virtual

Machine (JVM) installed[6] It was developed by Sun Microsystems, which is now

23

owned by Oracle Corporation Java programming is known for its simplicity,

readability, and versatility, making it one of the most widely used languages in theworld

*Key features of Java include:

e Platform Independence: Java code can be written once and run anywhere.

This is possible because Java programs are compiled into an intermediateform called bytecode, which can be executed on any device with a

compatible JVM

e Object-Oriented: Java is designed around the concept of object-oriented

programming, which promotes the use of classes and objects This approachenhances code organization, reusability, and maintainability

e Automatic Memory Management: Java has an automatic garbage collection

system that automatically deallocates memory occupied by objects that are

no longer in use This helps in preventing memory leaks and makes memory

management more convenient for developers

e Security: Java has built-in security features, such as the sandboxing of

applets in web browsers This helps in creating secure applications,

especially in web-based environments

e Rich Standard Library: Java comes with a comprehensive set of libraries

and APIs (Application Programming Interfaces) that provide pre-builtfunctionalities for various common tasks This simplifies development andreduces the need to write code from scratch

e Multithreading: Java supports multithreading, allowing multiple threads of

execution to run concurrently This is beneficial for developing applicationsthat can perform multiple tasks simultaneously, enhancing performance and

responsiveness

e Portability: Java's "write once, run anywhere" philosophy contributes to the

portability of applications across different platforms without modification.

Java is widely used for developing a variety of applications, including web

applications, mobile applications (Android apps are primarily written in Java),

enterprise-level applications, and embedded systems It has played a significant role

in the evolution of the internet and continues to be a popular choice for developers

in various domains

24

3.3 Node JS

Now that we have introduced Android Studio andJava as a key technology used in the development of

“Happy App”, let's move on to discussing another

important technology that is used in the project:

NodeJS NodeJS is a popular JavaScript runtime that

is used to build scalable network applications It isbased on an event-driven, non-blocking I/O model,

which makes it lightweight and efficient In this

section, we will delve deeper into NodeJS and its

role in Happy App

Node.js became the right platform for webdevelopment by inheriting JavaScript It is the most popular language today withmillions of free tools and an active community Node.js, due to its connection to JS,has quickly become popular with developers and is one of the most popular RuntimeEnvironments among developers According to Stack Overflow's survey of the mostused technology by developers in 2023 [7] (Figure 6 ), NodeJS is at the top with42.65% of developers Proved that it is very popular with developers

Node.js and React.js are the two most common

web technologies used by all respondents.

Node.js is a JavaScript runtime built on Chrome's V8 JavaScript engine It allowsdevelopers to run JavaScript on the server side, enabling the creation of server-sideapplications with JavaScript.

One of the main advantages of using Node.js is that it is built on top of an

event-driven, non-blocking I/O model This makes it efficient and scalable, particularly for

applications that need to handle many concurrent connections

Node.js also has a large and active developer community, which has contributed awide range of packages and modules that can be easily installed and used in Node.jsapplications This makes it easy to build and extend applications with Node.Js

Node.js is used in a wide range of applications, including web servers, real-timeapplications, and command-line tools It is particularly well-suited for buildingserver-side applications that need to handle a high volume of requests and

connections, such as real-time chat applications and online gaming platforms.

Overall, Node.js is a powerful and popular tool for building server-side applicationswith JavaScript Its event-driven, non-blocking I/O model and large developer

community make it an attractive choice for many developers

There are several reasons why Node.js has become so popular:

¢ JavaScript is a widely used language, and Node.js allows developers to useJavaScript on the server side, making it easier for developers who are already familiarwith JavaScript to build server-side applications

¢ Node.js has a lightweight, efficient runtime, which makes it well-suited forbuilding scalable, high-performance applications

¢ Node.js has a large and active developer community, which means there aremany open-source packages available that can be easily integrated into Node.jsprojects, saving developers time and effort

* Node.js has a flexible architecture that allows developers to build a wide

range of applications, including real-time web apps, microservices, and APIs

26

*In NodeJS we using libraries:Express (not a library but a

framework): is a web

—X (aS S Js framework built on Node.js It

O) provides structure and tools to

develop web applicationsquickly and easily Express isconsidered one of the most popular frameworks in the Node.js community [8].Express helps you build web applications by providing features and APIs for HTTPrequest handling, routing, middleware, error handling, and more Here are some keyfeatures and benefits of Express:

+ Routing: Express allows you to route HTTP requests to specific URL addressesand process them You can define routes for HTTP methods like GET, POST, PUT,DELETE and more

+ Middleware: Middleware are functions that are executed before, after or duringHTTP request processing Express allows you to add middleware to performfunctions such as authentication, logging, input processing, and more

+ Error handling: Express provides mechanisms to handle and manage errors in your

application You can define special middleware to handle errors and send appropriateresponses when errors occur

+ Responses and requests: Express provides objects and methods to handle requests

from users and send responses You can define HTML, JSON, static file responses,and even create custom responses

+Third-party middleware modules: Express allows you to use third-party

middleware modules from the Node.js community, helping to extend the features and

capabilities of your application.

Express helps you build flexible and powerful web applications in Node.js It reducesrepetitive work and provides a structured way for application development With

27

Express, you can quickly build responsive web applications and easily scale themaccording to your needs.

Multer: The "multer" library is a Node.js middleware used to handle file

uploads in Express applications Multer allows you to handle HTTP requestscontaining multimedia data (multipart/form-data), such as file upload requestsfrom users Multer helps you extract files from requests and store them on your

server.

Multer-Storage-Cloudinary: The library "multer-storage-cloudinary" is a

plugin for Multer, helping you store files uploaded to Cloudinary Withmulter-storage-cloudinary, you can configure Multer to automatically uploadfiles to the Cloudinary service, instead of storing them on your server Thisplugin integrates Multer with Cloudinary, allowing you to take advantage ofCloudinary's features and services in uploading and processing multimediafiles

When combining the Multer, Multer-Storage-Cloudinary, Cloudinary libraries, theprocess of handling photo and video uploads in your application can be done as

cloud_name, api_key, api_secret) so that Multer can interact with the service

Once the file has been uploaded to Cloudinary, you can use Cloudinary's APIs

to process and store multimedia files according to your application's needs.Cloudinary offers features like cropping, format conversion, imageversioning, and more so you can customize and process your media files asdesired

We opt for Node.js due to its exceptional performance in situations where high

concurrency, low-latency, and real-time capabilities are crucial, even though it maynot be the optimal choice for every use case

28

3.4 Nodemailer

After introduced Theoretical Basic about NodeJS,

we continue to show Nodemailer It is a popularopen-source library for Node.js that simplifies theprocess of sending emails from a Node.Js

application It provides a straightforward and

Nodemailer

transport methods, such as SMTP, sendmail, or even directly from the application[9]

Key features of Nodemailer include:

flexible API for sending emails using various

e Multiple Transport Options:

Nodemailer supports various transport options, allowing you to send emails usingdifferent methods Common transports include SMTP, sendmail, and even a directtransport for testing purposes

e Attachments and Inline Images:

You can easily attach files or embed inline images in your emails using Nodemailer.This is particularly useful when sending rich HTML emails with images orattachments

e HTML and Plain Text Emails:

Nodemailer supports both HTML and plain text email content This flexibility allowsyou to send emails with different formats based on your requirements

e SMTP Configuration:

If you choose to use SMTP as the transport method, Nodemailer provides options to

configure SMTP settings, including server, port, authentication, and security settings

e Promise-Based API:

29

Nodemailer uses a promise-based API, making it easy to work with asynchronousoperations This is especially beneficial when integrating with other asynchronousNode.js features.

e Template Support:

You can use templates for email content, making it easier to structure and customize

the email's appearance Nodemailer can work well with templating engines likeHandlebars, allowing dynamic content in emails

e Error Handling:

Nodemailer provides robust error handling mechanisms, allowing you to handleerrors gracefully and provide appropriate feedback in case of issues during emailsending

MongoDB is a popular, open-source NoSQL (Not

Only SQL) database management system designed to

handle large volumes of data that doesn't fit neatly into

tabular structures, which is typical of traditionalrelational databases MongoDB is known for its

flexibility, scalability, and ability to handle

unstructured or semi-structured data It was developed

by MongoDB Inc and is part of the NoSQL database

Key features of MongoDB include:

e Document-Oriented: MongoDB is a document-oriented database, which

means it stores data in flexible, JSON-like BSON (Binary JSON) documents

31

These documents can contain nested arrays and subdocuments, allowing forthe representation of complex data structures.

Dynamic Schema: Unlike traditional relational databases, MongoDB does notenforce a rigid schema Each document in a collection can have a differentstructure, enabling developers to evolve the database schema withoutdowntime

Scalability: MongoDB is designed to scale horizontally, allowing for the

distribution of data across multiple servers This makes it well-suited forhandling large datasets and high-traffic applications

Indexes: MongoDB supports various types of indexes to improve query

performance Indexes can be created on any field in a document, includingthose within arrays and subdocuments

Query Language: MongoDB provides a rich and expressive query language,supporting a wide range of queries, including field, range, and regularexpression searches

Aggregation Framework: MongoDB includes a powerful aggregationframework that allows for the processing of data and transformation within thedatabase itself This is particularly useful for complex data manipulations and

MongoDB is commonly used in various applications, including content management

systems, real-time big data analytics, mobile applications, and for handling largevolumes of data in a scalable and flexible manner Its document-oriented nature andability to handle diverse data types make it a popular choice for modern applicationdevelopment

We opt for MongoDB because it excels in scenarios requiring flexibility, scalability,and efficient management of unstructured or evolving data It's crucial to evaluateyour specific use case and requirements to fully leverage MongoDB's advantages

32

3.7 Cloudinary

Cloudinary is a cloud-based mediamanagement solution that provides acomprehensive set of tools for managing,

optimizing, and delivering images and

videos for web and mobile applications Itoffers a range of features to streamline theprocess of handling media assets, fromupload and storage to dynamic manipulationand delivery [11]

Key features of Cloudinary include:

e Image and Video Storage:

Cloudinary allows users to securely upload and store images and videos in the cloud,

providing a reliable and scalable storage solution

e Dynamic Image Manipulation:

Cloudinary enables dynamic on-the-fly image transformations, allowing users toresize, crop, rotate, and apply various filters to images without the need to create andstore multiple versions of the same image

33

e Responsive Images:

It supports responsive design by delivering images in appropriate sizes based on theuser's device, screen size, and resolution This helps in delivering an optimal viewingexperience across various devices

e Video Transcoding and Manipulation:

Cloudinary extends its capabilities to video management, providing transcodingservices, video quality optimization, and dynamic video transformations

e Content Delivery:

Cloudinary leverages a global content delivery network (CDN) to ensure fast andreliable delivery of media assets to end-users worldwide This improves the overallperformance and user experience

e Versioning and Backup:

Users can track changes and versions of their media assets, and Cloudinary providesbackup solutions to prevent data loss

e Security and Access Control:

Cloudinary offers robust security features, including authentication, encryption, and

access control, to protect media assets and ensure secure access

e Integration with Development Frameworks:

Cloudinary provides software development kits (SDKs) and integrations with populardevelopment frameworks and platforms, making it easy for developers to incorporatemedia management features into their applications

e Analytics and Reporting:

Users can gain insights into media asset performance and user engagement throughanalytics and reporting tools provided by Cloudinary

34

Cloudinary 1s widely used by web and mobile developers, marketers, and contentcreators to simplify the management of media assets and enhance the visualexperience of their applications Its flexibility, scalability, and ease of integration

make it a popular choice for handling media in modern digital experiences

We opt for Cloudinary in the development of the Happy App application because, inessence, Cloudinary stands out as the preferred solution for cloud-based mediamanagement Its comprehensive feature set, seamless integration, global contentdelivery, security features, and scalability make it an ideal choice Cloudinaryeffectively streamlines the intricacies of managing media assets, empowering you toconcentrate on providing a vibrant and compelling user experience in yourapplications

3.8 RestfulAPI

A RESTful API (Representational State TransferAPI) is an architectural style for designingnetworked applications It is based on a set ofprinciples and constraints that define how web

services should be structured and how they should

behave RESTful APIs are commonly used in webdevelopment to enable communication between

different systems over the internet [12].

Key principles and characteristics of RESTful APIs include:

e Stateless Communication:

RESTful APIs are stateless, meaning each request from a client to a server mustcontain all the information needed to understand and process the request The serverdoes not store any information about the client between requests

35

e Representation:

Resources are represented in a format, such as JSON or XML, which can be easilyunderstood by clients Clients interact with these representations rather than directlywith the resources

e Stateless Communication:

+ Each request from a client to a server must contain all the information needed to

understand and process the request The server does not store any information aboutthe client between requests

+ RESTful APIs use standard HTTP methods for communication For example, GET

is used to retrieve a resource, POST is used to create a new resource, PUT is used toupdate a resource, and DELETE is used to remove a resource

+ RESTful APIs can support different representations of a resource, such as JSON orXML Clients can request the representation they prefer, and servers can respond withthe appropriate representation

+ Hypermedia as the Engine of Application State (HATEOAS) is a constraint that

allows the server to provide information to clients about what actions can be takennext Clients interact with the application entirely through hypermedia provideddynamically by application servers

36

RESTful APIs are widely used in web development due to their simplicity,

scalability, and ease of integration They are particularly well-suited for building webservices that can be consumed by various clients, including web browsers, mobiledevices, and other applications The adherence to standard HTTP methods and statuscodes simplifies the implementation and understanding of these APIs

We opt for a RESTful API in the development of the Happy App application because,

in essence, selecting a RESTful API offers simplicity, standardization, scalability,flexibility, and extensive community support It represents a widely accepted andproven methodology for constructing resilient and interoperable web services

37

Chapter 4 System Analysis and Design

System Analysis and Design is an important phase in the development of Happy App.Because this is to create a detailed plan for how the Happy App system will bedeveloped and implemented In this chapter, we will analyze and design the system

to ensure that it meets the requirements and needs of the users We will use variousdiagrams and models to represent the system and its components, including systemarchitecture diagrams, function tree diagrams, database designs, use case diagrams,activity diagrams, sequence diagrams and design interfaces We will also design theuser interfaces, including wireframes, to ensure that the system is easy to use andnavigate By thoroughly analyzing and designing the system, we can ensure that

Happy App is a reliable and effective platform for users to share and discover

The system architecture design is an important step in the development process, as ithelps to ensure that the system is scalable, maintainable, and able to meet the needs

of the users It also helps to identify potential bottlenecks or areas of weakness in thesystem, which can be addressed early in the development process

Some key considerations when we are designing the system architecture for Street

Anywhere include:

* Identifying the various components of the system, such as the user interface,the database, and any third-party APIs or services that may be used

* Defining the relationships between these components, and how they will

communicate with each other

* Ensuring that the architecture is scalable, so that the system can handle a highvolume of users and data without performance degradation

¢ Ensuring that the system is maintainable, with a clear separation of concerns

and well-defined interfaces between components

4.1 System Architecture

In the Design System Architecture section of Happy App, we will focus on designingthe overall architecture of the application This includes identifying the variouscomponents that make up the system, their interrelationships, and how they worktogether to achieve the desired functionality

* Identifying the various components of the system, such as the user interface,the database, and any third-party APIs or services that may be used

* Defining the relationships between these components, and how they willcommunicate with each other

38

¢ Ensuring that the architecture is scalable, so that the system can handle a highvolume of users and data without performance degradation.

* Ensuring that the system is maintainable, with a clear separation of concernsand well-defined interfaces between components

Figure 8 System Architecture

4.2 Feature diagram

In the section Design Function Tree diagram, we will analyze and design thefunctionalities of the Happy App application in the form of a tree structure This willhelp us visualize the various functions and sub-functions of the application andunderstand how they are related to each other The function tree diagram will alsohelp us identify any redundant or unnecessary functions and streamline the design of

39

the application By using a function tree diagram, we can ensure that the Happy App

application is efficient, user-friendly, and meets the requirements of the users

Happy App

Authentication | | Main Activity

‘Survey Data Sensors

Login Register Forgot Password Home Profile | Tế | Collection

}

Enter Email and Fill profile Enter Registered R Tả

Password information form Email Address View history Profile Info View Profile Info Ore Cie to Oper Video © Tate \cottect Sensors Data

‘Take a Photo a Video.

6 Verify Email

: : ,

| - | ma kiêu Change Name [Review Photo Taken [Review Video Taken| Save data to the |

Redirect to Store User Account i +

OTP verification

MainActivity Infc tt "hange Passwi

saci ee Ngưựg Fill in Survey Fill in Survey

Rediectto Ỷ Ỷ

MainActivity INotific: øs = ity |_ptNotification Settings} —-»{ Information manage| — oe

[| Privacy Settings |-—»} Sensors manage

Figure 9 Function Tree diagram

4.3 Database Di .3 Database Diagram

In the section, Design Database of Happy App, the focus is on designing the database

for the Happy App application This may involve creating an Entity Relationship

Diagram (ERD) to model the relationships between different entities in the database,

such as users, post, and tag or categories The database design should also consider

issues such as data security, data integrity, and performance It is important to

carefully plan the structure of the database to ensure that it can efficiently store and

retrieve data for the street anywhere application

40

e Detail description of data collection

a Collection of Users:

Table 1 Detail description of data collection Users

Users

Orders Name Datatype Constrain Description

1 id String unique, Id of the Users.

required Automatically

generated by mongodb

2 email String unique, Email of the users

required

3 name String _ required Name of the users

4 password String required Password of the users

5 is Verified | Boolean default: false Users is verified

6 otp # 'Sưing - | required Ỉ Otp of user

7 otpCreatedAt Date ~~ mi | Time created User otp

8 createdAt Date required Time created User

b Collection of Sensors:

Table 2 Detail description of data collection Sensors

Sensors

Orders Name Datatype Constrain Description

1 id String unique, Id of the Sensors.

required Automatically generated

by mongodb

2 email String required, Email of the users

unique

41