Email

Capstone Project

~ ✧ ~

The Foxglove Tome

A Digital Sanctuary for Mental Wellness

The Heart of the Project

Born from a desire to support those facing mental health struggles, including people close to my heart, The Foxglove Tome is more than a journal. It is a digital sanctuary designed to provide "breathing room" in an often overwhelming digital landscape.

A Space for Reflection

Inspired by the calm and healing nature of a physical garden, the app features a mood tracker that translates emotional check-ins into a visual sanctuary. Instead of sterile charts, the Tome allows users to "plant" flowers in their digital space creating a curated garden that serves as a mirror to their internal world.

The Planned Toolbox

PHP MySQL VS Code React Adobe Illustrator Bootstrap GitHub Figma
~ ✧ ~

Progress Updates:

Graphic Design Icon

Week 1 - Conceptualization & Wireframing

Completed the proposal document, wireframe and UML Diagram

Website wireframe and UML diagram for The Foxglove Tome project proposal.

Week 2 - The Logo

Created the logo for The Foxglove Tome using Adobe Illustrator and exported the full package of sizes. Created the database and tables in PHP.

The Foxglove Tome logo, featuring a botanical flower over an open book.

Week 3 - The Database

Created the GitHub repo, started the folder scaffolding and connected to the database.

Database relationship diagram showing links between users, garden, and journal entries.

Started working on the nav bar and home page to test progress.

Screenshot of The Foxglove Tome homepage featuring the deep purple navigation bar and the script title in the hero section.

Week 4 - The Assets

Started working on the mood category icons using Adobe Illustrator

Screenshot showing the process of adding thorns to brambles for the prickly category.

Week 5 - More Assets

Changed asset strategies for better time management and completed mood category icons

Four circular category icons for the mood categories. A thistle, a wilted leaf, a foxglove in bloom and a rooted tree.

Week 6 - Making Decisions

This week I reached out for some feedback from someone with vision difficulties. I created two visual comfort options to be accessible through an easy to use toggle setting.

A side by side view of the home landing page when not logged in. It shows a high contrast version of black text on white with a dimmed background image and a lower contrast version of white text on slightly see-through black with a vibrant background image.

I also began coding!

A cropped screenshot showing error message coding. The fan favourite is 'It looks like this email already planted a garden here. Try logging in?'

Week 7 - Authentication

Added Signup, login, logout and forgot password/reset password

A collage of code snippets showing authentication coding.