Paws Off!

Home Screen
profile
Affirmations
Friends List (Connections)
Add Friend
Accessories
Play Time
Calendar + Schedule

Inspiration

As current students within the pandemic, we wanted to create an app that would encourage and help students attend Zoom lectures, because oftentimes they feel “optional”. To combat this, we decided to try to gamify going to classes through the use of points, virtual dogs, and a connection system. This resulted in our app name “Paws Off!”, as a reminder to stay off your phone in class, but also to highlight the cute dogs within the app! Also, we wanted to shine a light on mental health and how important it is to have confidence and feel loved. This led to the development of affirmation messages and notifications within the interface.

What it does

When you open up the app it features a virtual dog for users to dress up with accessories purchased with coins. You will also be able to view how many coins you have and you can earn coins by attending class and through studying. However, by picking up your phone during the time you’re supposed to be studying you will get coins deducted. By clicking on the different buttons you can access different areas of the app, for example, to view your profile which will contain the users general information as well as data about how many classes they have missed and number of completed study sessions.

We also wanted to add a feature whereby users will get prompts and notifications to remind students about their lectures as well as to send them affirmations to brighten up their days. We think mental health and wellbeing is really important so we would also send notifications to ‘check-in” on them and to give users information about the different services that are available if they wanted support.

The connection page works so users can add their friends to track their friends progress and to compare them. This portion will help keep users motivated if they see their friends are working hard, and how nice the other dogs look. It will add a slight competitive edge to the app, which will add to the fun!

Users will also be able to buy accessories with the coins they have to upgrade their profile and to feed their virtual dog. There are four categories: clothing, collars, treats, houses. These items can be given to your dog to wear, eat, or live in! Through this, you can create a unique dog that looks amazing.

Next is the Play Time button. Here it will direct the users to a page that will give the status of the dog. The dog will be sad or angry if users do not attend class, and happy or excited if they do. There will also be a status for the hunger levels of the dog, which is where the treats come into play. Feeding your dog treats will make them less hungry and slightly happier.

Finally, we have a Calendar function within our app. This portion will connect to the student’s calendars so they can view it within the app. This will allow our app to send out messages and notifications to remind students and give them words of affirmation.

Stimulate students to stay productive and maintain mental health through gamification.

How I built it

We first designed some rough drafts for the app interface and how we wanted everything to function. We sketched up some rough drafts on paper and got mentor feedback. Then we moved onto Figma to start designing the app online and utilizing their prototype interface to connect the panels together and get a rough idea of how the app would function. Then, we had one member start the coding for the aspects we wanted to keep, and the other two members to continue polishing up the design. From there, the app slowly came together, but the functionality of the app was not where we wanted it to be due to our inexperience with app development. With no previous experience and a lot of research and googling we built it on react natvie

Challenges I ran into

Determining the user interface and how the users would react with the design was a bit challenging. We weren’t sure if the buttons were self explanatory and made sense to the users so we had to think from a different perspective and make sure that all the buttons had a function that made sense. Also, we originally only had 3 buttons, but we wanted to add more interaction for the users so we created play time to have them interact with the virtual dog. It was a brand new language and compiler so we didn’t even know where to start

Accomplishments that I'm proud of

The app design and interface came out really nicely. We enjoyed finding the right color palette and pictures for the images. It was a really cool moment when we got to see the design and pieces come together because this is the first hackathon we’ve attended. Being able to learn about Figma and actually create something through this new program that allowed us to see a prototype and gave us a direction for the app. This is the first time we have built an app and none of us had any experience in it so it was definitely a learning curve, but we got a lot more done than we anticipated.

What I learned

We learnt about the use of figma which we hadn’t previously heard about before so it was new to all of us, however, it’s a really great programme and is useful to see your designs. This was a great opportunity to work with other students who we previously have not met before and to work together to each other's strengths to come up with an idea and create the application. Through the use of google-meet we have learnt to communicate in a different way and it was important to make sure we were organised as we had members in the UK time zone and California time zone. We learned how to use react native to code the program, but still could learn more about how to create an actual app. We learned the process of app creation, from the brainstorming process to the execution and development of the interface and app itself.

What's next for Paws Off!

Interface Design Expanding upon the gamification by setting up an accomplishment system and goal system for members to strive for more. Make the virtual dog more interactive and a dog that moves so that it seems more “alive” in a sense. Fully developing the app, the features in the aforementioned “What it does” section hasn’t been reached Expanding upon features such as play time and accessories so that there is a wide variety of options for users to choose from to truly make each dog unique. Develop the connection system to allow for users to search for new friends and potentially have play dates with other dogs if their status is free.