Børns Vilkår Smart Assistant for Webchat

Børns Vilkår Smart Assistant for Webchat

Improved Børns Vilkår chat service with an ethical and personalized AI assistant, so councelors have an efficient and seamless experience.

Børns Vilkår Smart Assistant for Webchat


Improved Børns Vilkår chat service with an ethical and personalized AI assistant, so councelors have an efficient and seamless experience.

Platforms

Web

Tools

Miro, Optimal Workshp, Axure, Usability Hub

Timeline

August 2020- June 2021

Platforms

Web

Tools

Miro, Optimal Workshp, Axure, Usability Hub

Timeline

August 2020- June 2021

THE CHALLENGE

Making Børns Vilkår webchat more efficient


Counselors volunteering in Børns Vilkår to give advice and support to kids spend too much time looking for information that helps in supporting their answers and too little time on actually talking with the kids. Moreover, from the 130,000 requests they receive annually, they can assist only 50,000 requests (approx), which means that more than half of the requests are not responded.

How can we then design a solution with a UX approach that help Børns Vilkår counselors during their conversations for two main objectives:

1)  Make conversations (children- counselor) more efficient.
2) Help Counselors in giving more accurate and engaging answers to the children.

Our Users

Børns Vilkår Counselors

My Role

For this project, I had the opportunity to participate in all the stages of the design process, from the Design Thinking workshop with stakeholders, to the research by doing contextual interviews, ideation, information architecture, wireframing, prototyping, and usability testing.

THE KICKOFF

Design Thinking Workshop with Børns Vilkår

NTT Data had the mission to help solve some digital challenges Børns Vilkår (BV) faced in terms of making their processes more efficient while increasing customer’s and employee’s satisfaction through different solutions. 

The starting point for this project was a Design Thinking NTT Data held with Børns Vilkår staff, where both teams found different solutions to develop.

THE APPROACH

Understanding users in their context

The first step into the research was to do some contextual inquiry with  Børns Vilkår counselors, as users of this system. I elaborated some questions for the interviews and helped in conducting them. This allowed me to dig deeper and get a good insight through the users.

The main research goals were to find out more about:

This contextual inquiry was highly beneficial because users verbalized their pain- points and needs while having insights into what they were doing and why they were doing it.

THE DISCOVERY

Some Insights

On average, what percentage of the conversation do you spend on actively conversing and on searching for endorsed information to enrich your answers?

“It depends; if I know about the topic, it can go fast, but that does not happen often. So when it is about issues I’m not specialized in, more than half of the conversation goes to looking for the information we have in our files. Maybe it can be 60% vs. 40% of actual conversation. What happens often is that children get tired of waiting and leave”.

Do you need to leave the chat to find out information, even if it is a topic you know well?

“If it is a topic I am specialized in, I could try to answer myself, although I wouldn’t feel confident enough. It is even worse when it’s about topics I do not know much about… but I always have to look for files, the less I know about the topic, the longer it takes me to search for information, find it, make sure it is the right file and go back to the chat to answer”.

Before conducting the interviews, participants were asked to sign a form, allowing to record the interview for later use in the research stage*. 

DEFINING THE CHALLENGES

300 sticky notes later....

After I was done with the interviews, I created affinity maps for each interviewee. This process helped to analyze and organize the information, which allowed me to get an overview of the findings, identify patterns and crucial topics.

KEY FINDINGS

Long story short

Users feel overwhelmed when having to search for information to support their advice. 

Users would like to have a more accessible way of finding information for advice.

Users feel overwhelmed when having to search for information to support their advice. 

Users digital skills were very diverse. From expert users to novice users. 

Children want & need a warm, empathic adult to talk to. 

CONNECTING THE DOTS

Understanding our users

Based on the information and data gathered during my research, the UX team and I developed a primary user persona. The Novice persona represented the prospective user; this user helped us keep in mind while working on the design. The Experienced persona is quite different, as his digital skills are more developed than the Novice user. He also knows the system better, but I needed a reminder to reach users with different needs and digital abilities.

