UX Case study — Bachennya Rozmovoyu —online platform for training and employment of visually impaired people
Hello, everyone! We are the Teal team. We created and developed the product described in this article for three months. Foremost, we want to thank OffGrid Design School for the incredible opportunity to join the endless world of design under the apparent supervision and assistance of great mentors. Thanks to the support of OffGrid, we got a unique opportunity to conduct the project through all phases of the design process and get an excellent result.
What is our project about?
To make the story short, an offline Ukrainian public (non-profit) organization was located initially in Kharkiv. The primary mission was to improve the lives of visually impaired people. How did they do it? — By training them and support in the employment process.
What did we find out when we first met them?
During their activities, they’ve been facing a lot of problems, for exp:
- attracting new partners for the project who could provide new workplaces for their key audience;
- looking for needed assistance for visually impaired people in education, etc.
As we discovered later, unfortunately, it’s a massive question about employing people with disabilities in our country. And one of the reasons it’s a pure information campaign about social entrepreneurship opportunities and its development from a government side and, at the same time, the lack of costs for such activities from the side of such organizations.
Team composition
And here, we’d like to introduce our team, which worked day and night to create a great design and make some social impact.
Mentors:
Lyubov Kurach — Experience Designer
Ihor Mykhailiuk — Senior Experience Designer
Students:
Hanna Natiahla — Experience Designer
Roman Snigur — Experience Designer
The Process
The project result depends on a well-developed project plan, flexibility to change it anytime, and communication. To succeed, we must create a project plan and estimate our scope as close to reality as possible.
So, here you can see the road map of our design activities for this exact project:
What helped us to build it and to do the proper estimations? — the stakeholder’s interview.
“Difficult to see. Always in motion is the future.” — master Yoda would tell us. But our mentors told us to prepare. And we did so. To have an efficient kick-off with our primary customer, we prepared the agenda for the meeting and assigned the roles of who will be responsible for what. We were interested in the following questions:
- What is the importance of the project?
- What problems are we trying to solve with this platform?
- Who are our potential users?
- What are the potential risks in the development of this product?
- What will be the criterion for the success of our cooperation?
After this meeting, we processed the answers in detail and prepared a follow-up letter to document the main points.
It was essential for us to align the expected outcome with the customer. We shared our brief with Vyacheslav to be on the same page and be sure we could start our process.
Then we created a design brief. It was essential for us to align the expected outcome with the customer. We shared it with Vyacheslav (our customer) to be on the same page and be sure we could start our process.
So, here we got a green light and began our research.
Discovery
Competitors research
We’ve started investigating competitors to understand their activity area better.
As a result, we analyzed 15 from target and related areas, 6 were direct competitors, and 9 were indirect. Among them were both Ukrainian and international organizations.
We also conducted a SWOT analysis and looked over the strengths and weaknesses of Bachennya Rozmovoyu and its competitors.
Business research
We conducted a business study to understand better how the organization functions from the inside.
Namely, we built a Business Model Canvas together with our stakeholders on a bit of workshop activity.
Outcome: determined primary audience.
It’s important to mention that there were 5 categories of audience in total, but the main one has been chosen blind people who need to find a job to ensure a decent standard of living and socialize.
User research
We conducted 7 interviews with people with visual impairments people.
After that, we were able to close issues related to problematic areas of user interaction with a potential product.
At the same time, we conducted a quantitative study — a questionnaire on the actual audience: business, benefactors, partners, and volunteers. We received 25 responses and got respondents for interviews and valuable insights.
Personas
After all the research, we decided to focus on the path of two primary users: blind people and business representatives.
Mental Models
It was a moment of truth. We realized we needed some technique to visualize all the user interactions with the existing product and with each other (their friction points). And this technique helped us a lot to see the complete picture much better.
In conclusion, we obtained the primary user’s relationships with the product and the critical points at which users can turn away from interacting with “Bachenniya Rozmovoyu.”
Flow chart “As is”
After the previous step, we moved on to the user flows of our 2 key groups of users in the current experience.
These diagrams improved our understanding of user interactions sequence in positive and negative scenarios.
As a result of our discovery phase, we decided to design an adaptive website and a separate admin part for it.
At the end of this phase, we held a team retrospective to improve the process.
Stakeholder input in a design process
The first point is that we had a great stakeholder happy to be involved in all activities. It helped us to look at things from his perspective and to look in the same direction all the time.
*It’s important to mention that stakeholders in most situations are business people who do not have enough time for ineffective communication. So, you always need to consider it and schedule meetings in advance with a clear agenda.
On regular bases, we presented and validated all ideas with him. It allowed us to avoid mistakes in future product designs and made our design process much more efficient.
Define Phase
And then, we moved into the Define Phase.
Customer Journey Workshop
The main goal for us in this step was to go deeper into the details of interactions with our product for 2 primary personas. To find out their pain points and to understand how we could improve their journeys.
Our main challenge was conducting this activity with people with visual impairments.
How did we manage it?
- We organized it this way: one of us was the facilitator, and the other one helped people with visual impairments fill out the cards for them.
- In addition, before the workshop, we prepared an agenda with learning materials about the topic, and some of them included links to YouTube videos (we knew after user interviews that it’s easy to understand for them such type of info)
Results:
- 8 members of the workshop from all types of audience
- 5 hours of fruitful work with minimal breaks
- CJM for 2 different personas (business and blind people)
Matrix
After identifying all the pain points of the project and coming up with various features that could fill the product, we realized that we needed to prioritize them since the project’s deadlines were relatively short.
With the help of this matrix, we understood what we needed to do first and second. We also decided that we would describe other features that we will not have time to work on in the recommendation letter for the further growth and development of the project.
Informational architecture
After all the research, it was decided that we would create a website with a separate admin part for the team. So we had to create two information architectures. The leading site will allow users to learn about the content, apply for studies, donate to the organization, and support them as volunteers or partners. The admin part will contribute to updating the content and supporting the primary users.
Flow charts “to be”
To check whether we are moving correctly, we created new flow charts. They allowed us to understand better how we could improve our user journey. As well, it helped us improve user empathy.
Prototyping phase
It all started with low-fidelity wireframes. We outlined the basic structure of the site and verified it through testing. This was followed by the second iteration of wireframes with a better-drawn design and assembled into one large working prototype. At last count, we had ?321312? wireframes.
Testing
Probably, one of the most challenging and exciting stages of the project. Since our potential users are visually impaired, they could not see our site. And the prototypes in Figma do not allow navigation using screen readers. So we decided to conduct testing in the form of a role-playing game. One of us was the facilitator of the meeting and issued tasks to our users, and the other was responsible for the role of the screen reader and helped navigate the site in imagination. With the help of such testing, we got exciting results and found places where the site needs to be improved. The best compliment for us was the comment from one of the test participants:
“Thanks, you conduct great and an important work! You immersed me in the process so much that it seemed to me that I really visited a real website!”
Visual design
It’s important to say that Bachennya Rozmovoyu didn't have branding on which we have to rely on in our UI. The reason why we prepared a mood board and presented it to our stakeholder.
Crutial thing in our mood board was the accessibility of colors. So, we had to look over a lot of colors options and to check if they are accessible and suitable for our website.
After long research, mood board preparation, accessibility check and approving it with our stakeholder we moved to UI kit preparation and realization of out last visual part.
It’s important to mention that our design considers availability of changing colors for the people with different level color blindness.
Also, website will be accessible not only for the people with visual impairments, but also for the people with other type of disabilitites.
Summary
In general, we managed perfectly and on time. The stakeholder was satisfied and continued the implementation of the project. We stay in touch with him to help with specific issues. We want to thank OffGrid Design School for the opportunity to join the program, work, and learn new things in a great community. Special thanks to all team members who worked on the project and everyone who contributed to the creation of this article.
