February, 2018
Speekify – iOS app for practicing languages
Speekify iOS app is a part of the whole Speekify project. It has all the functionality of a web version. Main workflow is the same, UX/UI is adapted in order to fit iOS guidelines.
Main screens of Speekify's iOS app
After the app is installed, a user sees "Intro" slider that describes how to use the app. An instruction is very short and describes the process in general. All the illustrations used in Speekify project are mine.
Intro slider with four steps instruction
Language and course selection
A user can choose a language he wants to learn and a course inside. We have two languages ready and two courses in each of them so far. But in the future I wish we add a lot more languages and courses.
So the goal was to make this pages look not quite empty while there are only two options but they should remain useful when we have more courses in the future. So I used big cards with icons for languages and even bigger cards with illustrations for courses.
So the goal was to make this pages look not quite empty while there are only two options but they should remain useful when we have more courses in the future. So I used big cards with icons for languages and even bigger cards with illustrations for courses.
How to choose a language and a course
Lesson
The main part of the app is a lesson. It consists of three steps – listen and repeat an audio track; make a recording; get a result and listen the recording side-by-side with the original track.
I divided it into different screens in order to give a user only one CTA (call to action) button at a time. E.g. on the first screen a user should listen to an audio track. After he has listened it, the "Make a record" button appears.
On the recording step, there is again only one CTA button. If a user wants, he can return to the training using a navigation bar. After a user gets his result he can move forward to the next lesson.
I divided it into different screens in order to give a user only one CTA (call to action) button at a time. E.g. on the first screen a user should listen to an audio track. After he has listened it, the "Make a record" button appears.
On the recording step, there is again only one CTA button. If a user wants, he can return to the training using a navigation bar. After a user gets his result he can move forward to the next lesson.
Lesson steps in Speekify
Progress, about, profile and other pages
One of the frequent mistakes of people who learn languages – is to hurry to absorb more and more content during one day. While doing it they get tired and can't find the motivation to proceed to learn tomorrow. It's better to study for a short period of time but every day.
So we made a mechanism that prevents a user from passing more than three lessons a day.
The "Progress" section shows all the course lessons and a user's progress. It motivates a user to finish the course after he starts it and shows a progress. Here I use a gamification technique – show a medal, cup or diamond if a user has a high score for a lesson.
So we made a mechanism that prevents a user from passing more than three lessons a day.
The "Progress" section shows all the course lessons and a user's progress. It motivates a user to finish the course after he starts it and shows a progress. Here I use a gamification technique – show a medal, cup or diamond if a user has a high score for a lesson.
Enough for today page, progress, about and profile sections
The "About" section contains FAQ. Users have a lot of questions about the method itself – how long they should practice, what if they don't understand the meaning of all the words, what result is good and what is bad and so on. Here in FAQ I give short answers to this questions.
On the "Profile" page a user can change interface language and log out from the app. Later we're going to add several more settings here.
The first version of the App – basic functionality – is published in the App Store.
On the "Profile" page a user can change interface language and log out from the app. Later we're going to add several more settings here.
The first version of the App – basic functionality – is published in the App Store.
Olga Shavrina
Product manager. Human being