Zain is one of Kuwait's most recognizable brands, its commercials are woven into the cultural memory of an entire generation, full of humor, warmth, and unmistakably human moments. But that same warmth had quietly disappeared from the one place millions of customers touch every month: the plan pages.

Years of growth had outpaced the original design. Every new OTT partnership, every bundled offer, every benefit tier was patched onto a card system that was never built to hold that much information.

The result was two failures happening at once. A structural one, where cards broke, buying flows slowed, and updates became expensive; and an emotional one, where the interface became so generic it could have belonged to any telecom in the region.

This case study is about solving both. Rebuilding the information architecture from the ground up so the system could scale and bringing back the personality that made people feel something when they saw the Zain logo in the first place.

Disclaimer: This is an independent concept and is not affiliated with or endorsed by Zain. All trademarks, imagery, and media belong to their respective owners and are used for contextual portfolio presentation only.

Years of growth had outpaced the original design. Every new OTT partnership, every bundled offer, every benefit tier was patched onto a card system that was never built to hold that much information.

Industry

Telecommunications

Role

Product Designer

Project Type

Independent Concept

Target Outcomes

Mobile View
+27% Mobile Plan Conversions
–41% Mobile Support Queries
18s → 11s Mobile Decision-Time

Desktop View
+18% Desktop Plan Conversions

–30% Mobile Support Queries
38% Faster Desktop Value Recognition

Year

2025

UNDERSTANDING ZAIN'S ENERGY

Ask anyone in Kuwait what they remember about Zain, and it's rarely the network. It's a commercial: a specific one, from a specific year, that made them laugh or feel something.

That's the temperature this brand was built at: warm, funny, unmistakably human, delivered one thirty-second story at a time for over two decades.

A few of the ones people still bring up.

More Projects

All projects

Oil & Gas Operations

STRATA Energy

View

Museum Experience App

Guggenheim Abu Dhabi

View

UNDERSTANDING ZAIN'S ENERGY

Ask anyone in Kuwait what they remember about Zain, and you'd be surprised because it's not always the network. It's a commercial: a specific one, from a specific year, that made them laugh or feel something.

That's the temperature this brand was built at: warm, funny, unmistakably human, delivered one thirty-second story at a time for over two decades.

A few of the ones people still bring up.

DRAG TO MOVE

THE BREAK BETWEEN BRAND AND EXPERIENCE

Growth had outpaced the design.
Every new OTT partnership, every bundled offer, every benefit tier was patched onto a card system that was never built to hold this much. What worked when plans were simple started to break once real complexity entered, updates slowed, comparisons got harder, and the structure began to feel fragmented and unbalanced.

The brand went quiet.
Zain's identity had always been bold, youthful, and full of motion, but the plan pages carried none of it. The one place customers visited most had become disconnected from the energy they felt everywhere else the brand showed up.

The system became harder to scale.
When a card system cannot adapt to constant changes in plans, benefits, and partnerships, every new requirement risks becoming a custom exception. Over time, those exceptions increase design and development effort, slow iteration, and make the experience harder to maintain.

THE BREAK BETWEEN BRAND AND EXPERIENCE

DESIGN PRINCIPLES

Continuity through brand expression.
Zain's identity is already distinctive, the bold campaigns, expressive imagery, and recognizable graphic motifs. Rather than introducing a new visual language, the redesign brought those familiar elements into the product experience. Campaign imagery, brand accents, and subtle graphic details create a stronger connection between Zain's marketing and its digital touchpoints, making the journey feel unmistakably Zain.

Responsiveness by making interaction feel alive.
Zain's advertising has always had energy. People, movement, warmth. An interface can carry that same quality through how it behaves, not just how it looks. On hover, the image behind a plan's price plays. The accent color activates. The card acknowledges attention instead of sitting still. Small moments like this build engagement, one hover at a time.

