UX Case Study: Wise—electronic document management system for schools (DesignSpot School).

Anastasiya Homanava
DesignSpot
Published in
9 min readMay 12, 2022

Hi! My name is Nastya, I am a graduate of the DesignSpot School mentoring program. In this article I will talk about my training project, share the key activities and difficulties I encountered during my work.

You can read the article in Russian.

Wise Mobile App

About DesignSpot School

DesignSpot School consists of 3 stages, with each stage proceeding on a competitive basis. The final step of training — mentoring program under the guidance of experienced designers. I was lucky to get into a team with Gleb (Gleb Khorunzhiy) and Yulia from EPAM Systems. The training was held jointly with other students, we had meetings, discussed problems, gave each other advice and feedback, organized online workshops, where we brainstormed ideas, but each of us developed his or her own project. The main goal of the mentoring program is to create a real product from scratch.

Our team presentation on YouTube

Why such a “boring” topic?

The topic of the project was not chosen by chance, I wanted to find a solution to a real-life problem. I did Desk Research in the chosen domain — I studied forums, talked to teachers and found out that they spend a lot of time on paperwork — planning, creating and submitting reports.

Design Process

The Design Process was built in accordance with the modules at the DesignSpot School.

Design Process
Design Process

1. Discovery

Discovery

I conducted initial data and analysis to understand the project in detail through Desk Research. Mentors acted as stakeholders throughout the work, and I held a Project-Kick-off with them to determine a common vision for the project. Then we had online meetings 2 times a week with the entire team where we discussed the results of each stage and got feedback and approval from the customers (mentors).

Online-meeting
Meeting with a team, we called “UX GYAVA”

So… Let’s begin!

Why does the problem exist?

Initially it seemed to me that reports were invented only to complicate a teacher’s life — the whole process looked rather “excruciating”. But later it turned out that record keeping should improve the quality of the educational process. Unfortunately, the existing scenario isn’t the best solution.

Who will use the service?

The target audience is teachers, social educators, and school administrators — all of whom need to work with documentation. Everyone involved has their own fears and pains, but they all boil down to the fact that reporting creates a problem that needs to be solved.

Interviews
Complaints from teachers on forums and social networks

How is the problem solved now?

I analyzed the report-writing process in order to understand what the future service should look like — this was the most difficult task, since there are really a lot of reports and they are all different.

To make a report, the teacher has to “google” templates and re-structure and duplicate information each time. The report-writing process can take several hours, and often the teacher has to do it after hours instead of taking time off from work or spending time with family.

Desk Research
Teacher need to “google” how to write a report

I found out that the reports may vary from school to school, but must strictly adhere to the recommendations of the Ministry of Education, which helped me find a solution to the problem.

Success Story

The service will carry out Digital Transformation and completely eliminate paperwork. It will simplify the process of reporting, thanks to prepared templates. All information will be stored in a single database of the school. The management will be able to view teacher reports, track progress statistics, and find ways to improve the educational process.

Restrictions

  • Complicated structure of the learning process
  • Large number of reports
  • Necessity to submit reports to other organizations
  • Different reports for different target audience groups

Design Principles

  • Reliable — protects the data of the educational institution
  • Easy to learn — the service with a low entry threshold for the most inexperienced users
  • Understandable — the service for users of any age, with the correct hierarchy and inclusion of only necessary functionality
  • Useful — it will help to organize the learning process and improve its efficiency thanks to the progress statistics
  • Convenient and mobile — the development is carried out for all devices, so as not to create limitations for users

2. UX Research and Analysis

UX Research

After conducting Desk Research and compiling a UX Brief, I formed hypotheses to test them in UX Research.

Hypotheses
Hypotheses

I chose the most effective research methods for my project — User Interviews and Field Studies. Who can give the most information if not the users themselves?

User Interviews

I conducted 2 iterations of user interviews with 11 respondents, all of whom represented the target audience for the future service.

  • The first iteration helped explore real user problems.
  • The second iteration helped to examine the structure of schools, the relationships between staff members, and how reports are now generated.

Field Studies

I talked to one of the respondents at his workplace — the teacher wrote a profile of the student with me, showed different kinds of reports and was happy to share pictures of other documents. This helped me to look deeper into the problem, as well as to refine my ideas on how to improve the process.

