Being a frontend developer working on dozens of Web projects, it’s fairly easy to dissolve into the numbing monotony of dashboards, tables, and photo galleries. But every now and then, an unusual project appears, offering up an opportunity to face new challenges and a whole new level of problems to solve. Last year, we were approached by iDesigner who asked us to build a 3D interior design app for the Web. Leading such a complex project was truly a unique experience and felt like a breath of fresh air. In a series of blog posts, I would like to share with you some knowledge acquired in the course of developing that particular app.

The general idea was to create something similar to Homestyler, Wanaplan, or Homebyme. Our client prepared a list of insights regarding those applications—what they liked, what could still be improved, and what components had to be rewritten from scratch. All of these insights combined contributed to the vision for the new product.

The Challenge

The shape of the planned application was defined by the following requirements:

• Web application—offering end users easy access (similar to all other services by the same client).
• 3D workspace—computer graphics and attendant 3D rendering engines have become a true blessing for designers and architects, as they allow them to produce highly immersive representation of their creations. The same, however, is now available to the average Joe, particularly when it comes to playing with their virtual flat and decorating it as they wish. These semi-professional capabilities are the key driver of such products, the main selling point of many a service, and, naturally, the core feature of our application.
• 2D workspace—although a 3D view is perfectly suited for intuitive item placement and material visualization, it nevertheless still lacks precision and often leads to poor space planning. A traditional CAD-like view for floor plans is an obligatory addition to the UI. Obviously, both views should allow for similar operations and be synchronized all the time.
• Workspace save & load—once the plan is created, the user has to have the possibility of saving it for further use at any point; otherwise, the time spent in the app by a user would be lost. Once implemented, such a feature could easily be used for prepopulating plans or promotional demonstration of fully arranged interiors.
• History tracking—it’s hard to imagine any usable editor without the option of allowing you to correct your mistakes with a magical “Undo” button. Nobody wants to make frustration a part of the product experience, so this was an obvious point on the list.
• External assets—all product data was planned to be provided via a REST API in order to allow complete control over content provided inside the editor (descriptions, prices, providers, thumbnails, and 3D models).

#ue.js #product design #development