TATA METALIKS

Enhancing Online Presence with Website Designing & Development | Iron Manufacturer & Seller

Industry: Iron Manufacturer

About Tata Metaliks: A subsidiary of Tata Steel, Tata Metaliks Limited, has its state-of-the-art manufacturing plant at Kharagpur, West Bengal, India, which produces the finest quality eFee-pig iron and Ductura - ductile iron pipes in India. The Company has been fulfilling its vision of "Reaching Tomorrow First" by offering innovative products to its customers worldwide. Setting industry benchmarks through quality products and service offerings, Tata Metaliks has a range of branded products customized to meet specific user needs under its umbrella.

Services Offered:

UI/UX Design & Development
Web Experience Design
Web Maintenance
Website Development
Website Frontend Design & Development
Website Optimization
Website Strategy
Wireframing & Prototyping

PROJECT ROADMAP:

Objectives:

Design a Website to Complement the Brand
Develop an easy to manage website UI/UX
Drive User Engagement on the Website
A Streamlined Website to Integrate Services
Enhance User Experience and Satisfaction
Increase the website conversion rate

THE WAY TO A WEBSITE WIREFRAME

The way to achieve a solid wireframe went through establishing the research pillars for the website and drafting an intricate blueprint for the same. Several detailed client discussions laid the groundwork for a website that included a sitemap of pages elaborating on services and case studies of the multinational client.

Performing Research:

Service Research and Definition
Competitor and Structure Research
A sitemap was planned according to Tata Metaliks requirement
A Glossary of Pages-to-be-created was separately ideated and saved for the next step

Creating a Blueprint:

Finalizing Pages, Banners, Sections, and Forms
Designing 2-D Homepage and About Us Page with Figma

Decorating a Wireframe:

A two-dimensional frame was built on Balsamiq
The home page and about us page were planned according to the intended interaction.
Placement of buttons and forms on the main pages
Space allocation for content
Placement of intended behaviors

Immersive UI/UX

Throttling user discovery on the website

A series of design discussions with Tata Metaliks led to a select family of fonts, color combinations and custom-designed icons. The intention was to create a seamlessly navigable website where a user would be pushed to discover more by himself. Subsequently, subtle humanistic animations were decided upon and drafted to support the themed UI/UX.

The designs were built in a manner to offer easy to integrate new updates, without any need for technical expertise or background. After thorough training with the backend module, the brand was able to understand the dynamics of the developed website and manage it on its own.

Words That Deliver

A Wholesome User Experience

Custom-crafted content designed by Tata Metaliks itself was used throughout the pages of the new website. Further, a special content strategy team was established by us to give suitable banner and heading copy that complimented the website’s purpose and UI. The aim was to keep it user friendly and reduce load time.

Plagiarism & Grammar Check: The content delivered by Tata Metaliks was tested for plagiarism and grammatical errors to ensure a foolproof functional website for its users.

On-page SEO: The content strategy team gathered a well-researched set of informational keywords that were incorporated into web pages in order to rank it higher on the Google SERP.

The Need for a Visual Language

A clear business goal from Tata Metaliks to stand out from the herd determined our strategy to craft a website that included real-time data analytics, custom icons and animations and an intuitive user experience for maximum customer conversion. An exquisite design theme was adopted to further these goals with maximum impact on user experience while navigating the website. The steps were processed in the following order-

The wireframe built on Balsamiq was studied
A UI was built on the wireframe using the finalized color palettes and fonts
The content and interactive buttons were placed according to the frame

Realizing the Design

The UI conceptualized on Figma was poured into codes with the markup language HTML and the premeditated designs were given a more finalized form with proper working functionalities throughout the website. Tata Metaliks was meant to provide business solutions to its users. Hence, flexibility and dynamicity was the premier priority that led us to furnish:

Reusable Codes
Quality Prototypes
Vector Motion Graphics
Dual Mode for the Website

Further, at the backend, a custom theme was chosen for Tata Metaliks since all the other 3rd party themes were limited by designs. The custom theme was prepared by using HTML, CSS, Bootstrap, JS, and jQuery. And webpages were designed as dynamic pages with the help of PHP, HTML and CSS. Thereafter, suitable plugins were placed according to Tata Metaliks’ needs.

Integration of Live Updates from Facebook

The website was built with the feature that allowed easy integration with the brand’s Facebook page. The latest updates on Facebook were available on the website itself, allowing for a wholesome user experience and connecting with the brand’s ideologies and social presence. As we emerged into our last phase to conduct a rigorous multi-pointer testing of the whole website. The overall Page Speed was tested and consecutive optimizations were performed to increase the speed. Subsequently, final checks like interactive functions, responsiveness, cross-browser and cross-device compatibility were performed to ensure a foolproof site. As per Tata Metaliks’ requirement, a training was conducted for its IT team on the usage of Blog Pages and Case Study pages, where the team was taught to add data on all static and dynamic pages through the website. Query forms’ integration with the brand’s CRM - Salesforce - reduced the turnaround time for any query/feedback. It worked by actively updating the received query on the website tracker as well as on the Salesforce.