Everstory: Product Website Redesign
Everstory, an innovative ed-tech non-profit startup, is redefining early education with a digital encyclopedia designed for young learners aged 3-6. By combining engaging audio and visual content, Everstory empowers children to explore geography, history, and science independently. Starting with English and Spanish, the platform emphasizes accessible education for all.
Project Management
Interaction Design
Ed-tech
Old Website Design
The goal of our project was to improve Everstory’s website to be a primary information source for users and attract financial and content contributors.
Project Timeline
01 // RESEARCH PHASE
We started with the Research phase to better understand stakeholder needs, user pain-points and market competition.
To do so we took on a multilateral approach to research: conducting stakeholder interviews with the Founder, Garret Potter, non-targeted and targeted-user interviews with parents, teachers, and librarians as well as executing a wide-spanning competitive analysis across 12 competitors.
Competitive Analysis
The team conducted a competitive analysis with 12 competitors, direct and analogous, with comparison points such as Clarity of Product Presentation, User-friendly navigation, Visual appeal and Branding, Responsive Design and Compatibility, Call-to-action Effectiveness, Trustworthiness and Social Proof, and Investment and Growth Potential.
Usability Tests
We also conducted usability tests with 5 participants on the old website using Neilson Norman Group's Heuristic Evaluations. Here are some of the pain points identified by the participants.
Research Insights
Based on additional secondary research and usability testing conducted on the previous website, we identified the following areas for improvement:
Product Demo
Users need to see a demonstration of the products to invest in their company
Cleaner Design
Users were struggling navigating the website due to the outdated design and lack of information architecture
Visible CTAs
Interested investors found it difficult to contact the team due to a lack of clear CTA to contact them.
02 // DESIGN AND DEVELOPMENT PHASE
Based on the insights, we started with the D&D phase and created journey maps and wireframes for the first drafts of the prototype
Sitemap
We made sure to include a separate page for the product to better highlight its features. Since the company is a non-profit, we needed more visible CTAs across the page and a separate 'Get Involved' page for potential contributors.
Wireframes
Style Guide and Design Strategy
To align the website design with the client’s vision of a fun and educational product, we embraced a vibrant color palette. The client’s primary lime green served as the anchor color due to its energetic and engaging appeal. To complement this, we introduced a split analogous color harmony using highly saturated tones for the elevated sections of the website.
Prototype
After conducting usability tests with the prototype and implementing feedback, we moved to the Development phase.
The website was originally hosted on SquareSpace by the client, but due to the limitations of the platform we decided to hard code the website using HTML, CSS, and JavaScript.
