Harry Perrin

Product / UX / Strategy Design Consultant

Portfolio

  • Jan 21 - Sept 21
  • Remote
  • Agency Contract

GFK, Enhancing an enterprise experience.

Dive into this case study on the digital revamp of WebTas, a key tool within GfK‘s data platform. As a Product Designer, I’ll guide you through every step of the design process. I’ve focused on user-friendly designs, ensuring everyone can use our platform with ease. You’ll see how we’ve blended understanding of human thought, memory, and interaction to craft an engaging user experience. The result? A WebTas that stands out for its efficiency and inclusivity. Curious about the journey? Let’s explore.

Who’s GFK?

GFK is a leading AI-driven intelligence platform specifically for the global consumer products sector. In simple terms, they offer real-time insights that help businesses make smarter decisions. Their goal? To give businesses the tools they need to improve their sales and marketing strategies.

About GFK’s Data Platforms

GFK uses special data platforms like Newron, Digital MI, and Lightspeed to collect and process important data. Think of them as the heart of GFK where financial, retailer, and product details meet. They process this data, make it smarter with advanced techniques, and then share it where it’s needed. This helps businesses get the custom reports they want, with over 250 tools at their disposal.

Coding & Cataloguing: What’s It All About?

I worked on improving the Coding and Cataloguing section, its goal was to automatically match new information with old, similar data GFK already have. If new data doesn’t match anything that is known, it gets marked and the global team, spread over three continents, step in to code it manually.

By the numbers:
We track 180 million products.
We’ve teamed up with 100,000 retail partners.
Each year, GFK add 2 million products to the main data. That’s a 20% increase from the previous year!

WebTas Overview

WebTas is the go-to software for manually pairing new products with existing product data. While the machine learning algorithm can auto-match some products, it only has a success rate of 12%. This means that a whopping 1.8 million products each year still need human oversight. WebTas, built by engineers for engineers, has been serving GFK loyally for 24 years. It’s not just another tool; it’s a respected legacy software. It stands at the heart of GFK’s plans to modernise with a focus on user experience.

Project Scope

Quick Stat: On average, a WebTas user spends 1 minute and 34 seconds matching new data with existing data.

The Goal? Reduce this time. We’re setting out to improve this performance by aligning systems and user workflows across different areas. This project is just the beginning – it’s the initial step in GFK’s digital transformation, aiming to boost the client experience.

What I Did: I was involved in research planning, journey mapping, brainstorming ideas, designing, and testing concepts.

Discovery

Approach and Context

During the discovery phase, I combined various research methods, inspired by the classic human-centred design double diamond. Our research involved 23 participants from three countries across two continents. I gathered questions from the product management team and used them in a digital survey sent to 900 users. We had a good response rate of 8.5%.

User Interviews

I set up and led interviews with WebTas users, the first time they actively shared feedback with GFK. Initially, the team nominated mainly experienced, English-speaking users. Noticing this biased view, I urged stakeholders to include a broader user range.

These interviews were key in understanding user habits, pain points, and the technology they used to get their jobs done. My analysis highlighted areas for improvement in the platform’s service, experience, and interface, helping shape WebTas’s future plans.

I prepared a semi-structured interview guide with a mix of open-ended and specific questions. With user permission, we recorded each session, using a “show and tell” method to gain deeper insights. We also asked about their primary tasks to guide the development of a more user-friendly version of the platform.

Surveys

Alongside interviews, I launched a worldwide survey using Qualtrics. The survey had clear, easy-to-understand questions based on the PACT framework, helping us better understand our users’ backgrounds.

I made sure to follow ethical guidelines. Everyone who took part knew what they were getting into (informed consent), their information was kept private, and they could leave the survey whenever they wanted.

Out of 900 users from two continents, we got 77 survey responses. My team turned these responses into easy-to-understand visuals to guide the next steps for WebTas.

Survey Insights

  • 90% prefer a linear workflow.
  • 85% show adaptability to change.
  • 85% are proactive problem solvers.
  • 51% maintain a strong focus on tasks.
  • 60% value individuality and sharing insights.
  • 100% of users consider themselves analytical.

