Summer internship report

Study and implementation of an android application usage

management system

Within the company

Period of the internship : from 01 July to 31 August 2021

realized by : Affes Achraf

 Table of contents

Acknowledgements ....................................................................................................................1
Introduction ...............................................................................................................................1
Presentation of the host organization. .......................................................................................2
Chapter 1 PRELIMINARY STUDY .................................................................................................3
1. Goals: ..................................................................................................................................3
2. State of the art: ...................................................................................................................3
2.1. Introduction: ............................................................................................................................ 3
2.2. Study of the existing:................................................................................................................ 3
2.3. Conclusion: .............................................................................................................................. 4
2.4. Added Value: ........................................................................................................................... 4
2.5. Work Plan: ............................................................................................................................... 4
Chapter 2 SPECIFICATION AND ANALYSIS...................................................................................6
1. Introduction ........................................................................................................................6
2. Design methodology ...........................................................................................................6
3. Choice of modeling language ..............................................................................................6
4. Identification of functional and non-functional requirements ............................................6
4.1. Identification of actors: ............................................................................................................ 7
4.2. Funcional requirements: .......................................................................................................... 7
4.3. Non-functional requirements : ................................................................................................. 7
5. Use Case Diagram ................................................................................................................8
6. Detailed Use Case analysis: .................................................................................................9
6.1. Use Case : Consult DashBoard .................................................................................................. 9
6.2. Use Case : Consult Activities ................................................................................................... 10
6.3. Use Case : Consult Rules......................................................................................................... 11
6.4. Use Case : Send FeedBack ...................................................................................................... 12
7. Sequence Diagramme........................................................................................................12
7.1. Consult DashBoard ................................................................................................................. 13
7.2. Consult Activities.................................................................................................................... 15
8. Technologie Requirement + Softwares used .....................................................................17
 8.1. VSCode .................................................................................................................................. 17
8.2. Github .................................................................................................................................... 17
8.3. Flutter .................................................................................................................................... 17
8.4. Android Debug Bridge ............................................................................................................ 17
8.5. FireBase ................................................................................................................................. 18
8.6. Pub ........................................................................................................................................ 18
8.7. AdobeXD ................................................................................................................................ 19
9. app_usage functionality ....................................................................................................20
Chapter 3 Realization! ..............................................................................................................22
1. Prototyping .......................................................................................................................22
1.1. SplashScreen UI...................................................................................................................... 22
1.2. DashBoard UI ......................................................................................................................... 22
1.3. Activities UI ............................................................................................................................ 23
1.4. Rules UI.................................................................................................................................. 24
1.5. Add Rule UI ............................................................................................................................ 24
1.6. Settings UI.............................................................................................................................. 25
1.7. About-Us UI ........................................................................................................................... 26
1.8. Send FeedBack UI ................................................................................................................... 27
General Conclusion ...................................................................................................................28
Bibliography .............................................................................................................................29
 List of figures

Figure 1. Use Case Digramme .................................................................................................................. 8

Figure 2. Sequence diagram «Consult DashBoard» ................................................................................ 14
Figure 3. Sequence diagram «Consult Activities» ................................................................................... 16
Figure 4. Visual Studio Code Logo .......................................................................................................... 17
Figure 5. GitHub Logo ............................................................................................................................ 17
Figure 6. Flutter Logo............................................................................................................................. 17
Figure 7. ADB Logo ................................................................................................................................ 17
Figure 8. Firebase Logo .......................................................................................................................... 18
Figure 9. pub.dev Logo........................................................................................................................... 18
Figure 10. Adobe XD Logo ...................................................................................................................... 19
Figure 11. Android application life cycle ................................................................................................. 20
Figure 12. ADB debugging app_usage ................................................................................................... 21
Figure 13. SpalshScreen UI ..................................................................................................................... 22
Figure 14. DashBoard UI ........................................................................................................................ 23
Figure 15. Activities UI ........................................................................................................................... 23
Figure 16. Rules UI ................................................................................................................................. 24
Figure 17. Add Rule UI ........................................................................................................................... 25
Figure 18. Settings UI............................................................................................................................. 25
Figure 19. About-Us UI........................................................................................................................... 26
Figure 20. Send FeedBack UI .................................................................................................................. 27
 List of tables

