Lakshya 2021: A Website for a National Edu-Technical Festival

Lakshya 2021: A Website for a National Edu-Technical Festival

Lakshya 2021: A National Level Technology Festival

Lakshya 2021 was a national-level edu-technical festival held at L.D. College of Engineering in Ahmedabad, India. To showcase the event and its diverse activities, we built a dynamic and engaging website that effectively communicated the festival's theme, events, sponsors, and team.

Project Goals

The primary goals for the Lakshya 2021 website were:

  • Clear Communication: Present the festival's theme, "PERCEPTION," in a way that resonated with visitors.
  • Event Visibility: Showcase the wide array of technical, non-technical, literary, and workshop events.
  • Team and Sponsor Recognition: Highlight the individuals who made Lakshya 2021 a success and acknowledge the sponsors who supported the event.
  • Interactive User Experience: Provide a smooth and engaging browsing experience, encouraging users to learn more about the festival.

Technology Stack

To achieve these goals, we utilized a combination of front-end technologies:

  • React: We chose React as the foundation for the website's user interface, leveraging its component-based structure for a modular and scalable development workflow.
  • React Router: This library enabled us to create dynamic routing, allowing users to navigate seamlessly between different sections of the website.
  • Material-UI: For consistent styling and pre-built components, we integrated Material-UI, making it easier to create a visually appealing and functional user interface.
  • SCSS: Using SCSS, we implemented a structured and maintainable CSS preprocessor, enabling us to organize styles efficiently and create reusable components.
  • Axios: To handle API requests for fetching data from the backend server, we used Axios, streamlining communication and data retrieval.
  • React-Photo-Gallery: For showcasing the event's highlights, we integrated React-Photo-Gallery to create an image gallery that allowed users to explore images with an interactive lightbox.
  • React-Images: We utilized React-Images to enhance the lightbox experience, providing a smooth and responsive image viewer.
  • React-Elastic-Carousel: For displaying the team members, we chose React-Elastic-Carousel, creating a visually appealing carousel that provided a smooth browsing experience for users.
  • React-Loader-Spinner: To provide feedback to users while data was being loaded, we included React-Loader-Spinner, improving the website's responsiveness and user experience.

Site Design: Key Elements

The website was designed with several key elements in mind:

  • Visually Appealing Design: A dynamic color scheme and gradient backgrounds gave the site a modern and vibrant feel, capturing the energy of the festival.
  • Responsive Layout: The website was built using responsive design principles, ensuring a seamless viewing experience across various devices, from desktops to mobile phones.
  • Clear Navigation: A simple navigation menu allowed users to easily explore the different sections of the website, including information about events, the team, sponsors, and contact details.

Technical Highlights

Some of the technical highlights of the website include:

  • Dynamic Event Data: We implemented a system to dynamically fetch and display event data from a backend server using Axios. This allowed for easy updates and modifications to the event information.
  • Interactive Team Carousel: The team page featured a responsive carousel that showcased team members and their roles, with transitions that enhanced the user experience.
  • Sponsors Pop-up: When users hovered over sponsor logos, a pop-up appeared, displaying the sponsor's logo and a link to their website, providing a seamless way to learn more about the sponsors.

Conclusion

The Lakshya 2021 website was a successful project, achieving its goals of promoting the festival and creating a memorable online presence. The combination of modern technologies and a focus on user experience helped to create a dynamic and engaging platform that effectively communicated the event's theme, activities, and spirit.