STEMiphore Website

Inspiration

The inspiration behind this project was to make STEM education more accessible, especially to underprivileged communities. We wanted to create a platform that not only spreads awareness but also provides practical resources, mentorship, and hands-on learning opportunities to bridge the gap in STEM education.

What it does

STEMiphore is a platform that provides resources, videos, and contact points for individuals and organizations who wish to contribute to or benefit from STEM education. The website highlights our initiatives, showcases success stories, and offers an easy-to-use contact form for inquiries and collaborations.

How I built it

The project was built using a combination of HTML, CSS, and a bit of JavaScript for the dynamic features. I utilized Formspree to implement the contact form, allowing users to reach out directly without needing backend services. I focused on creating a simple, clean, and responsive user interface that works seamlessly across all screen sizes, from desktops to mobile devices.

Challenges I ran into

Initially, the navigation bar worked perfectly on wider screens, such as desktop monitors, but posed challenges on smaller screens like mobile devices. The upper right navigation bar did not adapt well, which led to poor user experience on mobile. To fix this, I implemented a menu icon that appears on mobile screens, allowing users to click and easily navigate to the desired section of the website.

Accomplishments that I'm proud of

I'm proud of the user interface design, which balances simplicity and functionality while being visually appealing and also relating to science as green is the color of science. Ensuring that the platform is responsive on all devices was a major accomplishment. Additionally, creating an intuitive, user-friendly experience where users can effortlessly interact with the content is something we take pride in.

What I've learned

Through this project, I learned how important it is to focus on responsive design, ensuring that the website is optimized for various screen sizes. I also gained deeper insights into combining different technologies (HTML, CSS, JavaScript) effectively and utilizing external services like Formspree to simplify form handling. It was a valuable lesson in balancing aesthetics and functionality while ensuring accessibility for a wide audience.

Built With

• css3
• formspree
• html5
• javascript