All Good Things

• 

  Welcome to the Forum! This is where you can see all of the awesome posts in one easy to access place.

• 

  This is what it looks like when a post is expanded in the forum. There is also a feature that lets you reply to somebody else's post.

• 

  Here's the Pets Channel! You can add a picture to one of your posts in the forum.

• 

  This is the rules page. All users on our website/forum must follow these rules so that interactions stay safe, positive, and civil.

• 

  This is our mental health resources page. It offers access to resources in multiple countries.

• 

  This is what our Random page looks like! Here is one of the games that you can access from the page. Can you help Harold?

• 

  This is one of the games on our Random page. Looks like somebody got a new high score!

• 

  This is another game on our random page. Help the Hedgehog eat all the donuts!

• 

  Here is the Music Maker on our random page. You can change the tempo, as well as what instruments are playing. What fun songs will you make?

• 

  This is our Dungeons and Dragons Personality Quiz, found on the Random page.

• 

  This is our About page, where you can learn about us, why we created this, and how you can create things using the same tools.

• 

  This is the code for the home page. It is inside the index.html file. This is where the content was created and the .css file was imported.

• 

  This is the code where we embedded the forum on the home page.

• 

  This, and the next 7 slides are all code from our Mental Health Resources Page. We included resources for multiple different countries.

• 

  We thought that it was important to include mental health resources in order to destigmatize asking for help, in a safe and positive space.

• 

  Mental health resources code

• 

  Mental health resources code

• 

  Mental health resources code

• 

  Mental health resources code

• 

  These are the mental health resources for the UK.

• 

  These are the mental health resources for Germany.

• 

  This is the code for the rules page. This specific chunk of code is what imports the style sheet from our .css file, and makes the nav. bar.

• 

  This is the code that embeds our rules scroll image, which we created using Google Drawings and downloaded as a .jpeg file.

• 

  This, and the next 3 slides are the code from the random page. This slide is where you can find the nav. bar, style sheet import, and title.

• 

  Here you can find 3 of the projects featured on our random page. This is the code for Harold, the Hedgehog Game, and the DnD quiz.

• 

  This is the code for the final project on the Random page, the music maker. Head over to the random page to check it out!

• 

  This slide, and the next 5 slides are all code from our .css file.

• 

  We used CSS to create a cohesive and complex style throughout the entirety of our website.

• 

  We used a variety of tools and techniques in CSS.

• 

  We added colors using hexadecimal code, we used classes, and many many lists.

• 

  Here is more of the CSS code

• 

  This is the last little bit of the .css file's code.

• 

  This is the code for the About page, where users can learn more about us, our project, as well as how and why we created it.

• 

  We used more complex styling techniques on this page, to give it some extra pizzazz, all while staying true to the color scheme.

• 

  Here is the last bit of code for the About page. We added links in this section so that people can easily access the same tools that we used

Inspiration

We were inspired to create All Good Things in order to brighten people's days, make them feel more connected, and give people a place to share good and positive things that are happening in their lives. Things are pretty chaotic right now, and it can be difficult to see that anything good is happening. All Good Things helps to give people hope by giving them a break from all of the stressful things going on in the world and on the Internet, and giving them a place to see and share positive things.

What it does

All Good Things is a website dedicated to positivity! You can use our forum, located on our home page to make an account, talk to other users, and share positive things in your life. We know that it's hard not being able to spend time with people in person, so we're giving people a safe space to interact positively online. We have a rules page, to encourage people to keep things civil, polite, friendly, and positive, as well as to keep everybody safe during their online interactions. We have a mental health resources page because we understand that cheering people up is not the same as professional medical help. This page provides easy access to various help hotlines to give people access to the care that they need. We have our Random page, which is a place to share fun projects, games, quizzes, and more! Our home is to brighten people's days, and bring smiles to their faces.

Forum Channels

The current channels on our forum are the Home Page, for announcements and general posts, Pets, because who doesn't love adorable cats (and dogs, and fish, and turtles etc.), Plants, for people to share the lovely green things growing in their garden and to share their gardening expertise, School, to share tips for how to manage stress and to share good things (good grades, new friends, fun clubs), Craft Projects, to share hobbies, projects, and your favorite places to buy supplies, Recipes, to share what fun foods have gotten you through Quarantine, as well as exciting new recipes you've tried, and the Random Channel, which can be used to discuss the various games, quizzes, and other interactive projects that are available on our Random page.

How we built it

We created this website on Glitch using HTML, CSS, and JS. We used multiple HTML files to create the various pages, and most of the content inside of them. We used CSS to make the website visually appealing, and to apply various formatting changes. We used CSS classes to assign designs to specific elements. We used HTML to embed the various projects on the Random page, as well as the basic forum. We used muut to create the forum, which we were able to embed in our website, and make changes to using HTML, CSS, and JS.

Challenges we ran into

Distance:

One of the main challenges that we ran into was not being able to work on the project together in person. We had to figure out how to communicate, work together, and share ideas completely online. We ended up using a combination of Zoom, Direct Messaging, Glitch, and shared Google Docs to plan and communicate during this process.

Complexity

When making this project we had to combine elements from various different platforms. We had to use multiple .html files for the different pages, and connect them using a navigation bar. We also had to figure out how to embed the various interactive projects from platforms such as Scratch. We had to figure out how to make our different pages cohesive, even though they serve very different purposes.

Chat Bot

One of the elements that we tried to include in our project was a chat bot. Unfortunately the chat bot did not make it into the final version of our project because there were still a few too many bugs to work out. We stretched ourselves in trying somethings new, and we learned a lot about how to work with and create a chat bot for next time.

Accomplishments that we're proud of

We are proud of the Navigation Bar that we created, because it helps make the project more user friendly, and connects the pages. We are proud of the forum, how well we got it to work, and how we got it to work together with the other elements of the website. We are proud of the projects that we created on the Random page, and how we were able to embed them.

What we learned

By creating this project we learned more about using CSS to create a single color scheme and layout. We also learned more about creating interactive games with Scratch, creating interactive quizzes using JS, and embedding things using HTML.

What's next for All Good Things

We hope that All Good Things will continue to give people joy, bring people together, and inspire people create fun and uplifting things with code!

Built With

• css
• glitch
• html
• javascript
• muut
• scratch