Azona

Mobile app design for service station

Sector

Retail / Services / Energy

Created in

Dinacode

Role

Product Designer (UX/UI)

Tools

Figma

Context

Azona is a service station located in Elche that offers refueling, car washing, cafe, and supermarket. This variety of services is concentrated in one space, but its management was fragmented, forcing users to interact with different physical points or unclear processes.

The project’s objective was to unify these services into a single, intuitive app that would allow users to manage the entire process of contracting and paying for services independently and without leaving their car.

Challenge

Design an experience that allows to:

Independently manage three distinct services: refueling, washing, and cafeteria.
Minimize interaction time in a fast-paced usage context.
Clearly differentiate each service without sacrificing visual brand consistency.
Ensure a clear and understandable experience for non-digital users.

The main challenge was to balance simplicity and functionality without creating friction or ambiguity in navigation.

Solution

Contribution

Analysis of the ideal customer journey.
Definition of an information architecture focused on fast tasks.
Design of independent flows optimized for each service.
Development of a visual system that allows services to be distinguished while maintaining consistency with Azona's visual identity.
High-resolution prototyping.

Design approach

The experience was structured around clear actions: select service → configure → confirm.

To ensure speed and clarity:

I prioritized visual clarity and step-by-step navigation to guide the user. The design focused on minimizing cognitive load and enabling quick interactions in an in-vehicle context.

Result

A complete, development-ready design was delivered, validated by the client for its clarity, ease of use, and visual consistency.

Impact

Reduction of the number of steps required to complete the main flows by 30–40% compared to traditional station processes.

Simplifying decision-making through a structure that clearly separates services, reducing ambiguity in navigation.

Learnings

✏️

The context of use conditions the entire experience.

Designing for in-car users requires prioritizing speed, clarity, and minimal interaction over any aesthetic decisions.

Clarity does not depend on a single visual resource

Differentiating services without breaking the brand requires working on hierarchy, structure, and iconography together, not just color.