Landing Page Redesign

Landing Page Redesign

Landing Page Redesign

Lipton Tea • 2025 • 2 minute read

I redesigned Lipton’s homepage to center both the product, customer and Lipton’s story — introducing new images that reflect the brand’s broad, multigenerational appeal and elevating the brand narrative. Customized Lipton themed layouts, new hover states, and immersive visuals now invite users into a warmer, more memorable experience — all while working with the existing written content.

I redesigned Lipton’s homepage to center both the product, customer and Lipton’s story — introducing new images that reflect the brand’s broad, multigenerational appeal and elevating the brand narrative. Customized Lipton themed layouts, new hover states, and immersive visuals now invite users into a warmer, more memorable experience — all while working with the existing written content.

I redesigned Lipton’s homepage to center both the product, customer and Lipton’s story — introducing new images that reflect the brand’s broad, multigenerational appeal and elevating the brand narrative. Customized Lipton themed layouts, new hover states, and immersive visuals now invite users into a warmer, more memorable experience — all while working with the existing written content.

Web Design

Web Design

Branding

Branding

Design Challenge

Design Challenge

Role

Web Designer

Web Designer

Duration

3 Days

3 Days

Tools

Figma

Figma

Anticipated Impact

+30% increase in time spent on page

+20–40% increase in click-through rate by showcasing product lines and clear CTAs

Up to 2x more scroll depth engagement

Improved brand perception especially among Gen Z and Millennials who equate design with brand trustworthiness

Better conversion from ad traffic

Design Challenge

Problems:

Overall outdated design style and layout

Does not differentiate Lipton Teas from other options

Basic layout, boring, uninviting.

Desires:

Promotes the high quality & longevity of the brand

Warm and inviting, high transparency

Showcase all avenues of the brand product offering

Talking to target audiences (lovers of all things tea, healthy adults, age range 18-80)

Easy to navigate design

Constraints:

1 week deadline

No access to user data

Could not change written content

Needed to include all provided sections

Branding guidelines were assumed from public materials


Constraints:

1 week deadline

No access to user data

Could not change written content

Needed to include all provided sections

Branding guidelines were assumed from public materials

Prototype

Branding & Hero Section

There was little visual emphasis on the customer, the product being made, or overall responsiveness. I drew inspiration from the shape of the updated logo and Lipton tea tags, creating custom masks to frame content. Instead of static imagery, I opened the hero section with dynamic visuals of tea being poured to immediately highlight warmth, freshness, and brand identity.

Layer Masks

BEFORE

AFTER

Tea Lovers

For this section, I created a collage of tea lovers using custom brand-inspired masks, and added much-needed motion with a double infinite scroll. I also introduced additional text to better support each section and used the mask shapes to create smooth visual transitions between sections, adding cohesion and flow to the page.

BEFORE

AFTER

Product Slide Show

The products are the stars of the site and deserved to be treated that way. The original recipe section included a sunshine effect that felt underused, so I remixed it and applied it to spotlight the featured product in the redesigned carousel. I also incorporated tea strings as subtle accent elements to reinforce brand detail and warmth

BEFORE

AFTER

BEFORE

AFTER

Brand Story

The landing page lacked context around what makes Lipton special — something competitors and even the parent site emphasized. To address this, I closed the page with a clear, compelling brand story that reinforces Lipton’s legacy and values.

AFTER

Reflection

If I had more time, I would have spent longer refining the story page—I originally wanted to experiment with motion in the founder’s portrait or add more expressive typographic effects. Landing pages set the tone for the whole site, and I had so much fun bringing this one to life! I’m proud of how the prototype and supporting pages came together overall.

If I had more time, I would have spent longer refining the story page—I originally wanted to experiment with motion in the founder’s portrait or add more expressive typographic effects. Landing pages set the tone for the whole site, and I had so much fun bringing this one to life! I’m proud of how the prototype and supporting pages came together overall.

Let’s connect. Want to collaborate or just chat design?
Get in Touch | More About Me

Let’s connect. Want to collaborate or just chat design?
Get in Touch | More About Me

Let’s connect. Want to collaborate or just chat design?
Get in Touch |

More About Me

Let’s connect. Want to collaborate or just chat design?
Get in Touch | More About Me

Copyright © 2025 Lilian Juma

Copyright © 2025 Lilian Juma

Copyright © 2025 Lilian Juma