FLYER for Teachers app
FLYER for Teachers app
Manage Classes and Students with Ease, Anywhere, Anytime
Manage Classes and Students with Ease, Anywhere, Anytime
Following the launch of the Teacher Dashboard, which has greatly assisted teachers in managing English learning and test preparation through the FLYER app, FLYER released a mobile and tablet management app for teachers on May 31, 2023.
This app aims to support teachers at over 700 centers using FLYER for student test preparation, making it more convenient than ever to monitor and assign homework via their phones.
FLYER Teachers app
A powerful tool for teachers and schools
FLYER Teachers app
A powerful tool for teachers and schools
FLYER Teachers app
A powerful tool for teachers and schools
FLYER Teachers app
A powerful tool for teachers and schools
FLYER Teachers app
A powerful tool for teachers and schools
FLYER Teachers app
A powerful tool for teachers and schools
FLYER Teachers app
A powerful tool for teachers and schools
Roles
Roles
Product Owner
Sole User Experience (UX) Designer
Sole User Interface (UI) Designer
Interaction (IxD) Designer
Visual designer
Product Owner
Sole User Experience (UX) Designer
Sole User Interface (UI) Designer
Interaction (IxD) Designer
Visual designer
Project specifications
Project specifications
Duration for UI Design: 1 week
Duration for launching 1st version: 6 weeks
Tools:
Figma
Photoshop
Illustrator
Lotties
Duration for UI Design: 1 week
Duration for launching 1st version: 6 weeks
Tools:
Figma
Photoshop
Illustrator
Lotties
Deliverables
Deliverables
Product Design:
Empathy user: User personas
Competitive analysis
User surveys and one-on-one interviews
User journeys and task flows
Site map
Low-fidelity wireframes
High-fidelity mockups and prototypes
Usability tests
Visual design:
Logo mobile app
App Store Previews and Screenshots
Product Design:
Empathy user: User personas
Competitive analysis
User surveys and one-on-one interviews
User journeys and task flows
Site map
Low-fidelity wireframes
High-fidelity mockups and prototypes
Usability tests
Visual design:
Logo mobile app
App Store Previews and Screenshots
Overview
Overview
Overview
Overview
Interviewing teachers who use the desktop Teacher Dashboard, we discovered their struggles and needs for easier, more convenient solutions. Teachers are busy with lesson planning and grading, and after work, they are occupied with family responsibilities. Many teachers in Vietnam are not tech-savvy, making it difficult for them to track student progress, assign homework efficiently, and monitor multiple classes. These challenges cause inefficiencies, miscommunication, and can impact the quality of education. The problem is even greater in larger education centers with multiple branches. To address these issues, we developed the FLYER Teacher Mobile App
Interviewing teachers who use the desktop Teacher Dashboard, we discovered their struggles and needs for easier, more convenient solutions. Teachers are busy with lesson planning and grading, and after work, they are occupied with family responsibilities. Many teachers in Vietnam are not tech-savvy, making it difficult for them to track student progress, assign homework efficiently, and monitor multiple classes. These challenges cause inefficiencies, miscommunication, and can impact the quality of education. The problem is even greater in larger education centers with multiple branches. To address these issues, we developed the FLYER Teacher Mobile App
Challenges
Challenges
Teachers often don't have a laptop or PC readily available.
Finding important insights about classes and students takes too much time.
Non-tech-savvy teachers struggle to check student homework.
Large education centers struggle to manage teachers and branches
Teachers often don't have a laptop or PC readily available.
Finding important insights about classes and students takes too much time.
Non-tech-savvy teachers struggle to check student homework.
Large education centers struggle to manage teachers and branches
Proposed solution
Proposed solution
Develop a multi-device app.
Create an interface that visually organizes data and presents relevant options, personalizing the user experience and saving time.
Design a user-friendly interface for non-tech-savvy teachers.
Develop a multi-device app.
Create an interface that visually organizes data and presents relevant options, personalizing the user experience and saving time.
Design a user-friendly interface for non-tech-savvy teachers.
Understand Users
Understand Users
Understand Users
Research - Interviews
Research - Interviews
Working with Customer Success team and Sales team to do interviews through chat and calls to all the teachers who are using Flyer teacher dashboard. Asking customers about
Their experiences with the FLYER desktop dashboard
Their thoughts, actions before, during, and after using desktop dashboard
Their feeling about those experiences
Asking if they are using other similar products and how is that experience.
Working with Customer Success team and Sales team to do interviews through chat and calls to all the teachers who are using Flyer teacher dashboard. Asking customers about
Their experiences with the FLYER desktop dashboard
Their thoughts, actions before, during, and after using desktop dashboard
Their feeling about those experiences
Asking if they are using other similar products and how is that experience.
Targeted users
Targeted users
Based on our research and interviews, combined with our experience developing FLYER products, we have decided to focus on:
Teachers and school admins using FLYER to teach and practice English with their students.
Parents who want to track their children's studies and receive daily notifications through the app.
Based on our research and interviews, combined with our experience developing FLYER products, we have decided to focus on:
Teachers and school admins using FLYER to teach and practice English with their students.
Parents who want to track their children's studies and receive daily notifications through the app.
User personas
Phuong Thao Tran
Age
34
Gender
Female
Occupation
Middle School English Teacher
Location
Hanoi, Vietnam
I wish I could see my students updates faster
Brief story
Thao works as a middle school teacher at a public school in Hanoi. She uses FLYER to teach and prepare her students for exams. Thao often checks her students' performance after school, but she doesn't have a laptop or PC at home. This means she has to wait until the next morning to review their progress. Thao wishes FLYER offered a solution for quick updates on her students *Thao is a fictional teacher, created based on real user insights.
Goals
Get updated if students submit a test/homework
Keep tracking students & classes without a laptop or PC
Frustrations
Can’t open dashboard at home
Need to wait to see updates
User personas
Phuong Thao Tran
Age
34
Gender
Female
Occupation
Middle School English Teacher
Location
Hanoi, Vietnam
I wish I could see my students updates faster
Brief story
Thao works as a middle school teacher at a public school in Hanoi. She uses FLYER to teach and prepare her students for exams. Thao often checks her students' performance after school, but she doesn't have a laptop or PC at home. This means she has to wait until the next morning to review their progress. Thao wishes FLYER offered a solution for quick updates on her students *Thao is a fictional teacher, created based on real user insights.
Goals
Get updated if students submit a test/homework
Keep tracking students & classes without a laptop or PC
Frustrations
Can’t open dashboard at home
Need to wait to see updates
User personas
Phuong Thao Tran
Age
34
Gender
Female
Occupation
Middle School English Teacher
Location
Hanoi, Vietnam
I wish I could see my students updates faster
Brief story
Thao works as a middle school teacher at a public school in Hanoi. She uses FLYER to teach and prepare her students for exams. Thao often checks her students' performance after school, but she doesn't have a laptop or PC at home. This means she has to wait until the next morning to review their progress. Thao wishes FLYER offered a solution for quick updates on her students *Thao is a fictional teacher, created based on real user insights.
Goals
Get updated if students submit a test/homework
Keep tracking students & classes without a laptop or PC
Frustrations
Can’t open dashboard at home
Need to wait to see updates
User personas
Phuong Thao Tran
Age
34
Gender
Female
Occupation
Middle School English Teacher
Location
Hanoi, Vietnam
I wish I could see my students updates faster
Brief story
Thao works as a middle school teacher at a public school in Hanoi. She uses FLYER to teach and prepare her students for exams. Thao often checks her students' performance after school, but she doesn't have a laptop or PC at home. This means she has to wait until the next morning to review their progress. Thao wishes FLYER offered a solution for quick updates on her students *Thao is a fictional teacher, created based on real user insights.
Goals
Get updated if students submit a test/homework
Keep tracking students & classes without a laptop or PC
Frustrations
Can’t open dashboard at home
Need to wait to see updates
Define User needs & goals
Define User needs & goals
Define User needs & goals
Phuong Thao Tran
Phuong Thao Tran
Journey Map
Journey Map
Journey Map
Thao is a teacher in Tue Duc school, she often uses Flyer dashboard in desktop to track and follow, also assign tests to her students every day.
We make some interview through chat with her to ask about her journey using dashboard to manage classes, students also assign tests
James is a parent of two school-aged children who values education and seeks the best tools to support his children’s learning. He frequently researches educational products online.
TOUCHPOINTS
TOUCHPOINTS
FEELINGS
FEELINGS
Tasks list
Tasks list
Opportunities
Opportunities
😩
Login
Login
Login
Open app
Login with phone number/Google Account
Open app
Login with phone number/Google Account
Connect Phone number with Google sign in so user can easily login
Connect Phone number with Google sign in so user can easily login
😊
View classes performance
Look for the main features
Look for the main features
View classes performance
Search for classes
Click on class name
Or click Classes in bottom menu
And choose a class
Search for classes
Click on class name
Or click Classes in bottom menu
And choose a class
Should list recent searches for easy access
Should list recent searches for easy access
😔
View student’s history
View student’s history
View student’s history
Go to Students list in menu
Search for student name from search bar
Click on student name
Click on Test History tab
Go to Students list in menu
Search for student name from search bar
Click on student name
Click on Test History tab
Can search student right in homepage like classes
Can search student right in homepage like classes
🤔
Assign a test
Assign a test
Assign a test
Click on Assign in bottom menu
Search for test to assign F
ollow 2 steps to assign to student(s) or class(es)
Click on Assign in bottom menu
Search for test to assign F
ollow 2 steps to assign to student(s) or class(es)
Make it easier and give faster way to assign a test
Make it easier and give faster way to assign a test
😊
Feedback - Give score
Feedback - Give score
Feedback - Give score
Go to Students list in menu
Search for student name from search bar -> Choose
Click on Test History tab
Choose a test
Check the test, give score and feedback
Go to Students list in menu
Search for student name from search bar -> Choose
Click on Test History tab
Choose a test
Check the test, give score and feedback
When teacher gets notification about student just submit a test, -> go directly to the page which has the answer to give score.
When teacher gets notification about student just submit a test, -> go directly to the page which has the answer to give score.
By using Teacher mobile app, a teacher can easily access to their class & students management dashboard everywhere and at anytime
By using Teacher mobile app, a teacher can easily access to their class & students management dashboard everywhere and at anytime
By using Teacher mobile app, a teacher can easily access to their class & students management dashboard everywhere and at anytime
Ideate solutions
Ideate solutions
Rapid sketching wireframe
Rapid sketching wireframe
Keeping a user-centric approach in mind, I visualized the user experience through sketches to explore diverse design patterns commonly used in competitive apps. This helped me identify the essential features to incorporate into the FLYER Teacher App.
Keeping a user-centric approach in mind, I visualized the user experience through sketches to explore diverse design patterns commonly used in competitive apps. This helped me identify the essential features to incorporate into the FLYER Teacher App.
Competitive Audit
Competitive Audit
Competitive Audit
Competitive Audit
We have researched in some LMS for schools. But they are not the direct competitor. There is not a direct competitor in Vietnam at that time because our dashboard is built for just user (Teachers) who has students using FLYER only. We noted some features which are useful to learn and some disadvantage from competitors to avoid and improve our products. After this audit we list idea for building the low-fi prototype.
We have researched in some LMS for schools. But they are not the direct competitor. There is not a direct competitor in Vietnam at that time because our dashboard is built for just user (Teachers) who has students using FLYER only. We noted some features which are useful to learn and some disadvantage from competitors to avoid and improve our products. After this audit we list idea for building the low-fi prototype.
Create Prototype
Create Prototype
Site map
Site map
With the features and content in mind after all the research and insights, I proceeded to develop the structure of the app which is based on the desktop dashboard for teacher
With the features and content in mind after all the research and insights, I proceeded to develop the structure of the app which is based on the desktop dashboard for teacher
Low-fidelity prototype wireframe
Low-fidelity prototype wireframe
Sample low-fidelity prototype from Homepage, Login, Onboarding, Dashboard,... Some main flows of the app
Sample low-fidelity prototype from Homepage, Login, Onboarding, Dashboard,... Some main flows of the app
Hi-fidelity prototype
Hi-fidelity prototype
I created a high-fidelity prototype to bring the design closer to the final product and have done usability tests to get feedbacks from teachers & school admins. User testing revealed some issues, prompting several iterations to improve the app. By April 2024, we had released five updated versions.
I created a high-fidelity prototype to bring the design closer to the final product and have done usability tests to get feedbacks from teachers & school admins. User testing revealed some issues, prompting several iterations to improve the app. By April 2024, we had released five updated versions.
The first version
The first version
After conducting usability tests with teachers, we received valuable feedback that highlighted areas for improvement before releasing the first version with its main features. Some bugs were identified, and issues emerged, showing that real users struggled to manage classes and navigate the product.
After conducting usability tests with teachers, we received valuable feedback that highlighted areas for improvement before releasing the first version with its main features. Some bugs were identified, and issues emerged, showing that real users struggled to manage classes and navigate the product.
Test & Iterate
Test & Iterate
Update assign test flow
Update assign test flow
Following the release of the first version, many teachers struggled with assigning tests due to the overly complicated flow. In response, the product team collaborated with the CEO, who engaged directly with teachers at our partner schools. This hands-on approach allowed us to quickly identify and address the issue.
Following the release of the first version, many teachers struggled with assigning tests due to the overly complicated flow. In response, the product team collaborated with the CEO, who engaged directly with teachers at our partner schools. This hands-on approach allowed us to quickly identify and address the issue.
The first flow
The first flow
In this flow, users could only assign tests via the "Assign test" button. The search functionality appeared overly complicated due to numerous filters displayed at the initial stage and not a visual search, which led to user confusion.
In this flow, users could only assign tests via the "Assign test" button. The search functionality appeared overly complicated due to numerous filters displayed at the initial stage and not a visual search, which led to user confusion.
The updated flow
The updated flow
In the new update, we simplified the search process. When users click on search, they can now easily find tests using thumbnails and basic information, making it much easier to assign a test.
In the new update, we simplified the search process. When users click on search, they can now easily find tests using thumbnails and basic information, making it much easier to assign a test.
Support parents watch their children study
Support parents watch their children study
After launching, parents requested the ability to track their children's studies. Using existing resources, we quickly updated the app to include a parent view. This allows parents to easily access reports and their children's history without needing a separate app.
After launching, parents requested the ability to track their children's studies. Using existing resources, we quickly updated the app to include a parent view. This allows parents to easily access reports and their children's history without needing a separate app.
And many features have been improved
And many features have been improved
And many features have been improved
We added features to support large English centers and schools, including campus management, admin/teacher role updates, and direct access for teachers to view students' test answers in the app. To attract more users, we implemented an affiliate program. You can check out the high-fidelity prototype here or download the app for the full experience.
We added features to support large English centers and schools, including campus management, admin/teacher role updates, and direct access for teachers to view students' test answers in the app. To attract more users, we implemented an affiliate program. You can check out the high-fidelity prototype here or download the app for the full experience.
We added features to support large English centers and schools, including campus management, admin/teacher role updates, and direct access for teachers to view students' test answers in the app. To attract more users, we implemented an affiliate program. You can check out the high-fidelity prototype here or download the app for the full experience.
Improving Usability
Improving Usability
Key Issues for Long-Term Development
Key Issues for Long-Term Development
Key Issues for Long-Term Development
Enabled the ability for users to assign multiple tests and set deadlines for each.
Implemented notification system to alert both students and teachers when deadlines are approaching.
Created an integrated chat function to facilitate better communication between teachers and parents.
Enhancing the challenge mode experience.
Implementing a ranking and history feature within the app for students.
Optimizing all academic material to seamlessly integrate with the user experience. This includes adjusting images for certain question types to ensure they align properly in portrait mode, eliminating the inconvenience of switching between portrait and landscape orientations, which can be frustrating for users.
What I learned
What I learned
Understanding School and Class Management:
Initial Research: Conducted interviews with teachers to gather insights into school and class management.
Challenges: Despite this, post-launch feedback revealed many overlooked scenarios and unmet user needs.
Lesson Learned: A deeper, more comprehensive understanding of educational environments is crucial. Continuous engagement with educators throughout the development process is essential to ensure all user needs are addressed.
Designing Actionable Reports:
Original Approach: Designed reports to be neutral, presenting data without interpretation.
User Feedback: While users valued the reports, they wanted actionable insights and guidance on what to do with the data.
Lesson Learned: Collaborate with professional educators to refine report functionalities, ensuring they provide practical, actionable advice to enhance their utility.
Prioritizing Accessibility:
User Demographics: Over 70% of teachers in Vietnam have limited technical proficiency.
Design Focus: Emphasized the need for an intuitive, user-friendly interface to accommodate non-tech-savvy users.
Lesson Learned: Always prioritize accessibility and simplicity in design to cater to a broader range of users, ensuring the app is easy to use for everyone.
Understanding School and Class Management:
Initial Research: Conducted interviews with teachers to gather insights into school and class management.
Challenges: Despite this, post-launch feedback revealed many overlooked scenarios and unmet user needs.
Lesson Learned: A deeper, more comprehensive understanding of educational environments is crucial. Continuous engagement with educators throughout the development process is essential to ensure all user needs are addressed.
Designing Actionable Reports:
Original Approach: Designed reports to be neutral, presenting data without interpretation.
User Feedback: While users valued the reports, they wanted actionable insights and guidance on what to do with the data.
Lesson Learned: Collaborate with professional educators to refine report functionalities, ensuring they provide practical, actionable advice to enhance their utility.
Prioritizing Accessibility:
User Demographics: Over 70% of teachers in Vietnam have limited technical proficiency.
Design Focus: Emphasized the need for an intuitive, user-friendly interface to accommodate non-tech-savvy users.
Lesson Learned: Always prioritize accessibility and simplicity in design to cater to a broader range of users, ensuring the app is easy to use for everyone.
Design
Contact me for freelance projects, full-time job or anything
you want to discuss about design. I’m happy to answer
lebichngoc15891@gmail.com
Linkedin.com/in/le-ngoc-jun158
Design
Contact me for freelance projects, full-time job or anything you want to discuss about design. I’m happy to answer
lebichngoc15891@gmail.com
Linkedin.com/in/le-ngoc-jun158
Design
Contact me for freelance projects, full-time job or anything
you want to discuss about design. I’m happy to answer
lebichngoc15891@gmail.com
Linkedin.com/in/le-ngoc-jun158
Design
Contact me for freelance projects, full-time job or anything
you want to discuss about design. I’m happy to answer
lebichngoc15891@gmail.com
Linkedin.com/in/le-ngoc-jun158
Design
Contact me for freelance projects, full-time job or anything you want to discuss about design. I’m happy to answer
lebichngoc15891@gmail.com
Linkedin.com/in/le-ngoc-jun158