Braav Studio

Case

Silberfuchs – Care App

Context

Onboarding redesign

Rol

UX Design

Tools

Wireframes, Photoshop, Microinteracties, Screenflows, Seduction

TL;DR

Silberfuchs is a German startup set up by BCG Digital Ventures in Berlin. The goal of the startup was to connect seniors with their familiar environment through technology, so that they are less lonely. By developing an app that works with a tracker for the (older) person, they wanted to be the new generation of the home emergency call, for both daily life and in an emergency.

Although the app and the tracker were under development, I was able to make a proposal to BCG for the app during my UX minor. This is to support and / or improve if the app is launched.

Business & User goals

To come up with a good design I started to set goals, for both BCG and the user. I used these goals further in the process to design concepts for the most important micro interactions of the app.

Business goals;

  • Improve care for the elderly and caregivers
  • Allowing people to grow old with pleasure through good guidance
  • Become the largest care app / company in the world

User goals;

  • Being able to properly care for someone who needs it
  • Provide care to the (older) person together with your family, colleagues or caregivers
  • No need to send someone to the nursing home
Redesign

With the set goals I had something to strive for. With my design I should make it possible for the user to achieve his goals. With separate screens this would not work, so I have created use cases that I wanted to work out. My goal with every use case was to get the user a bit closer to his goal. All worked out cases together would finally ensure that all goals could be achieved. Because I worked in the same way with every use case, I describe one of the use cases that I have elaborated here.

Use case – Add a loved one during app configuration

To make the app work for the care and also to connect the tracker for the (older) person, I thought that an onboarding was necessary. Because this would be a very important part, I chose to focus primarily on this. In addition to entering the details of the caregiver and connecting the tracker, I thought that it took a little more than giving the tracker a name, namely adding the (older) person to the care circle that the caregiver will have to create.

The interaction with the app should feel really good for it to work properly and clearly, so I had set some conditions that the screens had to meet.

  • Easy small steps
  • Supporting visual elements
  • An understandable goal for the situation
  • A helping user interface
  • With this list I started working on a concept. I thought up the wireframes, put them on paper and developed a global flow of the app. When the flow was right I went with some adjustments to improve this digitization and expansion.

Because the corporate identity of Silberfuchs already existed, I was able to adopt it nicely during the design process. This saved me a lot of time that I could spend on UX. In this way I have been able to develop the stepping stones, helping colors and visualization of the care circle.

On the main screen of this case with the most interaction, I placed extra focus next to the screen and worked out the micro interaction;

Stepping stones
This was already an element in the current design, but I made it stronger by naming the parts and by using visuals, as you can see from the faces. You can also see the next step.

Microcopy
I have strengthened the microcopy by asking the user a question that the user should think about himself and then want to prove “Do you consider yourself a good caregiver”. In the unconscious, this causes the user to do more to complete this step.

Care circle
Because the care circle is spoken throughout the app, I thought it was important to visualize it, and to use it as elements to interact with and to clarify the process by giving it a context.

Add button
I created the add button because the care circle is now a complete UI element, so it needed a trigger. It is a “rule” to press this add button, otherwise the setup cannot be done care for someone there must really be someone. By haptic movement at a tap, “Feedback” is given to the user.

I have also used seductive principles from Stephen P. Anderson and Chialdini to direct the user more where I want them to be.

Unity
I used this principle by making a visualization of the care circle. This is the main interface element that the user works on during the entire onboarding process. Unity in this design creates an integrated user interface of the care circle in which all elements work together to support the design as a whole. A design is more than individual elements. This principle also continues in the other case.

Pre-suasion
I used the principle for the microcopy. By turning a simple text into a text that tells the user a story and asks a personal question, the user becomes more focused on being a good caretaker for the (older) person.

Reciprocity
I have not really visualized or added this principle in this screen, but more in the entire process of adding the person in the care circle. As a child for your parent or as a caregiver you expect a certain amount of assurance from the person you are going to take care of through this app, the entire onboarding is made very personal for both the caregiver and the (older) person. Because you as a caregiver are visible next to the person you are going to care for in the circle, it encourages you to complete the process.

Chunking
I do not use the chunking principle specifically in this screen, but also in the entire process of adding the (older) person to the care circle to indicate care. Instead of a big task “complete the setup of this app and you can take care of the person”, the process is divided into small steps and I also tried to apply chunking in it.

Learnings
  • Designs by using bussines / users goals
  • Send user by seduction
  • Develop app onboarding
  • Develop screen states

See here some images of other use cases and interactions and possibly also view the entire documentation (14 pg.)

Geraadpleegd

Bring a little psychology to Web design. (n.d.). Retrieved May 15, 2017,

from http://getmentalnotes.com/

How to Use the 6 Principles of Persuasion to Create Landing Pages That Convert. Retrieved

May 15, 2017, from http://unbounce.com/landing-pages/six-principles-of-persuasion-landing-pages/

BJ Fogg, PhD. (n.d.). Retrieved May 15, 2017, from http://www.bjfogg.com/

Olinas Kukkonen. Retrieved May 15, 2017, from http://www.few.vu.nl/~wissen/downloads/seminar/2011_Oinas-kukkonen.pdf

Mischa Koster. Retrieved May 15, 2017, from https://www.dropbox.com/s/5zkov06v6eeadub/2017-04-03%20Gastcollege%20CMD.pdf?dl=0