Welcome to the StressGuide App from Team StressLess
Live link: https://andersganander.github.io/2406-hackathon-team3/
StressGuide is an app designed to help individuals manage the common human problem of stress.
Our goal is to provide you with valuable information about stress, allow you to assess your own stress levels,
and offer advice on how to manage stress effectively. Additionally, we provide links to further resources to help you improve your well-being.
We aim to create a site that is understandable and easy to navigate.
We start with two information cards that provide basic information on what stress is and how it can affect you.
Next, we offer a stress assessment tool to help you reflect on your stress levels across four different categories.
This tool helps you identify areas where you might need to improve your stress management,
emphasizing the importance of maintaining a good balance in your life.
The Stress Facts section in the Stress Management Application is designed to educate users about stress and its impact.
This section provides foundational knowledge that helps users understand what stress is, its causes, and its effects on both mental and physical health.
By presenting clear and concise information, the section aims to raise awareness and promote better stress management practices.
- Educational Content: The section presents basic, essential facts about stress in an easy-to-understand format. It covers definitions, common causes, and the physical and psychological effects of stress.
- Fact Cards: The information is organized into two visually appealing fact cards. Each card focuses on a different aspect of stress, ensuring that users receive a comprehensive overview without feeling overwhelmed.
- Visual Appeal: The fact cards are designed with user engagement in mind, using attractive layouts, colors, and icons to make the information more accessible and memorable.
The stress assessment feature in the Stress Management Application is designed to help users evaluate their stress levels across various aspects of their lives. It provides a structured way to identify areas that may be contributing to their overall stress and offers insights into how to manage and reduce stress effectively.
- Categories of Assessment:
The assessment is divided into four main categories, each addressing different aspects of life:
- Work and Education: Evaluates stress related to workload, job security, work-life balance, and career progression.
- Health: Assesses stress due to physical health issues, chronic conditions, and maintaining a healthy lifestyle.
- Social Media and Technology: Looks at stress related to the use of social media, online presence, and digital connectivity.
- Family and Relations: Focuses on stress arising from family responsibilities, relationships, and communication within the family.
- Questionnaire Format:
- Each category contains 8 questions, making a total of 32 questions.
- The questions are presented 4 at a time to avoid overwhelming the user and to ensure focused responses.
- Users rate each statement on a scale from 1 to 5:
- 1 - Strongly Disagree
- 2 - Disagree
- 3 - Neutral
- 4 - Agree
- 5 - Strongly Agree
- User Interface:
- The questions are displayed in a column in the center of the page, occupying one-third of the width to ensure readability and focus.
- Above the questions, there is a heading that shows the current category being assessed.
- Each question is numbered, and the total number of questions in the category is displayed for context.
- Navigation:
- A "Next" button is provided to navigate through the questions. Once the user has answered the first 4 questions, clicking "Next" will display the next set of questions.
- This process continues until all questions in all categories have been answered.
- Summary and Results:
- After completing all questions, a summary page is displayed.
- The summary shows the total score for each category, helping users identify which areas of their life are causing the most stress.
- This insight allows users to focus on specific areas for stress management and improvement.
- After the survey has been completed and the user's stress profile has been displayed, the tips section is customized to show tips for the two categories where the user has the highest stress scores.
Our design is calm and smooth to help you slow down and avoid information overload. The icons visualize the theme, and the assessment uses a clean slider instead of numerical grades. Further down, we provide general tips, and personalized advice based on your assessment results.
Technologies used in this project:
- HTML
- CSS
- Materialize
- Java Script
- Github - Save the project in a repository, use the canban for user stories
a team, we worked on the same project by forking the repository to our own GitHub accounts.
We made changes and committed them back to GitHub using the following commands in the codespace terminal:
Git add .
Git commit -m"text"
Git push
To run a frontend (HTML, CSS, Javascript only) application in Gitpod, in the terminal, type:
python3 -m http.server
The project is deployed on GitHub. Here are the steps to deploy on GitHub: Navigate to the repository.
- Click the "Settings" tab above the repository.
- Select "Pages" in the left-hand menu.
- In the "Build and Deployment" section, select "Deploy from a branch."
- Choose "main" in the first dropdown and "root" in the second.
- Save your settings. You can find the public site under GitHub Pages in the "Deployments" section on the right-hand menu.
To fork this repository, click the "Fork" button at the top right corner of the main repository page. On the "Create a Fork" page, you can change the name of the repo if desired. Check the box if you want to copy the main branch or multiple branches (main is selected by default). Then, create the fork.
To clone the repository, you create a copy in your repository (with all files and history).
This creates a remote link to the original repo, allowing you to work in your copy and push changes back to the original.
Open your repo and click the green "Code" button on the right-hand side. The easiest way is to open it with GitHub Desktop.
You can read more information on cloning at the GitHub : https://docs.github.com/en/repositories/creating-and-managing-repositories/cloning-a-repository
For inspiration for this project:
- experience from stress course in Sweden
- took part in KEDS test (a common used stresstest from medical researcher in Karoliniska Institute)
- https://dinpsykiskahalsa.se/artiklar/nar-livet-kanns-jobbigt/stress/
- Litteratur "Tid att leva : ett tioveckors program för stresshantering med ACT och medveten närvaro" Author: Fredrik Livheim, Daniel Ek, Björn Hedensjö
The footer contains information about our team, who built this app, and links to useful resources for stress management.
- Read more about stress: https://www.helpguide.org/articles/stress/stress-management.htm
- Learn more about CBT: https://www.youtube.com/watch?v=Jz55Uk9EH6U
- Beginners guide to mindfulness: https://mindfulness.com/mindful-living/mindfulness-a-beginners-guide