Techlogix Enables Rich Design Capabilities for a Leading Printer Manufacturer

The client is a leading US-based multinational hardware and software company offering services to consumers, businesses, government, healthcare, and education sectors.

The client engaged Techlogix as a software development partner to design an interactive label designer application for their end-customers to design labels on their own. Techlogix enabled them to transform their business process from resource-intensive design to one that end-users could directly interact with. The new application provides complete control over all stages of the design cycle while simultaneously reducing revisions. This dramatically transformed user experiences, cost savings, collaboration, and scalability for the client’s customers.

The Challenge: Limited End-User Engagement

The client was designing labels for end-user product lines on their own. And since these product lines belonged to diverse industries, the designs were highly variable, making it time and resource intensive. Once the end-user viewed the final design, accommodating revisions was slow and tedious. This also significantly delayed time-to-market because the end-user did not have visibility during production.

• Lack of Design Control: End-users were not involved in production cycles so labels could not be previewed or edited in real time, meaning limited design flexibility and slower iteration cycles.
• Cluttered UI: The designer was not user-friendly and posed a steep learning curve which restricted intuitive usage, leading to frequent errors and limited productivity.
• Inefficient Design: Users were not notified of errors and had to manually identify and correct design inefficiencies.
• Complex Layering: Users had to navigate multiple design layers, leading to layout deficiencies.

Solution: Rich Interactive Design for End-Users

Considering customer reviews and pain points, Techlogix decided to introduce pre-defined templates and real time prototyping. This enabled end-users to directly access the new label designer on a self-service basis, giving them complete control of the design process, without needing to depend on the manufacturer’s engineering team. This was achieved through the following features:

• Cloud Enablement: End-customers can directly access the label designer enabling instant preview and real time editing, thereby significantly reducing iteration times.
• Personalized Design: End-users can design labels from scratch or choose a template from the available pre-defined designs.
• Versioning History: Designs are locked during editing and edit history is saved against user ID, date, and time. Users can also access, edit, and duplicate past company designs.
• WYSIWYG Design: Users can preview label mockups before submitting for printing.
• Security Integration: Users can access the new label designer on the cloud through the client’s website only after passing a security check that verifies user data against associated company, roles, and permissions.

UI/UX Overhaul for Enhanced Customer Experience

Techlogix realized that the existing UI was too complicated for end-users, so a solution was devised to make the software more user-friendly for first-time (especially non-technical) users. End-users can now choose from various templates, label sizes, orientations, fonts, date formats, barcode formats and types, and a comprehensive list of several fields to be displayed. Users can also customize the designs for their specific product lines. These UI/UX changes included the following:

• Configurable Templates: Users can select and specify label attributes through a questionnaire without needing extensive design training. The designer automatically prepopulates labels against provided values (e.g., asset tag number) by end-user.
• Design Capabilities: A dedicated toolbar at the top of the canvas provides easy access to label field actions and features like drag-and-drop, undo/redo, rotation, positioning, alignment, re-sizing, and zoom-in/out, enabling faster design execution.
• Error Guides: Warning messages are displayed as pop-ups in case of spelling mistakes, text or field overlaps, unsaved changes, and duplicate submissions so mistakes can be identified and corrected easily.
• Simplified Design: The new canvas tool also eliminates the need for design layering, further simplifying the design process to ensure consistency and efficiency.
• Configurable Defaults: Techlogix also developed an admin panel accessible to the client’s engineering team which provides an additional layer of control, allowing them to adjust the weight of fields, set up default field values, and modify the list of fields displayed to each end-user.

The Technology: Clean Architecture

The team at Techlogix engaged cloud architects, front-end and back-end engineers, UI/UX designers, full-stack developers, product managers, and QA testers to deliver the new and improved label designer. The project followed agile methodology implemented by a scrum framework via CI/CD deployment, encompassing regular sprint reviews over 5 iterative releases.

The system was developed using .NET core 8, featuring web APIs accessible through a front-end single-page web application developed by Angular v16 and hosted on the client’s cloud. Submitted labels triggered a REST API call, converting the auto-generated XML file into the required format for printing after passing through a service-based authentication mechanism. End-user and client data was also stored on the Azure SQL database so users could access and edit previous label versions. The backend application follows a clean architecture, where the business logic is decoupled from data access and infrastructure dependencies.

Additionally, the deployment of CDN on MS Azure promised ultra-fast speeds and high scalability. Besides this, App Insights were deployed to consistently monitor performance, diagnose errors, and track user interactions.

Key Benefits

The new label designer application developed by Techlogix provided the following business benefits:

• Higher Efficiency: Simpler UI and real-time editing dramatically improved efficiency and customer satisfaction.
• Faster Time-to-Market: Empowering end-users to develop their own labels reduced miscommunications and the need for multiple revisions, which ultimately reduced time-to-market.
• Elevated Customer Experience: Cloud integration enhanced the potential for collaboration and scalability, improving speed and resource utilization because users could edit past designs and maintain version control.
• Fewer Errors: System warnings eliminated most errors and improved design consistency. End-users could also view label mockups before finalizing for printing, lowering rework costs.
• Productivity Gains: Simpler navigation and UI eliminated the existing learning curve while simultaneously boosting user adoption and overall productivity.