Cropped TM logo Trademark Productions
Cropped TM logo Trademark Productions

LiftBuild

The manufacturing industry has experienced significant productivity, quality and innovation improvements over the past twenty years. LIFTbuild® began by adopting a manufacturing systems approach to the entire design, procurement, and assembly process for building construction. This vertical manufacturing approach reduces complexity, increases assembly efficiency, and minimizes variability in the delivery process.

LiftBuild Logo

Our Challenge

When LiftBuild approached TM, they knew they needed a custom website as impressive as their innovative vertical building technique, but didn’t know where to start. We worked with LiftBuild to guide them along the path to getting their business on the web.

Since LiftBuild came to us without an existing website, we were starting with a blank canvas. LiftBuild’s only requests were: a project gallery, a page to  show their floor plan innovations, and for the website to be reflective of their branding.

LiftBuild left most of the design decisions up to TM, only giving some basic information as to what they wanted to appear on each page. Our mission was to find a way to take the basic information for the project gallery and floor plan page, then display them in a way that was easy to understand for the user.

  • Create a brand new website to follow brand standards
  • Find a creative way to display LiftBuild’s innovative floor plans
  • Design a custom project gallery layout
  • Utilized Juxtapose to seamlessly illustrate LiftBuild’s floor plan innovation
  • Included design elements to make transitions between content seem effortless
  • Applied overall design elements to emphasize LiftBuild’s branding

Our Solution

Our developers went to work, getting feedback from our design team along the way, and built out all the various elements into a single, cohesive layout. To contrast the various floor plans provided, we used a really cool library called Juxtapose that allows the user to switch back and forth between two different views of the same image – giving us the exact functionality we envisioned. We also came up with a "jump to X" scrolling navigation element to allow the user to quickly traverse the page.

Additionally, our team spent time ensuring the subtlety of the transitional elements on each page. Visually speaking, the angles of all the geometric shapes are all angled upwards. This "upward" trend extends to the parallax background as well, which "lifts" up as you scroll down. In addition, many of the hover effects on the pages "lift" up from the bottom to the top, continuing the theme of elevation.

Coming up with creative solutions can be difficult, but the end result is always worth it.

Parallax & Thematic Design

To drive home the innovation of LiftBuild’s construction technique, our design team put together an overall design that made heavy use of parallax and upward angles. These design elements made it so that as users scrolled down on a page, all of the content ascended upwards in a smooth, “barely-there” motion.

Custom Project Portfolio

It was important to LiftBuild that users have the option to filter projects by category and that each individual project page had a place for project statistics, written content about the project, and an image gallery. To do this, our developers started with our TM Project Gallery Plugin and added custom functionality to meet the client’s needs.

Floor Plan Comparison

One of the many highlights of LiftBuild’s technique is the reduction of support beams that are needed. To illustrate the impact this makes on the overall building design, they wanted a page that could compare traditional floor plans to LiftBuild floor plans. TM used Juxtapose to give users the option to seamlessly toggle between the floor plans.