Table 1. Analysis of the use case «Consult DashBoard» ............................................................................ 9

Table 2. Analysis of the use case «Consult Activities» ............................................................................. 10
Table 3. Analysis of the use case «Consult Rules» ................................................................................... 11
Table 4. Analysis of the use case «Send FeedBack» ................................................................................ 12
Table 5. Android application States........................................................................................................ 21
 Acknowledgements

At the end of this internship, I have the great honor to present my sincere thanks
to all the people who participated in the success of this experience.

My sincere thanks are addressed particularly to my supervisor, Mr. "Taieb

Meftah" for his great guidance and support and also for putting a huge effort in teaching
me different aspects related mainly to the workflow, user interface, user experience, etc.

Finally, I want to express my sincere thanks to all the professors of SUPCOM for
their efforts during our studies, which made this experience worthwhile and enjoyable.

Introduction

Nowadays, IT is considered an essential tool for any company that does not want
to remain on the sidelines of computerization. Indeed, it has long been seen as a
support for the various logistical operations of companies, this support has evolved in
time and space, and even increased thanks to the improvement of computer systems,
as well as to the perpetual performance of computer hardware. This evolution continues
so that it is impossible, if not unthinkable, to run a serious business without
computerization.

The fact that hardware alone is insufficient to run a successful business, but
software solutions are what makes it potentially doable and attainable to keep up with
the pace of change is indeed what encourages me to stick to my goals of becoming a
software engineer in the first place, and therefore comes the choice of my 2nd year’s
summer internship as a SUP’COMien engineering student.

1
 The main objective of this internship was to approach a project as a software
engineer, thinking entirely about the planification of such project, the fluidity of the user
experience, getting better at understanding how the framework works, diving deeper
into debugging, testing, database integration ( local and cloud based ).

In addition, I was able to make new connections with professionals, learn from
their own experiences and understand what the job market really requires and demands
from a software engineer.

Presentation of the host organization.

The company “Web Graphique” represents a consulting and engineering

company specialized in new information technology operating in Tunisia and
internationally, it facilitates the choice for the implementation of customized interactive
web solutions (graphic study, assistance etc.)
The company “Web Graphique” offers several services: web design, development,
augmented reality, mobile application on measure, conception of IT solutions as well as
logo creation, printing and graphic design.

2
 Chapter 1 PRELIMINARY STUDY

1. Goals:
 Develop an easy to use android application where users can track their
smartphone usage.
 Allow users to set rules to rSSemind and warn them when they spend too much
time on the phone in general or on specific applications.
 Work primarily on the user experience by making the application easy and simple
to use, and as optimized as possible (low battery usage, low RAM usage, less
computation, etc.).

2. State of the art:

2.1. Introduction:

In this chapter, we will talk about the study of the existing applications with an
abstract layer of details such as what problems exists within the already developed
solutions, what are the features provided etc.

2.2. Study of the existing:

In this section we will talk about the different existing solutions which have
similarities with our project.
StayFree
 (+) Accurate data ( usage percentages )
 ( - ) Warning system requires the app to be on screen
 ( - ) Complicated UI/UX ( so much details )

App Usage – Monitorer

 (+) Simple and acceptable UI/UX
 ( - ) inaccurate data ( usage percentages )
 ( - ) One language ( English only )

3
 Usage Analyzer
 (+) Accurate data ( usage percentages )
 ( - ) Antique odd UI/UX
 ( - ) One language ( English only )

Screen Time
 (+) Simple and acceptable UI/UX
 ( - ) inaccurate data ( usage percentages )
 ( - ) One language ( English only )

