보름달 🌝 #3.1 Development - Application (ENG)

보름달·2020년 12월 6일
4

개발 / Development

목록 보기
2/4
post-thumbnail

1. Task Distribution

NameTask Description
Jeongin KimApplication Backend, NUGU Backend Proxy development
Jina KimApplication Frontend, NUGU Playbuilder development
Sihyun JungApplication Backend, NUGU Backend Proxy development
TheophileApplication Backend Machine Learning

2. Development Environment

[Backend]

- Node.js

    Node.js is a single thread non-blocking model which is relatively easy to learn for people who are not
familiar with server programs. It is also compatible with Json format. However it is not suitable for servers that use CPU a lot, such as large-scale images or video processing.

    보름달 service doesn't use CPU that much. So, we chose node.js because it is believed that the advantage that we can develop Front and Backend together using Javascript is bigger than the shortage.

- MySQL

    SQL stands for Structured Query Language,and manages data from RDBMS. MySQL is one of the most famous RDBMS.

    Because 보름달 service use tables that have a set structure and relationship, such as users, dates, and cycles, We chose SQL, not NoSQL.

Machine Learning

- Jupyter Notebook

    Jupyter Notebook helps to write code, the result of code execution, and the description of the code at once.

    We used Jupyter Notebook and Python to create cleaned datasets in Machine Learning.

- TensorflowJS

    Tensorflow is a library that provides API for Machine Learning.

    Since both Backend and Frontend use Javascript, we chose Tensorflow.js.

[Frontend]

- React.js

    React is a library that only cares about view among MVC(Model, View, Controller) models, and uses Javascript. When certain elements change, they can render only the necessary parts through DOM monitoring rather than re-rendering the whole.

    We chose react.js to use Javascript like Backend while providing optimal user experience while saving performance.

[Production]

- Amazon EC2

    Amazon's Elastic Compute Cloud (EC2) provides scalable computing capacity in an Amazon Web Services (AWS) cloud. Amazon EC2 allows applications to be developed and deployed faster without the need for a prior investment in hardware.

- Amazon RDS

    Amazon Relational Database Service (RDS) is a web service that makes it easier to install, operate and scale relational databases in the AWS cloud.

    We used MySQL among them.

3. Development Tool

  • Windows

        We used Woindows for developmet. Windows is the most widely used OS in the world.
  • Linux

        We used Linux Ubuntu to deploy via EC2
  • Visual Studio

        Visual Studio is a source code editor form Microsoft. We used this to develop Frontend
  • Webstorm

        Webstorm is an IDE for modern JavaScript development equipped for complex client-side development and server-side development with Node.js.
  • Git&Github

        Git and Github offer largely three functions.

       The first is version management. The Git records when and what changes were made to the file. The second is backup. If the data are stored locally, it will eventually disappear. The GitHub is the remote storage of the Git, which provides online backup. The last is collaboration. The GitHub allows us to collaborate by pulling, and pushing the source code.

       We used Git flow to manage branches. Only the perfect version was put up for the master branch, and the develop branch was used during development. And we used feature branch for the functional developments.
  • Adobe XD

        Adobe XD is a UI/UX tool to design website or mobile application.

       We used Adobe XD to produce prototype to refer to in the development process.
  • Slack

        Slack is a channel-based messaging platform and cloud-based collaborative web application.

       We used Slack to make communication easier and to use Github, Trello, Google Spread etc easier.
  • Visual Paradigm

        Visual Paradigm is an UML diagram tool.

       We used visual paradigm to work on the document.

4. Structure

  • Server Structure


       The picture above is the structure of the folders posted on AWS. The machine learning code is merged into the backend code, and the frontend code was merged into a build file to form a single directory.
  • DB Structure


       There are 5 tables in the Database- Dates, Users, Cycels, Controls, Predicts. The Users table is connected 1:N with Dates, Cycles, Controls, and Predicts tables.

5. How to Use

  • Entry&Login Page

    When the user clicks the icon, Entry page runs for one second and the user is navigated to the login screen.

   Those who already have an account can log in and use the service, and those who do not have an account can register as a member through the Register button.

   Anyone who forgets their ID or password can find their account by clicking the 'Did you forget your account?' button at the bottom.

  • Register Page

    This is the register page which people without account can sign up as a member.

   Name, Email, Password, Password Confirm, meanCycle are mandatory elements. Birthday can be selected from the calendar format, and height and weight can only be entered in numbers. To recommend painkillers considering the user's symptoms and condition, 보름달 requires user to check whether they enjoy alcohol or have gastrointestinal disorders.

   If the user fills in all required input elements without errors and press the sign - up button, the registeration is completed with a notification.

  • Main&Calendar_Detail Page

    Once login is complete, the main page pops up where the user can check her menstrual cycle. In the large circle, the user can see the coming menstrual cycle, in-progress menstrual cycle, or the coming ovulation date. If the user click on the large circle, the user can go to the calendar_detail page where the user can record in detail.

   On the Calendar_detail screen, user can record whether she is menstruating, whether she is taking contraceptives, whether she had a sex, her body condition, and her mood, and also leave a record by using a memo box.

   At the bottom of the circle, user can check out a word that is helpful to the user and the Nugu speaker ID that is needed when using Nugu speaker.

   User can check the information of the logged-in account at the top, or she can log out by pressing the button on the right. Click the "home," "calendar," "health" and "shopping" buttons at the bottom to go to each page.

  • Calendar Page

    This is a calendar page where user can check her overall menstrual cycle. This month's menstrual days are shown in red and ovulation days in blue. The next menstrual period expected by artificial intelligence appears in pink.

   User can select a date to go to the detail page for that date. No details can be recorded for days after today. The "body condition" recorded by the user on the date detail page is used by artificial intelligence to recommend painkillers to the user. Considering whether user enjoys drinking alcohol, whether user has gastrointestinal disorders, and symptoms, painkillers are recommended which has the quickest effect and the least side effects.

   Click on the "month" or "year" part of the calendar to move to another month or year. The calendar can be seen from 1901.

  • Pill Page

    Next is the Health page. The Health page consists of two tabs, Medicine and Self-diagnosis, where users can set up contraceptives they are taking, or perform a simple self-diagnosis of several diseases.

   On the Medications tab, user can set contraceptives alarm. Setting the Start date, end date, alarm time tells the user to take the medicine at the set time every day. The start date and the alarm date are mandatory input factors, and the end date of the dose is automatically set back 180 days if not set.

   User can also check whether she took contraceptives today by checking the details of the calendar page. If the user doesn't have any medication she's taking, it just tells the user that she doesn't have any contracept to take.

  • Self-Diagnosis Page

    On the self-diagnosis tab, the user can make a self-diagnosis for vaginitis, uterine myoma and menstrual blood.

   Self-diagnosis of vaginitis consists of a total of eight questions, each of which has a score of 1 to 5 to determine the suffocation of the user by the sum of the scores.

   Uterine myoma tests users for suspected uterine myoma through 16 questions.

   Menstrual blood self-diagnosis checks the health status of the user by checking blood color and status, according to the Ministry of Food and Drug Safety's standards.

   If a user has a suspected disease, it is most ideal to visit the hospital, but through self-diagnosis, the user can know her condition in advance and prevent it.

  • Shopping Page

    User can access 11st and shop in 보름달 application. Of course, user can shop for items needed for menstrual periods such as sanitary pads, and use all functions the same as the 11st application.

profile
당신의 여성 건강 지킴이

2개의 댓글

comment-user-thumbnail
2020년 12월 15일

Thanks a lot for sharing!JOKER123

답글 달기