Smartlets is an online learning platform built to equip kids between the ages of 7-18 years with high demand technological/digital skills that may not be taught in the traditional classroom settings.
.png)
Media Digital Agency (MIDA)
Product Design
August, 2020
The social and economic impact of technology is widespread and accelerating. The speed and volume of information have increased exponentially. Experts are predicting that 90% of the entire population will be connected to the internet within 10 years. th the internet of things, the digital and physical worlds will soon be merged. These changes herald exciting possibilities. But they also create uncertainty. And our kids are at the re of this dynamic change with little understandi
I conducted a meticulous user experience process to ensure that the mobile app is ready for the market and meets the needs of the users
.png)
To get a better understanding of the problem, I conducted 10 user interviews with kids. I chose in-person interviews to better understand my target audience and their individual pain points on a deeper level.
Some of the questions include:
Results
From the interviews conducted, I discovered that many kids had interest in learning a digital skill but were not being taught in school and many existing digital products were built for adults making self paced learning difficult and boring for them. Also it was noticed that many spend their on-screen time playing games and communicating with others.
Personas are fictional characters, which I created based on my research in order to represent the different user types that might use the product. To save time I created one user persona which helped me understand the user needs, experience behaviours and goals.
.png)
User flow forms the skeleton of our product. Visual elements, functionality, interaction are built according to the user flow principles.
Using the structure of the user flow, I designed high fidelity wireframes. It helped me focus on the functionality rather than on visual appearance. Also, I used the wireframes as an interactive prototype to test the usability and logic of the application. The main reason for doing so was to fail early and save time.
.png)
.png)
.png)
.png)
Pain point 1: Users (parent) seemed uncomfortable with having the payment feature first after registration.
Pain point 2: Users (students) found the tab bar boring and needed a bit of fun.
Design solution:
For user 1 (parent), I swapped the payment feature with the Ädd a Child" feature. Therefore after registration the next step was to add a child and then payment was made optional.
For user 2 (students), I changed the UI of the tab bar by adding some motion. This way it was more interesting to navigate through the product.
Smartlets for students included two major features : Courses and Games. However for students below 13 years, an interface was built for parents/guardians to monitor the progress of their kids.
The first thing to focus design effort on was the onboarding process. I had to make it as simple as possible to avoid bad user experience. The onboarding flow included; the splash screen, Registration and Login screens. As well as the email confirmation and forgot password screens.
.png)
.png)
Smartlets provides three basic categories: Design; Coding and IOT (Internet of things). To make it easier, the categories are further broken-down into subdivisions. The content provided are made very easy for the user to assimilate with ease.
.png)
.png)
.png)
Users should feel fulfilled by seeing their progress measured in a visual way. The games and reward will boost the chances of daily engagement and build more retention.
.png)
To monitor and ensure the users progress. Users are given projects to work on for hands-on experiences. Parents are advised to help their wards to complete projects.
.png)
The full project consisted of 33 screens: the splash screen, registration and login (7 screens), the payment screen (3 screens), the Add a child screen (9 screens), course catalog screen (6 screens), game and reward screen (2 screen), notification (2 screens), account (4 screens).
.png)
.png)
.png)
.png)
.png)
I started this design really as a challenge. A challenge for me to handle a clients work, and hand it over to the developers and I’m so glad I did . It is only when you start designing something you begin to notice and understand the intent of design decisions and whys of the product. While designing this project, I realized how important the research stage is.
What are the next steps?
Supervise the development phase of the product and ensure Agile method using scrum is practiced.
Design the product scaling plan (web version)
Develop a comprehensive business model
The video below explains the functionality of the app.