WebTas operates within three main settings:

    💪 Physical
    🏢 Organisational
    ❤️ Social

Physical Setting:

From my findings, users access WebTas from various places – from quiet home offices to bustling workspaces. Some users encountered disrupted services due to extreme weather, impacting their work. Home users often struggle with shared or slow Wi-Fi, in contrast to reliable office connections. This highlights the need for WebTas to be more user-friendly, especially during remote work.

Organisational Setting:

WebTas caters to users from different time zones like India, Malaysia, Bulgaria, and Germany, leading to communication challenges. Tools like MS Teams have solved certain issues, especially in remote settings.

Social Setting:

When faced with problems, users don’t have many self-help options. They usually turn to managers or seasoned users. While office support seems better, there’s a clear need to upgrade support mechanisms to enhance overall user experience.

Design Insights

During the design phase, I developed three key tools that shed light on user needs and helped guide our teams. These tools ensured I stayed committed to delivering a tailored user experience. They included personas, user journeys, and user stories.

Personas

The personas I crafted provide a window into user behaviours, their motivations, and skills. As I delved deeper into the research, these personas evolved, helping the team better understand and empathise with users.

Each persona not only pointed out the user’s challenges and preferences but also combined demographic and psychographic details. I made sure they were realistic and free from bias.

User Journeys

User journeys help us grasp how users act. In the sessions I led, I took screenshots to see how users moved through WebTas and matched data in a broader context. Every journey was then simplified, labelled, and paired with user comments.

Such journeys are vital to see where GFK can do better, find issues, and decide on the main goals. They gave the team insight into problems and enhanced the design approach.

User Needs

Our research revealed that WebTas needs to cater to multiple user groups. Elements like memory, feelings, thinking, and social interactions shape their experience from start to finish.

Users often find the current WebTas interface too busy, especially when they’re just starting out. It can feel overloaded with features, which goes against easy-to-use design guidelines. The solution? A more streamlined design, cutting out any unnecessary noise.

Users also value social interactions when using the data platforms. While WebTas currently doesn’t offer much in this area, features like a leaderboard could boost engagement. Something I felt was an avenue worth exploring.

Understanding how things work is crucial for users. For a platform like WebTas, where quick interactions matter, users should easily recall essential information. This was key to achieving GFK’s digital transformation goals.

WebTas needed to be more accessible, especially for visually impaired users. This is an immediate priority as over 20% of users have a visual impairment.

Reviewing WebTas: A Heuristic Review

In my effort to improve the user experience of WebTas, I conducted a heuristic evaluation based on Jakob Nielsen’s 10 guidelines. This review allowed me to identify the system’s strengths as well as areas requiring refinement, setting a clear path for targeted improvements.

Heuristics

  • Proactive onboarding features are lacking.
  • Aesthetically WebTas suffers from interface clutter and a dated design.
  • WebTas promotes recognition over recall through the use of product filters.
  • The system offers flexibility with keyboard shortcuts and user-defined filters.
  • WebTas aligns with system status visibility principles by using tabs for status.
  • User control and freedom issues arise from unconventional navigation architecture.
  • Inconsistent iconography and text size differentiation directly affects information hierarchy.

Diving Deep with a Cognitive Walkthrough

I grouped users based on detailed personas and their matching methods, as evident from system usage data. Each group had specific tasks to complete through clear, step-by-step actions. The primary aim? Swift and effective product matching.

During this matching process, I constantly asked: Is the goal clear? Is the next step obvious? Can users easily see the results of their actions? And, can they spot any issues?

The insights from this walkthrough enriched the research, broadening the journey’s scope for all teams involved. This ensured our findings didn’t just enhance user experience, but also aligned with the company’s broader objectives.

Design Principles

WebTas followed key design principles to shape the user experience. It was crucial to align these principles with top design practices to improve the user’s journey.

Speeding Up Interactions: Doherty’s Threshold

The older WebTas platform was slow, not matching up to Doherty’s Threshold, which suggests that users work best when interactions happen in under 400 milliseconds. Things like post-click animations and loading search results are taking too long. We aimed to make everything faster and more responsive to hit that ideal speed.