THE VISION

Designing with AI

Our vision for Børns Vilkår Smart Webchat assistant was to build an AI that can understand children’s problems and look up for guidance material and advice for counselors. 

We made sure that the AI is modelled using ethical principles of counterfactual fairness to ensure that advice and guidance is given in the most ethical way. 

With this system, it is expected that the non-attended calls will decrease by at least 50%.

These percentages represent how confident the AI is in relation to the topic.  

According to this confidence, the AI will show the topic related information so that counselors can give advices. 

THE FRAMEWORK

How we got there

For the project we created our own model. This model combines Design Thinking principles with AI/ ML lifecycle. 

The challenge of making these two models work together was moving back and forth in order to understand our data and pair it with diverse ways to represent it in the interface design.  

We collected several data from Børns Vilkår, which made the project even more challenging. How can we best design a solution with the findings from our research and the data we had from Børns Vilkår. We partnered with our data scientist and created this model, which helped us reframe the problem and envision the solution more clearly.

How the AI works

Every time there is a new conversation, the CIM system will assign an ID to it; each text part sent to the AI is preprocessed and analyzed by the AI model and includes this conversation ID.

The analysis of the AI determines relevant topics of the text part and the AI returns the topics along with the relevant guidance material. This happens during the conversation for each text part sent. 

Regarding storage of information, the cache of each conversation is deleted when the conversation is ended by the child or the counselor. This will send a stop event to the AI regarding that particular conversation and the AI will delete its cache.

What is actually stored, is the trained model. The training data is used to create a mathematical representation of the training data and it is this mathematical representation that is being stored in the AI model, not the training data – the training data is thrown away after training ends.

 

Defining System's Architecture

Another design challenge showed when proposing how to design the architecture of our solution.

Chat
Topic Editor

Users Flow

It was important to think of a scenario the user would be interacting with the chat, and the specific tasks they would want to accomplish. We created a scenario for the Novice User and its user flow identifying the happy path.

FROM SKETCHES TO HI- FI PROTOTYPES

Communicating The Design

NTT Data upholds high standards for the work it produces both externally for customers and internally for team members. This has created a culture that aims to generate trust through accountability, work carefully into details, and invite others to collaborate.

The sheer size of this project demanded me to work into a high level of detail to communicate design decisions and move forward with the work very efficiently. Therefore I created a lot of reference documentation. Also, because of low and mid-fidelity wireframes, I was able to gain meaningful feedback before investing a lot of time in Hi-Fi prototype.

Prototyping was the most effective way to gain meaningful feedback from the team and consensus from stakeholders.

From sketching to Hi- Fi Prototype

Design Specs

NTT Data upholds high standards for the work it produces both externally for customers and internally for team members. This has created a culture that aims to generate trust through accountability, work carefully into details, and invite others to collaborate.

The sheer size of this project demanded me to work into a high level of detail to communicate design decisions and move forward with the work very efficiently. Therefore I created a lot of reference documentation. Also, because of low and mid-fidelity wireframes, I was able to gain meaningful feedback before investing a lot of time in Hi-Fi prototype.

Prototyping was the most effective way to gain meaningful feedback from the team and consensus from stakeholders.

COLOR PALETTE

Bright Red
HEX #F15140
RGB 241 81 64 
100 %

Black
HEX #000000
RGB 0 0 0  
100 %

Turquoise 
HEX #00AFAB
RGB 0 175 171 
100 %

Electric Blue
HEX #007CB4
RGB 0 124 180 
100 %

Titanium White Color
HEX #E4E4E4
RGB 228 228 228  100%

White Smoke
HEX #F0F0F0
RGB 240 240 240  100 %

Suva Grey 
HEX #8D8686
RGB 141 134 134  
100 %

TYPOGAPHY

Arial

To use for headlines and text

AaBbCcDdEeFfGgHhIiJjKkLlMm

AaBbCcDdEeFfGgHhIiJjKkLlMm

AaBbCcDdEeFfGgHhIiJjKkLlMm

ICONOGRAPHY

