I created this project as a learning experience to deepen my understanding of rendering and animating 3D objects using Three.js. This website showcases a comprehensive platform for an architectural agency, designed to be visually engaging, interactive, and user-friendly.
Instructions on how to set up and install the project locally:
-
Clone the repository:
git clone https://github.com/bora-sen/architectural-agency-website.git
-
Navigate to the project directory:
cd architectural-agency-website -
Install dependencies:
npm install
- React.js / Vite : Front-end development
- Three.js : 3D model rendering library
- GSAP / GSAP/ScrollTrigger / Animate.css : Smooth & engaging 3D animations
- Tailwind.css : Styling and responsive design
- Optimize the model loading time
- Clean and minimal UI
- An integrated contact form allowing potential clients to send inquiries directly through the website.
- Uses GSAP for animations and Three.js for potential 3D model rendering to add visual depth.
- Optimized for different screen sizes, ensuring a user-friendly experience on desktops, tablets, and smartphones.
- Includes a section showcasing completed and ongoing projects with high-quality images and descriptions.
Details on how to use or interact with the project after installation:
npm startNavigate to http://localhost:3000 to view the project in your browser.
Steps for deploying the project to a live environment:
-
Build the project:
npm run build
-
Deploy the build folder to your preferred hosting service (e.g., Vercel, Netlify, Heroku).
Guidelines for contributing:
- Fork the repository.
- Create a new branch (
git checkout -b feature/your-feature). - Commit your changes (
git commit -m 'Add a feature'). - Push to the branch (
git push origin feature/your-feature). - Open a pull request.
For any questions or feedback:
- Author: Bora Şen
- Email: bahattinborasen@gmail.com
- GitHub: bora-sen
Thank you for checking out my project! Contributions, feedback, and suggestions are welcome.
made with ❤️