top of page

ZF Gated Area

Executive Summary

My Area is the gated access zone of the ZF Aftermarket Portal — a complex B2B platform serving distributors, workshops, and fleet operators across multiple markets. The challenge was to design a scalable, flexible workspace capable of supporting highly diverse users with evolving needs, while minimizing onboarding friction and enabling long-term engagement.

As a Senior UX/UI Designer, I led the experience design of the My Area concept, focusing on progressive access, modular permissions, and personalization. The resulting solution transformed the portal from a static system into a dynamic customer workspace that grows with the user relationship lifecycle.

This case study demonstrates my ability to:

  • Design complex enterprise platforms

  • Translate business strategy into UX architecture

  • Create scalable interaction models

  • Balance usability with system flexibility

  • Drive continuous improvement using behavioral data

 

Responsibilities

  • Defined UX strategy for the gated portal experience

  • Designed the progressive registration and access model

  • Created information architecture for My Area

  • Designed flexible dashboard and feature layout

  • Developed access request interaction patterns

  • Collaborated with product managers and developers

  • Facilitated stakeholder alignment workshops

  • Supported usability testing and iteration

  • Integrated analytics-driven optimization principles

​

Context

ZF Aftermarket operates in a highly complex B2B environment where customers vary significantly in size, maturity, and operational structure. Unlike consumer products, enterprise customers do not share a single predictable workflow. Instead, they operate within layered organizational hierarchies and evolving partnerships.

Examples of target users include:

Distributors

  • Sales managers

  • Logistics coordinators

  • Product specialists

Workshops

  • Mechanics

  • Service managers

  • Owners

  • Warranty specialists

Fleets

  • Operations managers

  • Procurement teams

  • Maintenance supervisors

Each role requires different tools, permissions, and content.

The Challenge

Designing My Area required solving a multi-dimensional problem involving identity, permissions, and experience design. The system needed to support multiple industries, roles, and partnership levels while remaining intuitive and scalable.

The key challenge was not simply building a user interface, but designing a flexible interaction model capable of adapting to changing business relationships over time.

The portal needed to:

  • Serve diverse user personas

  • Support evolving partnerships

  • Enable incremental access

  • Reduce onboarding friction

  • Encourage feature adoption

  • Scale across markets and services

The Problem

Traditional enterprise portals rely on static role definitions and fixed permission structures. These models assume that users know exactly what they need at the time of registration and that access requirements remain stable.

In reality, customer engagement evolves gradually. Organizations typically begin with basic usage and expand their interaction as their capabilities and trust grow.

This mismatch created several usability and business challenges:

  • Long registration forms reduced completion rates

  • Users requested unnecessary access

  • Support teams handled frequent permission changes

  • Features remained underutilized

  • Customers lacked visibility into available services

 

The Insight

The most important insight from research was that access is a journey, not a decision. Customers do not need full functionality immediately. They discover value progressively and request additional capabilities when they are ready.

This shifted the design approach from gatekeeping to enablement.

Instead of asking users to provide all information upfront, the system allows them to expand access gradually in exchange for additional data.

Design Principles

Progressive Registration

Collect only essential information initially and request additional data later when it provides clear value.

Flexibility

Allow the system to support multiple user types, roles, and partnership levels without redesign.

Transparency

Make available features visible, even when access is restricted.

Personalization

Deliver relevant content based on role, behavior, and organizational context.

Continuous Improvement

Use behavioral analytics and feedback to refine the experience over time.

 

The Solution

I designed My Area as a modular workspace that evolves alongside the customer relationship. Instead of a single fixed interface, the system dynamically adapts to user identity, permissions, and behavior.

The solution combines:

  • Progressive registration

  • Modular permissions

  • Feature promotion

  • Personalized dashboards

  • Data-driven optimization

Key UX Innovation

Enabled vs Disabled Features Model

Rather than hiding unavailable functionality, My Area displays both accessible and restricted features within the same interface.

Enabled features allow immediate productivity.

Disabled features act as guided opportunities for growth.

This design turns access management into a discovery and engagement mechanism.

User Flow

User discovers portal

→ Registers with minimal information

→ Enters My Area

→ Uses available features

→ Discovers locked features

→ Requests additional access

→ Provides required data

→ Gains expanded capabilities

System Architecture

