Roff was one of the projects that I worked on as a User Experience Intern at Interaction One Solutions Pvt. Ltd.
Roff focuses on delivering a comprehensive range of tile and stone Fixing and Care products. They also offer a wide array of products in Building Repair, Grouting Solutions, and Waterproofing and Sanitary Solutions.
Study of the brand and understanding the needs of the client.
Identifying the user base and their needs, along with competitor analysis.
High fidelity designs, close to the final product.
Feedback and rebuilding the design to perfect it.
The first week of the internship went into understanding the space which I will be working on. Interaction One provides a Creative Brief to the customers, and it has all of the important questions which would help us as a designer.
Consumers
Influencers
Contractors
Dealers
Pidilite acquired Roff in 2004. Since then, they have been catering to a wide variety of people.
One overarching question everyone always has is why they should use Roff over regular cement while tile fixing?
Even if they were to pick an adhesive over cement, why should they choose Roff over other competitors out there?
I intended to answer all of these questions through my designs.
According to Pidilite and the Roff team, their competition included Saint-Gobain Weber and MYK Laticrete.
Websites of other companies such as Mapei and Kerakoll were also taken a look at.
• The website looks clean and aesthetic.
• Usage of keywords to identify the products is an excellent way to highlight its features and sell them to the user.
• Inclusion of disadvantages tells the user that they care about all the aspects of the product and helps them make an informed decision.
• Weber's UI tries to connect emotionally with the user by using people in most pictures.
• The Information Architecture of the website makes it very easy for users to navigate it.
• The catalogue of products is divided into sections and cater to specific problems, which helps with the cognitive load for the user.
• Every product is approached via a particular issue and solution. Hence the user has a clear idea of the product and its usage.
• The UI follows their brand guidelines, with proper use of colours.
Before I went deep into the userbase, I went through the current website to find out its existing problems by conducting a usability evaluation. This gave me more clarity on what I should focus on in my designs.
✓ - Low ease of use ✓ - Moderate ease of use ✓ - High ease of use
(Hover to see the key points)
Understanding the users and whom Roff is catering to is one of the critical aspects of every design. I sat down with the Pidilite team for an hour's session, where I extensively asked about their customers and what they value the most.
Roff over others
Even though the sales figures of Roff products have been rising in recent years, they expect it to grow further. The primary question every Indian consumer ask is why should they use an adhesive instead of cement, as they feel the latter is more robust.
Approach through problems
Roff offers many solutions, but a typical consumer may not understand what each name might stand for. So it's best to approach every product through a problem that the consumer might face.
Influencers and trends
An emerging set of people can promote their products through designs for new homeowners and renovators. The best way to target this audience is through blog posts and top-ten lists. Aesthetics matters a lot in this case.
Technicals for contractors
Contractors and dealers prefer technical details of products and may take advantage of specific tools like usage and coverage calculators. These tools can also apply to other brands that can bring over people through Search Engine Optimisation.
Once I figured out the user base, and what I was focussing on, I did a user flow with the existing pages as Pidilite did not want any additional pages or tools.
Deriving from the target audience, I created two personae. Let's take a look at them.
Bangalore | Software Engineer
“I am currently building a new home and torn between the number of decisions. The opinions I get from people are varied and adds more to my confusion.”
User Goals
• Get informed about various products and what they do
• See the competition and compare them
• Futureproof her new home
Why should Priyal take a look at Roff?
She is building a new house, and she wants the best of materials to keep it long-lasting for generations to come. She is confused about new trends and doesn't know where to start. Her elders advise her to stick with cement and marbles because they have used them, but she is sceptical and wants to do her research.
Bangalore | Constructions Dealer
“I own a hardware store and am also a Pidilite authorised seller. When new customers come in, it's hard to sell them products which they don't have any idea about.”
User Goals
• Help customers sell pick what they exactly need, not necessarily what they want
• Showcase the latest products, to make his sales easier
• Latest trends and designs to showcase in his store
Why should Roshan refer to the Roff website?
Along with the multitude of useful tools for the suite of products he is selling, Roff also showcases curated trends and blog posts which he can use to aid his sales. On top of this, he can also use it to drive sales through their website, as he is an authorised Pidilite dealer.
As I converged on to my final design, I had to set a design language to be followed throughout the entire website.
Over 40 wireframes were made and reiterated based on the feedback from the client.
The accent colour was based on the primary colour of the Roff logo, referred to as Roff Green. Red was used to highlight the most important keyword in a section.
This colour scheme was chosen to showcase the brand identity throughout the website.
Navigation Bar concise and clear. The 'Find a Dealer' CTA is in bold to draw attention.
The primary target audience is the home-owners, so we categorised Roff's products to be approached through typical problems.
The header video grabs the user's attention, which is also the primary message to be conveyed.
The preview for the Tile Grout Matcher gives the user a sneak peek of the colour selector. It showcases the variety of grout solutions Roff has to provide.
Blogs and Current Trends show the latest trends in tiles, categorised by Living Spaces. Designed such that influencers can offer the latest trends to consumers with ease. The blog showcases posts from curators at Roff.
Testimonials show the completed projects using Roff products, along with what the customer says.
The footer contains the sitemap of the website along with Social Links for quick access.
The five essential solutions for consumers are tabbed for the ease of switching between the problems.
All product recommendations are up-front, so the user doesn't have to scroll down to find them.
The application video informs the user on how to apply the given product.
This page is intended for professionals who knows what they are looking for.
The Filter By option of products is based on the user journey provided to us. It quickly helps the user break down the product selection to what they need.
An adequate description is provided to better understand the product before viewing the page.
The features and application areas of the product are shown upfront. The tabs describe the use-cases, benefits, and tech specifications of the product.
The Coverage Calculator provides an idea of how much quantity a user should buy.
Pidilite wanted a responsive design, so I also took it up to create the mobile designs.
The whole design is created so that no critical information was truncated for the user, keeping the original message intact.
The screen is interactive; you may scroll to see the rest of the page.
No information has been truncated on this screen.
The Filter has been made into a button; try clicking on it.
The product page has a slightly different layout, but the content is intact.
Roff was the first project I did for a client, and it taught me a multitude of things, including how to collaborate with a team, deal with clients, and gave me a small insight into how the corporate world works.
The internship was during the first wave of COVID, and working from home was a different experience altogether, but the team at IO made it seamless.