Today

• Check in on your HW7 Figma progress.
• Get oriented to the new repo and issue tracker.
• Explore design options for the module workflow before full implementation begins.

Part 1 - Quick Check-in (10 minutes)

As a team, briefly share:

• What have you completed so far in Figma?
• Which screen or component feels most solid right now?
• What still feels unclear?

Write down:

• one thing your team has already made progress on
• one thing you still need to figure out this week

Part 2 - Repo and Issue Tracker Orientation (10 minutes)

We will spend a few minutes getting oriented to the new project space.

Goals:

• make sure everyone has access to the repo
• understand where issues/tasks will live
• see how weekly work will be tracked

As you look at the issue tracker, think about:

• What kinds of tasks could be written as issues already?
• Which tasks are design tasks, which are frontend tasks, and which are backend tasks?
• Which tasks are blocked until more shared infrastructure is ready?

Part 3 - Module Workflow Concept Exploration (25 minutes)

Your team will sketch out two different design concepts for the module workflow.

You do not need polished screens. Focus on structure and interaction ideas.

Step 1: Research inspiration

Look at a few comparable products or interaction styles. Possible references:

• Duolingo
• Coursera
• Khan Academy
• cybersecurity training platforms

As you browse, look for ideas related to:

• progression through modules
• locking/unlocking content
• progress indicators
• feedback and motivation
• navigation between lessons or activities

Step 2: Create two concepts

Create two contrasting concepts for how the module workflow might work.

For each concept, note:

• what the main screen looks like
• how a user moves from one module/activity to the next
• how progress is shown
• what the primary action is

Your two concepts should be meaningfully different.

Examples:

• one concept might feel more like a guided learning path
• one concept might feel more like a dashboard or library

Part 4 - Compare Stakeholder Views (15 minutes)

Now think about how this workflow changes for different users.

Focus on:

• Parent view
• Admin view

Discuss:

• What does each stakeholder most need to see first?
• What actions matter most for each stakeholder?
• Which parts of the workflow are shared?
• Which parts should be different?

Make a short list for each stakeholder:

• top information needs
• top actions
• one design decision that should differ between the two views

Part 5 - Demo and Technical Exploration (15 minutes)

We will look at two early technical directions that may support this work.

Backend demo idea

• TTS research
• SSML (Speech Synthesis Markup Language) basics
• what kinds of content or interactions this might support

Frontend demo idea

• mobile UI proof of concept
• animation
• audio queueing / preloading
• buttons that trigger actions or playback

As you watch, take notes on:

• what seems feasible soon
• what questions you still have
• what pieces could be explored independently before full integration

Part 6 - Weekly Task Planning (10 minutes)

Before class ends, each team should produce a short working list for the week.

Include:

• 1 design task
• 1 frontend task
• 1 backend or research task
• 1 open question or blocker

If helpful, phrase tasks like this:

• “Compare two module workflow concepts and choose one direction”
• “Build a small mobile proof of concept for the module card”
• “Research TTS + SSML options and note what inputs/outputs would be needed”

Share-out

Be ready to report:

• your two workflow concepts
• one key difference between the admin and parent views
• one task your team can begin right away
• one thing that is still blocked or uncertain

Exit Check

Before you leave, make sure your team can answer:

1. What two workflow concepts did we explore?
2. What did we learn from comparing parent and admin views?
3. What task can we start now, even without the full shared codebase?
4. What do we need next in order to move into implementation?