EduTrend

Bringing Current Events into the Classroom with Care

Overview

EduTrend is a tool that leverages a generative AI chatbot to help educators conveniently and thoughtfully navigate and integrate current events into their class sessions with care and ease.

The idea stemmed from the challenges we identified during a series of educator workshops.
It gradually developed into a user flow and a high-fidelity prototype that received highly positive feedback and encouragement from 7 educators during testing.
Eventually, it became a fully functional tool built with React and Google Gemini API, and it achieved a 4.7 out of 5 satisfaction rating from 8 additional educators.
The project is still evolving, and we are excited to see how it continues to grow!

Role

Product Designer + Developer

I designed and developed the entire product myself!

Tools

Figma, FigJam,
React.js, Firebase, Vercel, Google Gemini API

Timeline

Jan 2025 – Aug 2025, Ongoing

– Introduction –

Background

Educators often struggle to incorporate trending news or social media content into their course materials, making it difficult to engage students and demonstrate how knowledge applies in the real world.

Problem

"How might we help educators efficiently transform current events into engaging and thoughtfully presented class materials?"

Goal

Develop a flow aligned with how educators plan their classes.
Design a clear, intuitive interface.

Process Overview

– Phase 01 - Understanding User Requirements –

Analyzed insights from 12 educator workshops to create personas and storyboards

Workshop Analysis

To better understand the challenges educators face in today’s information-rich era, I began by analyzing 12 educator-led misinformation workshops.

Key insight:
Many educators want to incorporate news, current events, or trending social media content into their teaching to better engage students.

However, they find it difficult and time-consuming to adapt such content into classroom-ready materials while ensuring it is appropriate and free from sensitive or inappropriate elements.

Persona

Building on the insights and findings from the workshop analysis, I then created a persona to better understand the target users' needs, behaviors, and goals.

– Phase 02 - Design Prototype –

Created user flow and interface prototypes

Solution

Create a tool that simplifies the process of browsing and selecting suitable content, then transforms it into the desired format using AI.

Storyboard

By visualizing educators' scenarios and interactions through storyboards, I define the user flow and shape the UI structure.

Prototype

1

Onboarding Process

8 questions capture data on teaching practices, including subject, current topic, and student needs.

→ Help the AI understand user context and deliver personalized content.

2

Dashboard

Present 5 current events aligned with user needs. Users can also upload their own resources.

→ Enable quick discovery of relevant topics for teaching.

3

Teacher-AI Collaborative Work

Once a topic is chosen, the platform generates class materials based on user input, which can be refined via the AI chatbot.

→ Support efficient creation and customization of teaching materials with AI.

View the prototype in Figma

– Phase 03 - User Testing –

Conducted user testing with 7 educators (45 min/session) using the Wizard of Oz method.

Wizard of Oz

Simulated the interaction and collected participant’s input using Google Slides, then generated class materials using ChatGPT and demonstrated them in real time.

Step 1:
I used Google Slides to simulate the prototype, collect users’ onboarding responses, and observe their reactions simultaneously.

Step 2:
Based on their answers, I asked ChatGPT to generate 5 current events and displayed them on the slides. Participants selected the one that best fit their teaching needs.

Step 3:
I then input their selections into ChatGPT and presented the generated content through the slides.

Key Findings

Here are 5 interesting findings from conducting 7 user tests:

😀 Participants found this idea helpful for time saving & preparation.

P1

“From what you described, it sounds like something that would make my life easier.”

P2

“I’m truly happy to have this—it feels like a great jumpstart.”

🧐 Improve the design and provide more scaffolding to help users give accurate input and discover more generation options.

P2

“I hope it provides more real material instead of instructions.”

P7

“I found myself wondering: What exactly are you asking for here?”

🤫 Educators are wary of sharing student data due to privacy concerns.

P5

“I feel hesitant sharing that information not knowing the level of data security/privacy associated with this platform.”

P6

“I’m concerned about revealing information that could potentially de-anonymize students.”

🤨 Educators see activity creation as core to their role and prefer tools that support, not replace, their ideas.

P5

“Being an educator, I often create a lot of activities on my own, without relying on a tool, because I feel that's part of the value I bring to the curriculum.”

P6

“When it comes to designing the activities themselves, I feel like that’s part of my job and something I want to craft directly.”

🤩 EduTrend is not meant to replace teachers or their skills, but to augment them.

P4

“I think this is scaffolding. It’s like teaching a teacher how to think through a process in the same way we, as teachers, help students learn how to think things through.”

P6

“I really appreciate that the tool seems to aim for collaboration rather than just automation.”