2.3. Conclusion:

We conclude that in order to bring a better solution to the market, we need to

work on the drawbacks of each other app and combine them into one final solution.

2.4. Added Value:

 Simple and acceptable UI/UX ( Modern design )
 Accurate data ( usage time etc )
 Multi-Languages ( English, French, German and Spanish )
 Notification system that works independtly of the current state.
 Dark Theme option ( for better UX )

2.5. Work Plan:

The road map followed in order to deliver the developed solution

Phase 1 :
 Research around the Modern UI close to the solution.
 Using Adobe XD in order to visualize the solution.
 Specification and analysis ( UML conception )

Phase 2 :
 Project initiation.
 Making decisions around what packages to use.

4
 Using Android Debug Bridge (ADB) in order to make sure that the data gathered is
accurate.
 Local database and CRUD functionality integration
 Firebase integration ( report a bug / contact us )

Phase 3 :
 Project overview and testing.
 Bugs fixing and UX improvements.
 Study of further developement and enhancement.
 Project deployment

5
 Chapter 2 SPECIFICATION AND ANALYSIS

1. Introduction

The requirements specification is the initial phase of any application to be

developed in which we will identify the needs, the actors and the main functionalities of
our application. We distinguish functional needs that present the features expected from
our application and nonfunctional needs to avoid the development of an unsatisfactory
application.

2. Design methodology

the design methodology requires methods to set up a model on which we will

base ourselves during the implementation phase, modelling is the fact of creating a
conceptual representation of reality in order to set up the points of interest.

3. Choice of modeling language

UML is a standard system modelling language, which uses diagrams to

represent every aspect of a system based on the notion of object oriented programming
which is a great asset for this language.

In our contribution, we have chosen the UML as our modelling language.

This choice is justified by the fact that UML has several advantages :

 UML is a formal and standardized language

 UML is a powerful communication medium
 UML facilitates the understanding of complex abstract representations

4. Identification of functional and non-functional requirements

This phase consists of understanding the context of the system. It determines the
functionalities of the most relevant actors .

6
 4.1. Identification of actors:

An actor is the modeling of a role played by an external person who interacts with
the application. The different actors interacting with our application are:

 Administrator : can access all reviews through the firebase firestore

 User : basically has access to all the functionalities except checking the reviews

4.2. Funcional requirements:

In this part, we will identify the needs of the actors of the application.

A functional need (or a use case in terms of UML), expresses an action which the

system must perform in response to a request.

The functionalities that will be provided by the system are divided in two categories as
follows:

User-specific features:
 Consults DashBoard ( summarized usage )
 Consults Activities ( detailed usage of each app for each day )
 Manage Rules : User will be able to create usage rules in order to customize the
notification system.
 Costumize the application ( Language, Theme, notifications etc )
 Report bugs and contact the developers
Administrator-specific features :
 Consults the reviews in general

4.3. Non-functional requirements :

These are requirements that are not related to the behavior of the system but
that identify the internal and external constraints of the system.

The main non-functional needs of our application can be summed up in the

following points:

7
 Usability: The application has to be easy and simple to use in order to
make the users more comfortable and more engaged with the services.
 Accuracy: Presenting accurate usage data
 Performance : The application must be efficient, that is to say that the
system must be as optimized as possible with low battery usage.

5. Use Case Diagram

Figure 1. Use Case Digramme

8
 6. Detailed Use Case analysis:

The analysis of the use case digram makes it possible to identify for each of
these cases the objectives, the actors, the preconditions, the postconditions as well as
the nominal and alternative scenarios in order to describe the functioning of the system.
In this session we describe some of the use case analyses represented in the
diagrams in Figure 1

6.1. Use Case : Consult DashBoard

Table 1. Analysis of the use case «Consult DashBoard»

Summary of Consult DashBoard

Title Consult DashBoard

Objectives Show usage data in breif

