RoadmapDay 74 / 80
Interview PrepMonth 4 · Week 15

Day 74: Mock Interview 3: Frontend/Mobile System Design

Run a full timed system design mock on an unfamiliar prompt, applying the Day 66 framework and Day 67-69 trade-off instincts together.

Mark this day complete

Study

Concepts

This mock is about synthesis, not new material

By this point you have the framework (Day 66), the trade-off analyses (Days 67-69), and 5 worked examples (Week 10) — this mock tests whether you can synthesize all of it live, on a prompt you have not seen structured for you in advance, which is a meaningfully different skill from following an already-outlined case study.

Choose a prompt outside anything already covered explicitly: "Design the frontend architecture for a food delivery app's live order-tracking screen" is a good choice — it touches real-time data (Day 43, 46), maps/location UI, offline degradation (Day 45), and has natural depth for a 15-20 minute deep dive, without being a copy of a Week 10 case.

See It

Visualizations

Visualization

This mock, mapped to prior days

Phase structure

from Day 66

Rendering/network trade-offs as they come up

from Days 29, 43, 67

Real-time + offline instincts

from Days 45, 46

Explicit rejected-alternatives section

from Day 66 phase 4

Build It

Code Examples

Run this exactly like Day 70, on a new prompt

text
Prompt: "Design the frontend architecture for a food delivery app's
live order-tracking screen — the user watches their driver's location
update in real time on a map, with status updates (preparing, picked
up, arriving) and an ETA."

Give yourself 45 minutes, no notes, and hit every phase from Day 66:
  1. Clarify requirements (functional + non-functional) — don't skip this.
  2. High-level architecture — what pushes location updates, how the
     client renders them, what happens offline/on a dropped connection.
  3. Deep dive — the interviewer (or you, playing that role) picks ONE:
     the real-time transport choice, or the offline/reconnection story,
     or map-rendering performance with frequent position updates.
  4. Trade-offs — name at least one alternative you rejected and why.
  5. Wrap-up — what would you monitor once this ships?

Self-review immediately after using the Day 70 scorecard.

Remember

Key Takeaways

  • This mock tests synthesis across the whole system-design track, not recall of any single day.
  • Deliberately choose a prompt with no pre-built structure to answer against — that is the actual interview condition.
  • Real-time UI prompts naturally pull in networking (Day 43), offline-first (Day 45), and rendering trade-offs (Day 29/67) together — notice how the days connect.
  • Reuse the Day 70 self-review scorecard every time — consistency in review is what compounds improvement across mocks.
  • If a deep-dive area feels shaky, that is exactly the signal for what to re-study before the NEXT mock — use these mocks diagnostically, not just as rehearsal.

Do It

Practice

  1. 1Run the food-delivery tracking prompt above as a full 45-minute timed mock, narrating out loud.
  2. 2Self-review with the Day 70 scorecard and identify your weakest phase for this specific mock.
  3. 3Write one NEW system design prompt of your own (not listed anywhere in this roadmap) for a future mock.