My Area operates on a layered architecture designed for scalability and maintainability.

Identity Layer

Defines who the user is.

Examples:

  • Organization type

  • Role

  • Partnership level

  • Region

Permission Layer

Determines what the user can access.

Examples:

  • Feature availability

  • Service eligibility

  • Security rules

Experience Layer

Controls what the user sees.

Examples:

  • Dashboard modules

  • Notifications

  • Promotions

  • Content

Analytics Layer

Monitors user behavior and system performance.

Examples:

  • Feature usage

  • Navigation patterns

  • Conversion funnels

  • Feedback responses

Progressive Registration Model

The onboarding process was redesigned to reduce friction and improve adoption.

Step 1 — Minimal Registration

Collect only essential data required to create an account.

Examples:

  • Name

  • Email

  • Organization

  • Country

Goal:

Enable fast entry into the system.

Step 2 — Contextual Data Collection

Request additional information when users attempt to access specific features.

Examples:

  • Workshop size

  • Fleet size

  • Service capabilities

Goal:

Ensure relevance and reduce form fatigue.

Step 3 — Advanced Access Enablement

Grant expanded permissions after eligibility validation.

Examples:

  • Warranty processing

  • Training programs

  • Diagnostic tools

Goal:

Support partnership growth.

Dashboard Design

The My Area dashboard was designed as a modular layout that supports personalization and scalability.

Design Goals

  • Provide quick access to key tasks

  • Support multiple workflows

  • Enable flexible configuration

  • Maintain visual clarity

Key Components

Header

Navigation and account controls

Dashboard Modules

Personalized widgets

Feature Grid

Enabled and locked features

Promotions Panel

Upgrade opportunities

Activity Feed

Recent actions and updates

Access Request Experience

A critical part of the design was the access request flow.

Users request additional functionality directly from the interface without contacting support.

Design Goals

  • Minimize friction

  • Collect only required data

  • Provide clear expectations

  • Enable automation

Smart Form Behavior

Forms dynamically adapt based on user context.

Examples:

If user selects Fleet Operator

System requests:

  • Fleet size

  • Vehicle types

If user selects Workshop

System requests:

  • Technician certifications

  • Service categories

Personalization Strategy

Content and features are tailored using multiple signals.

Personalization Inputs

  • User role

  • Organization type

  • Partnership level

  • Usage behavior

  • Geographic region

Example

Mechanic sees:

  • Repair instructions

  • Technical bulletins

  • Training courses

Fleet manager sees:

  • Fleet analytics

  • Maintenance planning

  • Performance reports

Data and Continuous Improvement

User behavior is monitored to identify friction points and opportunities.

Tools

Piwik (Matomo)

Tracks:

  • Page views

  • Click paths

  • Feature usage

  • Session duration

Qualtrics

Collects:

  • User feedback

  • Satisfaction ratings

  • Feature requests

Design Decisions and Trade-offs

Decision

Show locked features instead of hiding them.

Trade-off

Risk of user confusion.

Mitigation

Clear messaging and visual differentiation.

Decision

Use progressive registration.

Trade-off

More complex system logic.

Mitigation

Modular architecture and validation rules.

Decision

Design modular dashboard.

Trade-off

Higher initial design complexity.

Mitigation

Reusable component system.

Constraints

The project operated within several constraints.

Technical

Legacy systems integration

Business

Multiple stakeholder priorities

Operational

Global rollout requirements

Design

Need for flexibility without overwhelming users

Outcomes

The redesigned My Area significantly improved usability and engagement.

Business Impact

  • Increased portal adoption

  • Improved feature utilization

  • Reduced support requests

  • Enabled scalable partnership growth

User Experience Impact

  • Faster onboarding

  • Clear feature discovery

  • Reduced friction

  • Higher engagement

What I Learned

Designing My Area reinforced the importance of thinking beyond screens and workflows. In complex enterprise environments, UX design must address organizational behavior, system architecture, and long-term product evolution.

I learned that flexibility is not achieved by adding options, but by designing systems that adapt gracefully to change.

Future Opportunities

  • AI-driven personalization

  • Predictive feature recommendations

  • Automated eligibility validation

  • Mobile-first workflows

END OF PORTFOLIO CASE STUDY

© Copyright Hamik Mayilyan.

bottom of page