The DashBoard contains breif usage informations suchs as

Summary
weekly statistics, today’s and average general usage details etc.

Actor User

Sequencing description

Preconditions Post Conditions

Packages usage access Connection to local database

Nominal Scenario

1. The User gives access to the packages usage

2. The System establishes a connection with the local database
3. The System Checks if data already exists in the local database
4. If data exists Shows it to the user
5. Else checks the log files of each package, calculates the usage and saves it
to the database then shows it to the user

Alternative Scenario

9
E1: Usage Access denied
1. The system Shows an interface asking for permession
2. The Scenario resumes at step 1
E2 : DataBase Connection problems
1. The systems Shows and error message <<Connection denied>>
2. The systems resumes at step 2

6.2. Use Case : Consult Activities

Table 2. Analysis of the use case «Consult Activities»

Summary of Consult DashBoard

Title Consult Activities

Objectives Show each application’s usage data in breif

The Activities interface contains breif usage informations about

Summary each application suchs as usage percentage, app category,
usage time and the improvement status

Actor User

Sequencing description

Preconditions Post Conditions

Packages usage access

Connection to local database
LastUpdate Timer set to yesterday

Nominal Scenario

1. The System establishes a connection with the local database

2. The System Checks the lastUpdate Timer
3. If the timer exceeded then checks the log files of each package and
recalculates all the data and save it to the localdatabase
4. Else gets the data from the local database immediatly

Alternative Scenario

10
E1 : DataBase Connection problems
1. The systems Shows and error message <<Connection denied>>
2. The systems resumes at step 1

6.3. Use Case : Consult Rules

Table 3. Analysis of the use case «Consult Rules»

Summary of Consult DashBoard

Title Consult Rules

Objectives Shows The predefined Rules by the user

The user can consult all the predefined rules, showing breif
Summary
details about each rule and allowing the user to edit or delete it

Actor User

Sequencing description

Preconditions Post Conditions

Packages usage access Connection to local database

Nominal Scenario

1. The System establishes a connection with the local database

2. The System Checks the lastUpdate Timer
3. If the timer exceeded then checks the log files of each package and
recalculates all the data and save it to the localdatabase
4. Else gets the data from the local database immediatly

Alternative Scenario

E1 : DataBase Connection problems

1. The systems Shows and error message <<Connection denied>>
2. The systems resumes at step 1

11
 6.4. Use Case : Send FeedBack
Table 4. Analysis of the use case «Send FeedBack»

Summary of Consult DashBoard

Title Send FeedBack

Objectives Send FeedBack to the developers

The User fills in with a FeedBack content, and sends it to the

Summary
cloud so that the developers can check it later on.

Actor User

Sequencing description

Preconditions Post Conditions

Packages usage access Internet Connection

Nominal Scenario

1. The user fills in with the feedBack description and title then submits it
2. The System establishes a connection with the firebase firestore
3. If the connection was successfully established then a dialog message says
that the feedBack was successfully sent
4. Else a dialog box asks the user to recheck his internet connection

Alternative Scenario

E1 : Firestore Connection problems

3. The systems Shows and error message <<Connection denied>>
4. The systems resumes at step 2

7. Sequence Diagramme

Sequence diagrams are the graphical presentation of the interactions between

the different actors and the system in chronological order according to the UML

12
formulation. In the following section, we present the sequence diagram for some of the
use cases of our system.

7.1. Consult DashBoard

The figure 2 represents the sequence diagram of «Consult DashBoard» ,Once

the User access the DashBoard interface the weekId will be initially set to “this week’s
Id” which is a simple representation of a unique string containing the dates of the first
day of the week and the last day of the same week, The user can check older weeks by
simply clicking on two arrows (left and right) that simply generates that weeks Id and
calls the getWeeklyUsage methode:

 The system consults the local database for the weekly usage using the provided
weekId by the user
 If the database responds with an empty list the system checks the log files of
