Design Draft Auto‑Recognition and Floor Generation in the Tongtian Tower Platform

Background

Facing the trend of cost reduction and efficiency improvement, the Tongtian Tower team sought to break traditional R&D barriers by allowing anyone to become a floor‑style producer, linking design and construction through automatic design‑draft recognition to boost production efficiency.

What is Design‑Draft Auto‑Recognition

The project explores “design‑front‑end integration” by parsing Sketch (or similar) design drafts and directly generating Tongtian Tower floor layouts, supporting subsequent fine‑tuning. This eliminates the need for manual recreation of designs, dramatically reducing construction cost and delivering a smarter, more diverse floor‑building experience.

During the first phase, the system was applied to the 618 core event, automatically generating the “Qinglv” announcement floor and supporting various material types (single‑row, double‑row, carousel, etc.), achieving a 40% increase in building efficiency.

Solution Design

01. Starting Point

Key problems to solve include: bridging platform links to reduce pre‑construction steps, optimizing the construction workflow to improve interaction and reduce learning cost, and enabling data‑field association after automatic floor generation.

02. Core Design Philosophy

By leveraging RELAAAY’s asset online management, the Tongtian Tower flexible floor‑building system, and design standards, the solution reduces five steps compared with traditional methods, significantly improving efficiency (see comparison diagram).

03. Core Architecture

The system provides four core capabilities: automatic recognition and conversion of design drafts to floor elements; canvas support for drag‑and‑drop and preview; visual fine‑tuning with advanced configurations (navigation, tracking, etc.); and one‑click saving that links design assets to floor assets.

Key Challenges and Solutions

Three major challenges were addressed: cross‑platform data sharing, design‑draft automatic recognition, and element‑data field association.

Cross‑Platform Data Sharing

Users upload Sketch drafts to RELAAAY, view annotations online, and then restore the visual floor in Tongtian Tower; linking these three components resolves the data‑sharing issue.

Design‑Draft Layer Auto‑Recognition

Instead of machine‑learning image recognition, the solution parses the design‑draft JSON directly, performing data acquisition, dehydration/rehydration (cleaning redundant layers, merging or deleting based on position, visibility, and missing style fields), and generating unique IDs for fast queries.

Element and Data‑Field Association

Styles derived from the recognized design draft are combined with existing material pool items (e.g., product images, ad titles) that carry data‑field information and advanced attributes, producing fully functional elements without requiring users to understand underlying data structures.

Implementation

The workflow consists of three steps: (1) designers create and upload drafts on Sketch; (2) RELAAAY collects draft metadata and syncs it to Tongtian Tower; (3) Tongtian Tower automatically recognizes the draft, generates the floor, and allows visual fine‑tuning and saving for reuse.

Conclusion & Future Plans

Automatic design‑draft recognition significantly improves construction efficiency and business value. Future work will focus on increasing recognition accuracy, enhancing design‑draft fidelity, optimizing canvas usability, and expanding the material pool to support more flexible, rapid floor creation across scenarios.