Inspiration

We gained inspiration from National Geographic's Polar Bear Episode, "Hostile Planet" where we saw how global warming could affect wildlife. This led us to create a Sea-Level observation project that would connect climate change with real-life environmental effects. We believe this project brings awareness to this urgent issue and makes it a valuable contribution to the competition.

What it does

Our website is designed for young activists and students. "High Tide" is an interactive and informational webpage that teaches our audience about sea levels, why they're rising, and their impact on our planet; plus a list of organizations and solutions dedicated to helping combat Global warming, encouraging our audience to make a difference.

How we built it

We began by brainstorming our ideas onto a Figma frame, envisioning an impactful environmentally sustainable idea. Once our idea was formed, we outlined the features we wanted to implement and drew out their functions on various Figma frames. To organize our ideas, we started drawing with virtual pens to have a general idea of where images and texts should be placed. We also created a Flowchart to design the structure and how they interconnect. Next, we started developing low-fidelity designs, adjusting them over time. Having a mood board and a palette of colors ensured consistency within our designs since everyone was working on separate tasks. Finally, we moved on to high-fidelity designs where we tackled challenges with formatting, text alignment, research, and prototyping. When generating the graphs for Climate 101, we took our skills with Python to sort the data into a visual representation. With a few touch-ups, we completed our design, achieving a user-friendly interface with fun and interactive features for everyone.

Challenges we ran into

We faced several challenges when designing "High Tide". The learning curve was pretty high as it was our first time developing low and high-fidelity designs and collaborating as a group in a designation. Our group wanted to achieve a youth-friendly website that could send a strong message about how we can lower our sea levels and possibly impact them to make changes in their own homes. The most difficult part was prototyping specific components like the slider. It became finicky as we played with it and because there is no proper slider feature in Figma, we struggled with the overall prototyping for the Main Page. We had a great idea in mind, but although it was a bit difficult to execute, we are still happy with our product! Another challenge we had was with formatting. Whether it was the layers not cooperating, or we realized we had to fit our designs to the size of a laptop screen, there were many times when we had to readjust each design. Collectively, we can agree that prototyping and designing were the hardest stages during development.

Accomplishments that we're proud of

Our biggest accomplishment is finishing the project within the allotted time! We learned a lot of things along the way through our mistakes and late-night discussions about features and designs, but all of this is to say that we are proud to see our webpage come to life. With the help of smart animation tools and our artistic capabilities, we were able to create web pages that properly portray our creative ideas. The interactive features have functionality and artistic appeal through our hard work and we are proud of how our designs came together in the end.

What we learned

We learned many things from design shortcuts to learning about the effects of sea levels rising. We also made sure to take account of the user experience and how they would be able to navigate our website. Using Figma to bring our ideas to life through formatting and prototyping taught us how we need to consider many things like the position of a button, the different fonts, and appealing color schemes when creating a design. Additionally, research taught us that greenhouse gas emissions can cause sea levels to rise and that temperature changes can lead to devastating events. Throughout the course of this project, our team worked together learning various features in Figma and applying our skills and creative imagination to create our project.

What's next for Stargazers: High Tide

Since this was our first design project, we now know how to create certain features and learned how the design process works overall. We can take these skills to develop and prototype our own projects in the future and even possibly re-design some aspects of "High Tide." In the future, we hope to create a working webpage to successfully inform students like us how we can help our environment and spread knowledge amongst one another. Even though we submitted our final project, the journey is not over yet.

Built With

Share this project:

Updates