AggieHouse Portal

May 2024

HackDavis is the first major intercollegiate hackathon at UC Davis where over 800 students, hackers and creators come together for 24 hours of hacking.

Thanks for stopping by, let’s chat! 👋

CONTACT ME 💌

dheekshamagesh@gmail.com

LET’S CONNECT 🤝

©️2024 DHEEKSHA MAGESWARAN

Made with 💛 & 🍵

Context

📋

Overview

AggieHouse is a student-led and student-run transitional housing shelter that aims to combat homelessness and housing insecurity among the student population at UC Davis.


The ask was to create a web page to track volunteer attendance and notify them of their shifts. My team of 4 won the awards for Best Overall Design & Best Aggie House Hack, after which we were asked to partner with Aggie House to bring the vision alive through full deployment.

💁‍♀️

My Role

As 1 of 2 Designers, I collaborate in a cross-functional team with 2 developers. I work very closely with the front-end engineer to develop the website, ensure feasibility and deliver assets, alongside the other UI/UX Designer, with whom I work to create user flows, wireframes and UI components. I took initiative through roadblocks or pivotal moments in the project as well.

Problem

⚡️ The Challenge: How might we streamline admin & volunteer operations to work more efficiently?

Admin assign shifts to volunteers every 5 weeks according to their availability and receive feedback from volunteers once their shift has been completed. Volunteers have a requirement of completing 4 shifts every quarter from 7:00 PM to 8:30 AM. All of this happens across Google Forms, Google Sheets, Discord and email – leading to workflow inefficiencies for admin and volunteers.

Design Process

📚

Research

My first step was to understand the constraints of the existing system to understand what components were working and what was not.

I conducted user interviews with the AggieHouse President and Co-President to define their pain points about shifting. They revealed that admins didn’t know if volunteers actually showed up to their shift and manually sifted through preferences to fill the scheduling spreadsheet.

“We try to remind volunteers to check the spreadsheet to know their schedule. They end up forgetting and miss their shift.

- AggieHouse Co-President, Virginia

“It takes me hours to find 2 volunteers who are available on a particular night, have common preferences, and ensure they’re meeting their required hours.

- AggieHouse Board of Staff, Kaavya

I also researched third-party applications that other student-led organizations on campus used to create systematic scheduling.

Design Process

📚

Ideation

I took my findings and compiled them on an artboard where I organized my thoughts with my team. Technical and time considerations were established to help achieve realistic outcomes that aligned with both client and user needs.

Design Process

✍️

Sketching

Before reaching my final design, I sketched out iterations of the portal screens while staying mindful about keeping the user flow clear, dynamic, true to Aggie House’s brand.

DESIGN

Shift Scheduler

I explored the formatting and hierarchy for the table and received much feedback from design mentors in critique on legibility. In the final design, I added more whitespace, signifiers to indicate modifiable actions, and grouped 5 weeks (scheduling cycle) in a single view.

DESIGN

Shift Swapping

The original problem was that volunteers had to announce shifts to swap in a Discord channel and admin manually update the spreadsheet. I had to think about where and how to integrate this function minimally. My final solution was a clean and simple card and button on the dashboard that also dynamically updated the shift table on a successful swap.

DESIGN

Notifications

To inform users without necessarily logging into their portal, I included a system that would send text notifications to volunteers 1 week, 1 day, and 30 minutes before their next shift. During the research, I reviewed studies acclaiming spaced repetition reminder systems. 

DESIGN

Clock In & Out

I wanted to explore opportunities to allow volunteers to seamlessly transition between their shifts. However, how would we ensure volunteers are clocking in? Would the platform track their location? Or would that be violating privacy concerns? After discussing viable solutions with our whole team, I found that the simple and most straightforward design would be to only enable the “Clock In” button when the volunteer was on campus wifi overnight.

Outcome

💎

Design Library System Component

I detailed development notes and handed-off an organized final Figma file to allow the engineers to jump in and implement without needing to ask for much input from design. Given the time constraints, our cross-functional team collaborated concurrently. Including implementation notes and highlighting which states are ready for implementation versus ones that are in-progress was especially helpful in our context.

Design Process

💁‍♀️


Q/A Testing

I performed integration testing to consider interactions between the modules of our design once developers completed the MVP. This identified visual inconsistencies and made me re-evaluate our impact-effort matrix so that we could preserve high-priority design elements in our final Hackathon submission.

Takeaways

💛

Embrace Ambiguity

This project pushed me to work in a fast-paced environment while simultaneously handing off deliverables for development. During the 24 hours, our team encountered various obstacles from concept testing, pivots and dealing with two user personas. Although stressful at the time, this taught me the experience of adaptability and reframing. Not only did this allow me to practice critical thinking and proactivity, but I also discovered opportunities to develop my soft skills such as confidence, communication and leadership. 

Develop Design Focus

During HackDavis, there were various features that we considered implementing in our final product. However, this experience taught me to prioritize data-driven and high-impact decisions. I learned to consistently elevate the quality of my designs by soliciting feedback from peers and our clients when redefining direction. 

FInal Volunteer View Design

FInal Volunteer View Design

PREV.

Pet Health

NEXT

KNF

Selected work

AggieHouse Portal: Streamlining volunteer & admin operations

UC Davis

HackDavis 2024

Role

UI/UX Design

Duration

24 hours

Tools

Figma

Team

2 Developers, 2 Designers