each application package and calculates the weekly usage of each one
 The system then saves the calculated data to the local database

Consulting the dashboard calls the getGeneralUsageData method as well, the

first time this method is called, it uses lastCheck DateTime variable which is initialy set
to the yesterdays DateTime the system then :

 Checks the lastCheck variable, if the current time exceeded the lastCheck
variable with 10 minutes.
 The system then runs the same process to calculate the general data then saves
it to the local database.
 The system updates the lastCheck variable and Shows the data to the user

13
Figure 2. Sequence diagram «Consult DashBoard»

14
 7.2. Consult Activities

The figure 3 represents the sequence diagram of «Consult Activities» ,Once

the User access the Activities interface the DayId will be initially set to “today’s Id”
which is a simple representation of a unique string containing simply the date of that
day, The user can check older days by simply clicking on two arrows (left and right) that
simply generates that specific day’s Id then :

 The system checks the lastCheck variable.

 If the current time exceeded the lastCheck variable with 10 minutes.
o The system checks the log files of each application package and
calculates the daily usage of each one etc using the provided dayId.
o The system saves the data to the local database.
o The system updates the lastCheck variable and Shows the data to the
user
 Else it simply consults the database for the app usage using the provided dayId
It is also important to note that the user can also interact with the activities interface by
typing a specific application name to check its usage.
The status for each application is calculated compared to yesterday's usage, and
therefore the data saved in the database is simply the one related to the day of the
same dayId, else the system will be stuck in a recursive function that never ends.

15
Figure 3. Sequence diagram «Consult Activities»

16
 8. Technologie Requirement + Softwares used

8.1. VSCode

Visual Studio Code is a freeware source-code editor made by

Microsoft for Windows, Linux and macOS. Features include support for
debugging, syntax highlighting, intelligent code completion, snippets,

code refactoring, and embedded Git.

Figure 4. Visual Studio Code Logo

8.2. Github

GitHub is a Git repository hosting service, but it adds many of its

own features. While Git is a command line tool, GitHub provides a Web-
based graphical interface. It also provides access control and several

collaboration features
Figure 5. GitHub Logo
Figure 5. GitHub Logo

8.3. Flutter

Flutter is Google's UI toolkit for building beautiful, natively

compiled applications for mobile, web, desktop, and embedded
Figure 6. Flutter Logo
devices from a single codebase.

8.4. Android Debug Bridge

Android Debug Bridge (adb) is a versatile command-line tool

that lets you communicate with a device. The adb command facilitates
a variety of device actions, such as installing and debugging apps, and
it provides access to a Unix shell that you can use to run a variety Figure 7. ADB Logo

of commands on a device

17
 8.5. FireBase

Firebase is a Google-backed application development

software that enables developers to develop iOS, Android and

Figure 8. Firebase Logo

Web apps, we used the firestore functionality.

8.6. Pub

Pub is the package manager for the Dart programming

language, containing reusable libraries & packages for Flutter,

AngularDart, and general Dart programs, Figure 9. pub.dev Logo

We used multiple libraries such as :

 flutter_svg :
Used to use svg pictures ( Icons, Logos etc ) designed in AdobeXD
 fl_chart :
Used to represent charts ( line chart and pie chart ) the package allows
custom styling and design for better UI/UX.
 app_usage:
This librarie allows the data gathering for each application package in android
only, the functionality of this librarie will be explained later on.
 Intl :
Provides internationalization and localization facilities, including message
translation, plurals and genders, date/number formatting and parsing, and
bidirectional text
 Sqflite :
SQLite plugin for Flutter, that uses DB operation executed in a background
thread on iOS and Android.
 flutter_easyloading
 flutter_local_notifications
 cloud_firestore :

18
 Flutter plugin for Cloud Firestore, a cloud-hosted, noSQL database with live
synchronization and offline support on Android and iOS.

8.7. AdobeXD

Adobe XD is the Adobe prototyping tool for user experience and