Interview Findings
I received more than 50 photo documents from respondents

I analyzed user responses using Affinity Mapping and identified the key insights.

Key Insights
Key Insights

Personas

As a result, I identified 3 key Personas:

  • Teacher (class teacher)
  • Vice-principal
  • Social pedagogue

I paid attention to the persona of class teacher — Olga, because she has to make more than 100 reports per year. That is why it was decided to work on the main scenarios for this persona in scope of DesignSpot.

Key Persona
Key Persona
Secondary Personas
Secondary Personas

Also, I compiled custom scenarios for my Persona to see what steps might cause problems for users.

UJM or CJM?

The next tool that helped me was Experience Map. It was important to decide on the right type of map. I chose User Experience/Journey Map because, unlike Customer Journey Map, it is more flexible and better suited for my service.

User Journey Map
User Journey Maps for Key Persona

3. Ideation, UX Design & Prototyping

Prototype

After researching the audience, I built a Service Map and began working on Prototypes, from paper sketches to clickable prototypes. I worked through the prototypes for 3 key scenarios of my Persona. I used them throw the testing phase.

Desktop vs. Mobile?

During User Interviews, I found out that my Target Audience is more likely to use a phone than a computer. Some teachers don’t have any devices other than a phone at all. I also learned that my users use mobile apps — Viber, Google, OK, and email apps.

Since time on the project was limited, I decided to use the Mobile First approach and develop a mobile app that would grow into a web service in the future.

4. User Testing & Prototype Improvement

Wireframes
Wireframes

Possible problems in the prototypes were identified and hypotheses were formed that needed to be tested. I conducted:

  • A pilot testing session to discover flaws in the prototypes and scenarios themselves, after which I changed the service architecture and redesigned the prototypes.
  • Usability testing, for which respondents were prepared with 4 basic tasks. The testing was iterative until they were able to cope with them without significant problems.
Home Screen changes
Home Screen changes

During testing, users had some difficulties with the passage of the scripts, so repeatedly changed the architecture of the service, the main application screen and some functionality.

Items Deleting
Deleting Functionality

Only in several iterations of testing was it possible to refine the prototype to the final result.

5. Visual Design

Visual Design

So, we are approaching the final result.

I’ve worked through a few moodboards and tested the most successful options on users, stakeholders, and the team with A/B testing.

Moodboard
Option 1
Moodboard
Option 2

Respondents preferred Option 2, although it offers quite bright colors, it was important to me to keep the service concise and not distract users from important tasks.

Prototype vs. Visual Design
Prototype vs. Visual Design

UI-Kit

To simplify the work on the visual design, I started with the selection of basic colors, typography, icons, and illustrations. Then I worked out the basic elements — buttons, instances, checkboxes, and so on. I assembled it all into components and made a UI-kit. This helped me reduce the time it took to draw all the screens of the application.

UI-kit
Part of the UI elements of the application

As part of the mentoring program, I had time to fully draw 34 screens, which allows you to pass three scenarios of my persona — Olga Viktorovna.

Visual Design
Visual Design

Create a lesson plan

To check the result, let’s put ourselves in Olga’s shoes and consider one of her scenarios.

In a week’s time, Olga has a public lesson to teach. She needs to create a lesson plan and remember to add a presentation. Olga wants to make sure the plan is successfully submitted.

We first enter the app, where we are greeted by onboarding, after which we see the main screen.

Scenario 1
Onboarding

We need to make a lesson plan — okay, lets choose the right action.

Scenario 2

Then we have to choose the type of lesson and fill out the form. And that makes sense, doesn’t it? When you successfully fill out the form, the system tells you that the plan has been submitted. You can look at the result — all the information is in place, the media files have been added, which means we did the job. Yay!

Scenario 3
Creating Report and View the result

Conclusion

As a result of the mentoring program, I got a service that will completely change the process of working with documents and really solves the problem of the teacher and makes life easier for all participants in the educational process. We will replace paper and flash drives with convenient electronic forms.

Gratitude

Thanks to the DesignSpot School, I got real design experience, learned a lot of useful tools, and understood how to correctly and systematically approach the task at hand.

Thanks to my mentors who helped me stay on the right track. Thanks to Nikita Zenchenko and everyone associated with the school for such invaluable work!

Thank you for making it through this article. See you again :)

Wise

--

--