Braini

A Web Tool App for Developing and Expressing Ideas in an Intuitive Experience, along with a Smart Voice Assistant.
Role:
Creator, UX Researcher, Designer
Tools:
Sketch, Invision, Principle, Adobe Creative Suite
Time:
5 months, 2020
Conducted:
User Interviews
Persona Creation
Empathy map
Journey Mapping
Usability Testing
Full prototype videos
Overview
Braini is web tool app that helps professionals and students brainstorm and develop projects intuitively with a smart voice assistant. This project was done within an interaction design class and this case study shows the process of creating Braini from ideation phase to developed stages of user interface and into a well rounded branded product. This futuristic concept explores conversational UI (CUI) and how the user interacts with the voice assistant/mentor along with the tools offered in the UI itself. All in the goal of creating a more empowering and natural user experience in order to ideate and make choices within a project.
Understanding the User
When we have projects, whether it's for work, a passion project or even a new entrepreneurial product there is a phase where we brainstorm and collect our thoughts. What's the idea and how to distill it to its greatest potential and develop it into many sub ideas and action items. Many of us think and brainstorm differently, some like writing notes, reading, talking to a friend or a co worker or simply all of the above. That part in a project no matter the type presents a wide field of options, thoughts, opportunities and even constraints. Which may lead to confusion, doubt, time and energy squander.
How brainstorming for a project may look like
When ideas pop into our minds developing them can be tricky. The amount of information we have, the possible expertise we may need to attain and perhaps moral support on a human level are all beneficial for a project. Sometimes trusting ourselves is the hardest part and we need something or someone to bounce ideas to and organise our way of thinking while brainstorming. Decisions and choices for our projects from early to later stages can be stressful and even result in energy and time waste, especially when there's a deadline. Getting access to new methods of looking at something from different angles and especially asking the right questions can help and be effective. Trust and perhaps a moral and smart companion can really make a difference, logically and emotionally.
User Interviews - Concept Testing and Feature Ranking
Before designing anything it was important to interview potential personas and learn about the following:
1. Ways of thinking or brainstorming on a project
2. Discussing pain points and issues
3. Potential feature ranking
Testing on 3 people from different professional levels (potential personas).
I prepared cards with potential features and ideas and asked to rank them and interview them on their process and pain points of brainstorming.
Key Learnings:
"The voice can help getting things out, when talking you make connections and talk through the process. It's all embedded in the process of thinking."
Summary of Key Learnings:
The product should accommodate for the different ways users brainstorm (writing, doodling, imagery and more).
Users were intrigued with introducing a smart voice assistant to the product and value conversing as a more intuitive means of developing and brainstorming ideas.
Users prefer being alone while thinking, sketching and developing ideas within a project and need to have the right tools for doing so.
Users expressed how sometimes the process can be confusing and primary ideas are lost along the way so it's hard to keep track of the trail of thought and decisions made.
Users suggested a timeline and loved the idea of mind mapping and using graphic shapes to assist with the UI for breaking down ideas.
Users value flexibility between shifting gears of doing things themselves and using an assistant.
Define
Problem statement
  • Brainstorming and developing ideas in a project can be confusing and lack perspective for professionals and students.
Goals
  • The product should be able to organise ideas and allow keeping a trail of thought that assists with noticing key points to elaborate on.
  • Exploring Using VUI (voice) to create a more intuitive experience that can go hand in hand with existing tools of brainstorming
  • Added value of introducing thinking methods for idea development.
User Persona
After talking with potential users and defining who is the consumer of the product I dived deeper into developing personas and truly grasping how professionals and students work and brainstorm prior to the ideation phase for solutions.
Use Cases
  • In order to narrow down what kind of projects require brainstorming and developing ideas I came up with possible use case projects. I kept in mind there should be an example project to ideate solutions for and eventually be an example project for a prototype so the product features can be best demonstrated.
Presentations
Product Dev
Event Planning
Investments
Personal
Learning
Ideate
How Might We
  • Introduce a smart voice assistant to guide and mentor to the user and gain trust.
  • Create an accessible way to use existing brainstorming users currently use: writing, imagery and more.
  • Let the user control and the smart assistant according to the project and amount of interaction. And to what extent?
  • Create an added value the product has besides the smart voice assistant, perhaps thinking methods?
Narrowing Down
After card sorting and ideating what possible features can answer the problems here are some insights for the design:
1. Existing brainstorming needs (writing, imagery ..etc) - creating a canvas, perhaps similar to current digital 'notebook' products so users can have all the existing tools for keeping a trail of thought.

2. Visualising thoughts both from text and from conversing with the smart assistant into bubbles and graphic shapes would be helpful according to user testing, perhaps in a form of mind mapping for order and clarity.

3. Voice Assistant - like a mentor that guides through the thought process and can have multiple characteristics. This would require additional thought in order to further define the relationship between the user and the assistant.