interaction designers. We used it to visualize the application’s interfaces
etc. Figure 10. Adobe XD Logo

19
 9. app_usage functionality

To explain the way this librarie works we need first to dig deeper into the life
cycle of an android application.

Figure 11. Android application life cycle

20
 Table 5. Android application States

Method Description

onCreate called when activity is first created.

onStart called when activity is becoming visible to the user.

onResume called when activity will start interacting with the user.

onPause called when activity is not visible to the user.

onStop called when activity is no longer visible to the user.

onRestart called after your activity is stopped, prior to start.

onDestroy called before the activity is destroyed.

In order to get the usage of a certain application we simply check the log files of
that specific app using its packageName and simply calculate the periods between each
onResume and onPause using the provided starting and ending date. We made sure
that the data provided by this librarie is accurate by using the ADB shell

Figure 12. ADB debugging app_usage

21
 Chapter 3 Realization!

1. Prototyping

1.1. SplashScreen UI

Splash screen is the first graphical notification you receive when you visit the
app. It can appear as an introductory screen of an application or simply to notifies the
user that the program is in the process of loading.

Figure 13. SpalshScreen UI

1.2. DashBoard UI

The DashBoard Interface contains breif usage informations, a line chart

representing the weekly usage statistics, general usage data such as today’s and
average general usage details and a pie chart containing the top 5 used apps for today.

22
 Figure 14. DashBoard UI

1.3. Activities UI

The Activities interface contains breif usage informations about each application
suchs as usage percentage, app category, usage time and the improvement status.

Figure 15. Activities UI

23
 1.4. Rules UI

The Tules interface allos the user to consult all the predefined rules, showing
breif details about each rule and allowing the user to edit or delete it

Figure 16. Rules UI

1.5. Add Rule UI

The Add Rule interface allows the user to add a new rule by filling in a simple
form, By selecting the application name, the usage limit and the notification frequency.

24
 Figure 17. Add Rule UI

1.6. Settings UI

The Settings interface provides multiple features, including the change langugae
functionality, the general notifications customization, switching to dark theme and its the
route to other interfaces such as the about interface and the feedback functionality.

Figure 18. Settings UI

25
 1.7. About-Us UI

The Abous-Us interface simply gives informations about the developers of this
app, as well as its main functionality and an answer to the most common asked
question.

Figure 19. About-Us UI

26
 1.8. Send FeedBack UI

The Send FeedBack interface allows the user to fill in a simple form with a
FeedBack content and title, and sends it to the cloud so that the developers can check it
later on.

Figure 20. Send FeedBack UI

27
 General Conclusion

The objective of our project was the study and implementation of an Android
application to keep track of the usage behavior of the user, This project was supervised
by Mr.Taieb.Meftah at the company “web graphique”.

In order to carry out our project we started with the definition of the functional
requirements, followed by the design of the different UML diagrams representing the
use case diagram and some sequence diagrams, then we started the realization phase
in which we presented the technical architecture of our application followed by the
presentation of the environment and the different development tools, we also explained
the use of some libraries and packages.

Finally represented a series of screenshots that represents all the basic

functionality of the application

In conclusion, I acknowledge that the realization of this project allowed me to

implement my academic knowledge acquired throughout my training and to deepen
them in the field of applications development on mobile terminals.

28
 Bibliography

Trello, 2021. https://trello.com.

Github, 2021. https://github.com.

Vscode, 2021. https://code.visualstudio.com.

intl 0.17.0 https://pub.dev/packages/intl

FireBase https://firebase.google.com/

app_usage 2.0.0 https://pub.dev/packages/app_usage

Activity Lifecycle https://developer.android.com/guide/components/activities/activity-lifecycle

Android Debug Bridge https://developer.android.com/studio/command-line/adb

Stack overflow https://stackoverflow.com/

Adobe XD https://www.adobe.com/fr/products/xd.html

29