By Mind Menders Developers : Dan Morriss, Agy Luczak, Tomislav Dukez, Ben Gilbert, Jamie Phelps and Stanley Owanta
- Project Discription
- Project Goals
- User Experience
- Design
- Technologies Used
- Features
- Testing
- Bugs
- Deployment
- Credits
- Acknowledgements
This is MenTool, just a simple way of tracking your mood whenever you want to. It’s completely anonymous, all data here is just for you to see how you’re getting on. At MenTool we understand that sharing moods and feelings with others can be difficult so we’re providing users with a way of simply recording them. You can then view the data and see how things are changing, for better or worse, over time. This might help you become more aware of how you are feeling about yourself, relationships, the wider world and more or it might just be an interesting thing to look at - ‘This week I was OK for more days than I was sad’ or ‘That was a great week, only one down day!”. We’re not going to suggest changes, hint at trends or anything else, just allow you to observe how you feel day by day. It’s so easy to use, just a couple of clicks a day or whenever you want too.
- To be able to track moods
- To see previous mood patterns
- To be able to create an account
- To be able to log in and out
- To help users track their moods
- To help users realise what sort of mood they are in
- Provide an account feature for users to keep thier infomation safe
- Users who want to start tracking their feelings
- Users who want to continue to track their feelings
- Users who want to use a login in
- As a first time user, I want to be able to track my mood
- As a first time user, I want to be able to create an account
- As a first time user, I want to be able to navigate the app easily
- As a returning user, I want to be able to continue the track my mood
- As a returning user, I want to be able to see my mood history
- As a returning user, I want to be able to log into my account
- As a returning user, I want to be able to find out about mental health sites
- As a returning user, I want to be able to find out who built the app
- As the App owner, we want users to find informantion about mental health
- As the App owner, we want users to be able to track thier moods
- As the App owner, we want users to find out about the devs who built the site
- Login
* User
* Stats
* Brain for track your mood?
* Logout
* Home
* About us
Very Happy Happy Meh Sad Very Sad
This colour palette combines deep navy blue (#010A26), dark teal (#224040), soft off-white (#EBF2F2), olive green (#595542), and light taupe (#BFBAAA) to create a harmonious and balanced aesthetic. We chose these calm, earthly colours to reflect the app's purpose of tracking and reflecting on emotional states.
Audiowide, with its modern and tech-forward appearance, was used for headings to give the app a contemporary and professional look. In contrast, Quicksand, with its more approachable and readable style, was applied for body text, ensuring that longer texts are easy on the eyes and pleasant to read. The combination of these two fonts balances a modern, tech-forward look with approachability and ease of use, aligning well with the app’s purpose and its target user base.
Landing Page
About Us
Account Home
Create Account and Login Page
Analytics
About US
Login
Mood
Navbar
Sign up
Database design was made with QuickDBD. The database is hosted on ElephantSQL and is a PostgreSQL database.
Database Diagram
- HTML
- CSS
- JavaScript
- Python
- GitHub
- Bootstrap
- Balsamiq
- Google Fonts
- Font Awesome
- Favicon.io
- Django
- Heroku
- Jquery
- Crispyforms
- Cloudenary
- Elephant sql
- Peak
The mood tracker allows the user the tracker their mood on the app by clicking on the relivant icons
User stories covered: 1, 10
The account feature allows the user to login and out of the app keep their data secure
User stories covered: 2, 4, 6
The mood analytics feature allows the user to be able to keep a record of the moods that they've inputed in the mood tracker
User stories covered: 5
The Github profile link allows the user to see the acounts of the devs that built the app and see their other work
User stories covered: 8, 11
The navbar allows the user to navigate around the app
User stories covered: 3
The footer links back to the about us page which details the devs involved with the app
User stories covered: 8, 11
I put my website through the following validation tools:
Account Page
Landing Page
Login Page
Signup Page
All good
Validation
About us Lighthouse
Landing Page Lighthouse
Login Lighthouse
Signup Lighthouse
Iphone Mac Linux Windows
Chrome Firefox Edge
| Bug | Fix |
|---|---|
In order to make a local copy of this project, you can clone it. In your IDE Terminal, type the following command to clone the repository:
git clone https://github.com/DanMorriss/MenTool.git
If done locally, the virtual environment needs to be created and activated. To do so, in your IDE Terminal, type the following commands:
python3 -m venv venvIf on Linux/MacOS, type the following command for activation:
source venv/bin/activate
On Windows type the following command for activation:
venv\Scripts\activate
Alternatively, if using Gitpod, you can click below to create your own workspace using this repository.
After cloning or opening the repository in Gitpod, you will need to:
- Create your own
.envfile in the root level of the project:
SECRET_KEY=[your_secret_key]
DEBUG=True
DATABASE_URL=postgres://[username]:[password]@[host]:[port]/[database_name]
CLOUDINARY_URL=cloudinary://[api_key]:[api_secret]@[cloud_name]
**Ensure the .env file is added to your .gitignore file so it doesn't get pushed to a public repository.
If you don't have a Cloudinary account already, you will need to Sign Up for Free to host the static files in the project.
-
Run
pip3 install -r requirements.txtto install required Python packages. -
Setup the SQL database. In this project, PostgreSQL on ElephantSQL and put the details in the
.envfile. -
Migrate the database models using:
python3 manage.py migrate -
Create a superuser with your own credentials:
python3 manage.py createsuperuser -
Run the Django sever:
python manage.py runserverThe address of the server will appear in the terminal window. Add /admin to the address to access the Django admin panel using your superuser credentials.
Sign up to Heroku for free if you don't already have an account.
-
Create a new app in Heroku.
-
In the Resources tab of your app in the Heroku dashboard, click Add-Ons and select Heroku Postgres. Select Hobby Dev - Free as your plan.
-
When Heroku Postgres is installed, click the Settings tab in the Heroku Dashboard. Click Reveal Config Vars, and add the same variables from your
.envfile here, except forDEBUG, as you don't want debug mode on the deployed project. -
Insert the
SECRET_KEY,DATABASE_URLandCLOUDINARY_URLto the Config Vars. -
Create a file called
Procfile(no extension) containing the following:
web: gunicorn mentool.wsgi
- Add the url of your Heroku app ('https://mentool-2af96fd6f7e7.herokuapp.com') to your
settings.pyfile:
ALLOWED_HOSTS = [
'https://mentool-2af96fd6f7e7.herokuapp.com',...
]
- Disable collect static so that Heroku doesn't try to collect static files when you deploy by adding the following to your Heroku Config Vars in the Settings tab of Heroku dashboard:
DISABLE_COLLECTSTATIC=1
The same variable has to be removed from Heroku Config Vars when you want to collect static files (for the testing and final deployment).
- Stage and commit your files to GitHub
git add .
git commit -m "Commit message"
git push
-
In the Heroku dashboard for your App, select Deploy. Under Deployment Method, choose GitHub and search for your repository and click Connect.
-
Select Enable Automatic Deployments, and then Deploy Branch. Heroku will build the App from the branch you selected.
-
Now whenever you push your commits to GitHub, Heroku will rebuild the application.
The project can be forked in order to make a copy of the original repository and propose changes to the project owner using Pull Requests. That can be done by following these steps: First, log in to GitHub and locate the Project's Repository. At the top of the Repository, on the right side of the page, locate the "Fork" button. A copy of the Repository should now be in your GitHub account. You can now propose changes to the Repository by creating a Pull Request.
The web site is deployed on Heroku and can be found here.
The AMAZING team Mind Menders! Everyone is the team worked fantasticly well together and made the hackathon a fantastic event to be apart of!
Dan - Our fearless leader who kept us on track all week Tom - Our resident Yoda helping with all backend issues and deployment Ben - Our middion guidrnce councilor, keeping the project ideals together at all time. Agy - Our front end magician, making our site look pretty at seeing things the rest of us missed. Jamie - Our cleaning master, picking up everything gets the rest of us miss and keeping us on track. Stanley - Our backend guru who unforunately missed out on the in person day from missing his flight