Plan your next perfect room by selecting any color palette of your choice. This website will then scout the ideal furniture choices for your dream room along with the perfect side pieces to go along!
- Return furniture suggestions to a user based on a given color palette.
- Upload images of your own furniture to get a matching color palette back.
- Create a "saved" section to save multiple ideas of a room with its corresponding pieces of furniture, similar to Instagram “collections”
- Provide a suggested/trending color palette generator for users.
- Give furniture suggestions based on past searches/viewed items.
- Create public "rooms" to get other opinions on your furniture combinations!
Week # | Deliverables |
---|---|
1 | Set up development environments. Start wireframes & API tutorials for backend. Push test files to GitHub. |
2 | Start "Color Picker" page. Set up middleware to fetch API information about furniture based on color. |
3 | Keep working on week 2 deliverable. Start working on integration of color picker page with front-end. |
4 | Upload an image page. Send an image to the Imagga Color Extractor to extract color of furniture. |
5 | Continue working on Week 4 deliverable. Integrate front-end and back-end. Start creating MongoDB schema for favorite color choices. |
6 | Start work on "saved page". Finish any remaining integrations for "Upload Image" page and "Color Picker" page |
7 | Continue work on "saved page" and continue integration. |
8 | Complete any remaining integrations. Start working on presentation slide deck. |
9 | Practice presentation and add finishing touches! You can do it! 💙 |
- Front-end:
- Vue.js + Bootstrap/Tailwind
- Wireframing
- Back-end:
- Node.js
- Mongoose (package to create API's & Schema's for MongoDB databases)
- API’s
- Imagga Color Extractor + documentation (You can insert an image endpoint to this API and it returns a palette of colors to use)
- Google Cloud Vision API for furniture images + pricing
- https://cloud.google.com/vision/product-search/docs/searching
- Narrow the search results to only return furniture products
- You can add filters to only return products of a specific color.
- Database storage
- MongoDB
- Use this for database. Easy to store in NoSQL because there’s no structure and Express/Mongoose are Node.js friendly.
- IDE (both front-end and back-end) - Visual Studio Code
- NPM (package manager for JavaScript)
- Front-end: Vue.js
- Back-end: Node.js
- Git CLI for version control
- Compass: Helpful GUI tool to see databases created in MongoDB
- POSTMAN (test your API requests)
- Javascript packages for back-end:
- Javascript packages for front-end:
- Setting up
- Front-end
- Back-end
- Tutorials for Rookies! :)
- Helpful GitHub Cheatsheet 1
- Helpful GitHub Cheatsheet 2
- Article on UI/UX tips