Deep Learn app and website
Project overview
The product:
Deep Learn is the company that provides quality tutoring system with video calls, repeating the material and interactive quizzes. Students can study any time they free and also ask questions. The main cathegory of users are college students and people who are prepearing to enter the university.
Project duration:
August 2023- September 2023
The problem
Very often students are in need of additional explanation and effective system of study, so they could see the progress more quickly due to tight schedule.
The goal
Design the app that will help students to study effectively and in their comfortable schedule.
Understanding the user
User research: summary
I created an interview questions besed on experience of a group of people who are studying at the moment. During a usability study I learned that the tutoring isn`t aviable at the same level for different people. Most tutors are teach in person in cities or online tutoring is too expencive and isn`t very reliable because you don`t know the person.
Personas
Persona: Janet, problem statement:
Janet is a busy student which lives in countryside who needs access to quick and effective tutoring through her phone and track her progress because she often busy while riding home from the city and sometimes has a bad internet connection
Persona: Sam, problem statement:
Sam is a working adult who needs to study new subjects on his own time and get motivation to study because He works full time and wants to go to the university
Competetive audit
The competitive audit provided the overwiew of competitors strengths and weaknesses, also I found some interesting solvings for the search and navigating systems
Ideation
I did a Crazy Eight exercise for ideation. My main focus was on learning what functions of app would be useful for people and suitable for the main users group.
Starting the design
Digital wireframes
The user cabinet was created with the goal of comfortable tracking of the process and always having a flexible schedule
Low-fidelity prototype
To conduct a usability study I needed to create a low fidelity prototype. For the app I created more standart view of wireframes, on the opposite side I had the ready components for the desctop version, so I made it a little more detalised.
Usability study parameters
The product:
Study type:
Moderated usability study
Location:
Kyiv, Ukraine
Participants:
5 participants
Length:
10-15 minutes
Usability study: findings
1
Navigation bars
I decided to make some elements in the upper part of screen tagged to their place, so they are always visible
2
Not defined main action
The booking button isn`t easy to find, so I needed to make it stand out.
3
Too many options in buy lessons section
To make the main action more clear and the opportunity to stop sudying and returning money always under hand I needed to move this option to the menu section.
Refining the design
Mockups
Mockups
First insight was to make the main action more clear on the page. Mockup on the right demonstrates how the emphasizing of the element was improved.
Additional changes were for the upper menu bar. I added white background so it appears while scrolling. Also I removed some elements like upper frames on photo to create more space.
High fidelity prototype
Accessibility considerations
1
High contrast icons and text (in comparisson to the background)
2
Text hierarchy and clear names, so the screen reader could read it easy.
3
Added subtitles and video script for the lessons
Responsive design
Sitemap
After creating an app I started thinking on information architecture of the website. It has a few options that are not represented in the app because the app was designed specially for studying purpose, while website provides opportunity of job searching. That is why it has a little wider structure.
Responsive design
The responsive website includes screen variations for desktop, tablet and smartphone. I made some changes to keep the website recognizable and the text clear.
Click the prototype)