NSBE-UCALGARY

NSBE Logo

Inspiration

As dedicated members of the National Society of Black Engineers (NSBE) at the University of Calgary, our team recognized the critical need for a central online platform to represent and unite our community. The hackathon challenge to create a website for a club we are passionate about presented the perfect opportunity to enhance our chapter's outreach and impact.

Our website serves as a gateway for prospective members to learn about NSBE’s mission to increase the number of culturally responsible Black engineers who excel academically, succeed professionally, and positively impact the community. By showcasing our events, initiatives, and success stories, we aim to inspire students from all backgrounds to join our vibrant community and contribute to meaningful change.

As two of us are executive members, we understand the importance of making it easy for students to get involved. Our site simplifies the process of learning about our activities and joining NSBE UCalgary, ensuring that our chapter continues to grow and empower future leaders in engineering.

What it does

Our website serves as the digital hub for NSBE UCalgary, providing information about our events, mission, and how to join. It helps connect students with our community and empowers them to get involved and make an impact.

How we built it

We built the NSBE UCalgary website using React, a powerful JavaScript library, to create a dynamic and responsive user interface. Chakra UI was integrated for its robust and flexible component library, allowing us to design a cohesive and visually appealing layout efficiently. React's component-based architecture enabled us to modularize the site, making it easy to maintain and expand. With Chakra UI's accessibility features and design simplicity, we ensured that our site is user-friendly and visually engaging, helping us effectively showcase our club's mission and activities.

Challenges we ran into

One of the main challenges we encountered while building our website was learning to use Chakra UI. With two out of three team members new to this library, we had to quickly adapt and familiarize ourselves with its components and styling approach. This required significant learning on the go, but it also allowed us to deepen our understanding of UI design in React. Another challenge was ensuring the site maintained a visually appealing and consistent look across all device types. We spent time refining the responsive design to make sure the website was accessible and stylish, whether viewed on a desktop, tablet, or mobile device. Despite these challenges, we were able to create a user-friendly and engaging platform for our club.

Accomplishments that we're proud of

We’re proud of the stylish and cohesive design we achieved with our website. Despite the initial learning curve with Chakra UI, we successfully utilized its components to create a visually appealing and user-friendly platform. Our ability to quickly learn and adapt to new tools allowed us to deliver a polished and professional web app that effectively represents NSBE UCalgary. The end result not only meets our expectations but also serves as a valuable resource for our community.

What we learned

Throughout the development of our project, we learned the importance of balancing visual appeal with simplicity. Initially, we aimed to incorporate a variety of fancy CSS and JavaScript animations, believing they would enhance the user experience. However, as we began implementing these features, it became clear that an overly complex design could detract from the core functionality of our web app. We discovered that subtle animations and a clean, minimalist design not only created a more cohesive look but also elevated the user experience by allowing the content to shine without unnecessary distractions. This realization reinforced the value of simplicity in design and its impact on usability.

What's next for NSBE-UCALGARY

Moving forward, our team is committed to keeping the web app updated to reflect new events and opportunities for our club. We plan to implement a dynamic content management system that will allow us to easily add and modify information as it becomes available. Additionally, we are excited to gather feedback from our users to continuously improve the app's functionality and design. By staying responsive to our community's needs, we aim to create a valuable resource that enhances engagement and participation within our club.