Education Station

Education Station is an eCommerce site where customers can make informed, confident choices in high-quality educational toys for friends, family, or themselves. 

The goal of Education Station is to eliminate the guesswork and frustration users experience when visiting online stores with mediocre product representations, unreliable reviews, and poorly-curated selections. It was crucial that the website instill trust in the quality of the products offered by maintaining high standards and company transparency. I designed the website to be intuitive, efficient, and personalized for the convenience of customers in order to offer a positive shopping experience and encourage return visits. Customers would be able to make informed decisions based on the comprehensive details provided for each product. These details would include high-quality images, videos, detailed descriptions, verified customer reviews, and clearly displayed certificates and awards from prominent organizations.

Personas

After outlining goals and objectives, I organized the research and user data collected from interviews with educators, parents, grandparents, and aunts/uncles who had experience purchasing toys online. Throughout the interviews, it became clear that many of the interviewee’s had common goals and pain points that supported and elaborated upon the initial goals and objectives. This information was organized into distinct personas, which were used as references for the primary users’ needs throughout the design process.

Use Model

Once the personas and G&O’s were established, I outlined the flow and basic features of the website by creating a Use Model. At this stage the emphasis was on creating a familiar shopping experience that users would be able to recognize and navigate instinctively. Changes were implemented over the course of a few rounds of user testing, where the flow of the model was refined and new features were added based on feedback.

Use Case Storyboards

To explore user journeys and their unique interactions with the product, I illustrated storyboards that show each persona’s unique needs and how the product helped them achieve their goals. This was a very successful means of communication with other groups and peers in order to refine and improve the experience, as it is more engaging and relatable than typical user flows. This is the finalized storyboard for Judy’s use case, showing how she searches for and purchases a birthday gift for her grand-daughter using the Education Station website.

Use Case Animatic

For a deeper dive into user interactions within the product, I created an animatic following Judy as she uses Education Station’s search and filter features to find and purchase a toy. An animatic is much faster to create than full animation, but has proven to be an effective method for showing user interactions with the product. It also serves as an efficient way to brainstorm layouts, features, and interactive elements.

Low-Fidelity Wireframe

Building off of the use model and storyboards, I designed a low-fidelity wireframe to determine the page layouts, where features would be located, indicate how users would be able to navigate throughout the site, and estimate the scope of the project. Several rounds of user testing helped to determine optimal page layouts and navigation before moving forward with high-fidelity designs.

High-Fidelity Prototype

Using Figma, I built a high-fidelity prototype. The final design was a challenge of building an experience that enables customers to confidently achieve their goal of purchasing a toy for themselves or a loved one, while maintaining a clear, colorful, and fun design. The prototype was put through extensive user testing by assigning tasks to test users and recording their actions and verbal feedback. This feedback was then incorporated into the following iterations of the prototype.