Buttterfly

• 

  Welcome Page

• 

  Client Goals

• 

  Client Report

• 

  Scheduling

• 

  Daily Logs

• 

  Client Map

Inspiration

Part of inspiration, was the application MyCompass, which is currently utilized by the company Chrysalis for their work. However, MyCompass lacks the inclusion of many features that would allow Chrysalis employees to better organize their time and manage their work with their clients, so we chose to take in inspiration from various management systems (such as the task/event system from calendar application) to add to our solution.

What it does

The application includes a simple dashboard that includes a master schedule that displays all staff/individual assignments that allows staff to manage their time directly on the application. There is a navigation bar that gives staff easy access to profiles, where upon clicking on a profile the staff members they are able to get information about their client, review their client's calendar (which would include who was on shift with a client and when), display and manage their client's goals (which can help improve the self esteem of their client), and a community section which displays the locations their client frequents. The staff are additionally able to create and view the logs for any of their clients, with the ability to create revisions and check revision history. A major feature is the "Reports" page on the staff navigation, which would give them the choice between viewing past reports or creating a new one. When creating report they are able to choose the client who they would like to create a report for, as well the logs that they wish to include in the report, and would then have access to a properly formatted pdf that includes all the necessary information. These reports can then be sent for accreditation, and would save them time that they previously were spending manually aggregating logs, creating the report, and formatting it.

How we built it

We utilized next.js and react.js for both frontend and backend development, with supabase to act as our api. We've used Supabase authentication the make Signup, login, email confirmation, and role based authentication run smoothly. We've utilized the google API to in order to use the google map and pinpoint location

Challenges we ran into

Determining what framework we should work with given the lack of time. Most members on our team had not previously used next.js, so there was a lot of learning to be done before we could start building our website.

Accomplishments that we're proud of

Despite never using next.js before, many team members showed impressive adaptability and perseverance to learn the framework, while still producing a polished website containing all desired functionalities.

What we learned

Through this process team members learned about full stack development, as well as key project management concepts such as agile workflows, scrums, and effective communication to complete our final prototype.

Working with Chrysalis has taught our team about what it means to go above and beyond for those in our community. After talking with Director, Robert Helm, we got to understand all the work that goes into the employment/skill programs offered at Chrysalis. It helped us understand why staff time and effort was so critical, and drove our motivations for creating a website that could provide such relief.

What's next for Buttterfly

We would like to expand on the functionality of site, to further streamline the process of creating reports, as well as managing the ability to create different kinds of reports and storing client information. We would also expand the site to include a mobile friendly format, as there are some staff who may wish to access the site and document log while out in the field with their client, and mobile formatting would create a better user experience for them. We also plan to add and to expand on the Goals dashboard, that consists of subgoals, category, completion process, and if not met the reasoning as drop down menu in the client list, which the client list can be ordered alphabetically

Built With

• maps-javascript-api
• next.js
• places-api
• shadcn
• supabase
• typescript
• vercel