Mobile application for learning English
Programs that were used
I was approached by a client to assist in creating the framework and design of a mobile application for learning English through series. The application's ability to sort words by series is an interesting feature that enables you to select series related to a particular subject and learn the language in a targeted manner (for example, the lexicon of the series "Doctor House" is perfect for doctors, because there are many specific medical terms used there).
The decision of which colors to use for the design emerged during its development. A dark mode is appropriate for cinematic themes, whereas a light mode is appropriate for learning. The design was split into light and dark as a result.
The application allows the user to:
search for series by your favourite genre
adding words to dictionary and track the development of learning words
tracking the development of one's understanding of the series' texts
listen to cues with the chosen word
practice words (2 different trainings game)
statistics for the results
Stages of work
The prototype was developed using around 40 different wireframes. The prototype was developed in figma. Users were able to test the usability of the UX design after all the settings were finished. A few minor adjustments have been made. The prototype was generally welcomed.
The process of developing a UI design started after the prototype had undergone testing.
The header of the home screen displays the user's progress: a card for the number of words he has learned, a card for the number of new words he needs to learn, and series he is presently learning. There is a progress indicator for the study on the series' image. The header of the screen shrinks and only shows the cards as you scroll.
The feed below displays the available series, broken down by genre.
The navigation bar has a "Catalog" button. We'll talk more about the catalog later.
The bottom menu consists of 5 parts: main screen, favorite series, dictionary, trainings and profile.
Following registration, the user is presented with three onboarding screens that include a synopsis of the program. The user can rapidly comprehend the benefits of this software solution thanks to the introduction onboarding process. This is useful and visually pleasing information for the user.
The catalog makes it easy for the user to locate the required series. Series can be filtered by genre in the collection, and there is also a series-name search option. In the series card, the user immediately sees the rating of the series according to the IMDb version. Additionally, the card has two different types of icons: an eye denotes that the series is still being watched, and a medal denotes that the study of the series has been finished.
The user can add the series to the "favorites" category.
Card words and a translator were the two methods of word training available at the time the concept was conceived.
By using cards, the user learns words. He sees a card with an English word on the screen, but no translation. The user can listen to how this word sounds. The user flips the card over if he is uncertain of the word. All of the word's details are listed on the card's back side, including the word's form, translation, series and episode from whence it was added to the dictionary, and there is also a timestamp of the time when this word appears in the series. The user sees a phrase containing this word when they choose a timestamp.
The user has the option to hear the word and select the appropriate translation. The user can use the hint, which describes this word with synonyms. The user will see this term written after selecting an answer, and he will also have access to information about which series this word and a related sentence from that series featured in.
The dictionary contains all the words that the user has ever wanted to learn. The dictionary is equipped with a search field by the name of the series. Each word has a status by which you can sort "new words", "in the process of learning", "learned words".
The user has the opportunity to choose certain words and send them for training or change word's status
The user can pick a specific episode of the series to learn words from. The study takes place according to the "Word Flashcards" training method, but there is a certain difference. First, the user sees the whole collection of word cards at once. Second, user can also group words according to their type, for example, learning only verbs or only nouns.
Words from the episode
There are two sections on the profile: my activity and settings.
Tab "My activity"
The user's activity is shown in the "my activity" area by day, week, or month. This page also shows records for the most words learnt in a day and the longest period of daily study. Generalized statistics on word statuses are also shown: how many words have already been learned, how many words are being studied, and the number of new words. The previously studied series are displayed below.
Most design of the application is made in dark mode, but the educational part is made in light mode.
Customer feedback on freelancehunt
The work was divided into 2 parts:
Development of a mobile application prototype:
"Olga is a pleasant person to talk to and a professional with a lot of interesting ideas. During the development of the prototype, we were constantly in contact and discussed features and changes. Everything was done within the stipulated time. It was a pleasure to cooperate"
Mobile application design:
"Olga did a great job with the assigned tasks, was always in touch and tried in every possible way to do everything well. She constantly offered new ideas, many of which we added to the project. Everything was done within the stipulated time. Thank you, Olga, it was a pleasure to cooperate.