Construct 1.0

Welcome to Construct, a visual layout editor based on Blueprint & jQuery! This is version 1.0, finalized on March 5, 2010 and released for public consumption under the FreeBSD License. This project was built by Christian Montoya, and exists both as a useful tool for CSS designers and as proof that a visual layout editor is possible to acheive with clean CSS & semantic HTML. Read on for an explanation of the controls.

Here are the keyboard mappings for Construct:

• Up arrow — select the previous container
• Down arrow — select the next container
• Left arrow — select the previous column
• Right arrow — select the next column
• J — contract the current column
• K — expand the current column
• L — toggle class="last" on the current column
• Q — add a new container
• W — give the selected container an ID
• E — delete the selected container
• R — remove the ID from the selected container
• A — add a new column
• S — give the selected column an ID
• D — delete the selected column
• F — remove the ID from the selected column
• Z — add or remove an <hr> after the selected container
• C — fill the selected column with Lorem Ipsum text
• V — remove all text from the selected column

Also, you can click on any container or column to select it.

Hosted with a VPS Server from HostGator

Construct is a visual layout editor based on Blueprint.

It was inspired by the Blueprint Layout Builder.

It is powered by jQuery.

And, finally, it was written by Christian Montoya.