Linx4

Customer

interface

Mockup_Contracts.png

Context

Linx4 is a fast growing StartUp in Austria. They provide a new flexible way of equipment financing, which offers significant benefits for equipment buyer and equipment builder enabled by Industrial IoT and new equipment investors. One of their main products is a Pay-per-Use financing calculator and as they are quickly growing, they wanted to improve this calculator and the customer interface which is linked to it.

The only restrictions was that they wanted the bubbles of their existing homepage included. The focus was mainly on the UI part with a bit of UX.

Duration

4 weeks

Role

Research

Ideation

Low-fi/hi-fi UI

Team

Fritzi (bootcamp colleague)

Tools

Miro

Figma

Problem

On the one hand Linx4 asked for a super modern and stunning design to impress investors and new potential customers, on the other hand they wanted a user friendly design for their target group. Their target group is +45 years with a strong economy background, but not that big digital knowledge. So far they have a lack of customer feedbacks.

Goal

To create a modern, functional and user friendly product within 4 weeks. For a variety of people. Also a recognition value should be included. 

Research

At the beginning the focus was on diving into this topic to understand Linx4, their product and the target group. Therefore we started to study several information documents and the website of Linx4. As there is no comparable competitor we focused on seperate fuctions as a calculator, charts and input fields. We also did a big research on what will be the trend for the next years, as they wanted a super modern solution. We also scrutinized the status quo of the existing interface and its structure.

Research Highlights

Structure

After the first Kick-off meeting, it was clear that their interfaced grew randomly by just adding new features. This was not an obvious problem for Linx4, but for external people who are using the product the first time. 

To get an overview we rebuild and visualized the information architecture. So we found out, 

- that the data administration is not clearly structured

- the wording could be miss understood

- that there are submenues with no other options

Bildschirmfoto 2021-01-26 um 09.20.57.pn

Old

Bildschirmfoto 2021-01-26 um 09.27.51.pn

New

Trend

Caused of the high demand for moderness, a big focus was on trend research. We decided for glassmorphism.

Because on the one hand it is modern and colorful and on the other hand it is clean and fits for tables. But I woun't explain you now the benefits of glassmorphism ;)

Bildschirmfoto 2021-01-26 um 10.32.20.pn
Bildschirmfoto 2021-01-26 um 10.32.26.pn
Bildschirmfoto 2021-01-26 um 11.43.13.pn

First concept

For the first concept we made a Miro moodboard to make sure everybody is on the same page.

As mentioned, we focused on

- moderness

- a clear structure

- creating a clear and userfriendly table structure

- glassmorphsim

- stand out design

- bubbles

Besides that Linx4 decided to just have a desktop version,

because their customers update the data 95% there.

bubble.png

Prototyping

For our first low-fi prototype we did some pen&paper sketches. After discussing our first ideas with Linx4 we improved some things and created wireframes with Figma. 

Pay-per-use_wireframe.png
Tabelle_1.png

We continued prototyping with Figma. It was a repetitive process and we were nearly daily in contact with Linx4 to include as much feedback as possible. So we were going through several versions:

Welcome_1.png
Welcome_2.png
Welcome_3.png
Welcome_4.png
Welcome_5.png

During the welcome-screen-process we changed:

- the color combination, but always kept the purple of Linx4

- the position of the bubbles

- font sizes and colors to improve the readability

- button sizes and shapes to have round edges to keep the consistency

Tabelle_1.0.png
Tabelle_2.png
Tabelle_4.png
Tabelle_3.png
Tabelle_5.png
Tabelle_6.png

During the tabele-screen-process we changed:

- improved the demarcation and readability between the rows

- we added signal colors to get an quick overview

- changed the side menu

as above:

- the color combination, but always kept the purple of Linx4

- the position of the bubbles

- font sizes and colors to improve the readability

- button sizes and shapes to have round edges to keep the consistency

Design solution

After several feedback rounds we decided for a white background with purple/blue bubbles and a bubbly glassmorphism design.

We also focussed on a clear data output.

Reflection

📈  we were able to develop an efficient and outstanding process

 🎤 Linx4 had a lack of existing feedback from their customers (e.g. service hotline, customer service etc) and there was no possibility to interview them. The things we created are mostly based on assumptions.

🔄 so far it was not possible to test the assumptions we made. We hope, in the future we receive feedback from their customers.

🏝  as the project was tightly scheduled and their front end developer was on christmas holiday we missed at some points the exchange with him.

👯‍♀️  working with another person makes things much easier and so the quality of the result increases.

🆒 the permanent exchange with Linx4 (nearly daily) helped to satisfy everyone.