Intentional Communities of Washtenaw- Communication and Content Management System

SI 699: User-Centered Agile Development Capstone Project

Client

The Intentional Communities of Washtenaw (ICW) is a group of parents, families, and friends who want to improve the quality of life for adults with intellectual and developmental disabilities by supporting community living and enhancing social opportunities. Based on a model of “community interdependence,” ICW promotes the development of individual strengths and gifts while respecting personal needs and preferences. ICW community-building strives to improve the lives of adults with disabilities by:

• Creating unique, high-quality housing communities of choice for clusters of 6-10 individuals

• Providing a Community Builder to live on-site to support independent living and facilitate social activities

• Developing a large network of families, individuals, and businesses who support and participate in social, recreational, and educational activities

Category

Web Development

Team Size

6

Skills

Agile Development, Software Integration, MERN Stack (MongoDB, Express, React, Node), Contextual Inquiry, Wireframing, User Testing

Problem Statement

ICW has been using a combination of multiple platforms to keep track of its organization’s information and to communicate with the residents and their families. ICW has used an Excel spreadsheet to organize its contact information, multiple different calendar software to organize its events, and multiple communication platforms to update residents and their friends/family about announcements and upcoming events. This variety of tools has created an information disconnect that has impeded ICW’s ability to efficiently operate.

Solution

Our project built a simple and usable calendar, communication, and management app that consolidates all of these platforms into one. This platform will reduce the community builders’ workload and provide a more efficient experience for both staff and residents.

Key Features

Event Management

• Add/Edit/Delete

• Notifies Attendees

• Attendee RSVP

• List View/Calendar View

• Search

• Export

In-App Communication

• Email/SMS

• Send to contact groups

• Schedule messages

• Message formatting

• Image support

Agile Project Management

Product/Sprint Backlog

Our project followed the Agile development framework. We completed four sprints, with each lasting 2-3 weeks. We utilized Airtable to organize our user stories and track progress throughout the sprints. Our Airtable had a product backlog, a sprint backlog, an in-progress column, a blocked column, a ready to review column, and a done column.

At the beginning of each sprint, we held a sprint planning meeting. During this meeting, our team would select high-priority user stories to include in the sprint and would estimate the work hours required to complete that user story. At the end of each sprint, we had a sprint review meeting. Sprint reviews were an opportunity to demonstrate progress, reorganize our product and sprint backlogs, and if necessary, plan how to finish incomplete features from that week’s sprint backlog.

User Research

User Interviews

We carried out contextual inquiry interviews with all community builders and a group of ICW residents. The community builder interviews served as a method to investigate ICW’s current processes regarding event management, calendar organization, and communication. By discussing their current experiences, we sought to uncover any preferences that the community builders had as well as any pain points they had been experiencing.

Our interview with the ICW residents concentrated on determining how residents interact with the material they receive from the community builders. These interviews allowed us to better understand the issues with the current system, and best design how to address these issues. The interviews also revealed the importance of accessibility in our design. We needed to incorporate methods in our design where community builders were able to tailor their communication to fit the unique visual and comprehension needs of residents.

High-Fidelity Prototype - Wireframes

We built a design system for the platform and developed high-fidelity wireframes on Figma for all required screens.

In addition, we also designed the appropriate mobile screens for our platform.

Usability Testing

We conducted three usability tests with community builders that would be using the platform. We developed a user testing plan that concentrated on checking five overarching goals: account functions (sign up/sign-in/sign out), event management, contact/contact group list management, communication functions, and user profile functions.

The usability tests were done on the live site when possible, but for some functions, we utilized screen share to test functions on our local site deployment. These usability tests helped us discover some bugs in our code, as well as user flow improvements and additional desired features.

The feedback from these usability tests was very positive, and many of the participants were relieved to see they had a single source to do their tasks.

Technology Stack

Our project was built using a MERN stack. A MERN stack is a technology stack that includes MongoDB, Express.js, React.js, and Node.js.

MongoDB

• NoSQL Database

React.js

• Dynamic, interactive web page

React is a JavaScript framework for creating dynamic client-side applications in HTML. Express and Node make up the middle (application) tier. Express.js is a server-side web framework, and Node.js is a powerful JavaScript server platform. MongoDB is the backend database where our application stores data.

Passport.js

• Authentication Plugin

Google Calendar API

• Integration with Google Calendar

Deployment

Our site is hosted by DigitalOcean using Ubuntu and Nginx.

Project Demo