Description as a Tweet:

A virtual logging journal to check-in with yourself three times a day! With encouraging prompts and a color goal motivator, we’ve made a safe space for you to vent out your thoughts.

Inspiration:

There is a lot of inner turmoil that can come from prolonged isolation and limited social contact, so we wanted to create something that would remind us to get in touch with our emotions and thoughts. It is an individual-oriented task to create base-lines for our feelings and maintain some structure in our days.

What it does:

Our project sets off a pop-up three times a day to our users, asking them to take some time to write down their thoughts in the virtual journal. The first check-in of the day asks the user to pick a color they would like to reach. Our web page's background becomes a physical representation of our user's daily journaling progress as each journal entry, which consists of picking an emoji and writing a couple of words or sentences, is a gradient closer to the "color goal". All of this requires an account login to ensure that the user can maintain and look back at their progress.

How we built it:

We first started with a GitHub project board of core components for our journal: the infrastructure of the login, register, and home page, a design scheme, and a database. Using lots of tutorials and free available layouts, we formed a basic layout of the HTML and CSS code. We also found a website that would let us use a free database and figured out how to send a username and password to the database.
The next day we re-evaluated our tasks and chose to focus on: sending and retrieving journal information to and from the database, coding the color-gradient background switches, and prompting the check-in alerts.

Technologies we used:

  • HTML/CSS
  • Javascript
  • Python
  • Flask

Challenges we ran into:

As novice coders, our team had to research and find as much information about establishing a website that integrated HTML, CSS, Python, and JavaScript. This took up the majority of our time that first night, but fortunately, we were able to get a solid foundation.
Likewise, towards the end of the second day, we accepted that we were a bit too ambitious with our original design plan. We had to cut down on some of our aesthetic goals, like adding emojis as part of the journal, for the more functional requirements, like properly coding the database calls and presentation of the login and register pages.

Accomplishments we're proud of:

The sheer dedication and commitment from all of the team members is what we are most proud of. Although we didn’t pull all-nighters, we did spend the entire waking day in front of our computers researching, troubleshooting, and debugging. We all finished our semester this past Friday, so we weren’t sure how burnt out we were going to be, but we’re proud of the work we were able to complete as newbies in the hacking world.

What we've learned:

Only one of us in the team had previous experience with coding a website, so for the rest of us, it was the equivalent of discovering a whole new world of programming applications and resources. From learning how to use rendering calls, learning about Javascript functions, scrolling through Favicon icons, and reading never-ending Stack exchange threads, this hackathon felt like THE “coding experience." We’re really glad that we took the chance.

What's next:

There is a lot we wish we could have gotten done. The main component would be adding an emoji feature that offers an alternative option for writing down our thoughts. We’d also like to increase screen reader accessibility and run some usability tests to ensure the best experience for any users.

Built with:

We built our website using Visual Studio Code to run HTML, CSS, Javascript, and Python. Flask was used as a python plugin and MongoDB as our database.

Prizes we're going for:

  • Best Web Hack
  • Best Healthcare Hack
  • Best Beginner Software Hack
  • Best Beginner Web Hack

Team Members

Angelica Pelcastre
Anna Zhang
Alice Zhang

Table Number

Table TBD