· 6 years ago · Dec 02, 2019, 08:26 PM
1Portfolio
2
3<!--Start Our portfolio Area -->
4 <section id="our-portfolio" class="portfolio section-padding">
5 <div class="container">
6 <div class="row">
7 <div class="col-xs-12">
8 <div class="section-title wow fadeInDown">
9 <h2>Our <span>Projects</span></h2>
10 <div class="border-line">
11 <span class="border-box"></span>
12 </div>
13 </div>
14 </div>
15 </div>
16 <div class="portfolio-inner">
17 <div class="row portfolio-posts">
18 <div class="mix photography development col-sm-6 col-md-3">
19 <div class="item">
20 <img class="img" src="assets/images/portfolio/green_campus/greencampus.png" alt="">
21 <div class="portfolio-caption">
22 <div>
23 <h3>GREEN CAMPUS</h3>
24 <button type="button" class="button" data-toggle="modal" data-target="#info-green-campus">
25 Learn More
26 </button>
27 </div>
28 </div>
29 </div>
30 </div>
31 <div class="mix photography development col-sm-6 col-md-3">
32 <div class="item">
33 <img class="img" src="assets/images/portfolio/pocked_medic/pocketmedic.png" alt="">
34 <div class="portfolio-caption">
35 <div>
36 <h3>POCKED MEDIC</h3>
37 <button type="button" class="button" data-toggle="modal" data-target="#info-pocked-medic">
38 Learn More
39 </button>
40 </div>
41 </div>
42 </div>
43 </div>
44 <div class="mix webdesign development col-sm-6 col-md-3">
45 <div class="item">
46 <img class="img" src="assets/images/portfolio/work_for_day/workforday.png" alt="">
47 <div class="portfolio-caption">
48 <div>
49 <h3>WORK FOR DAY</h3>
50 <button type="button" class="button" data-toggle="modal" data-target="#info-work-for-day">
51 Learn More
52 </button>
53 </div>
54 </div>
55 </div>
56 </div>
57 <div class="mix webdesign development col-sm-6 col-md-3">
58 <div class="item">
59 <img class="img" src="assets/images/portfolio/helence/helence.png" alt="">
60 <div class="portfolio-caption">
61 <div>
62 <h3>HELENCE</h3>
63 <button type="button" class="button" data-toggle="modal" data-target="#info-helence">
64 Learn More
65 </button>
66 </div>
67 </div>
68 </div>
69 </div>
70 </div>
71 </div>
72 </div>
73 </section>
74
75
76 <!-- Modal info projects -->
77
78 <!--Green Campus-->
79 <div class="modal fade" id="info-green-campus" tabindex="-1" role="dialog" aria-labelledby="greenCampus" aria-hidden="true">
80 <div class="modal-dialog" role="document">
81 <div class="modal-content">
82 <div class="modal-header">
83 <h5 class="modal-title" id="greenCampus">Green Campus</h5>
84 <button type="button" class="close" data-dismiss="modal" aria-label="Close">
85 <span aria-hidden="true">×</span>
86 </button>
87 </div>
88 <div class="modal-body">
89 <p>A group of ONPU and University of Applied Sciences Augsburg students is working on the Green Campus project, the aim of which is to modernize universities by equipping classrooms with IoT-systems, as well as improve the environmental and economic situation by reducing the excessive power consumption. This work describes one of the Green Campus modules that monitors and automatically maintains microclimate parameters in classrooms at a comfortable level. </p>
90 <p>Our innovation is the automatic ventilation of the room when CO2 is exceeded and the automatic switching on and off of humidifiers or dehumidifiers, since this method is less expensive than turning on the air conditioner or other temperature control systems indoors (fireplace, central heating, fan, etc.). Automatic ventilation can be opening a pressurized window or starting a ventilation system of a room (recuperator, for example), if such a system is present.</p>
91 <p>When choosing components, we first of all paid attention to cheap devices with low energy consumption, since for a full implementation in the university building it will be necessary to install such a system in each audience. Based on this, ESP32-based module with WiFi would be an ideal option for us: power supply 2.2 … 3.6V, maximum power consumption 500mA. To read data from two sensors, display information on the display, control the relay and send data with HTTP to the remote server, its performance was neither small nor redundant.</p>
92 <p>We selected DHT22 sensor to measure temperature and relative humidity (relative humidity within 0-100%, temperature from -40 - 125°C [2]), MH-Z19 to measure CO2 concentration (within 0-5000ppm [3]). We also need one or several relay modules and small LCD display.</p>
93
94 <div class="content-model__image">
95 <img src="assets/images/portfolio/green_campus/1.png" alt="img1">
96 </div>
97
98 <p>Measurements are displayed on the display and sent to the server using the built-in Wi-Fi module. The server processes, records and analyzes data, and if certain indicators go beyond the normal range, the system signals this and automatically performs actions aimed at normalizing the relevant indicators - it ventilates the room, changes the humidity to maintain the comfort tempera-ture. The interaction of the controller and the ventilation or humidification mechanisms occurs through a relay module with a control voltage of 5V. In a simplified version, the user is notified of deviations from the norm and an appropriate recommendation is issued for their normalization.</p>
99 </div>
100 <div class="modal-footer">
101 <button type="button" class="button__close" data-dismiss="modal">Close</button>
102 </div>
103 </div>
104 </div>
105 </div>
106
107 <!--Pocked Medic-->
108 <div class="modal fade" id="info-pocked-medic" tabindex="-1" role="dialog" aria-labelledby="pockedMedic" aria-hidden="true">
109 <div class="modal-dialog" role="document">
110 <div class="modal-content">
111 <div class="modal-header">
112 <h5 class="modal-title" id="pockedMedic">Pocked Medic</h5>
113 <button type="button" class="close" data-dismiss="modal" aria-label="Close">
114 <span aria-hidden="true">×</span>
115 </button>
116 </div>
117 <div class="modal-body">
118 <p>The project is based on a client-server architecture and is written in Java. The main reason for choosing this programming language was the fact that the team had experience with it, as well as the presence in it of a large number of libraries capable of helping in the development of this kind of application. One of these is the Spring Boot framework on the basis of which the server part of the application was written. The client is a mobile application written for Android - the most popular operating system in the country of residence of the team. PostgreSQL is used as the database, due to its inherent capabilities that meet the requirements of this development, and the Hybernate library as the JPA specification (Java Persistence API). To deploy the application in the cloud, the Heroku SaaS platform is used.</p>
119 <p>At this stage, work is underway on the introduction of such functions as: calling a doctor at home, making an appointment with the doctor, making an appointment with the doctor in the laboratory, as well as online consultation with a doctor; storage of various medical documents inside the application (prescription for a pharmacy, medical card, etc.); instant ambulance call through the application using GPS;</p>
120
121 <div class="content-model__image-pocked-medic">
122 <img src="assets/images/portfolio/pocked_medic/1.png" alt="img1">
123 <img src="assets/images/portfolio/pocked_medic/2.png" alt="img2">
124 <img src="assets/images/portfolio/pocked_medic/3.png" alt="img3">
125 </div>
126 </div>
127 <div class="modal-footer">
128 <button type="button" class="button__close" data-dismiss="modal">Close</button>
129 </div>
130 </div>
131 </div>
132 </div>
133
134 <!--Work For Day-->
135 <div class="modal fade" id="info-work-for-day" tabindex="-1" role="dialog" aria-labelledby="workForDay" aria-hidden="true">
136 <div class="modal-dialog" role="document">
137 <div class="modal-content">
138 <div class="modal-header">
139 <h5 class="modal-title" id="workForDay">Work For Day</h5>
140 <button type="button" class="close" data-dismiss="modal" aria-label="Close">
141 <span aria-hidden="true">×</span>
142 </button>
143 </div>
144 <div class="modal-body">
145 <p>. The «Work For Day» information system is a three-tier client-server architecture, with a client, an application server (to which the client application is connected) and a database server (with which the application server is working).</p>
146 <p>To develop the server side of the application was used an open source framework for the Java platform the Spring Framework. It used to simplify the development of Java EE applications for developers. Spring provides the ability to automatically create and link objects, and also has improved testing tools. This information system uses components of the Spring Framework, such as Spring Security and Spring JPA. Registration and secure user authorization are implemented with the help of Spring Security, and Spring JPA provides work with the database.</p>
147 <p>PostgreSQL is used for data storage. This database is free and has support for working with the JSON data format. This is useful when the data structure requires a certain flexibility. For example, if during the development process the data structure may change or it is not known in advance which fields the data object will contain. In addition, cloud technologies were used in the development: the server and database were deployed on the Heroku service. This was done to ensure that the host is not located on the local computer. This server is free to use. Heroku also makes it easy to manage the selected PostgreSQL database.</p>
148 <p>The client part of the information system was developed, as a mobile application for the Android OS. According to the company "statcounter" as of March 2019 in Europe there are about 72.77% of Android OS users [3]. Also, mobile devices on this OS are significantly cheaper than on iOS.
149 The mobile application provides the following features: registration, authorization, editing of personal account, adding one-time works, viewing them. For easy search, the user is offered a map on which the nearest works are marked. The map is implemented using Google Maps technology.
150 The application has a comfortable UI / UX interface with which the user can intuitively use all the functions of the program
151 </p>
152
153 <div class="content-model__image">
154 <img src="assets/images/portfolio/work_for_day/1.png" alt="img1">
155 <img src="assets/images/portfolio/work_for_day/2.jpg" alt="img2">
156 </div>
157 </div>
158 <div class="modal-footer">
159 <button type="button" class="button__close" data-dismiss="modal">Close</button>
160 </div>
161 </div>
162 </div>
163 </div>
164
165 <!--Helence-->
166 <div class="modal fade" id="info-helence" tabindex="-1" role="dialog" aria-labelledby="helence" aria-hidden="true">
167 <div class="modal-dialog" role="document">
168 <div class="modal-content">
169 <div class="modal-header">
170 <h5 class="modal-title" id="helence">Helence</h5>
171 <button type="button" class="close" data-dismiss="modal" aria-label="Close">
172 <span aria-hidden="true">×</span>
173 </button>
174 </div>
175 <div class="modal-body">
176 <p>To achieve these goals, a mobile application is being developed that allows students to publish their applications and find a competent performer, or become performers of a specific application. Each user will have his own profile, where he will indicate the necessary information that he indicated during registration, and also in the profile he will be able to view his applications and resume. The information will provide contact details, which include social networks (Telegram, Viber, Instagram e.t.c.), phone number and mail. The application provides the ability to view the pages of current applications and summaries of user users. The search for the contractor and applications can be carried out in the key fields: Items, Country, Date, etc.</p>
177 <p>When finding a specific application, the contractor can click on the “contact” button to select a specific popular messenger (which are indicated in the user profile) or other types of communication (mail or phone) to contact the customer and discuss the implementation details with him. The customer, in turn, will be able to hide the application during its execution so that other contractors do not contact him.</p>
178 <p>The customer has the opportunity to immediately find an artist without leaving his application. When placing an application, the customer needs to describe his problem, and can also attach certain files (pdf, doc, png, etc.) to the advertisement for better understanding. When the contractor is found, the customer can also contact him by analogy as the contractor contacts the customer</p>
179 <p>The project is based on a client-server architecture written in Java. The client is a mobile application written for Android. This client used the following libraries: REST API (Volley, Retrofit2, rest-template), Room (for creating and working with the database), Glide (for uploading photos), rxJava (For working with multithreading).</p>
180 <p>The server part is written based on the SpringBoot framework using the REST API. PostgreSQL and the Hibernate library as the JPA specification (Java Persistence API) are used as the database. To deploy the application in the cloud, PaaS - the Heroku platform is used. It is also planned to create an application version available for iOS and a web version of the application. At this stage, work is underway on the client part (Android) of the application.</p>
181 </div>
182 <div class="modal-footer">
183 <button type="button" class="button__close" data-dismiss="modal">Close</button>
184 </div>
185 </div>
186 </div>
187 </div>
188
189 <!-- /End Our Portfolio Area -->