I've been bouncing back and forth between Sketch and Webflow a lot and thought of an idea that might make sense while Webflow is hopefully working on a way to incorporate Atomic Design into the platform. At the end of the day, everything on the UI should fall into one of those categories and should be a symbol that can be synced across all instances and overridden at any time per-instance.
The idea is to make it easier to add elements to the page through two methods:
1. Faster Dropdown-style menu directly on the top navbar for easy browsing between Atoms, Organisms, Molecules, etc.
2. Using a Shift+CMD+A keystroke you can prompt a nice UI to search for the element you want to add and it yields up to your pointer.
Thoughts?
Cameron Roe
.svg){kind=logo}
To insert special keys, such as the arrow keys and Caps Lock, and modifies, ... To add more than one shortcut key, select 'New shortcut key'. Click Here
Attachments Open full size
Now that I think about it.. A simpler command might be more useful: "CMD + I"
By pressing this, you get access to instant search that you can search for any existing symbol (atomic element) that (ideally namespaced) will allow you to instantly add elements to your arrow.
NOTE: They are not inserted right away... they are positioned fixed under your mouse cursor and are not added to the page until you click the area you would like the element to be inserted. This allows designers to also "preview" their element in the page by toggling "W" (or a left-sided keyboard key) to dynamically insert the element when the key is pressed down. When it is lifted, the element returns to the cursor fixed position and can be moved around any where without holding down the clicker.
This would boost design speed by 10x at least!
Attachments Open full size