4. Synthesis - A summary at the end of the project where most of the important points are pointed out and reflected, both from the canvas and the thoughts expressed with the voice mentor.
Defining User VS Braini Relationship
  • Defining the relationship, reliability and archetype the smart voice assistant for the user is important prior to designing.

    Unlike other voice assistants, Braini can approach the user if needed and vice versa. A back and forth, reliable and trustworthy relationship is key.

    There is a 2 way voice interaction and that can be set later in the settings.​General Energy is somewhere between a Magician and Explorer within the 12 archetypes scale.

    Braini is focused on the users goals and assisting for anything that can be achievable. It explores with the user, frames the way but knows when to step back. The reliability on Braini is also dependant on the user's persona.
Introducing Frameworks for Ideation
Strategic Questions -
The power of questions can help us shape and understand our thoughts and decisions such as:
1. Strengthening Questions: How? What? They help us overcome and think actively of a solution. Engaging and require a creative type of thinking.​
2. Weakening questions: Why? Lead to doubt but also can help understand root causes of ideas.
5 Whys -
Asking 5 times why? to trace back to a problem and understand counter measures and solutions. Braini can use these thinking methods to help guide the user for getting to conclusions in a project, in cases of confusion.
6 Hats -
Using different thinking perspectives and energies can be useful throughout the flow. Blue, white, red, black, yellow and green.
Google Design Sprints -
5-6 Steps for product development can be used as a time frame for focusing on different aspect of a bigger project. Helpful for product design projects. Others projects can have different steps but each has its' own main goal and focus.
User Journey
The user's journey from start to end of the experience including the relation between the user's experience and activity of the smart voice assistant through the journey.
Prototype
Features
Smart Voice Assistant
Braini, the voice assistant is one of the key features. Using Ai and NLP for understanding text, conversing with the user and developing ideas together.
Toolbox Canvas
The toolbox on the canvas page enhances the user experience letting the user ideate in more ways besides voice. Some of the tools are: Card note for text, doodle, images, page upload and more.
Summary
The summary consists of 3 main pages at the end of a project. Big overview of idea bubbles which contains the idea flow. One out of three summary screens.
Information Architecture
Information Architecture containing the relevant features and pages.
UI Style Guide
Developing a style guide for the high fidelity UI design. I chose dark mode since i'ts known to be easier on the eyes and enhances focus. Vibrant blue as a color of trust and a clean design approach for keeping the focal point on the thought bubbles on canvas.
High Fidelity UI
A selection of high fidelity UI screen, view prototype videos for full demo.
Test
Usability Testing
After having the high fidelity designs it was important to usability test on 5 users UI, navigation and most importantly relationship with the smart voice assistant. Since I didn't have a full smart voice assistant I created voice memos for the signup stage to introduce to the user. I wanted to see their reaction and how they responded and conversed with the voice assistant.

Key goals for testing:
- Signup Flow
- User relationship with Braini, when and how to introduce the voice assistant
- Basic navigation and UI buttons
Key Learnings
Naming the voice assistant was confusing. Perhaps further steps and UX should be taken if personalisation would be taken into account.
Braini should start interacting with user during signup to create and build an early reliable relationship. A back and forth relationship of conversing and ideating.
Reduce user's ability to decide how Braini should be active. This can be set later in settings.
User is confused on toolbox icons. Might need labeling for clarification.
It was interesting to see how users interact with the high fidelity UI and tasks. On 2 tests I haven't presented a voice memo so it was evidently hard for the user to understand one of the key features and on the other 3 tests it was satisfying seeing the users reaction to a "voice assistant" on the end of signup which even converses and engages with the user.
Demo Prototype Video
This prototype is divided into 4 steps shown in each video, showcasing the UI, UX and the voice aspect of the product. For this prototype the project selected is a product development smart dating app. The user is using Braini to ideate on pain points and issues regarding modern dating apps.
Signup
Introducing Braini to the user on signup was a key learning in the usability testing. The way Briani assists even on sign up is beneficial to building the trust and reliability the user when introducing a complex product.
Onboarding
After the signup, the user has already been introduced with Braini and here it is welcomed to the canvas page, the main ideating board. The timeline of the project (in this case product development - Google Design Sprints), the toolbox feature and Braini.
Brainstorming
During the timeline of the project the user can use toolbox tools such as the text card bubble and talk to Braini to explore ideas and develop them. The relationship here between the user and Braini is shown and tied hand in hand with the GUI.  Braini uses thinking frameworks to assist the user in ideas such as 5 whys and 6 hats to explore different perspectives.
Summary
After finishing the brain flows and timeline this is where the user can review all the ideas explored, ways of thinking and next steps.
Reflections
I enjoyed working on this project even though at first it was confusing to understand how to translate user's paint points into features in this particular product. I learned to continue iterating and checking back in with the user pain points and even talking with more colleagues to constantly shape and strive for a concrete solutions. I also learned a lot from the usability testing I've done with 5 users and how to be flexible with testing modifications to get the best possible insights in a short amount of time. Adding the voice memo really made it satisfying to test and to understand where exactly the user's confusion is coming from, timing and the way the GUI relates with the voice was a very big point which could be fully elaborated separately. I was also thinking about personalisation which I think could be elaborated on a separate case study, however I initially let the user choose a name for their assistant along with the type of energies they think they would need for a mentor, according to their project. Since this was a robust product and many details could be further elaborated on UX wise, I think that could be an interesting challenge for the future.