E-Learning Portal - Jiangsu Fun Reading Culture Co., Ltd.
Jiangsu Fun Culture Co., Ltd. creates different services for children's learning, offering innovative and fun reading platforms for preschool and elementary school teaching programs in China and other countries.
About the Project:
The Jiangsu Fun Culture website project consisted in creating a layout for their landing page and main sections. The site consisted of 3 main sections: a portal for student courses and activities, a library for digital and physical books and a log in section for teachers with content for download and information on their course modules.
The Challenge
For this project, I needed to create a page layout that could be applied for both a student section and a teachers portal making sure it included the specific sections for each one of them.
The client was clear on the visual aspect and provided a style guide and a color palette which allowed me to design the website visuals fast on a tight deadline.
Main Layout Wireframes Web and Mobile
Low-Fidelity wireframes for landing page, Student Section with available main courses and the main layout for the Teachers Portal.
Low-Fidelity wireframes for the online library and summer courses section for mobile.
Web and Mobile Design
Jiangsu Fun Culture had a very clear concept of how the brand visuals were meant to look from the beginning. Therefore, the client provided style guides and working files which allowed me to design the web and mobile page layouts minimizing the number of edits substantially.
The approved versions of the students and teachers landing pages sections were the base for the inner sections of each portal:
For the teachers portal, I designed a main layout for each of the teacher’s option to access course modules and downloadable content:
The Students Portal consisted in a simple layout to list the available courses and available design modules:
For the mobile version, the client requested to design a mobile version for an online library and the student courses:
The online library included the steps for a search engine with specific criteria, a page displaying book results and the steps to view and reserve a book.
The mobile Student Courses section, included a list of available courses, an individual description of the course and scheduling options.