Atlanti SA. 

Lead Product Designer

We were a team consisting of a project manager, a business analyst, a back-office architect, a front-end developer, and myself. To qualify the needs of the business and the users, we had a referent (Product Owner) at the clients who participated in all the design and development phases. These phases were based on the Agile methodology, therefore in the form of sprints. I was the most involved during sprint 0, like during the workshops and the design of the screens. The following case study shows the work done during this sprint 0.

Context

Atlanti is a private financial company in Geneva that enjoys a very good reputation with its clients. Like many companies in French-speaking Switzerland, it works to ensure that its clients remain loyal and feel well taken care of. Not having a strong presence or management tools accessible to their clients, they could not meet the requirements and needs of their younger and more connected clients.

Methodology

We approached this project in several phases. First, we spoke with experts from Atlanti to understand the challenges of their business. What was interesting to see was that their most important need was to be able to reassure their clients about their investments. Beyond maintaining an account and following the investment fund market, Atlanti's experts advise each of their clients on an investment that suits them. It is therefore important to be able to see this data in the application, which is also in line with Atlanti's DNA, which advocates transparent investments.

In a second step, we were able to draw up an inventory of the expected functionalities and to realize workshops to refine them. In a logic of co-creation and to confront our ideas we invited potential clients to come to a second workshop.

UX Design

The user flows we collected during the workshop phase were central to the design phase. We used them to create the first wireframes that we tested with a select amount of user. After multiple iterations we were able to validate the functional specifications. 

To make this validation process as simple as possible, we created a prototype directly on a smartphone. 

Art Direction

To maintain consistency with the client's identity when designing digital products, it was essential to understand how the brand elements would be applied.

For this reason, we worked with the client's art direction led to establish a list of rules regarding the use of color, typography, and imagery.

The design choices were the result of research conducted at the client's office to capture the brand's DNA. For this reason, we chose to go with a track that reflects the glassy, woody, and luxurious interiors of a thriving company.

Mockups and prototypes

The models were created on Adobe XD following the guidelines and specificity of mobile platforms (devices).

We chose to push an atomic* approach during the design so all the elements (colors, shapes, typography etc..) are connected and form modular components and easy to modify whether in the design tool or in development for new versions.

*”Atomic design” is a product design methodology. See Brad Frost's book "Atomic design". Brad Frost “Atomic design” 

This system design based on atomic design* exists today and is developed on the Flutter framework. 

See the demo here

Validation process

We went through several phases of validation of the model thanks to interactive prototypes. These phases were divided into functionalities and user paths and allowed us to have functionalities ready for development during the design phase and to have a clear "Definition of ready".

Outcome