7-Eleven Home

Screen Redesign

Our current homepage is dominated by marketing materials that overshadow essential app functionality.

Bold promotional banners, seasonal campaigns, and corporate messaging occupy prime screen real estate,

This marketing-first approach creates unnecessary friction in the user journey, forcing customers to navigate through promotional content before reaching the tools they actually need.

Making things worse our bottom navigation is a mess.

Location specific features are wasting valuable navigation items while some fetures are being rolled up into one navigational item. On top of that critical features are often presented in an ad banner format, causing them to blend into the promotional noise and get overlooked by users who have been conditioned to filter out banner-like elements.

We ran a workshop to drill down on homescreen priorities and current failings

What we observed was there was a lot of focus on customization, and surfacing features where there had been struggles with user engagement. We needed the home page to adapt to our user's behavior, and we needed to find out how.

After that we did some competitive analysis to see how other home pages were solving their problems

We looked at many mobile apps and studied how they organize their pages. We noticed a trend where apps would break content into separate, modular sections that can be easily changed or rearranged. This smart design lets them show different content based on where users are located or what services they frequently engage with. Visually, these apps varied in their apporach, but we observed there would be shifts between large interaction items and smaller to promote visual hierarchy

Our Modular Solution

The homepages we drew inspiration from broke content into separate, modular sections that can be easily changed out or rearranged. This smart design allows for a flexible homescreen for different contexts and user types.

A modular, scalable design allows easy integration of new services without disrupting user experience

A modular, scalable design allows easy integration of new services without disrupting user experience

Regular Unleaded

Savings Details

Your Price

$3.229

/gal

$3.509

/gal

Start Fueling

4010 Lincoln Blvd,

Santa Monica, CA

Change

Coffee

$1.49

Banana

$0.35

Reese’s

$1.23

Pizza

$5.34

Clarity Through Simplicity

Our approach begins with a simple premise: your experience should adapt to your unique situation. We've reimagined the user journey by designing an interface that recognizes and responds to your specific context.

Personalization Without Complexity

We're implementing a single, prominent primary action at the top of every screen—one that dynamically changes based on your current state and immediate needs.

A Modular Future

After performing some usuability tests, our state-based home page design has been received well by users, and has proved how adaptable our design is. This helps the team create a smooth user experience that changes based on each customer's situation.


By making it simple and focusing on what users need most in each situation, we've seen users interact with features that used to have little engagement. Further, what began as a new way to think about one screen has shifted our approach to our digital strategy,

7-Eleven Home

Screen Redesign

Our current homepage is dominated by marketing materials that overshadow essential app functionality.

Bold promotional banners, seasonal campaigns, and corporate messaging occupy prime screen real estate,

This marketing-first approach creates unnecessary friction in the user journey, forcing customers to navigate through promotional content before reaching the tools they actually need.

Making things worse our bottom navigation is a mess.

Location specific features are wasting valuable navigation items while some fetures are being rolled up into one navigational item. On top of that critical features are often presented in an ad banner format, causing them to blend into the promotional noise and get overlooked by users who have been conditioned to filter out banner-like elements.

We ran a workshop to drill down on homescreen priorities and current failings

What we observed was there was a lot of focus on customization, and surfacing features where there had been struggles with user engagement. We needed the home page to adapt to our user's behavior, and we needed to find out how.

After that we did some competitive analysis to see how other home pages were solving their problems

We looked at many mobile apps and studied how they organize their pages. We noticed a trend where apps would break content into separate, modular sections that can be easily changed or rearranged. This smart design lets them show different content based on where users are located or what services they frequently engage with. Visually, these apps varied in their apporach, but we observed there would be shifts between large interaction items and smaller to promote visual hierarchy

Our Modular Solution

The homepages we drew inspiration from broke content into separate, modular sections that can be easily changed out or rearranged. This smart design allows for a flexible homescreen for different contexts and user types.

A modular, scalable design allows easy integration of new services without disrupting user experience

A modular, scalable design allows easy integration of new services without disrupting user experience

Regular Unleaded

Savings Details

Your Price

$3.229

/gal

$3.509

/gal

Start Fueling

4010 Lincoln Blvd,

Santa Monica, CA

Change

Coffee

$1.49

Banana

$0.35

Reese’s

$1.23

Pizza

$5.34

Clarity Through Simplicity

Our approach begins with a simple premise: your experience should adapt to your unique situation. We've reimagined the user journey by designing an interface that recognizes and responds to your specific context.

Personalization Without Complexity

We're implementing a single, prominent primary action at the top of every screen—one that dynamically changes based on your current state and immediate needs.

A Modular Future

After performing some usuability tests, our state-based home page design has been received well by users, and has proved how adaptable our design is. This helps the team create a smooth user experience that changes based on each customer's situation.


By making it simple and focusing on what users need most in each situation, we've seen users interact with features that used to have little engagement. Further, what began as a new way to think about one screen has shifted our approach to our digital strategy,