For this May’s jam, we want you to #TeachAThing or two 🍓

Happy May! This month signals that the end of the school year is upon us, so why not procrastinate from our papers, assignments and grading by making a Glitch app that…teaches a thing . Whether it’s a tutorial, guides, or fan art about your favorite fun fact, this month we’re building apps that will make others say “today I learned!”

Head to glitch.com/jams right now to learn more about what jams are, how to submit your projects, and see what the community made for past jams. And a huge shouts out goes to all of you who participated in last month’s #coolbugs jam!

We can’t wait to learn, as well as see and share what creative projects you come up with!

4 Likes

I am so going to create a website version of my CSS Animations tutorial!

2 Likes

Here is my example :smiling_face:

4 Likes

I initially thought of making a simple “fun facts” website, but I then stumbled upon a UFO sightings dataset, so I decided to make a simple website around reading random UFO sightings.

Link: htxtps://ufo-o-matic.glitch.me/

EDIT: I have now added a bigfoot sightings list, so the link is now https://sight-o-matic.glitch.me/

2 Likes

Here’s my example: How to factory reset various network devices ensuring data is securely destroyed for things like change of ownership and reselling.

4 Likes

Technically, anything you see in the sky that you do not have information about is, by definition, a UFO as UFO stands for “Unidentified Flying Object.” I love the website!

2 Likes

Thanks! I decided to go with a simple, minimalistic design, I think it fits pretty nicely :slight_smile:

Also for the UFO thing, I went with it because the database I got everything from specifically mentioned UFOs. Idk if I should change the name

I feel inspired to compile a massive linux tips and tricks cheatsheet for friends now =P

3 Likes

This website is my codejam submission and it is called “NO MORE UGLY WEBSITES.” It has a nice guide (which I will expand) and some Tools and Inspiration to go along with it.

3 Likes

A little tip to improve your website on how to improve websites: recommend some fonts and please make the text animations not be so long :slight_smile:

1 Like

Okay! I was defiantly going to add on to the Guide and I was considering making the animations shorter. Thanks for the suggestions!

1 Like

great work! I’d make the animations even shorter (my rule of thumb is < 500 ms unless it’s used for storytelling). also I would use max-width to say 768 or 1024px on the container div and use margin: 0 auto to center it so that the text would be easier to read on a large screen.

suggestions on resources

https://coolors.co/

https://flexbox.help/

and obviously mdn

Here I am teaching how to use Wikidata (thing one) and Mapbox (thing two!), together.

4 Likes

Yep! Thanks for the suggestions. I am trying to add on @wh0 onto the project (it is not working) but when/if it does he can help with that sort of thing.

Other than mentioning bright on bright and dark on dark is unattractive, you could add that it’s an accessibility issue for people with vision problems and add a link to this accessibility validator showing them as “contrast errors”:
https://wave.webaim.org/report#/https://nomoreuglywebsites.glitch.me/howto.html

3 Likes