Lifestyle is India’s leading fashion destination for the latest trends. The Landmark Group, Lifestyle brings multiple categories including men’s, women and kids’ apparel, footwear, handbags, fashion accessories and beauty under the convenience of a single roof, now let’s start with the project explanation.
Getting Started… We are a group of 4 people working on the project to clone the LifeStyle website. We Collaborate and first take a deep look at the website tried to mark important features of the website to clone it in our project and later than we discussed and divided work and started working on it. While surfing the website we find that the website is very user friendly and very easy to navigate from one type of product to another. We plan to make the navbar very similar to the original website because we like that part a lot. Later there are many more features on the website like add to cart option, Cart page, single product detailed page, sign Up and Sign In, Payment page, On hover feature and many more, we tried to add many of them in our clone website. For cloning the website we used Tech-Stacks Html, CSS, JavaScript and Bootstrap.
This is the landing page of clone LifeStore we tried to make an exact replica of the main landing page with almost every functionality similar to the original web page. Here when the user hovers on the navbar he or she will get the mega menu drop down below the navbar with multiple options in it and if again hover on any option from the first dropdown user will get another dropdown of a submenu of that particular category or option and finally clicking on any of the options he/she will redirect that product landing page or product page depends on the user click.
We wanted to make the sign-in sign-up page work exactly the same as the original website. When any user clicks on the Sign-in and Sign-up button a pop-up will come on the screen where the user needs to enter the phone number and click on the continue button similarly, the user has to enter the OTP, Email, User Name and click on continue later user can continue with the shopping
This is how the Landing page of any particular product looks here we use Shop & Bag landing page for a demonstration. You can look at snap there is again we have many product images and users can click on any product as per their need and later redirected to the list of products page where multiple types of products available of any particular category
So this is the product page of the website where the user can select any product from the list of multiple products available on the page. Initially, the User can only look at the Image, Price And Name of the products but when the user hovers over the image or price of the product more hidden options get visible where the user can select the colour of the product and size of the product and after selecting this all thing user can click on add to basket button and the product will get added to the basket. And if the user clicks on the image of the product he will redirect to the product detail page.
So this is the product page of the website where the user can select any product from the list of multiple products available on the page. Initially, the User can only look at the Image, Price And Name of the products but when the user hovers over the image or price of the product more hidden options get visible where the user can select the colour of the product and size of the product and after selecting this all thing user can click on add to basket button and the product will get added to the basket. And if the user clicks on the image of the product he will redirect to the product detail page.
Now we have the basket page and all the products which are added to the cart by the user will show here. on this page tried to put everything together as the total product added, the total amount of all the products also users have the option to increase or decrease the quantity of the product, by changing the quantity of product the total amount of individual product and the amount of total item in the cart is also got change. Also from here the user can place the order and buy the +product by clicking on the checkout page.
When User decides to buy any product they simply need to click on Proceed to Checkout and later the payment button. After clicking on the payment button user will redirect to the checkout page where he needs to fill in the home address where the user wants delivery of the product and below that user have to put the payment details and click on the payment button after this user will get the Thank you msg and will redirect to the home page again and continue their shopping