Tesler’s Law: Making Things Simple

WebTas followed Tesler’s Law, which says systems have a basic level of complexity. But with 136 filters and 200 data points, meant it got very complicated. My goal? Simplify it, focus on what users really need, and make it an enjoyable and positive interaction.

Hick’s Law: Making Choices Easier

Too many options made tasks especially hard for new users. My aim was to simplify these options to help users work more efficiently.

Gestalt Principles

Similarity: WebTas users tend to group data. However, they noticed extra columns in tables that aren’t being used. We should consider removing them.

Proximity: WebTas keeps retailer and product data in separate tables. To make things simpler for users, there should be a clear step-by-step process.

Common Region: In WebTas, buttons with similar functions are put together. This clear arrangement works well and should be kept.

Focal Point: To help users, WebTas uses distinct colours to highlight selected rows. It’s effective, and we should keep doing it.

Accessibility Audit

I ran an in-depth check on WebTas for accessibility and usability. A major discovery was its operation mainly on Internet Explorer, which may face issues due to Microsoft’s plans to phase it out. Some users also tried using Chrome extensions for translations [the action of matching data], which the system didn’t support. Interestingly, about 9.2% of users navigated using only keyboards. Also, some text elements lacked clarity because their headings were of the same size.

Ideation

Sketching

Having understood the users and their challenges, I delved into the ideation phase. The design was deeply rooted in making everything user-friendly and accessible. In collaborative workshops, I worked with experts and stakeholders to shape the future of the WebTas product.

From these workshops, sketching began. I prioritised user accessibility, like ensuring our colours were easily distinguishable. This was especially important for the 20% of users with visual impairments. We stuck to top-tier contrast standards, making sure everyone could use our platform easily.

I also rethought the language on our interface, avoiding confusing abbreviations.

Below, the sketches show the main WebTas screens with all the updated features. I kept certain designs, like the top and bottom tables, because users were familiar with them. This aligns with the Gestalt design principles.

And to boost the overall user experience, I added a feature that shows users the order in which items will be processed. This helps avoid confusion and makes the system even more user-friendly.

Design

After gathering insights in the discovery and ideation stages and shaping the future product’s vision, the focus shifted to the design phase. Here, I turned broad ideas into real, user-focused design solutions. I used my collected knowledge to start building a unified design system, and with Figma, I quickly developed detailed wireframes.

GFK Design System

With insights from earlier phases in hand, I set out to create a flexible atomic design system. It reflected the GFK brand’s look and feel and the guidelines set to boost the user experience.

High-Fidelity Wireframes: Turning Ideas into Reality

High-fidelity wireframes take our abstract design ideas one step closer to the real product. Using Figma, and informed by user insights and our design system, I began crafting these detailed wireframes. They not only give a solid feel to the design but also connect the initial ideas with how they’ll actually work.

Delivery

Prototyping

Prototyping was crucial in shaping designs. It gave a clear lens to test ideas. Through hands-on usability tests and the “show me, tell me” approach, I understood where our design stood out and where it needed work.
I used Axure RP to build our prototypes. It’s a great tool that helps make designs feel real. With Axure, participants experienced interactions very similar to a final product. This made their feedback more reliable. I also focused on the little touches, or micro-interactions, in the design. These small details make the user experience much richer and enjoyable.

Usability Testing

To facilitate our usability tests, I developed a semi-structured discussion guide. This guide was structured to provide a consistent framework while remaining flexible enough to explore unforeseen issues that arose during testing. It included sections such as an introduction, warm-up questions, main inquiries, user feedback collection, and a concluding wrap-up.

My primary focus was assessing the user-friendliness of the product, paying particular attention to design elements like font style, size, contrast, and the integration of upcoming features. A critical aspect of the discussions was evaluating how well these design modifications aligned with the users’ daily tasks, ensuring the enhancements effectively supported their workflow.

As I concluded the engagement, it was evident that the continuous loop of feedback and redesign had fostered a product that was not only more intuitive but also more aligned with the practical realities of our users’ daily operations. The end of this project phase marked a significant milestone in the journey towards creating an optimal user experience, setting a great foundation for future enhancements.