A design tool for planning and budgeting of Interior Design Projects. Test it out here
Architrave is a design tool that provides a solution for planning and budgeting interior design projects. It is specifically designed for designers and hobbyists who want to manage their projects efficiently.
With Architrave, users can create and manage multiple projects, upload images, and create moodboards for each project. During the creation of each moodbard, users may use files from their own asset library or those provided by Architrave via external API's. They can also extract colors from the images to create color schemes and palettes, or browse the curated color collections created by Architrave. This feature makes it easy for users to create a cohesive look for their projects. The budgeting feature of Architrave allows users to track expenses for each moodboard and the entire project. This feature is particularly useful for designers who need to stay within budget constraints. Furthermore, users may create their own library of assets for future use, store them in categories for easy access, and add external links and costings for budgeting purposes.
- User Profile
- Moodboard design from templates
- Color Palette created from image
- Budget Planner created from each moodboard
- Export moodboards and budget sheets for sharing
- Export budget sheets for sharing
- Add collaborators with editing capabilities
- Edit moodboard after saving
- Moodbaord templates have advanced customisation
This frontend is built using;
- React
- Redux
- Bootstrap
Check out the backend repository for this project.
This project was bootstrapped with Create React App.
In the project directory, you can run:
Runs the app in the development mode.
Open http://localhost:3000 to view it in your browser.
The page will reload when you make changes.
You may also see any lint errors in the console.
Launches the test runner in the interactive watch mode.
See the section about running tests for more information.
Builds the app for production to the build folder.
It correctly bundles React in production mode and optimizes the build for the best performance.
The build is minified and the filenames include the hashes.
Your app is ready to be deployed!
See the section about deployment for more information.
Note: this is a one-way operation. Once you eject, you can't go back!
If you aren't satisfied with the build tool and configuration choices, you can eject at any time. This command will remove the single build dependency from your project.
Instead, it will copy all the configuration files and the transitive dependencies (webpack, Babel, ESLint, etc) right into your project so you have full control over them. All of the commands except eject will still work, but they will point to the copied scripts so you can tweak them. At this point you're on your own.
You don't have to ever use eject. The curated feature set is suitable for small and middle deployments, and you shouldn't feel obligated to use this feature. However we understand that this tool wouldn't be useful if you couldn't customize it when you are ready for it.
You can learn more in the Create React App documentation.
To learn React, check out the React documentation.
This section has moved here: https://facebook.github.io/create-react-app/docs/code-splitting
This section has moved here: https://facebook.github.io/create-react-app/docs/analyzing-the-bundle-size
This section has moved here: https://facebook.github.io/create-react-app/docs/making-a-progressive-web-app
This section has moved here: https://facebook.github.io/create-react-app/docs/advanced-configuration
This section has moved here: https://facebook.github.io/create-react-app/docs/deployment
This section has moved here: https://facebook.github.io/create-react-app/docs/troubleshooting#npm-run-build-fails-to-minify