INPUT FIELDS

BUTTONS AND COMPONENTS

THE VALIDATION

Testing our assumptions

The moment to test our solution arrived. After some series of remote and in-person moderate tests I observed at first hand, hoy users interacted with my prototype. The testing gave me a better understanding of how our users perceive it and what could be improved. During these testing sessions, I identified the parts that worked well and the points where there could be friction and redundant and/ or confusing elements.

THE REFINEMENT

Long story short

What was working well… 

 

  • User find the navigation intuitive.
  • The layout was easy to understand.
  • Colors were just as if it they were navigating on Børns Vilkår system.
  • User interaction was easy to understand.
  • Users were able to complete the task in almost no time. 

What needed to be improved…

Consistency

Make a clear division between general information, the information given by the AI and the advices section. 

Simplicity

Make a clear division between general information, the information given by the AI and the advices section. 

THE SERVICE 

Introducing BørnsVilkår smart assistant

Once a child starts a conversation, the AI starts analyzing the information, it detects keywords and shows percentages representing the topic confidence scores. Once detecting the topic, the system immediately shows information endorsed by Børns Vilkår staff uploaded through the topic editor section. Counselors do not have to leave the system to leave the platform, as they have the information for advice displayed on the same screen; they can answer within no time. 

 

Chat Screen

The AI detects the keywords from the conversation and shows the topic relation. Information related to the topics will show right away so that counselors use that for their answers.

The information is divided into three main classifications:

1. Children’s rights according to the topic.
2. Facts about the subject.
3. Good advice for the conversation. The AI assistant will suggest an advice, that the counselors can edit before sending an answer.

Confidence Scores

These percentages represent how confident the AI is in relation to the topic.  

According to this confidence, the AI will show the topic related information so that counselors can give advices. 

Consistency

Make a clear division between general information, the information given by the AI and the advices section. 

Simplicity

Make a clear division between general information, the information given by the AI and the advices section. 

Topic Editor Screen

The AI detects the keywords from the conversation and shows the topic relation. Information related to the topics will show right away so that counselors use that for their answers.

The information is divided into three main classifications:

1. Children’s rights according to the topic.
2. Facts about the subject.
3. Good advice for the conversation. The AI assistant will suggest an advice, that the counselors can edit before sending an answer.

The counselors responsible for updating the system with endorsed information will add it very easily. They will see the topic list on one side of the screen, while they can add the text on the main screen. They can easily publish, edit or delete the information.. 

LET’S TALK ABOUT ETHICS

Ethical Considerations

Since the ideation, we knew we needed to be very careful with ethics. We  were very worried about three main issues: Give unbiased advice, no direct contact to an AI, privacy. 

  1. We made sure the AI is modelled using ethical principles to avoid unbiased advices by doing constant model testing.
  2. Since the ideation stage we were sure we did not want children to talk directly to an AI.
  3. When children start a conversation they do not have to add name ore any private information, neither the conversation is stored, only the mathematcial representation of the knowledge of the AI in order to make it continuously smarter. 

REFLECTIONS

What I learned

During this project, I worked with many talented people. It was exciting to use my UX/ UI skills in a project like this.  I was surrounded by people who encouraged me to participate and involved me also in some of the back-end activities. For instance, I had the opportunity to test some AI models, transfer some files into XML, and do some testing. I enjoyed working on this project and designing with AI as it brought a lot of knowledge into my career. 

THE GOOD

As a not so experienced Axure’s user, finding how to design with this program was super interesting. I turned out to be very good at it :D.

THE NOT SO GOOD

It was a challenge to understand how the AI worked and how we could use the data and show it in the UI. My mental model was not ready for that 😮 . I even had to make the model representation for BV myself… and yeppp… it took me some time. But hey, don’t the biggest satisfactions come from achieving big challenges?

WHAT I'D DO DIFFERENTLY

Working under two methodologies simultaneously, the Design Thinking and the AI/ ML methodology, was super challenging and fun, which can definitely become easier the next time I get to design with AI.

Paola Núñez Bonilla