Workflow Solutions

 

Challenge

Find a more automated system for creating technical specifications.

My role: UI designer front-end developer

We set out to create an in-house customized solution that would standardize the information that was used within documents and minimize the errors.

image of the final form

Research:

We asked the production team and the creative team what they felt were the biggest issues.

We found out that the technical specs were being created in-house by a team of 7 in InDesign and the formatting wasn’t consistent. Another big issue was that the team was receiving spec requests without all the information that they needed so there were often incomplete specs and they wanted to avoid that.

The producers were unhappy with the turn-around time and the amount of back-and-forth it took to complete one technical spec.It came out in our research that the producers were not supplying all of the information during the initial request, and that sometimes the specs were modified by different people causing errors and inconsistent formatting.
 

Planning

We started by identifying exactly what information needed to be in a technical specification. During the planning stages we identified 2 different types of spec (digital products and printed products) and agreed that these would need two separate forms. We created some editable PDF forms with all the required fields that producers could fill out themselves. It helped us to identify that they were still not filling out all of the fields properly. We decided that the best solution was to create and online form with required fields so that the specs would have all the required information before being submitted by the producer. Online forms are great because if the field is required, you can’t save it without having all of the details.

Design and Testing

Testing images

We began designing the online form with the data that we received in the planning stages. Our first test was to have the submit button email an HTML styled layout that would display in the email window and could be exported as a PDF but the results were inconsistent and varied depending on the email agent.

Our back-end developer suggested a great solution where, once the form was submitted it would then be stored in an online database as an XML file that could easily be imported into an InDesign template.

The InDesign used styles to maintain a consistent visual and was easily exported into a PDF format. It was the perfect solution because it allowed us to control the information to insure that all the data was included and we could keep the layout consistent for every spec.

The example on the right shows the wire-frames of our first idea of the form, we would later separate digital and static specs and refine a few other fields.

Final Result

Final product images

After we created the initial prototypes, we decided to pre-populate the text in the form to give it even more consistency. We also created a searchable list to index and access the entire repository (eventually there will be over 700 technical specifications)

image of the final form
image of the final form


image of the final form
This project has been beta released with continuous. The next version with have some modifications to reduce the number of fields even more and to recognize the english choice in the french side and vice-versa.