Teacher Resources Platform
improving educational equity
As the sole Product Designer of a software consulting firm, I had the opportunity to meet with other startup founders and help them build their visions in the form of apps, such as a resources platform built by and for teachers.
Problem Statement
Our challenge was to create an online platform that empowers educators, parents, and students to discover, share, and rate educational resources. I created the platform's brand identity and delivered an exceptional user interface for a passionate teacher who aspired to make online learning more equitable.
TEAM COMPOSITION
1 Product Owner/Client
1 Product Designer
2 Full-Stack Software Engineers
My Impact
Delivered a robust brand and elements to platform
Worked with client to deliver value to students and teachers
Provided front-end development services for styling
The Educational Product Vision
In the world of education technology, there are many resources for teachers to pore over when it comes to writing lesson plans and figuring out how to teach their students effectively. From websites to reading materials, to games, to activities—paired with different grade levels and subjects—there is a lot to synthesize. We had the opportunity to work closely with a passionate teacher who aspired to create a platform that could empower educators, parents, and students to find what resources they needed, seamlessly.
Advocacy & Representation
Alongside my team, I was able to advocate for the value of design by showcasing my ability to take abstract ideas and turn them into viable and feasible interfaces for development.
Her goal was to develop a comprehensive online resource hub where K-12 teachers, homeschooling parents, and students could discover, share, and rate educational materials. An online platform where these audiences could come together, engage in content, and improve learning accessibility was just a dream until we provided the building blocks.
Handcrafting the Identity
To bring this platform to life, the first step was establishing a distinctive brand identity. My first step was to design a logo that embodied the essence of education, innovation, and community. I was happy with the design of a logo that looked like a schoolhouse with an up ‘arrow‘ to symbolize the bell tower, as found in older school buildings. The logo became the cornerstone of the platform's visual identity, encapsulating the spirit of learning and collaboration. In creating the logo, it felt reminiscent of the days I spent in school playing educational games in class.
Alongside the logo, I carefully curated an airy color palette of blues, teals, and light grays to create a welcoming and engaging atmosphere with a modern feel. I opted for a sans-serif font family with dynamic weights, ensuring clarity and readability across the platform. Elements like buttons and cards were designed to fit the brand, becoming the basis of an early design system that would later evolve.
Collaboration Through Lo-Fi
In the early stages of designing the interface, it was important to keep colors muted in low-fidelity wireframes, allowing us to objectively look at the interface without making any rash decisions about what high-fidelity design should entail, too early. Showing a cornerstone page of what the interface could look like is always fun for the client, as it gets them excited about the future of their product and business, but can be seen as jumping the gun in some cases. I played around with different layouts and ideas on how to display resources engagingly and worked with my technology team to see which ways we could manipulate or display data in corresponding lists and split views.
Research and Innovation
I explored disparate interface components and functionalities, ensuring the platform's alignment with educators' needs, and showcasing the essential role of brainstorming in a collaborative environment.
Our approach to this platform emphasized close collaboration with our passionate teacher/client. We needed to get her thoughts, input, and sentiments towards the platform from day 1, as we weren’t subject matter experts on the topic of teacher resource collation. By designing low-fidelity prototypes, I provided a canvas for feedback and adjustments; my method for information extraction typically relies on presenting options and then adjusting as the product evolves. This iterative process allowed our teacher-entrepreneur to actively participate in shaping the platform according to her vision. We incorporated modern web design components, including navigational hierarchies, typography, cards, lists, tables, pills, and filters, to ensure the interface was user-friendly and aligned with the needs of educators, parents, and students.
Earlier interface designs featured a split layout of the primary dashboard, where filters and searching were featured on the left-hand side and resources were on the right. In working the a User Experience Researcher on my team, we realized that this wasn’t conducive towards leveraging screen real estate, and made it harder to view content on smaller screens. Moving the filter and search functionality to the top in a sticky header, allowed for more cards to be shown at a time, alleviating the squeeze for space and allowing for better responsive design.
From Lo-Fi Concept to Hi-Fi
End-to-end Design
I delivered the low-level wireframes and components needed to get the app into a workable state. The Founder was able to talk about her idea and get buy-in with help from these early designs.
With a refined low-fidelity design in place and feedback from the client, I transitioned into the high-fidelity development phase. This was the most exciting phase because it incorporates research with creativity. I like working with existing products to make them more visually interesting and exciting, but working from scratch on a product provides even more leeway over the final designs. I paid attention to detail and ensuring that the final result would be possible for the technology team to implement.
Our team of developers, which happened to include myself, brought the designs to life using HTML, SCSS, JavaScript, and PHP. It was fulfilling to be the one who did the branding, UI design, UX interactions, and front-end development of components and elements that made the web app a reality. Simultaneously creating the web app’s dashboard and interior pages such as user profiles, we created a marketing website to enable our client to showcase the advantages of her platform to a wider audience. This comprehensive approach allowed us to provide a holistic solution that covered both the platform's functionality and its appeal to potential users.
I designed the detail pages to incorporate metadata on pricing, subjects, tags, and grade levels. When working with my UXR colleague, we delineated a nice visual to show the corresponding grades in a bar, rather than listing them out in plain text. On this page the split layout makes a return with related resources, pulling in materials that are similar and could be of interest to the end-user. From the onset, the platform also included a ratings system, so users could easily see which resources were recommended. Designing all of these elements was an engaging project.
Mentorship and Coaching
I was on the receiving end of mentorship throughout this project, as I had learned a lot from our processes in terms of Research and Engineering; working with talent team members can help bridge gaps in knowledge and build confidence for future projects.
A Bright Future for the Platform
The cross-team collaboration on this platform resulted in the successful launch of a platform that holds immense potential for transforming education and improving equitable access to teacher-recommended resources for students and parents. As the platform gains momentum and attracts more users, we anticipate its continued evolution and growth.
By fostering a sense of community and shared knowledge, the platform can evolve to become a bookmark for its intended audiences. The client was able to raise seed funding to continue the development of the platform and introduce new features. We take pride in our role in this project and eagerly await the positive impact it will have on the world of education.
Outcomes and Results
I created the brand, design system, and interface, considering detail and feasibility for implementation. Our development team brought the designs to life, both for the web app's dashboard and interior pages, and a marketing website to showcase the platform. The platform's launch represented how tech is transforming education, fostering community, and improving access to teachers, students, and parents.
Disclaimer: Work shown was created while employed at Nearby Creative and displayed with permission. Header image from Unsplash.
