Recently, one of our clients requested a new landing page and a request form. The challenge was to create something new and unique, but keep with the existing design of the website. The request form was also a challenge since it required the collection of many pieces of information. Before we discuss these two pages in details, we will provide a short introduction to our client: TCL Packaging.
TCL Packaging is a printed flexible packaging film company located in Telford, Shropshire UK. They have been in business since 1999 and provide packaging film solutions to well known food and non-food brands. Their services also extend to niche manufactures. In order to expand their online presence and compete with their competitors, they have also started to branch out to other industries. For more information about TCL Packaging, visit their homepage on the link provided above.
[ad name=”post ad links”]
The Landing Page
The landing page was a challenge since it had to be unique from the original site, but still maintain elements recognizable of TCL Packaging. The main banner had to attract a potential customer’s attention and direct them to the request page. The rest of the page’s purpose was to provide more information on the different products and services that TCL provides with the occasional option to go to the request page. The thumbnail above is a screenshot of the page, but you can see the live page here: http://www.tcl-packaging.com/printed-packaging-films/
The Request Page
The request page is essentially a contact form with many elements. The client provided us with 2 documents with the purpose of capturing specific data. In addition to capturing the required information, the form also had to have the ability to upload and attach files to an email. We initially considered building multiple forms and separate pages, but in order to keep the system simple we decide to build one long form with collapsible sections. Creating multiple forms and pages would defeat the purpose of creating a user friendly form anyone can use.
In order to implement the collapsible elements we used jQuery UI with an accordion effect to specific sections of the form. The overall effect made the form look simple to use and easy to navigate. To view the form in action, visit the page at: http://www.tcl-packaging.com/printed-packaging-films/request/
If you have comments about the landing page or the request form, feel free to add your comments below.