Welcome to my submission for the Front-End Development task – creating a fully functional Contact Page based on the provided Figma design. This project demonstrates my skills in front-end development, responsive design, and bringing designs to life. Below, you'll find details about the project, the tech stack used, and instructions on how to access the live demo.
This project involves the development of a Contact Page for a website, utilizing HTML5, CSS3, and JavaScript. The primary goal was to faithfully implement the Figma design provided, ensuring responsiveness, interactive elements, and optimized performance.
The project is based on the following Figma design: View Figma Design
- HTML5
- TailwindCSS
- Typescript
- ReactJS
- NextJS
- Faithful implementation of the Figma design, showcasing attention to detail.
- Fully responsive design ensuring optimal user experience across various devices and screen sizes.
- Clean and semantic HTML/CSS code for maintainability and readability.
- Interactive elements like buttons and a responsive navigation menu implemented using JavaScript.
- Responsive navigation menu that transforms into a hamburger menu on smaller screens.
- Optional subtle animations for enhanced user engagement.
- Cross-browser compatibility, tested on Chrome, Firefox, and Safari.
- Performance optimization for faster page loading times.
To view the live demo of the Contact Page, please follow this link: Live Demo
You can access the project repository on GitHub: Project Repository
To run the project locally, follow these steps:
- Clone the repository:
git clone https://github.com/ProfessorDy/assessment.git
- Navigate to the project directory:
cd assessment
- Open the
index.html
file in your preferred web browser.
The project will be evaluated based on the following criteria:
- Fidelity to the provided Figma design.
- Responsiveness across different devices.
- Code quality and organization of HTML, CSS, and JavaScript.
- Implementation of interactive elements and navigation.
- Performance, including loading speed and overall optimization.
- Creativity in enhancing the design.
If you have any questions or need clarification about the project, feel free to reach out to me:
- Email: [email protected]
- GitHub: Visit my Github Profile
Thank you for considering my submission. I look forward to the opportunity to discuss my work in further detail.
Best regards, Destiny Adebayo