How Yuque Board Reinvented Diagram Layouts: New Features, Challenges, and Innovative Solutions

In this talk, a Yuque front‑end engineer walks through the past six months of Yuque Board’s new features, unexpected use cases, emerging problems, fresh ideas, and novel methods, illustrating how abstraction, scientific falsification, and innovative thinking drive product evolution.

Alipay Experience Technology
Alipay Experience Technology
Alipay Experience Technology
How Yuque Board Reinvented Diagram Layouts: New Features, Challenges, and Innovative Solutions

New Features and Uses

The Yuque Board project, now a few years old, recently merged mind‑map and flow‑chart capabilities onto a single canvas, enabling both expected and surprising diagram combinations.

Beyond the obvious scenarios, users discovered novel layouts where mind‑maps and flow‑charts intertwine in unexpected ways.

New Problems, Ideas, Methods

The team identified several unforeseen challenges and responded with a set of six guiding principles—dubbed the “six bricks”—to drive solution design.

Story 1: Tree Layout Evolution

Inspired by classic literature, the speaker recounts how Donald Knuth first defined two layout principles and a nine‑line algorithm for compact tree drawing, followed by later refinements from Charles Wetherell, Alfred Shannon, and others, culminating in the widely used compact tree layout.

Story 2: Polyline Routing

Facing a lack of existing algorithms, the team applied the six‑brick principles, conducted competitor research, and abstracted six routing rules. They transformed the polyline problem into a graph‑search task, adapting A* with aesthetic‑aware evaluation functions to achieve superior routing results.

Story 3: Subgraph Nesting

When product demands grew beyond fixed layout algorithms, the team borrowed ideas from leading mind‑map tools to allow hierarchical subgraph composition. They introduced progressive principles (1.0, 2.0, 3.0) to constrain sensible nesting, using linear‑algebra concepts to reason about direction vectors.

Conclusion

The speaker emphasizes three takeaways: abstract early to manage complexity, adopt a falsification mindset to iteratively improve theories, and recognize that true innovation stems from new methods rather than new goals.

frontendVisualizationproduct developmentlayout algorithms
Alipay Experience Technology
Written by

Alipay Experience Technology

Exploring ultimate user experience and best engineering practices

0 followers
Reader feedback

How this landed with the community

Sign in to like

Rate this article

Was this worth your time?

Sign in to rate
Discussion

0 Comments

Thoughtful readers leave field notes, pushback, and hard-won operational detail here.