Author: 0x89a1d730aa1e78a0ede8dea988acecff0a6e99a9
Update Status: On Time
Project Health: 
On Track
Introduction
This month, all of the project’s roadmap milestones were successfully completed and even implemented some additional features. The GitHub repository can be followed at https://github.com/szilardjanko/ui-design-studio and the web app can be tested at https://ui-design-studio.vercel.app.
Highlights
The drag and drop system was refined, creating a more customizable grid system to help align UI elements. A function was set up to allow customization of UI element colors. A component was created that lets users choose between three different preset background images of Genesis City, enabling better visualization of the UI within Decentraland. In a future update, I plan to add the ability to upload a custom background, allowing users to upload a screenshot of their DCL scene for this purpose. I also added a component that displays all the UI element layers in use, with the ability to lock/unlock them from this list to prevent accidental movement or resizing once their final position is set.
The UI editor tools were repositioned to the right side of the screen, including new quick-aligning buttons, an area to input custom sizes and positions, and options to update UI text and colors. A more refined way to delete UI elements was also added. Additionally, the project’s roadmap was added to the homepage, along with a larger button to draw users’ attention to the Create UI page.
Feedback was gathered from the alpha release to a select testing group. Some of the suggestions included adding recently used and favorite colors to the background color selection, allowing users to quickly select colors for their UI’s theme. Other suggestions included the ability to copy properties from one UI element to another, tooltips for the Create UI page that provide basic help when a user first enters (with the option to skip or close them), and adding a delete button and lock button next to UI elements when the mouse hovers over them (in addition to the existing move and resize popup). Furthermore, redesigning the roadmap on the homepage to better highlight project milestones and allowing UI elements to be dragged around without the snap-to-grid feature when the grid is turned off were also suggested.
Blockers
None
Next steps
- Create advanced customization options for UI elements: flex directions, aligning items, justifying content, margins, etc
- Implement feedback from the alpha testing group