Scalability by designing for change, not just today.
The component was built around progressive disclosure, revealing only what users need when they need it. Long, repetitive content was consolidated into expandable sections, creating a calmer experience while leaving room for future plans, streaming partners, device bundles, and promotional offers. The result is a flexible system that can evolve with business needs without compromising usability or visual clarity.

DESIGN PRINCIPLES

Continuity by extending Zain's visual language into the product.
Zain's identity is already distinctive, the bold campaigns, expressive imagery, and recognizable graphic motifs. Rather than introducing a new visual language, the redesign brought those familiar elements into the product experience. Campaign imagery, brand accents, and subtle graphic details create a stronger connection between Zain's marketing and its digital touchpoints, making the journey feel unmistakably Zain.

Continuity by utilizing Zain's existing visual language.
Zain already had a visual language. The burst, the petal, and the spiral appear across its commercials and campaigns, recognized long before this redesign began. These marks carry meaning on their own. The redesign kept them, and gave them a place inside the interface itself, sitking quietly behind pricing, marking a card's edge, appearing at the exact moments where the product needed a little more warmth than a number alone could carry. The brand didn't need a new mark but the marks it already had to do more work.

Responsiveness by bringing motion into the interface.
Zain's advertising has always had energy. People, movement, warmth. An interface can carry that same quality through how it behaves, not just how it looks. On hover, the image behind a plan's price plays. The accent color activates. The card acknowledges attention instead of sitting still. Small moments like this build engagement, one hover at a time.

Restraint by a structure that can hold future asks.
A good system shows only what's needed, when it's needed. The redesign collapsed long, repeated lists into a single line, expandable on request. That decision made the interface feel calmer immediately. It also made room for growth. The same structure now supports plan cards, streaming offers, and device bundles, each carrying different amounts of information without straining under any of it.

DESIGNING A SMARTER PLAN EXPERIENCE

The original plan cards presented all information within a single uninterrupted layout, making it difficult for users to distinguish between what drives a decision and what supports it.

The redesign reorganizes the component into two distinct visual zones. The upper section focuses on recognition such as the plan identity, pricing, branded imagery, and a preview of included streaming services while the lower section provides a structured breakdown of everything that's included. This separation creates a clearer visual hierarchy, improves scanability, and establishes a flexible foundation for richer interactions and future expansion.

Designed to capture attention

The static campaign banners were transformed into lightweight motion previews that animate on hover, bringing Zain's commercials into the browsing experience. The interaction is subtle enough to avoid distraction, yet expressive enough to encourage exploration and create a stronger emotional connection with the brand.

Making entertainment visible

Streaming subscriptions are one of Zain's strongest value propositions, yet previously remained buried within dense lists of benefits. The redesign surfaces a preview of included services directly beneath the pricing through recognizable platform icons, giving users an immediate understanding of entertainment value before expanding the full list.

Progressive disclosure for scalability

Rather than permanently displaying every included service, the detailed list is revealed only when users choose to expand it. This dramatically reduces the visual height of the cards while creating a flexible component capable of supporting additional streaming partners and future offerings without becoming cluttered.

Resolving competing business priorities

The redesign reconciles an ongoing debate around pricing placement by pairing the monthly price directly with the plan allowance, establishing them as a single decision-making unit. The allowance is intentionally repeated within the feature list to reinforce the user's choice while maintaining context as they continue exploring the card.

Expressing the Zain brand

Beyond campaign imagery, subtle branded motifs emerge during interaction, giving the interface moments of personality that feel distinctly Zain. Rather than decorating the experience, these interactions reinforce the connection between the company's marketing language and its digital products.

The original plan cards presented all information within a single uninterrupted layout, making it difficult for users to distinguish between what drives a decision and what supports it.

DESIGNING A SMARTER PLAN EXPERIENCE

The original plan cards presented all information within a single uninterrupted layout, making it difficult for users to distinguish between what drives a decision and what supports it.

YOUR USAGE HAS A STORY. THIS AI READS IT.

