Case 04 · Portfolio

A product development tracker that turns testing findings into dev-ready instructions.

Diagnose the workflow. Define the requirement. Direct the build.

Bottleneck
Two-person team running product development through meetings, email and Drive — findings die between rounds
Requirement
One live portal. Two test modes. One button that turns findings into the next dev brief
Outcome
~3 days saved per cycle · manual dev handoff eliminated
offerlytest.netlify.app
+ Offerly Testing Tracker
Search tests by title, story, expected behaviour…
All statuses All types Extract changes
F&B Journey
+ Step-by-step
E2E-001 Homepage to F&B WhatsApp order Step-by-step Passed
US-FNB-002 F&B tab loads with kuih / cake / nasi lemak placeholder From requirement Needs change
US-FNB-004 Menu builder validity rules per item From requirement In progress
E2E-008 F&B vendor sign-up to live profile Step-by-step Failed
US-FNB-007 HBB privacy: card / profile / map all redact unit From requirement Blocked
US-FNB-011 F&B Order Now records category in analytics From requirement Not started
02 Add a test · two modes per case
offerlytest.netlify.app
+ Offerly Testing Tracker
Search tests by title, story, expected behaviour…
Extract changes
Needs change Last saved 2 min ago
Title
F&B tab placeholder copy
Test type
Step-by-step From requirement
User story
As a customer, I want F&B placeholders that match real items, so the search box hints at what I can actually look up.
Expected behaviour
Search bar placeholder reads "kuih, cake, nasi lemak…" instead of generic "Search businesses…".
◐ Current state (before) Placeholder reads "Search businesses…" — generic, doesn't hint at the F&B tab's content.
★ Changes I want made (after) Change to "Search kuih, cake, nasi lemak…" per the placeholder copy spec.
Delete test Save changes
03 One click · the brief becomes the dev instruction
offerlytest.netlify.app
+ Offerly Testing Tracker
Search tests by title, story, expected behaviour…
Extract changes
Extract changes
Close
12 cases · 4 sections · grouped by journey
Copy markdown Download .md
# F&B Journey ## [US-FNB-002] F&B tab placeholder copy **Status:** Needs change · **Type:** From requirement **From:** Placeholder reads "Search businesses…" — generic. **To:** Change to "Search kuih, cake, nasi lemak…" per the spec. ## [US-FNB-007] HBB privacy: unit redaction **Status:** Blocked · **Type:** From requirement **From:** Unit number visible on card / profile / map. **To:** Redact unit on all surfaces per HBB privacy spec. # Services Journey ## [E2E-008] Service promo lead capture **Status:** Failed · **Type:** Step-by-step **From:** Lead form accepts duplicate phone numbers in the same hour. **To:** Apply 1-hour rate-limit per phone number per promo.
Impact

What it changed per cycle

Before
2 meetings + email
Reqs meeting → testing → findings meeting → results emailed → manual translation to dev.
After
Test → Export → Ship
Async portal. One button compiles every change note into the next dev brief.
Saved per cycle
~3 days
Tester writes once. The brief becomes the dev instruction — no manual handoff.
What's inside

Built for the full release cycle, not just one screen

Test types
Two test modes
Step-by-step for the live site, From requirement for the spec — toggle inside one drawer.
Detail capture
Per-step screenshots
Visual proof attached to every step. Reorder steps with up / down arrows.
Detail capture
Before / after fields
Current state + changes wanted, captured in two extract-ready boxes.
Collaboration
Comments thread per case
Back-and-forth feedback stays attached to the test that prompted it.
Status & filters
Six statuses
Not started · In progress · Passed · Failed · Blocked · Needs change.
Status & filters
Search + filters
Search by title, story or expected behaviour. Filter by status or test type.
Structure
16 sections, 4 journeys
Customer journeys plus shared and admin areas — covers the whole release scope.
Structure
~135 pre-seeded cases
Test pack ready on day one — sourced from the spec, not built from scratch.
Output
One-click export
Every "changes wanted" note compiles into a Markdown brief — grouped by section, ready for dev.
Workflow analysis

Where the bottleneck lived

Before
Meeting 1 — discuss requirements
→
Testing happens offline · scattered notes
→
⚠ Bottleneck Meeting 2 + email · manual translation to dev no record of what changed · findings die between rounds
After
PM seeds the tracker
→
✓ Both update async Status, before / after, comments shared live state · own time
→
✓ One-click export Every change note compiles to a brief grouped by section · ready to send
→
✓ Brief = dev instruction Dev applies the changes section by section spec + decision log update from the same brief
Requirements

What the solution needed to do

  1. 01
    Two test modes — live walkthrough and spec review
    Step-by-step for testing the deployed site, with a screenshot per step. From requirement for reviewing the spec, with user story + expected behaviour. One drawer, one toggle.
  2. 02
    Shared live state — no merging, no version names
    One person's update shows up live for the other. Comments thread per case for back-and-forth feedback.
  3. 03
    Async by default — both work at their own time
    Add cases, run tests, write findings whenever. Meetings only when there's a real decision.
  4. 04
    One export button → a dev-ready instruction set
    Every change note compiles into a single brief, grouped by section, with steps and screenshots. Open it and work through the changes one by one — the brief itself is the instruction.
  5. 05
    Right-sized between Drive and Jira
    Heavier than a doc — structure, status, before/after, audit. Lighter than Jira — no admin, no seats, no config.
← Previous
Case 03 · Live Update Website
Start over →
Case 01 · Certificate Renamer