WeCoded Challenge 2025 - Celebrating Underrepresented Voices in Tech

This is a submission for the WeCoded Challenge: Celebrate in Code My WeCoded Landing Page For this challenge, I've designed a modern, accessible, and engaging landing page that celebrates the diversity and inclusion within the tech community. My goal was to create a visually appealing platform that not only highlights the stories of underrepresented voices but also provides clear information about the challenge itself. The design focuses on an eye-catching hero section with smooth animations, followed by sections that explain the evolution from SheCoded to WeCoded, showcase inspirational stories, provide a historical timeline, and detail how to participate. I wanted to create a landing page that feels both professional and welcoming, with accessibility and responsiveness as key priorities. Demo WeCoded Landing Page How I Built It I built this landing page using a modern tech stack including: React with TypeScript for the component architecture Tailwind CSS for styling with a focus on responsive design Shadcn UI for accessible UI components Lucide React for consistent iconography React Router for navigation (though this is a single-page design) I'm particularly proud of: The animated background and scroll-triggered animations that add life to the page without compromising performance The responsive design that works seamlessly across all device sizes The timeline section that visualizes the evolution of the WeCoded initiative The glass-morphism design elements that create a modern feel while maintaining readability The page incorporates accessibility best practices with semantic HTML, appropriate contrast ratios, and keyboard navigation support. I focused on creating a design that's not only beautiful but also functional and inclusive - embodying the very principles of the WeCoded initiative. Why This Initiative Resonates with Me This WeCoded challenge is particularly meaningful to me. As someone who is part of the Arabic-speaking community and has strong ties to the Middle East, I'm acutely aware of how underrepresented our voices often are in the tech world. It's not just about numbers; it's about the richness of perspective and innovation that comes from diverse backgrounds. Initiatives like WeCoded play a crucial role in creating space and amplifying those voices that have historically been marginalized. Seeing a platform dedicated to celebrating inclusion and providing opportunities for everyone, regardless of their background, is truly inspiring and something I deeply value. I believe that a more inclusive tech industry benefits everyone, fostering creativity, problem-solving, and ultimately, better technology.

Mar 27, 2025 - 09:14
 0
WeCoded Challenge 2025 - Celebrating Underrepresented Voices in Tech

This is a submission for the WeCoded Challenge: Celebrate in Code

My WeCoded Landing Page

For this challenge, I've designed a modern, accessible, and engaging landing page that celebrates the diversity and inclusion within the tech community. My goal was to create a visually appealing platform that not only highlights the stories of underrepresented voices but also provides clear information about the challenge itself.

The design focuses on an eye-catching hero section with smooth animations, followed by sections that explain the evolution from SheCoded to WeCoded, showcase inspirational stories, provide a historical timeline, and detail how to participate. I wanted to create a landing page that feels both professional and welcoming, with accessibility and responsiveness as key priorities.

Demo

WeCoded Landing Page
WeCoded Landing Page Screenshot

How I Built It

I built this landing page using a modern tech stack including:

  • React with TypeScript for the component architecture
  • Tailwind CSS for styling with a focus on responsive design
  • Shadcn UI for accessible UI components
  • Lucide React for consistent iconography
  • React Router for navigation (though this is a single-page design)

I'm particularly proud of:

  1. The animated background and scroll-triggered animations that add life to the page without compromising performance
  2. The responsive design that works seamlessly across all device sizes
  3. The timeline section that visualizes the evolution of the WeCoded initiative
  4. The glass-morphism design elements that create a modern feel while maintaining readability

The page incorporates accessibility best practices with semantic HTML, appropriate contrast ratios, and keyboard navigation support. I focused on creating a design that's not only beautiful but also functional and inclusive - embodying the very principles of the WeCoded initiative.

Why This Initiative Resonates with Me

This WeCoded challenge is particularly meaningful to me. As someone who is part of the Arabic-speaking community and has strong ties to the Middle East, I'm acutely aware of how underrepresented our voices often are in the tech world. It's not just about numbers; it's about the richness of perspective and innovation that comes from diverse backgrounds. Initiatives like WeCoded play a crucial role in creating space and amplifying those voices that have historically been marginalized. Seeing a platform dedicated to celebrating inclusion and providing opportunities for everyone, regardless of their background, is truly inspiring and something I deeply value. I believe that a more inclusive tech industry benefits everyone, fostering creativity, problem-solving, and ultimately, better technology.