Wordflyers Student Interface
Children can occasionally view learning as dull and difficult. For the majority, technology is a gateway to development and growth.
WordFlyers is a comprehensive online literacy program for students in Years 7–10. I delegated this project to assist the front-end development on producing an interactive, fun design for students’ to improve their literacy skills in an engaging way.
The Approach
I consulted with the stakeholders to discuss of all the screens in the student platform that required designs and development . Based on my initial wireframes and suggestions, the outcome was satisfactory with initial concepts and excited to get the ball rolling.
My Role
Once there was a clear direction on designs, provided was a specification sheet of the new features the company wanted to put in place. In short, they provided what problem they solve and with what feature. It was up to me how to design that solution into the platform.
My role was to design screens and prototype how they would function within the platform. Additionally, I worked within the development team to build my designs into the platform.
User Interface
After further iterations and research whilst tying the specifications, it was time to start designing the screens for the student platform. After approval of the low-fidelity mockups I moved onto filling in the details to form high-fidelity mockups.
I presented my designs to my manager and stakeholders of the company which were then translated to development.
A crucial element of the platform was the need for great visuals. This meant, making sure you could clearly see where the student navigated, incorporating brand colors strategically and enabling the platform to be fun; airport scenes and boarding a flight animations were added in by request in the final stages.
WordFlyers used in other Subjects
WordFlyers Benefits
The Website
For this project, my responsibility was to design and develop part of the student platform. The user journey had to feel the same as the rest of the student platform as it’s a learning course. We utilized a combination of libraries and frameworks to form our own self-starter framework for creating both dynamic and static web applications. For styling, we used Styled-Components to define our styles within a BEM-like hierarchy, but using the full power of components for easy reusability and performance. The development was with HTML/CSS, javascript and Ruby. Alongside, the use of Git and SourceTree.
The Final Product
The launch of Wordflyers that included my feature improved students learning and user engagement. Based on the designs and reviews from the team and stakeholders, I was able to design and develop a snazzy section of the student platform that was useful and engaging. I am proud to be apart of the development team on this project as it was a great learning experience.
“My class is really loving WordFlyers, so much so that they’re disappointed when I ask them to finish their lesson so we can move on to something else!”
Leah Nicholls
“The thing I really liked about this website is that you learn new things every time you are on it. I know when I go home everyday from school playing this game I’ve learnt something new that I never knew.”
Year 7 female student, state government school
Sahvanna 