Personalized plan recommendations based on real usage.

Most customers already know what they pay each month. What is harder to see is whether their current plan still reflects how they actually use it. For logged-in customers, Zain Intelligence turns account history, such as data consumption, overage charges, streaming habits, and shifts in usage into a timely plan recommendation at renewal.

Rather than adding another badge to the interface, I designed the recommendation as part of the plan card itself. Without a recommendation, the component behaves like a standard pricing card. When Zain Intelligence identifies a better fit, the same structure adapts to introduce the recommendation, estimated savings, and a clear path to the reasoning behind it. This makes the feature feel native to the experience rather than added on later.

Explainable by design. Optional by choice.
Zain Intelligence makes its reasoning visible by showing the usage patterns, additional charges, and potential savings behind each suggestion. This explainability allows customers to assess the recommendation rather than simply accept it.

Personalization also remains optional. Customers can switch Zain Intelligence off in their profile settings, giving them control over whether their usage history informs the experience. The system provides guidance when welcomed, while leaving both participation and the final decision with the customer.

YOUR USAGE HAS A STORY. THIS AI READS IT.

Personalized plan recommendations based on real usage.

Plan recommendations based on real usage.

BEYOND THE PLANS

The plan cards do the persuading. Everything below them exists to catch the customer who wasn't ready to be persuaded yet.

The rest of the page was designed to create new entry points into the decision: making the value difficult to miss, presenting ready-made device bundles, and giving customers a clearer way to compare plans without returning to the cards.

01 / Turn hidden benefits into visible value

The streaming offer details were previously hidden inside each card’s expandable benefits list. I brought them back into view immediately beneath the plans, translating a list of included services into a clear value proposition: three months free, two months free, or one month free.

The larger format creates a deliberate interruption for customers who may be casually scrolling rather than actively comparing. Even without opening a plan, they can immediately understand what joining Zain could be cost saving.

BEYOND THE PLANS

02 / A device and a plan, in one decision

Rather than sending users into separate device and plan journeys, I turned the bundle card into a smarter decision-making tool. The component starts with a recommended plan, but also lets users explore other Wiyana options through an inline selector that recalculates bundle pricing instantly on the page. Streaming service details, which previously lived deeper in the product page, were also pulled into the same experience so users can evaluate both cost and benefits in one place. By combining recommendation, pricing logic, and plan benefits into a single scalable component, the bundle experience becomes faster to use, easier to compare, and more resilient as offers evolve.

For logged-in customers, the pricing reflects their existing eligibility, so the number on screen is the number they'd actually pay. The same principles the plan card was built on, scalability, one system that scales, apply here to a component doing more work: showing a device, a plan, a streaming line, a live calculation, and a personalized price, all inside one card that still holds its shape.

02 / A device and a plan, in one decision

03 / Compare plans at a glance

Placing plans beside one another did not automatically make them comparable.

I introduced a dedicated comparison table that organizes every plan around the same criteria. Data, minutes, streaming services, roaming, and number tiers can now be read across a single row, making trade-offs visible without requiring customers to remember what they saw in another card.

03 / Compare plans at a glance

Placing plans beside one another did not automatically make them comparable.

WITH GRATITUDE, TO WHERE IT STARTED.

I spent five years at Zain, but I did not begin there as a designer. I started by managing website content, building page layouts, and adapting them across desktop and mobile. My manager, Hadeel, saw an eye for design in me before I knew how to name it. She invested in that instinct and gave me the opportunity to grow into UX/UI.

This redesign brings me back to that beginning. It reflects what I would create today with everything Zain helped me learn: a plans experience that is clearer, more expressive, and more responsive to both customer needs and business priorities. From adaptive plan cards and explainable recommendations to live bundle calculations and easier comparison, every decision was shaped by a brand I came to understand from the inside.

This is more than a concept redesign. It is my thank-you to Hadeel, and a love letter to Zain, the place where my career in design began.