Spork
A WebApp that helps individuals with chronic illnesses to track their energy use, discover and share insights to effectively communicate their lifestyle
Problem Background
Individuals with chronic illness and pain have reported a feeling of difference and division between themselves and able-bodied individuals.
Living with a chronic illness is debilitating and forces an individual to be acutely aware of how they use their energy. Seemingly simple, everyday tasks like making breakfast, or wearing boots, can place a significant strain on individuals, limiting their ability to complete necessary tasks and increasing the risk of a flare-up. The constant pressure to be mindful of how they use their energy can itself be an exhausting endeavour. Additionally, they may struggle to communicate their needs and limitations, leading to a disconnect with those around them.
As a team, we want to live in a world where people are more understanding of one another. To that end, we want to build a product that can improve the quality of life for individuals with chronic energy limiting conditions. We would like to help these individuals more easily track their energy usage to give them a deeper insight into their energy consumption and enable them to share with and educate able-bodied individuals about their energy usage.
User Research Insights
We initially conducted secondary user research on platforms like Reddit, Facebook groups and Discord servers to better understand our target customers and their pain points. From the secondary research, we were able to identify what we felt were the biggest pain points in our users: the inability to clearly track their energy use based on their unique energy needs, and the difficulty in effectively communicating their lifestyle with others. Once we felt comfortable in understanding our customers, we started conducting user interviews to get a better idea of their pain points and found that they largely aligned with what we had concluded.
Solution Mockup
As we were brainstorming potential solutions for our users’ pain points, we came across an analogy devised by Christine Miserandino. She had created the Spoon Theory analogy in 2003 to explain her lifestyle to a friend who wanted to better understand the lifestyle of someone living with Lupus. We felt that the spoon theory analogy could serve as an effective representation of our users’ daily energy availability and the number of spoons each task may consume. Keeping the analogy and user research in mind, we created our user persona, user flows, and Lo-Fi which in turn helped us gather additional user feedback for our MVP.
Feedback 1
The general reaction to our Lo-Fi design and user flow was quite positive. It seemed that users were genuinely excited to have a product that met their exact needs.
Highlighted user reaction: This kind of app is something I have been on the hunt for myself for quite some time, so I am very excited about it!
From early in our product design, we had intended for the user to have full control over their energy availability and expenditure. To this end, we wanted them to have the ability to change their daily spoons allotment based on flare-ups in their illness and how they were feeling. However, when we presented this to users, we discovered that while they appreciated the control, they did not predict that they would change the available spoons frequently. We learnt that our users considered their flare-ups to be completely separate from their energy availability. Additionally, users commented that the daily check-in that we had incorporated in our user flow might be an additional cognitive load and something a little less intrusive would be preferable.
Based on these learnings, we refined our Hi-Fi mockup. We added the functionality to log two types of activities: spoon consuming activities, and flare-ups. We added an optional banner to the top of our dashboard that would ask the user how they were feeling to allow them to log qualitative information as well.
Design Learnings
Once we had a Hi-Fi wireframe and started work on the prototypes, we began regularly updating potential users on our team’s progress. This allowed us to gather feedback and iterate on our design and user flows.
We learned that flare ups are a lot more common than healthy individuals think and the effects from a flare up can linger for a few days. Another important factor was that the act of tracking itself is something that takes time, energy and a cognitive load.
While it may be useful to quantitatively track energy expenditure, our product must be able to strike a balance to ensure that it does not inadvertently place a strain on our users when they utilise our product to track their energy use. Based on this feedback, we made it easier to log flare ups and reduced the complexity of some of the activity and mood logging to ensure that the user experience is very simple and takes the least amount of effort.
Feedback 2
Our users were very excited to see the Hi-Fi mockup and were keen to offer feedback. They were very interested in the type of insights that the product could offer. Particularly, they wanted to find out if it would be possible to identify correlations between their flare-ups and activities. Unfortunately, this level of insights was determined to be out of scope for the MVP, but was added to the backlog to ensure that the valuable user feedback was not lost.
Future Work / What’s Next
While the CoLab experience has been short and sweet, our team is highly motivated to continue working and learning together! We are very lucky to have dedicated user communities that are excited to offer feedback on an ongoing basis and would like to iterate our product based on their inputs. The feature that was most highly requested (rather loudly requested) was the ability to integrate Spork with wearable devices. This was far out of scope for our MVP, but would be an exciting challenge for our team to tackle and an excellent enhancement for our users.
Technical Implementation Details
Where is it hosted?
- Front: Netlify.com
- Back: Render
What is your tech stack?
- Backend framework: Flask w/ SQLAlchemy
- Frontend framework: React.ts
- Css framework: TailwindCSS w/ DaisyUI components
- Other tools: AG Charts used to create data visualisation
Why We Chose These Tools
Backend Framework: Flask with SQLAlchemy
We chose Flask because it is lightweight, flexible, streamlined and easy to set up. For database management, SQLAlchemy was picked since it integrates smoothly with Flask.
Frontend Framework: React.ts
React with TypeScript is our framework of choice for the frontend. React’s component-based structure is perfect for reusing code and keeping things organised. Adding TypeScript helps catch errors early and makes the code easier to understand and maintain.
CSS Framework: TailwindCSS with DaisyUI Components
TailwindCSS is a fantastic tool for styling that puts utility-first, allowing us to build custom designs quickly without writing tons of CSS. DaisyUI adds pre-designed components, which speeds up the process and ensures the UI looks modern and clean.
Other Tools: AG Charts
AG Charts were chosen for data visualisation because they are powerful and customizable. They support various chart types and make it easy to present data in an interactive and engaging manner.
How to Improve the Product’s Implementation
- Better User Experience (UX):
- Ensure that Spork is accessible to everyone, including individuals with disabilities
- Accelerate the UX by optimising load times, utilise lazy loading and tweaking assets to be more lightweight
- Scalability and Maintainability:
- Clean up the code, follow best practices and document the code to make it easier to manage and extend.
- Add automated tests to catch bugs early and make future changes smoother.
- Set up CI/CD pipelines to make deploying updates faster and more reliably
- Better Data Management:
- Use caching (like Redis) to speed up data retrieval.
- Optimise database queries and use indexing to make data operations faster.
- Consider using GraphQL so clients can request only the data they need.
- Visual and Interactive Enhancements:
- Add engaging CSS animations and transitions to the UI
- Ensure that the design works well on all devices, including mobile.
These improvements can make our product better by improving the user experience, performance, and make it easier to maintain and scale.
Learnings
Product Manager Learnings:
Viswajit Kumar
Designer Learnings:
Fabian Gutierrez
Designer Learnings:
Jo Sturdivant
- Adapting to an Established Team: Joining the team in week 6 of 8 was challenging, as I had to quickly adapt to existing workflows, dynamics, and goals. This mirrors real-world situations where you often integrate into teams mid-project, and flexibility is essential.
- Work-Blocking for Efficiency: With only two weeks to complete the project, I learned the importance of a structured work-blocking system. This approach allowed me to manage my time effectively and meet deadlines under pressure.
- Making Data-Driven Design Decisions: Unlike my past projects, I had to rely on research conducted by others. This was a valuable experience in using pre-existing data to guide design decisions, helping me focus on the core insights without starting from scratch.
Developer Learnings:
Jeff Chebul
Developer Learnings:
Vanady Beard
&
As the back-end developer, I learned how important it is to create efficient and reliable systems that support the entire application. This experience also taught me the importance of optimising the database and ensuring the backend is scalable and easy to maintain.
Developer Learnings:
Stephen Asiedu
&
As a back-end developer, I've come to understand the importance of being familiar with various database systems and modules. This knowledge enables me to build diverse applications and maintain versatility in my work. I've also learned that the responsibility for making the right choices rests on my shoulders, guided by my best judgement.
Developer Learnings:
Chris Fletcher
&
Developer Learnings:
Maurquise Williams
&
- Process of Creating an MVP: Developing a Minimum Viable Product (MVP) taught me how to focus on delivering core functionalities balancing between essential features and avoiding scope creep.
- Collaboration in a Real-World Tech Setting: This experience taught me how to collaborate efficiently in a fast-paced tech environment, keeping the team aligned and productive, even while working remotely across time zones.
- Sharpening Critical Thinking and Problem-Solving Skills: This experience honed my ability to think critically and solve problems efficiently. By tackling challenges and finding quick solutions, I sharpened my decision-making and troubleshooting skills in a dynamic, real-world setting.
Developer Learnings:
Jeremiah Williams
&
All in all this experience was very awesome I learned that in coding with others being transparent is key
Developers Learnings:
Justin Farley
&
I learned how important communication is when working with a team. Communication provides understanding, advice, ideas, and much more. While working with the product team, I’ve found that communication keeps everything flowing smoothly. Working with a team also showed me that every member brings something different to the table and we all have to work together in order to align and meet our end goal.