Inspiration
After brainstorming for a while, we decided that we wanted to take a UMass-centric approach given that there are known software concerns with the current student service systems. One prevailing issue is competitive enrollment into dorms, which leads students to uncertain positions with regards to how they desire to configure their furniture and personal items. This led us to zero in on a web app that would provide a clean and easy-to-learn user interface to arrange different features in any of the types of UMass dorms, given that there are many variations in their structures.
What it does
Dormmaker is a web app that allows its users to pick a dorm layout from any of the UMass residential halls and create a customizable render involving different types of features like beds, tables, boxes, nightstands, and so on. The webpage primarily involves a sidebar and a canvas. The sidebar is used for toggling between dorm and furniture sections. The dorm section uses a drop-down menu to select a basic dorm floor plan. One can then use the furniture section to drag and drop images (representing objects) in different locations. These objects can be oriented in different angles. All these placements are done on the canvas, which can toggle between blank and ruled.
How we built it
The project was built using JavaScript, Node.js, React, HTML, CSS, Bootstrap, SVG files, Inkscape, Adobe Illustrator. Domain Name: dormdash.tech
Challenges we ran into
While proceeding with the project, we faced a couple of challenges. The biggest roadblock was learning React; before this project, all the group members had little to no experience with the framework. The framework took time to get used to and ultimately caused some slow downs. Another major issue we had was using SVG files. SVG files allows us to retain good image quality regardless of the zoom. However, it doesn't use a pixelated format as a JPEG or PNG but as vectors instead. Because of this, manipulating SVGs becomes very difficult as we cannot use traditional techniques.
Accomplishments that we're proud of
We are proud to have created a feature-laden viable product that promotes ease of use and smooth execution. The GUI is very comprehensive and can be approached by a diverse population.
What we learned
We learned about React and image vectorization thoroughly and applied our knowledge to almost every point in the project.
What's next for Dormmaker
We plan to scale this project up to 3D models and diversify the selection of floor plans a bit more. This will transcend into a "Create Your Room" feature, where we can alter the vectors of the floor plan at will and essentially create any possible shape.
Log in or sign up for Devpost to join the conversation.