Live Site: ace-clothing.netlify.app
For this project we decieded to make a responsive e-commerce webstie called VogueValley. This online e-commerce shop allows users to see their favourite type of clothing and add them to cart if they want to buy them. VogueValley offers a diverse range of clothing such as pants t-shirt outerwear and even accessories. With a gamification system and an AI chatbot, we aim to provide a unique and engaging shopping experience.
If you want to buy trending clothes in the market to impress you friends on your fasion sense this is the store where you should be buying your clothes. We have a wide range of clothes avaiblable and they all are very affordable.If you do not know how to match the clothes fred not, you can ask our Advanced Ai bot which will help you to choose the perfect fit for you!
This website meant for people who want to buy clothes and look better than all of thier friends.Our store will always have products that are on offer. We have got all the type of accesories such as sunglasses, hat,belts and even gloves for you to buy. You can buy all your products from 1 store.
Wireframe Figma Design : https://www.figma.com/file/OHVeN2RdhKqYQnpTSjVxTW/FED-Assignment2?type=design&mode=design&t=Mfd5BDWml9jXUcGh-1
- Gamification System: Points are awarded for exploring different categories and purchases, with rewards available for redemption.
- AI Chatbot: Offers product recommendations, order tracking, and customer support.
- Responsive Design: Ensures a seamless experience across all devices.
- User Reviews and Ratings: Engage with the community through feedback.
- Advanced Search and Filters: Easily find products with robust sorting features.(you can sort by gender by type of clothing and even by price)
- Make it such that users can go to the check out page and actually buy the item.
- HTML5 & CSS3 for markup and styling.
- JS for the main contents and function
- RESTDB for database management.
- Lottie for engaging animations.
- Bootstrap for responsive design.
-
Login page: i. Go to the login page ii. Try to login to the page without entering a username and see if it send you a message to fill up the username iii. Try to login to the page without entering a password and see if it send you a message to fill up the password iv. Try to put in a valid username and password and press login. The website should promt you saying that the account doesnt exist v. Try to put a already used account in the sign up page, the page will prompt you that the accoutn already exist.
When you first launch the website you will be led to the login page where you either log in or sign up for an account. When you log in you will be see a promt welcoming you.
Once you are in the home page you will see an welcome animation. After the animation ends you will be able to see the navigations at the top including the company name, popular products which are products that are often bought, products that have and offer and lastly the footer at the bottom with quick links a small about us description, the opening hours and the facebook and instagram page.
In the products page you will be able to see all the products that are available in our store and the filter section which allows you to choose which type of clothings you want, which price range and which gender you want.When you press on the product car it will give you an enlarged version of the product so that you can see better and from there you will be able to add to card.
In the cart page you will be able to see all the products that you have bought its price and pictures.
In every page at the bottom of your screen you will be able to see that small icon which sybolizes the ai chat bot which you can talk to, to help you pick the products for you.
Inspiration drawn from Uniqlo and various website interfaces. Special thanks to the development tools and APIs that made this project possible.
Diontae & Ahmed - For the creation and development of the VOGUE VALLEY e-commerce platform from scratch.
Product images: UNIQLO SINGAPORE ONLINE - THE LARGEST PRODUCT LINEUPS AVAILABLE
Navigation bar : https://chat.openai.com/
Login form: 67 Bootstrap Login Forms (freefrontend.com)
Inspiration: UNIQLO SINGAPORE ONLINE - THE LARGEST PRODUCT LINEUPS AVAILABLE, https://chat.openai.com/
The photos used from this website are from : https://www.uniqlo.com/sg/en/?ds_rl=1302255&gad_source=1&ds_rl=1302255&gclid=CjwKCAiAt5euBhB9EiwAdkXWO5z6tn4TNMFWqaml3vCfzrMIQsBeAkCaE95r-TFbkkb6a1xR7E41sRoC7ikQAvD_BwE&gclsrc=aw.ds
Inspiration: UNIQLO SINGAPORE ONLINE - THE LARGEST PRODUCT LINEUPS AVAILABLE, https://chat.openai.com/, https://www.nike.com/sg