Digital Garden Project Overview RoleWeb Design
Development
Main ToolThree.js
React
HTML/CSS
The digital garden is an online 3D space designed to help users digitally store essential plant information. This interactive web platform promotes enhanced plant care practices.

The website consists of two main pages. The home page offers an immersive 3D experience, while another page is dedicated to storing information about each plant. This page includes two primary functions: adding new plants and removing plants that users no longer want.

Click to the website: https://digitalgarden-keyi.netlify.app/

Home
Page
The home page was primarily developed using Three.js. The graphic style showcases a collection of dreamy plants. The camera moves and rotates as users scroll down, offering a closer and more detailed view of these plants. This provides a delightful online 3D experience. Finally, the title of the website, "My Digital Garden," becomes visible.


Information
Page
The information page encompasses two primary functions: adding new plants and removing plants that users no longer desire.
ADDING FUNCTIONThe information page has eight blanks at the top for entering basic plant care information. Users can fill in these blanks and then click the 'Add to My Plants' button. This action will add a card with the plant's information to the page.


Removing FunctionAt the bottom of each plant information card, there is a 'remove' button. Users can simply click this button when they no longer wish to store information about a plant, and it will be removed.