Flex template builder and design tool application that generates printable PDF as output

The application is developed for one of the major printing solution provider in Sweden. It gives administrator ability to design printing templates for visiting cards, business cards, envelops, packing tapes, stamps, mouse pads, stationery etc. Now, in the front end user interface, users can choose one of these templates and can do the customization by applying text, uploading images, changing color etc. Once the user is finished with the design and places the order, a PDF of printable quality with exact dimensions of the printing template gets generated and is attached with order. This PDF can directly be sent to printer for generating output.

Industry

Printing

Technology

Front-end

• Adobe Flex
• Action Script 3.0

Back-end

• Joomla Open Source CMS
• VirtueMart e-Commerce Solution
• PHP/MySQL
• WebORB for PHP
• PHP libraries for generating printable PDFs

The Client

Sweden

The Challenge

• Client had requirement for an online e-commerce store from where the visitors can order standard printing items as well as they can customize the templates available for some customizable products and order for printing.
• All the products in the system needs to be divided into 2 categories, Standard Products that can be ordered directly and Customizable Products available with various design templates that user can customize and order.
• A customizable product can have multiple design templates associated with it. These templates are designed by admin so that users can only do customization according to the template layout. The templates can be grouped into in to various types for example business card templates can be grouped into education, health care etc.
• The flex template design engine should allow admin to define number and placement of text inputs, no. of images that can upload and their placement, background image etc.
• When visitor selects any customizable product from the product catalogue, the flex designer application loads with available templates. User can choose the template to design and customize it according to the available options.
• Finally the flex tool should generate printable PDF of the final design that can be attached with the order for direct printing in printing machine.

The Solution

We implemented Joomla (an open source CMS) and integrated VirtueMart (an open source e-Commerce solution) for developing the required e-commerce functionality.

While adding a product, admin can define it as either standard or customizable. If customizable, admin can define the template design using following properties: height, width, background image/color, no. text inputs and placement for each, number of image uploads allowed with placement for each, fixed size or resizable etc. Even each text input can be defined as fixed position or movable, number of character allowed, font size, font color, font family, alignment etc. Similarly each image upload can be restricted with fixed position or movable, fixed size as give height and width or resizable etc.

Now when user accesses the customized product, based on the template configuration done by admin, the flex graphical user interface generates the visual design of the template is presented to user in flex that he can further fill-up with text of his choice and uploaded images. The tool provides very intuitive and interactive customization features that make it easy for users to apply their choices on the template.

Another challenge was to generate the exact printable PDF of the final design made by the user. We used PDF generation libraries and integrated them with flex in such a way that they take input from flex and generate exact layout as designed by user into PDF with highly printable quality.

The main challenge was integrating flex customization engine with Joomla/Virtumart and we not only overcome it but over done it with our expertise in integrating flex with any of the back-end solutions.