– Phase 04 - Development –

Develop the platform using the Google Gemini API, React, Vercel and Firebase.

Ongoing…

Check out the latest progress on the development → https://edu-trend.vercel.app

Let's get in touch!

chiayuan1219@gmail.com

wendy-hsu-cy

EduTrend

Bringing Current Events into the Classroom with Care

Overview

Role

Product Designer + Developer

Tools

Figma, FigJam, React.js, Firebase, Vercel, Google Gemini API

Timeline

Jan 2025 – Aug 2025, Ongoing

– Introduction –

Background

Educators often struggle to incorporate trending news or social media content into their course materials, making it difficult to engage students and demonstrate how knowledge applies in the real world.

Problem

"How might we help educators efficiently transform current events into engaging and thoughtfully presented class materials?"

Goal

Develop a flow aligned with how educators plan their classes.

Design a clear, intuitive interface.

Process Overview

– Phase 01 - Understanding User Requirements –

Analyzed insights from 12 educator workshops to create personas and storyboards

Workshop Analysis

To better understand the challenges educators face in today’s information-rich era, I began by analyzing 12 educator-led misinformation workshops.

Persona

Building on the insights and findings from the workshop analysis, I then created a persona to better understand the target users' needs, behaviors, and goals.

– Phase 02 - Design Prototype –

Created user flow and interface prototypes

Solution

Create a tool that simplifies the process of browsing and selecting suitable content, then transforms it into the desired format using AI.

Storyboard

By visualizing educators' scenarios and interactions through storyboards, I define the user flow and shape the UI structure.

Prototype

1

Onboarding Process

8 questions capture data on teaching practices, including subject, current topic, and student needs.

→ Help the AI understand user context and deliver personalized content.

2

Dashboard

Present 5 current events aligned with user needs. Users can also upload their own resources.

→ Enable quick discovery of relevant topics for teaching.

3

Teacher-AI Collaborative Work

Once a topic is chosen, the platform generates class materials based on user input, which can be refined via the AI chatbot.

→ Support efficient creation and customization of teaching materials with AI.

View the prototype in Figma

– Phase 03 - User Testing –

Conducted user testing with 7 educators (45 min/session) using the Wizard of Oz method.

Wizard of Oz

Simulated the interaction and collected participant’s input using Google Slides, then generated class materials using ChatGPT and demonstrated them in real time.

Step 1:I used Google Slides to simulate the prototype, collect users’ onboarding responses, and observe their reactions simultaneously.

Step 2:Based on their answers, I asked ChatGPT to generate 5 current events and displayed them on the slides. Participants selected the one that best fit their teaching needs.

Step 3:I then input their selections into ChatGPT and presented the generated content through the slides.

Key Findings

Here are 5 interesting findings from conducting 7 user tests:

😀 Participants found this idea helpful for time saving & preparation.

P1

“From what you described, it sounds like something that would make my life easier.”

P2

“I’m truly happy to have this—it feels like a great jumpstart.”

🧐 Improve the design and provide more scaffolding to help users give accurate input and discover more generation options.

P2

“I hope it provides more real material instead of instructions.”

P7

“I found myself wondering: What exactly are you asking for here?”

🤫 Educators are wary of sharing student data due to privacy concerns.

P5

“I feel hesitant sharing that information not knowing the level of data security/privacy associated with this platform.”

P6

“I’m concerned about revealing information that could potentially de-anonymize students.”

🤨 Educators see activity creation as core to their role and prefer tools that support, not replace, their ideas.

P5

“Being an educator, I often create a lot of activities on my own, without relying on a tool, because I feel that's part of the value I bring to the curriculum.”

P6

“When it comes to designing the activities themselves, I feel like that’s part of my job and something I want to craft directly.”

🤩 EduTrend is not meant to replace teachers or their skills, but to augment them.

P4

“I think this is scaffolding. It’s like teaching a teacher how to think through a process in the same way we, as teachers, help students learn how to think things through.”

P6

“I really appreciate that the tool seems to aim for collaboration rather than just automation.”

– Phase 04 - Development –

Develop the platform using the Google Gemini API, React, Vercel and Firebase.

Figma, FigJam,
React.js, Firebase, Vercel, Google Gemini API

Step 1:
I used Google Slides to simulate the prototype, collect users’ onboarding responses, and observe their reactions simultaneously.

Step 2:
Based on their answers, I asked ChatGPT to generate 5 current events and displayed them on the slides. Participants selected the one that best fit their teaching needs.

Step 3:
I then input their selections into ChatGPT and presented the generated content through the slides.