SunScreen

https://youtu.be/tWT8sxm-3NA

https://git.cs.umu.se/id19abn/sunscreen

If you want to try a demo of the website, please visit https://www.figma.com/file/jZOvTdHCpyAa9o9oybDMAA/SunScreen?node-id=0%3A1

When you visit the website you are presented with a glimpse of space, with earth in focus and the sun far behind. Scattered around earth and space you see different objects floating around, or placed on earth. All the objects are either hoverable or clickable, letting you interact with them as you wish. Doing this reveals short information about the specific object. If you feel intrigued by this information you can continue to read more just by clicking a “read more”-button. This takes you to an additional page with videos, pictures and text telling you about the object. E.g. one object could be the Parker solar probe. From the overview you get a summary of what it is and maybe how far it has traveled, and if you decide to read more you get more in depth information about it, its journey and all the data it has collected so far. 

To engage the user even further the overview contains an additional, mysterious, object. This object leads you to a page similar to the “read more”-page but with possible scenarios instead of an article. These scenarios are based on the data the probes collect (and what they might collect?) and how this affects us, both now and in the future. They are more speculations than concrete facts, giving the user some food for their imagination. This might also lead to the users creating their own scenarios and sharing them with others on social media. 

The website aspires to make the, sometimes complex, information and data easy to take in. With animations and interactive elements we want the user to feel as if they are out in space exploring the vast information themselves. A website is easily accessible for almost everyone, thus making it possible to take part of the data and information no matter where you are in the world. 

A prototype of the website was made in figma. The website itself was created using html, CSS and some JavaScript. The code is written in VS code and is tested in various browsers. Adobe Illustrator and Photoshop were used to create assets and icons as well as for some editing and animation.

The data that the Parker solar probe and Solar orbiter collects inspired many parts of our solution, most notably the scenario-part. All parts of the website are supposed to be updated both with new data and images as they are collected, keeping the website relevant and worth a revisit. 

When we found out about the Nasa Space apps challenge we immediately were intrigued by it. We saw it as an opportunity to challenge ourselves and see what we could do in this short time. 

When we browsed the different challenges we found that Unlocking the Secrets of the Sun would be a fun, challenging but doable challenge considering our background and education. We started out the project by reading the given background and resources and then brainstorming ideas. We continued the process on canva and in figma to make sure everyone was on the same page with the appearance and function of the website. We stuck with an idea that we felt that we would use ourselves if it was available. The weekend itself went by quickly and we learned to cooperate (when tired and hungry) and to take on a project from start to goal all by ourselves. 

We were a bit late to the game, we didn’t register to Space apps until just a few days before the hackathon. Hopefully if we were to do this again we would like to make sure that we had more time to prepare beforehand. 

Overall, fun but intense! 

Resources:

https://science.nasa.gov/heliophysics/focus-areas

https://science.nasa.gov/heliophysics/big-questions/how-does-solar-variability-affect-human-society-technological-systems-and-the-habitability-of-planets

Tools: 

Figma

Adobe Illustrator

Adobe Photoshop

Visual studio code

This project has been submitted for consideration during the Judging process.