iSTOP

Promoting student volunteers through code

Comment

Inspiration

From personally working at Miami Dade College in their Institute for Civic Engagement & Democracy, our teammate realized the one asset social volunteering organizations need help with most today is technology. Like iCED, lots of non-profits still use outdated methods to track their volunteer hours and activities (for example, using paper forms). We discovered this issue consumes unnecessary paper, time and effort from both the volunteers and the organizations themselves. By optimizing this process with an online website, using iCED's Civic Action Scorecard as a case example, we aspire to turn the volunteer experience for students more accessible and user friendly, so volunteers no longer feel discouraged by the paperwork involved.

What it does

Our website is called iSTOP (iCED's Scorecard Tracking Online Page) and it allows MDC students to submit their volunteer activities to a database that the iCED office can access directly. Students at iSTOP are able to submit actions towards their Civic Action Scorecard, check out local volunteer events that can earn them points, keep track of their progress, access their academic awards and contact the iCED office. On the other hand, iCED advisors can keep track of the total volunteer progress under their campus, approve student submissions, upload local volunteer events, and update student information. Our main goal with iSTOP is to make volunteer data accessible and the prototype mainly focuses on the Environment & Sustainability section to showcase its functions.

How we built it

Since this is our first hackathon and we're both beginners in different languages, we decided to use Velo by Wix to create our website. This allowed us to concentrate on the User Experience in more depth since Velo cut a lot of our coding time short. We built iSTOP entirely from a collection of blank pages and focused on creating a cohesive wireframe to emphasize its accessibility. We considered using SQL to hold any data but since it’s a prototype we only used Wix Collections.

Challenges we ran into

Neither of us had used Wix nor JavaScript before. We had to spend a lot of our time teaching ourselves how use Velo so we ended up creating and deleting many parts of the website as part of our trial and error process. This slowed down the process by a lot, but it was a learning curve we were able to overcome.

Accomplishments that we're proud of

Firstly, being able to create a clean website with a system and language we had never used before. The learning process with Velo was enjoyable and when we were able to get the website going it felt like an impressive achievement as beginner coders. Secondly, being able to show our local community college that there are ways to improve student civic engagement through technology. Fer, who works at iCED Homestead, will be showcasing this prototype to the iCED director next week in hopes turning it into a real project.

What we learned

We mainly learned how to build an accessible and clean wireframe with a good UX in mind. We tried to make use of as many Velo features as possible to create an interactive user experience, thus we also learned how to google for resources better. Since we didn’t know how to use this system before, we were able to learn how to come up with alternative solutions on the spot when things didn’t go as planned. In general, this taught us a lot about the website development process: from planning our main goal, our solutions, and the actual look of the website to building the prototype. We will certainly be using Wix in the future again.

What's next for iSTOP

Fer is hoping to submit the prototype to Miami Dade College so they are able to solve a department wide problem they come across every week: unnecessary paperwork. We will probably continue to work on this prototype after Shellhacks is over so it’s presentable to iCED directors and it helps the department encourage students to volunteer more.

Built With

Share this project:

Updates