Work         Like          About
︎     ︎



Alvic


Alvic is the leading provider of comprehensive solutions for the management, automation and control of systems in the hydrocarbons sector.

They have evolved according to the needs of the moment until they become what they are today, working in several countries with the aim of being pioneers in technology. They stand out for their international projects in Latin America in which in some countries such as Mexico or Costa Rica for example, they have become a great technological benchmark in the hydrocarbon sector, achieving high market shares.

My role in this project was to work on the design of the interface of the self-service system. One of the goals of the project was to create a more intuitive and visual platform and also improve the user experience when it comes to refueling.

Client
Alvic

Discipline
UI | UX
Web Design

Agency
Lucid Design Agency




Task Flow


Here we define the logical path that the user must take to perform a task, in this case refuel.
Task flows are very helpful to identify several things:

  • Amount of steps that a user has to take to accomplish a task
  • Identify possible edge cases or scenarios 
  • Possible moments of friction in the user flow




Wireframes


After doing several tests and interviews with users, we realized that one of the resources that was going to help us the most to improve the UX was to use a Chatbot.

We created an artificial intelligence assistant to streamline the entire process and help the user to refuel in an easier and faster way. At Alvic service stations you can not only refuel, you can also pay directly on the platform, buy an item in the store or even buy a ticket to wash your car.
We created the wireframes where we defined the content and the position of the different blocks of the interface, it also allowed us to identify how all the elements interacted with each other.

The advantages of creating wirefames was that,

  • We run multiple versions until we find the right one.
  • We detect and correct problems before, being simple to carry out, it allowed us to expose them to feedback and solve basic problems related to the usability and proposed functionalities.
  • By planning the structure and elements of the interface in advance, it allowed us to offer better usability and have the elements previously defined.




Design System


For me the Design System is not just a classification of components, it is the entire process that is built and maintained to help in the development of user experiences and strengthen a brand.

Those will help to:

Reduce design debt
Without a design system, a product can lose its identity and start looking like a patchwork, creating a disjointed user experience.

Eliminate Inconsistencies
The first task before building a design system is classifying all the visual components within the product.
This will highlight where the biggest inconsistencies within the product are and will help the team to pick the most important and most used elements and components of the product.

Save time
When you build a design system, you will speed up the design process while also build links amongst teams.  The more people are on the same page, the fastest the process is.

“Good design is a language, and when everyone is speaking the same language, that’s when things get done.”





Final Product






︎︎︎ Feel free to write me a message! at irinaaltuna@gmail.com