Adding Visuals

We imagine highly abstracted screen elements and notations that represent things moved for a purpose.

We would like to add short videos or animations to our help documentation since many of our gestures are hard to describe in words.

I (Ward) have been down this road before. I know better than to try to work the ui. Better to draw a tiny facsimile, abstracted for focus, and then operate that. Demo Robots

The How to Wiki page is a default provided by the host and always appears to be from the origin such that it doesn't clutter the neighborhood until one starts browsing. This makes it easy for other providers to replace it if they have a better starting point.

The best idea I have had so far is to rewrite those pages with micro-animations generated from text markup. I think making such an animator is easier than writing text about a graphical tool.

.

I’ll try writing some moves. I think chess notation could be an inspiration. Imagine wiki-plugin-visual.

Say you want to reliably refer to a page on the blue site from a page on your own logged in red site. Line up red then blue. See Three Ways to Lineup.

SHOW LINEUP red, blue SCROLL to red journal CLICK [+] for FACTORY PRESS blue flag DRAG to red factory RELEASE to make REFERENCE

Say you want to see a blue pages from the blue site in the lineup on the red site.

SHOW TABS red, blue SELECT blue tab PRESS blue flag DRAG to red tab HOLD until red tab shows DRAG to empty spot RELEASE to make REMOTE blue page show

We'd like to setup situations that aren't complex except that they are hard to describe in words. Consider castling through check or capturing en passant.

.

Animation in design refers to dynamic visual effects that enhance user interaction and experience and make interfaces intuitive and engaging. Effective animations guide users, clarify relationships, provide feedback, and add liveliness to the product. post

Consider how we might interpret the markup suggested above. Consider nesting it with indentation as we do with Graphviz algorithmic drawing. Action words would add or manipulate a scene until a nest is completed and observed.

A scene would be constructed as a nested assembly of prepared drawing elements expressed as SVG with well defined slots for parts. Consider red or blue flags inserted into the flag slot on a page. We then might refer to the red flag or the blue page.