Mental Clairvoyance

Home page code
forum page code
get help page

Inspiration

As high schoolers, we're constantly surrounded by competition, pressure, and stress. Many of our friends, family members, and even some of our team members have all dealt with mental health problems. Despite the prevalence of this issue, the stigma surrounding mental health problems remains strong, and many of us are still unaware of mental health resources. That's why we decided to make a website for people like us to learn more about mental health, as well as to aid the recovery of people who are struggling with mental illness.

What it does

Our project is Mental Clairvoyance - an app that has various different features that all help the public learn about mental health/overcome mental illness. We have constantly-updating mental health news, a page of contacts to use in emergency situations, and positive exercises to calm the mind. We also have a forum, though it is incomplete as of now due to the lack of an account system. We also plan to implement other features, such as an Instagram-like 'Personal Pages' section for people to post updates on their mental status.

How we built it

We used HTML, CSS and Javascript to build the website. We looked into using app development software such as Flutter, but we were not sure if they would have the functionality we needed.

Challenges we ran into

We had to figure out a way to update our news articles to keep pace with current news while not manually updating our website every time an article came out. We ended up using an RSS feed for this. It was the first time a couple of our members had used HTML, so they had to learn it from scratch. Configuring the page to look nice and have an intuitive UI was difficult as well. We tried implementing a login page, but we didn't have time to connect a database for the login information. In addition, we attempted to make a random video generator that would switch the video whenever Positive Exercises was reloaded, but we ultimately ended up just adding videos by hand.

Accomplishments that we're proud of

We managed to create many different website facets in a very short period of time (even shorter because many of our team members had various conflicts during Friday/Saturday). We connected an RSS feed, created a working forum, and made our page look pretty as well.

What we learned

We learned a lot about using HTML and CSS, and about how databases work. We understand better how to make a functional website now!

What's next for Mental Clairvoyance

We want to add other features such as an Instagram-style Personal Pages section, a login page, set up a database for accounts, make the forum actually interactive, link our website to official mental health courses so people can dive more into specific topics, etc. There's a lot in store for our project!