The points mentioned in this article are nothing but a summary of extensive research around the users’ goals and behaviour, branding, business KPIs, and marketing communication strategy which were used to come up with what losleben has been released to be.
This article is aimed at anyone who is interested in UX & UI creative processes, I hope that with the experience gained through this research some may find some enlightenment towards a more usable and consistent product.
Back to the top
Coming fresh into a company and having the chance to turn everything upside down? Which designer doesn’t dream of that? We love constant change; moving furniture around in our homes, coming up with new concepts that are out of the box, or even changing the whole look and feel of the digital product that your new company has been working on.
Those were the mixed feelings I experienced when arriving at viesure. On one hand, I loved the challenge, the whole new range of possibilities. On the other hand, did I really want to question everything my new colleagues had been working on for the past year? Not the best way to make friends…
Getting to know the users
Although I felt conflicted internally, some facts were undeniable. The soon-to-be-released losleben App required an entire rethink of the user journey and application of the brand assets. Even simple procedures such as uploading an image required a lot of effort and assumptions on the user’s behalf. We were facing a product that lacked the user’s point of view when interacting with it and at the same time had no similarity to the company releasing the product in the first place.
As a result, the design team went back to basics, reconsidering the very first questions all projects must start with:
What are the user’s behaviours when using the product?
What age group are we designing for? Why?
What are their needs? Why?
What are their goals? Why?
What are their desires and difficulties when using the product?
We knew that the younger range of our users were between 35 to 40 years old, which meant paying particular attention to accessibility, discoverability, usability, and short-term memory. Being a product that handled money, our procedures needed to have summaries, edit buttons and kept in mind mistakes could happen and should be discovered far ahead into the process or just after a few taps at the beginning. We needed a flexible flow where the main user could double-check the information provided and change it without any major consequences.
It was there where clear signifiers were established. We were starting off with a medium-low tech-savvy audience, which meant that we needed to stick to common and recognisable practices (Jakob’s Law) in order to benefit from the knowledge the user already possessed and providing effective guidance during the whole process without being intrusive.
Long story short, we needed to flatten the learning curve.
Good cop, bad cop
After shedding some light on how we felt in our users’ shoes, we switched to User Interface & Branding Guidelines. The goal was to explore which possibilities we had in terms of communicating efficiently and consistently through the product and marketing assets to convey the same message to the same audience.
It was there where we found ourselves with an issue that I had personally never experienced before: A RED BRAND. However, surprises kept coming as we noticed shades of grey next to it. That was it! No blues, oranges, or purples… Just red and black, and shades of grey if you wanted to go the extra mile creatively.
During our research, we saw how in the previous product designs green was used as a positive colour for communication success and the primary brand colour was left to communicate any negative messages or mistakes happening inside the product.
The first decision around the branding guidelines was to flip this concept and set our brand red as our success colour. However, how were we supposed to make it happen when red is the reason we wait at a streetlight? How could we turn it into something positive? If red couldn’t be the messenger for bad news or errors, then which colour could it be?
It was here where after a lot of discussions, research and testing we came up with the concept where Black could be a worse colour than red. Black meant darkness, nothingness, and based on this line of thinking, we made black our bad cop when announcing mistakes and failures to our users. This was the main point that helped to pivot the redesign into the right direction.
Eventually, we went for a “minimalistic” approach set on white, grey, black, and our red. Due to limitations in the colour palette, we developed five shades of red for illustrations and iconography to give the design a more humanistic feel. Even though our users were senior, that didn’t mean that our product couldn’t connect with them; we wanted friendly animations that could communicate in a seamless way with the audience and give quick feedback avoiding being harsh or too formal.
What do you think about clicking here?
Another topic which we pushed hard to happen was the testing rounds. Our team knew about the positive aspects of testing a product before its release; the iterative processes as well as quick feedback for quick changes and eventually implementation. However, in the previously designed product, it never seemed the right time. We were always too busy, too flooded with meetings, and testing was continuously delayed and so on…
It was there where we started testing internally; simple and quick tests involving our co-workers and colleagues to give some insight of what their understanding was and what we could improve. Eventually, this was not always a smooth process but it still pointed us in the right direction and shed some light on how to shift the obstacles in the way.
Finally, the app was released in December 2020 and shortly after, we noticed the warm reception coming from our users. Redesigns do not usually start with a happy beginning, users don’t like changes and even less to change themselves. However, in this case, users understood clearly where the changes were coming from and the extra value that they were providing to the main functionalities within the app.
Links of Interest
Share this on
Talent Garden Vienna, 5th Floor
Liechtensteinstraße 111-115
1090 Vienna, Austria
Say hallo
office@viesure.io
Find us at
#creatingtomorrow