Description as a Tweet:

Are you often stressed? Overwhelmed by your computer science homework? Anxious about the upcoming exam? Then pittari.tech is a great choice for you! Pittari is a safe space for all with a ton of different methods to sooth your mind.

Inspiration:

In the fast paced world we live in today, no one really takes the time to slow down for a minute and relax. With this, mental health problems have been becoming more and more prominent. Hence we were inspired to create a calm space for people to come and finally have some guilt-free time to themselves. We want to have a space where a person can close everything that has been overwhelming them and be able to relax by listening to some music, play with their pets, and write down and release whatever that is on their mind.

What it does:

Pittari.tech is a website that people can use to relax and destress. The website itself has 5 tabs. The home page gives users a welcome to pittari and an introduction to our site pet kitty, Ari! Ari hangs out with you on every page of the website and you can click and drag her around the screen. We are also greeted by our footer, which allows users options to change the website’s main background and text color to their preference, or reset to the original colors. These color changes will apply and can be changed on any page of the website. The second tab “quotes” generates a random positive/encouraging quote every time you click on the tab or refresh the page, to help users when they are having a rough day. The magic journal tab is a great choice for users who have something to vent about but no one to vent to, it presents users with a text box that can be filled with anything they want to release into the void: either experiences they want to forget, or dreams they wish to manifest. The music tab features three upbeat and happy songs by lukrembo that users can listen to. Lastly the about tab tells users a bit about us. It explains why we made the website and hovering over our pictures shares some information about us!

How we built it:

Pittari was written in HTML, CSS, and Javascript using VSCode. Ari, one of our main features, was built using mainly javascript with methods that capture mouse activity, using this information, calculate the change in position of the cat. Her animation was completed manipulating hover techniques in html/css. And she was created by no other but our very own Rosie on Procreate. Another main feature utilized localStorage in order to maintain the users chosen colors across different pages and after refreshes.

Technologies we used:

HTML/CSS
Javascript

Challenges we ran into:

All team members had little to no knowledge of HTML or CSS when starting the project. We wanted to challenge ourselves by writing a website from scratch. This required us to read and watch several videos and articles in order to understand even how to get started. There were many ideas we had for the website that we were not able to implement yet. Several features we had to compromise on or save for the future, due to the length of time we needed to research and debug. Hours were spent on certain ideas that could not come to fruition: a playlist of multiple set audio files and selection of a different pet with its own unique animations. We all worked as software engineers, coding our own page or our own feature for the site. This led to several bugs when combining the separate bits of code into one html/css project. Spending hours comparing HTML codes to find the issue was an incorrect placement of a JavaScript code, honestly was worth it, because we now have an awesome website that we put all our energy and stress into.

Accomplishments we're proud of:

When jotting down our ideas for the website, we didn’t limit our ideas by what we thought was accomplishable. We told ourselves that these ideas are meant to be ambitious. We just wrote down everything we wished to have on this website. We all went into this project with no experience on making a website. We are proud of the fact that even though we were all beginners, we were able to accomplish all of the main features we wanted on the website such as quotes, music, customization of the website, and an interactable pet. We are proud that we didn’t let what we thought our capabilities get in the way of what we were inspired to do. Thus pushing our capacity and learning so many new techniques and gaining a love for web development.

What we've learned:

As mentioned above, one challenge we faced was lack of website building knowledge. From this experience, we have learned a lot about how to build a basic website using html/css and animate elements (with the help of javascript). We also dipped our toes in web hosting with domains and google cloud. We have also learned a lot about the opportunities available to us if we were to develop this project further, the great resources that were on campus all along! Furthermore, we have learned a lot interacting with others, including mentors, organizers, and peers.

What's next:

We want to add more features such as a random song generator, a to-do list, add more pets options to our website, and more to our website. We want to add a lot more features to our music tab to contain a larger variety of songs and let the user be able to create their own playlist with the songs. We would also like to expand our current features more such as having more quotes to generate and adding more interactive features between the user and the pet on the website. We also want to make another tab on the website where users can pick a pet to “raise” and name the pet. As mentioned with the to-do list before, we want to motivate the user more. We can add to our pet features to where it can level up with the amount of tasks the users do from their to-do list.

Built with:

We used VSCode to code in HTML, CSS, and JavaScript. Domain.com was used to obtain the domain pittari.tech and the site is hosted on Google Cloud.

Prizes we're going for:

Best Software Hack
Best Web Hack
Best Beginner Software Hack
Best Use of Google Cloud
Best Domain Name from Domain.com

Pittari