Skip to content

Final Milestone Deliverables

Jump to bottom
furkan kaan edited this page May 16, 2026 · 31 revisions

Group Number: 2

1.Meeting Notes

Weekly Meetings

Other Meetings

2. Project Documentation

Class Diagram

Use Case Diagrams

Sequence Diagrams

3. Project Review

3.1 Project Status

The project has reached a completed final milestone state with an integrated, demonstrable software release. Across milestones, the team progressed from requirements/design artifacts to a working full-stack platform with map-based story discovery, story creation and media handling, interaction features (likes/comments/bookmarks), profile/dashboard capabilities, and automated validation pipelines.

By the end of the project, the main objective shifted from feature implementation to integration quality, stability, and release readiness. This included frontend-backend alignment, CI/UAT reliability improvements, and UX consistency fixes across high-traffic user flows. At the end, the final app works perfectly except some bugs related to search bar.

3.2 Status of Deliverables

Deliverable Status Notes
Meeting Notes Completed Team and customer meeting outcomes were documented regularly and used for planning and follow-up actions.
Final SRS Completed Requirements were consolidated and updated to reflect implemented final-scope functionality.
Final Design Completed System design artifacts were refined to match the final architecture and implementation decisions.
Project Review Completed End-of-project assessment, milestone reflections, and lessons learned were documented.
Progress Based on Teamwork Completed Team-level progress, collaboration outcomes, and distribution of work were reported.
Individual Contributions Completed 8 of 8 members have submitted their sections.
Final Software Release Completed Final integrated version prepared with runnable stack, test coverage, and release documentation.

3.3 Final Release Notes

  • Delivered an end-to-end working platform combining backend APIs, frontend user flows, media support, and interaction mechanics.
  • Finalized critical integration paths, replacing remaining placeholder behavior with production-like behavior.
  • Improved quality gates via unit/integration/UAT coverage and CI stabilization to reduce regressions and increase demo/release confidence.

3.4 Changes Based on Previous Milestones

Change Reason Impact on the Project
Transition from partial/mock flows to full API-driven integration Early milestones prioritized rapid feature scaffolding and parallel development. Increased functional correctness and consistency; reduced ambiguity between frontend and backend behavior.
Expansion of automated testing (UAT/E2E + stronger regression checks) Manual testing alone was insufficient for final milestone reliability. Improved repeatability in validation, earlier detection of regressions, and more stable release candidate builds.
Final UI/UX hardening and cross-page consistency pass Integration phase surfaced usability gaps and edge-case inconsistencies. Better user experience, clearer navigation/feedback, and smoother demo execution under time constraints.

3.5 Final Milestone Demo Reflections

The feedback we received from the Final Milestone Demo was overwhelmingly positive, especially compared to the MVP demo. The application has improved significantly since the MVP, with all standard industry features now successfully implemented. Overall, the customers seemed highly satisfied with our implementation.

3.6 What Could Have Been Done Differently

From the beginning, the team could have benefited from stricter cross-team contracts (API schema/versioning + frontend integration checklist + test cases) for each milestone. This would have reduced end-phase integration overhead and duplicate fixes.

Earlier investment in CI gating and shared deterministic test data would also have reduced flaky behavior and shortened stabilization time. In addition, scheduling recurring UX review checkpoints throughout development (instead of concentrating many improvements in the final phase) could have lowered rework cost and improved iteration speed.

Overall, the project was successful, but an earlier “integration-first + test-first” discipline would likely have improved predictability and reduced final milestone load.

4. Progress Based on Teamwork

4.1 Team Member Contributions

Team Member Date Core Contribution Related Issue / PR / Commit Status
Beyza Nur Deniz 2026-05-11 Implemented the backend transcription review flow by adding the story-audio preview endpoint and support for optional transcript submission during audio uploads. PR #317, PR #350 context, commits 4bbcea5, c3127fd Merged / Completed
Beyza Nur Deniz 2026-05-10 Implemented backend edit-profile functionality by adding user profile fields, migration updates, API changes, and automated test coverage. PR #314, commit 4bbf74d Merged / Completed
Beyza Nur Deniz 2026-05-09 Implemented authenticated user dashboard APIs and optimized dashboard/engagement queries. PR #299, commits daaf70d, 391ba5d, merge 50d6109 Merged / Completed
Beyza Nur Deniz 2026-05-08 Built the audio transcription pipeline for uploaded story media, including model/schema updates, service integration, and test coverage. PR #298, commit 441aed6, merge c934c6f Merged / Completed
Beyza Nur Deniz 2026-05-02 Implemented notification triggers for story interactions and fixed notification persistence after comment deletion. PR #259, commits 1fdcafd, b55ce5d, merge 98c81f6 Merged / Completed
Beyza Nur Deniz 2026-04-19 Implemented core story interaction APIs for likes, comments, and bookmarks, including migrations, backend logic, and test coverage. PR #254, PR #255, PR #256, commits 78221fe, d92a883, 6648976, merges 2237988, 8c9ae10, 26373c6 Merged / Completed
Furkan Kaan Biçer 2026-05-12 Completed backend support for user restriction and admin service separation, improving moderation/admin maintainability for the final release. PR #371, PR #388 Merged / Completed
Furkan Kaan Biçer 2026-05-12 Added logging/monitoring support and contributed deterministic keyword-tagging validation through Playwright UAT and mobile/Appium E2E coverage. PR #369, PR #375, PR #382 Merged / Completed
Furkan Kaan Biçer 2026-05-12 Added server-side filtering support by extending story search and nearby-story APIs with tag parameters and related service/test updates. PR #380 Merged / Completed
Furkan Kaan Biçer 2026-05-11 Delivered tag-based and semantic story discovery improvements, including tag search/filtering, relevance ranking, hybrid search behavior, API contract updates, and test coverage. PR #357, PR #360 Merged / Completed
Furkan Kaan Biçer 2026-05-10 Implemented keyword tagging and AI-assisted tagging backend support, including tag persistence, normalization, Gemini integration, fallback behavior, and API/unit/integration tests. PR #332, PR #335 Merged / Completed
Furkan Kaan Biçer 2026-05-08 Implemented the reporting and moderation backend flow, including story report APIs, admin report review endpoints, admin story removal/soft-delete support, moderation logic, and related tests. PR #294, PR #295, PR #296, PR #297 Merged / Completed
Enes Hamza Üstün 2026-05-12 Implemented and stabilized dashboard UAT testing (web + mobile support) and improved CI reliability/base-URL handling for final milestone validation. Issue #276, Issue #309, Issue #327, commits 5cc7cb6, d29301e, f28d1c7 Merged / Completed
Enes Hamza Üstün 2026-05-11 Connected transcription editing flow on the frontend to backend-compatible behavior for story creation/detail workflows. PR #336 context, commit 34fea03 Merged / Completed
Enes Hamza Üstün 2026-05-10 Connected edit-profile/profile pages to live backend APIs, synchronized avatar/password/profile-field flows, and expanded unit test coverage. Issue #313, Issue #245, PR #319, commit 6735772 Merged / Completed
Enes Hamza Üstün 2026-05-07 Completed end-to-end frontend-backend integration for likes/comments and updated tests for story interaction reliability. Issue #226, PR #293, commit f1468c2 Merged / Completed
Enes Hamza Üstün 2026-04-24 Implemented comment logic in story detail page, removed dummy behavior, and added unit tests. Issue #226, PR #263, commit db1c5fd Merged / Completed
Enes Hamza Üstün 2026-04-23 Implemented like button UI and added unit tests after refactoring related logic for maintainability. Issue #212, PR #258, commits 863eb4c, c9753bb Merged / Completed
Muhammed Mustafa Öztürkmen 2026-05-12 Replaced local faster-whisper with the OpenAI Whisper API, eliminating Render OOM restarts and enabling graceful skip when the API key is unset. Issue #249, PR #364, commits 04c870b, merge ae06fb6 Merged / Completed
Muhammed Mustafa Öztürkmen 2026-05-12 Delivered the Playwright E2E suite (9 scenarios covering core flows) and fixed the backend tag-persistence bug discovered during testing where POST/PUT /stories silently dropped tags. PR #389, commits a4d3b6f, merge fbc40df Merged / Completed
Muhammed Mustafa Öztürkmen 2026-05-11 Implemented fuzzy/typo-tolerant place-name search using pg_trgm trigram indexing and similarity ranking. Issue #345, PR #359, commits 3f3f724, merge fe456cf Merged / Completed
Muhammed Mustafa Öztürkmen 2026-05-11 Implemented story view-count tracking with atomic DB increment on detail fetch, exposed on all StoryResponse payloads and user stats aggregation. Issue #346, PR #353, commits a4122f9, merge d9b1aad Merged / Completed
Muhammed Mustafa Öztürkmen 2026-05-11 Implemented the GET /stories/timeline endpoint with Haversine/ILIKE location filtering, date_start ASC ordering, and limit/offset pagination. Issue #300, PR #354, commits 1fe3b7d, merge 22b0815 Merged / Completed
Muhammed Mustafa Öztürkmen 2026-05-11 Fixed Whisper OOM crash on Render by removing lru_cache and adding per-request model load/del with a threading.Semaphore(1) to prevent concurrent model instances. PR #351, commits b367c02, merge 2894a8c Merged / Completed
Muhammed Mustafa Öztürkmen 2026-05-10 Implemented full Google OAuth backend — login redirect, callback token exchange, CSRF state-cookie validation, account linking by email — with unit and API tests. Issue #238, PR #286, commits 4b80762, merge 2409e0c Merged / Completed
Muhammed Mustafa Öztürkmen 2026-05-11 Built the release.yml CI/CD workflow composing CI + deploy and publishing a GitHub Release with JUnit-based test-result summaries. Issue #283, PR #312, commits 9c14abe, merge 2fda12c Merged / Completed
Muhammed Mustafa Öztürkmen 2026-05-04 Fixed CI job ordering (API before integration) and added a parallel UAT job to the pipeline. Issue #281, PR #285, commits c010831, merge 79eb555 Merged / Completed
Muhammed Mustafa Öztürkmen 2026-05-12 Extended the seeded_db fixture with a media-file story, a DATE-precision story, and an admin-owned story; added 3 new integration tests. Issue #224, PR #378, commits adcd4bd, merge fb1aa8a Merged / Completed

4.2 Status of Requirements

A detailed requirement-by-requirement status table, including implementation evidence and completion assessment, is provided on this page.

4.3 API Endpoints

4.3.1 API Documentation

4.3.2 Sample Usage Scenarios

Scenario 1

Endpoint: POST /stories

Scenario Description: An authenticated user publishes a new story by combining multiple pinned locations, historical date information, tags, and optional anonymous sharing in a single creation workflow.

The request assumes that the user has already authenticated and obtained a valid JWT access token.

Request:

curl -X POST 'https://bounswe2026group2-backend.onrender.com/stories' \
  -H 'Authorization: Bearer <ACCESS_TOKEN>' \
  -H 'Content-Type: application/json' \
  -d '{
    "title": "Silk Road Across Anatolia",
    "content": "This story traces a historical trade route through multiple cities in Anatolia and explains its role in cultural exchange.",
    "summary": "A multi-location story about the Silk Road in Anatolia.",
    "tags": ["history", "trade", "anatolia"],
    "place_name": "Istanbul",
    "latitude": 41.0082,
    "longitude": 28.9784,
    "date_start": 1200,
    "date_end": 1300,
    "is_anonymous": true,
    "locations": [
      {
        "latitude": 41.0082,
        "longitude": 28.9784,
        "label": "Istanbul"
      },
      {
        "latitude": 39.9334,
        "longitude": 32.8597,
        "label": "Ankara"
      },
      {
        "latitude": 37.8746,
        "longitude": 32.4932,
        "label": "Konya"
      }
    ]
  }'

Response:

{
  "id": "b64c1ce3-da74-49a6-af81-32582c569b11",
  "title": "Silk Road Across Anatolia",
  "summary": "A multi-location story about the Silk Road in Anatolia.",
  "content": "This story traces a historical trade route through multiple cities in Anatolia and explains its role in cultural exchange.",
  "tags": ["history", "trade", "anatolia"],
  "author": null,
  "is_anonymous": true,
  "place_name": "Istanbul",
  "latitude": 41.0082,
  "longitude": 28.9784,
  "locations": [
    {
      "id": "708edf8c-d987-45f7-8c8b-74a70426ea06",
      "latitude": 41.0082,
      "longitude": 28.9784,
      "label": "Istanbul",
      "sort_order": 0
    },
    {
      "id": "399cbfd2-a76e-4bac-b258-b5ab5209bc80",
      "latitude": 39.9334,
      "longitude": 32.8597,
      "label": "Ankara",
      "sort_order": 1
    },
    {
      "id": "3452fb0c-d9b4-413e-a231-0838abb1b306",
      "latitude": 37.8746,
      "longitude": 32.4932,
      "label": "Konya",
      "sort_order": 2
    }
  ],
  "date_start": "1200-01-01",
  "date_end": "1300-12-31",
  "date_precision": "year",
  "date_label": "1200 - 1300",
  "status": "published",
  "visibility": "public",
  "view_count": 0,
  "created_at": "2026-05-16T10:27:15.102699Z",
  "media_files": [],
  "like_count": 0,
  "new_badge": "First Story"
}

Scenario 2

Endpoint: GET /stories/search

Scenario Description: A user searches published stories by combining place-based search, tag filtering, and a historical year range in order to narrow discovery results to the most relevant matching stories.

Request:

curl --get 'https://bounswe2026group2-backend.onrender.com/stories/search' \
  --data-urlencode 'place_name=Istanbul' \
  --data-urlencode 'tags=history' \
  --data-urlencode 'query_start=500' \
  --data-urlencode 'query_end=1500' \
  --data-urlencode 'query_precision=year'

Response:

{
  "stories": [
    {
      "id": "b64c1ce3-da74-49a6-af81-32582c569b11",
      "title": "Silk Road Across Anatolia",
      "summary": "A multi-location story about the Silk Road in Anatolia.",
      "content": "This story traces a historical trade route through multiple cities in Anatolia and explains its role in cultural exchange.",
      "tags": [
        "istanbul",
        "history",
        "trade",
        "anatolia",
        "silk road",
        "trade route",
        "13th century",
        "cultural exchange"
      ],
      "author": null,
      "is_anonymous": true,
      "place_name": "Istanbul",
      "latitude": 41.0082,
      "longitude": 28.9784,
      "locations": [
        {
          "id": "708edf8c-d987-45f7-8c8b-74a70426ea06",
          "latitude": 41.0082,
          "longitude": 28.9784,
          "label": "Istanbul",
          "sort_order": 0
        },
        {
          "id": "399cbfd2-a76e-4bac-b258-b5ab5209bc80",
          "latitude": 39.9334,
          "longitude": 32.8597,
          "label": "Ankara",
          "sort_order": 1
        },
        {
          "id": "3452fb0c-d9b4-413e-a231-0838abb1b306",
          "latitude": 37.8746,
          "longitude": 32.4932,
          "label": "Konya",
          "sort_order": 2
        }
      ],
      "date_start": "1200-01-01",
      "date_end": "1300-12-31",
      "date_precision": "year",
      "date_label": "1200 - 1300",
      "status": "published",
      "visibility": "public",
      "view_count": 0,
      "created_at": "2026-05-16T10:27:15.102699Z"
    }
  ],
  "total": 1
}

Scenario 3

Endpoint: GET /stories/timeline

Scenario Description: A user explores stories associated with the same place and retrieves them in chronological order to understand the historical progression of that location over time.

Request:

curl --get 'https://bounswe2026group2-backend.onrender.com/stories/timeline' \
  --data-urlencode 'place_name=Merdivenli Yokuş, Balat, Fatih, Istanbul'

Response:

{
  "stories": [
    {
      "id": "7b3165be-4587-45c5-8844-0e0ea547f2d5",
      "title": "The Manav's Horse on Merdivenli Yokuş",
      "summary": "The vegetable vendor and his horse climbed our hill twice a week for sixteen years. When the horse died, he switched to a bicycle and never carried as much.",
      "content": "September 15, 1971 — Wednesday. The manav came every Wednesday and Saturday...",
      "tags": ["balat", "1971", "manav", "horse", "fatih", "neighborhood", "..."],
      "author": "selmakaradag",
      "is_anonymous": false,
      "place_name": "Merdivenli Yokuş, Balat, Fatih, Istanbul",
      "latitude": 41.0312,
      "longitude": 28.9462,
      "locations": [],
      "date_start": "1971-09-15",
      "date_end": "1971-09-15",
      "date_precision": "date",
      "date_label": "1971-09-15",
      "status": "published",
      "visibility": "public",
      "view_count": 0,
      "created_at": "2026-05-14T07:44:47.197796Z"
    },
    {
      "id": "aa00695b-1fea-4738-b617-070796b36e21",
      "title": "Balat Sokaklarında Çocukluk",
      "summary": "Summer afternoons on a street so steep that our football rolled away from us every five minutes. We chased it down to the Golden Horn and back, every single day.",
      "content": "July 14, 1975 — Monday. My mother used to send me out at ten in the morning...",
      "tags": ["balat", "1975", "childhood", "istanbul", "fatih", "1970s", "..."],
      "author": "mehmetyildiz",
      "is_anonymous": false,
      "place_name": "Merdivenli Yokuş, Balat, Fatih, Istanbul",
      "latitude": 41.0314,
      "longitude": 28.9463,
      "locations": [],
      "date_start": "1975-07-14",
      "date_end": "1975-07-14",
      "date_precision": "date",
      "date_label": "1975-07-14",
      "status": "published",
      "visibility": "public",
      "view_count": 10,
      "created_at": "2026-05-14T07:32:04.202391Z"
    }
  ],
  "total": 2
}

Scenario 4

Endpoint: GET /stories/nearby

Scenario Description: A user discovers geographically nearby stories by combining current-location coordinates, a distance radius, and thematic tag filtering.

Request:

curl --get 'https://bounswe2026group2-backend.onrender.com/stories/nearby' \
  --data-urlencode 'lat=41.0313' \
  --data-urlencode 'lng=28.9463' \
  --data-urlencode 'radius_km=0.15' \
  --data-urlencode 'tags=balat'

Response:

{
  "stories": [
    {
      "id": "aa00695b-1fea-4738-b617-070796b36e21",
      "title": "Balat Sokaklarında Çocukluk",
      "summary": "Summer afternoons on a street so steep that our football rolled away from us every five minutes.",
      "content": "July 14, 1975 — Monday. My mother used to send me out at ten in the morning...",
      "tags": ["balat", "1975", "childhood", "istanbul", "fatih", "..."],
      "author": "mehmetyildiz",
      "is_anonymous": false,
      "place_name": "Merdivenli Yokuş, Balat, Fatih, Istanbul",
      "latitude": 41.0314,
      "longitude": 28.9463,
      "locations": [
        {
          "id": "73638c23-5a80-45f3-81a0-abc9b0f5b6e8",
          "latitude": 41.0301,
          "longitude": 28.9484,
          "label": "Merdivenli Yokuş, Balat, Fatih, Istanbul",
          "sort_order": 0
        }
      ],
      "date_start": "1975-07-14",
      "date_end": "1975-07-14",
      "date_precision": "date",
      "date_label": "1975-07-14",
      "status": "published",
      "visibility": "public",
      "view_count": 10,
      "created_at": "2026-05-14T07:32:04.202391Z"
    },
    {
      "id": "7b3165be-4587-45c5-8844-0e0ea547f2d5",
      "title": "The Manav's Horse on Merdivenli Yokuş",
      "summary": "The vegetable vendor and his horse climbed our hill twice a week for sixteen years.",
      "content": "September 15, 1971 — Wednesday. The manav came every Wednesday and Saturday...",
      "tags": ["balat", "1971", "manav", "horse", "fatih", "..."],
      "author": "selmakaradag",
      "is_anonymous": false,
      "place_name": "Merdivenli Yokuş, Balat, Fatih, Istanbul",
      "latitude": 41.0312,
      "longitude": 28.9462,
      "locations": [
        {
          "id": "a615a28f-5085-4d41-b4db-2ffa7c1a8cd8",
          "latitude": 41.0312,
          "longitude": 28.9462,
          "label": "Merdivenli Yokuş, Balat, Fatih, Istanbul",
          "sort_order": 0
        }
      ],
      "date_start": "1971-09-15",
      "date_end": "1971-09-15",
      "date_precision": "date",
      "date_label": "1971-09-15",
      "status": "published",
      "visibility": "public",
      "view_count": 0,
      "created_at": "2026-05-14T07:44:47.197796Z"
    },
    {
      "id": "2a4a69b0-dcf5-4401-8dba-129004d1107d",
      "title": "The Antique Shop on Hızır Çavuş",
      "summary": "An old eskici on Hızır Çavuş who knew the story behind every object in his shop.",
      "content": "May 17, 2003 — Saturday. I was twenty-three and writing my master's thesis...",
      "tags": ["balat", "2003", "antiques", "eskici", "fatih", "..."],
      "author": "elif.demir",
      "is_anonymous": false,
      "place_name": "Hızır Çavuş Mescidi Sokağı, Balat, Fatih, Istanbul",
      "latitude": 41.0318,
      "longitude": 28.9463,
      "locations": [
        {
          "id": "d4ff3a08-094c-491d-8165-d1ab47388314",
          "latitude": 41.0318,
          "longitude": 28.9463,
          "label": "Hızır Çavuş Mescidi Sokağı, Balat, Fatih, Istanbul",
          "sort_order": 0
        }
      ],
      "date_start": "2003-05-17",
      "date_end": "2003-05-17",
      "date_precision": "date",
      "date_label": "2003-05-17",
      "status": "published",
      "visibility": "public",
      "view_count": 0,
      "created_at": "2026-05-14T07:44:41.024736Z"
    }
  ],
  "total": 3
}

4.4 User Interface / User Experience

4.4.1 Repository Links

Interface Design Repository Link
Web – Map Discovery View frontend/map.html
Web – Timeline View frontend/timeline.html
Web – Story Creation Form frontend/story-create.html
Web – Multi-location Story Creation Components frontend/story-create.html, frontend/multi-location.js
Web – Search and Filter Interface frontend/search.html, frontend/search-filters.js
Web – Story Detail and Interaction View frontend/story-detail.html, frontend/likes.js, frontend/comments.js, frontend/saves.js
Web – Profile / Dashboard View frontend/profile.html, frontend/profile.js
Mobile – Capacitor Android Wrapper frontend/capacitor.config.json, frontend/android

4.4.2 Screenshots

Interface Screen / Page Screenshot Notes
Web Application Map Discovery View View Screenshot Shows the main map-based discovery experience, including story markers, nearby exploration, and the recent stories panel.
Web Application Timeline View View Screenshot Shows the timeline interface with chronological story exploration and radius/date filtering controls.
Web Application Story Creation Form Overview View Screenshot Shows the main story authoring interface, including title/content input and the publishing checklist.
Web Application Story Creation Location Selection View Screenshot Shows map-based location selection and the pinned-locations area used for multi-location story creation.
Web Application Story Creation Media and Visibility Controls View Screenshot Shows media upload, in-browser recording options, and anonymous sharing controls.
Web Application Story Detail and Interaction View View Screenshot Shows the story detail page together with interaction features such as like, save, report, tags, and comments.
Web Application Search Filter Panel View Screenshot Shows the advanced filtering interface with year-range, distance, and tag-based discovery controls.
Mobile Application Map Discovery View View Screenshot Shows the main map view on mobile with story markers and the recent stories panel.
Mobile Application Multi-Location Story on Map View Screenshot Shows a multi-location story with numbered pins across multiple coordinates on the mobile map.
Mobile Application Story Detail View View Screenshot Shows the story detail page on mobile including tags, like button, and story content.
Mobile Application Story Creation Form View Screenshot Shows the story creation interface on mobile with title, content, and location selection.
Mobile Application Profile and Dashboard View Screenshot Shows the user profile page on mobile with activity stats (stories, comments, likes, views) and badges.
Mobile Application Saved Stories View Screenshot Shows the saved/bookmarked stories list on mobile.

4.5 Utilized Standards

4.5.1 Summary

Standard Where It Was Used Evidence
WCAG 2.1 Applied across the web interface to improve accessibility in forms, dialogs, status messages, and interaction controls. frontend/story-create.html, frontend/story-detail.html, frontend/timeline.html, frontend/site-header.js, frontend/likes.js, frontend/saves.js
Geolocation API Used in the map-based discovery flow to access the user's current location and retrieve nearby stories. frontend/map.html
Media Capture and Streams / MediaStream Recording Used in the story creation flow to record audio directly in the browser before publishing. frontend/story-create.html, frontend/recording.js

4.5.2 Deep Dive

Standard 1

Specific Standard: WCAG 2.1

Related Development Artifacts:

  • Issue: N/A
  • Pull Requests: PR #267, PR #319, PR #352
  • Commits: 965d8fb, 6735772, b83ff65

Implemented Parts of the Standard:
We applied accessibility-oriented markup and interaction patterns across the final web interface. In the story creation flow, we used explicit form labels, accessible transcript/status regions, and an anonymous-sharing toggle exposed with role="switch" and aria-checked in frontend/story-create.html. We also implemented an accessible badge modal with role="dialog" and aria-modal="true". In the story detail page, interactive controls such as like and save buttons expose their state through aria-pressed, and the comments section uses labeled fields and status messaging in frontend/story-detail.html. In the timeline page, filters and loading feedback are announced through labeled inputs and a live status region in frontend/timeline.html. The site header menu also uses aria-label, aria-haspopup, aria-expanded, and role="menu" in frontend/site-header.js.

Reasoning:
These implementations align with WCAG 2.1 principles by improving perceivability, operability, and understandability. Explicit labels make forms easier to use with assistive technologies; aria-pressed, aria-checked, and aria-expanded communicate dynamic state changes; and role="status" / aria-live="polite" ensure important updates are conveyed without requiring visual attention only. Together, these decisions make the interface more accessible for keyboard users and screen-reader users.

Standard 2

Specific Standard: Geolocation API

Related Development Artifacts:

  • Issue: N/A
  • Pull Requests: PR #192, PR #380
  • Commits: ce27d12, 3ee10cc, d1081d0

Implemented Parts of the Standard: We used the browser Geolocation API in the map-based discovery flow. In frontend/map.html, the application checks for navigator.geolocation support, requests the user’s permission with navigator.geolocation.getCurrentPosition(...), and then uses the returned coordinates to center the map, render the user’s position, draw a search radius, and fetch nearby stories from the backend. This flow supports both the direct locate action and the “stories near me” discovery mode.

Reasoning: This implementation follows the standard browser geolocation model for permission-based access to device location. It allows the application to provide location-aware story discovery without requiring external native integrations on the web side. Using the browser-standard API also ensures predictable consent handling and compatibility with map-based filtering and nearby-story workflows.

Standard 3

Specific Standard: Media Capture and Streams / MediaStream Recording

Related Development Artifacts:

  • Issue: N/A
  • Pull Request: PR #267
  • Commits: 0617f0b, 965d8fb, 154cb85

Implemented Parts of the Standard:
We implemented in-browser audio recording in the story creation interface. The recording flow uses navigator.mediaDevices.getUserMedia(...) to request microphone access and acquire a media stream, and then uses MediaRecorder to record audio before publishing. The UI for this flow is defined in frontend/story-create.html, including start/stop/cancel controls, live recording feedback, an audio preview element, and transcript feedback. The helper logic is encapsulated in frontend/recording.js, where recorder availability is checked and browser support is handled explicitly.

Reasoning:
This implementation follows the browser-native media capture model defined by W3C media APIs. By relying on standard stream acquisition and recording interfaces instead of a custom plugin-based solution, we kept the feature portable across supported browsers and aligned it with the platform’s permission and media handling model. This was especially important for our final milestone because audio recording is part of the end-user story creation workflow and needed to integrate cleanly with later transcription and publishing steps.

4.6 Testing & Quality Assurance

4.6.1 Test Execution Summary

Reports are from CI run #814 on main (2026-05-13).

Layer XML Report HTML Report Status
Backend — Unit backend-unit-test-reports — ✅ Passing
Backend — Integration backend-integration-test-reports — ✅ Passing
Backend — API backend-api-test-reports — ✅ Passing
Frontend — Unit (Jest) frontend-unit-test-reports — ✅ Passing
Web — UAT (Playwright) uat-test-reports uat-html-report ✅ Passing
Web — E2E (Playwright) e2e-test-reports e2e-html-report ✅ Passing
Mobile (Appium) — — ⚠️ Not run in CI (requires Android emulator), same tests as UAT (just for mobile run)

4.6.2 Verification Notes

All test layers — backend unit, integration, API, frontend unit, UAT, and E2E — are passing in CI run #814 on main. This run reflects the final merged state of the project.

Regression coverage from previous milestones is preserved: the core auth, story CRUD, media upload, like/comment/bookmark, and geospatial query paths all have dedicated tests that were introduced in earlier milestones and continue to pass without modification. New final-milestone tests were added on top of this baseline without removing or weakening any existing assertions.

The only layer not covered by CI is the Appium mobile E2E suite, which requires a running Android emulator and is validated manually.

4.6.3 New Test Evidence

Test Category Source Code Link Description
Integration Tests Backend Integration Comprehensive backend behaviour tests with direct API calls
End-to-End Tests Playwright E2E Test App behaviour with UI components
UI / UX Tests Playwright UAT Test app behaviour againsts expected user interaction

4.6.4 Impact Analysis

Coverage

All critical new functionality delivered in the final milestone is covered by automated tests:

  • Google OAuth backend — unit tests for the URL builder and CSRF state validation; API tests for callback, account linking, and error paths.
  • Story view counts — unit tests for atomic increment behavior; API tests verifying view_count is exposed on all StoryResponse payloads and in user stats.
  • Timeline API — unit tests for Haversine and ILIKE filter branches, sort order, and pagination; 11 API tests covering valid/invalid parameter combinations.
  • Fuzzy search (pg_trgm) — API tests confirming typo-tolerant results for place-name queries.
  • Tag system — unit and integration tests for tag creation, attachment, deduplication, and filtering on list/search endpoints; E2E tests verifying tag persistence after story create and update.
  • Transcription service — unit tests for the OpenAI Whisper API integration, graceful skip on missing key, and mock-based coverage for all error paths.
  • Seeded DB fixture — integration tests covering media-file stories, exact-date stories, and admin-owned stories.
  • UAT scenarios — TC_AUTH_1, TC_AUTH_2, TC_TAG_1, TC_MEDIA_2, TC_BADGE_1, TC_STORY_5 all implemented and passing in Playwright.
  • E2E flows — 9 end-to-end scenarios covering story CRUD, search, view count, multi-location, like/comment, tag search, timeline, and edit.

Bug Detection

Bug / Edge Case Test That Detected It Resolution
POST /stories and PUT /stories/{id} silently dropped the tags field after commit — tags were never persisted Playwright E2E tag-search scenario (TC_E2E_7) — story was created with tags but search returned no results Fixed in PR #389: create_story_with_location and update_story_with_location_and_dates now call get_or_create_tags + attach_tags_to_story after commit
Like and comment frontend were broken end-to-end — wrong API URL, missing GET endpoint, field name mismatch between frontend and backend Frontend integration testing during PR #293 review Fixed in PR #293: corrected API URLs, added GET /stories/{id}/like summary endpoint, aligned field names
StoryResponse Pydantic validation failed on None view_count for pre-flush ORM objects Unit test test_view_count_is_incremented_on_detail_fetch Fixed by coercing None → 0 in StoryResponse.from_orm_with_author
AI auto-tagging stored raw markdown code fence lines as tags — Gemini wrapped JSON in ```json ``` blocks Manual testing on dev deployment after PR #335 merged Fixed by adding parse_ai_generated_tags stripping logic before JSON parsing

Readiness

The test suite confirms release readiness on three levels. First, all CI jobs pass on main with no skipped or failing tests across backend unit, integration, API, frontend unit, UAT, and E2E layers, giving confidence that the integrated stack behaves correctly end-to-end. Second, the UAT suite covers the acceptance criteria for the six highest-risk user flows defined in the final milestone test plan, providing scenario-level validation that mirrors real user behavior. Third, the seeded DB fixture and integration tests ensure that the data layer behaves correctly for all story types, media configurations, and user roles, reducing the risk of environment-specific failures during the demo or grading evaluation.

4.7 Demo Reflections & Notes

4.7.1 Demo Notes

The final demo was an approximately eight-minute live walkthrough. The flow below summarizes both the presented features and the instructor/assistant reactions observed during the session.

Approx. Time Demo Flow Instructor / Assistant Notes
00:00-01:00 While the UI was on screen, the instructor asked us to zoom in. Efe then opened as the main speaker and introduced the problem space: preserving local memories through location-based stories. While the motivation and problem definition were being explained, all instructors took notes, which showed that they were actively following the framing.
01:00-02:00 Alper started the first story flow. We moved through the UI, entered the story detail page, and demonstrated saved-story behavior. The instructor took notes during the story detail part and also noted the save-story functionality.
02:00-03:00 We continued with the timeline feature and explained how it supports chronological memory discovery. The timeline received serious attention from the instructor and assistants. They inspected it carefully and followed the explanation in detail. A betting advertisement-like story example made the report/moderation need clear; this moment was found funny, but it also supported the moderation use case well.
03:00-04:15 Enes presented the second story flow and explained the "lost memory" idea behind the application. He connected this to users who may struggle with writing, especially elderly users. This framing helped connect the feature set to a real user need rather than presenting it as a purely technical flow.
04:15-05:00 We demonstrated audio-based story creation and the live transcription feature. The application generated the transcript during the demo. The instructors reacted positively to seeing the transcription work live. This was one of the stronger moments of the demo because it showed the accessibility motivation directly.
05:00-05:45 We introduced multi-location story creation and explained why a single memory may belong to multiple places. All instructors listened carefully during this explanation. However, an issue was noticed: the generated transcript could not directly replace the required content field. The instructor asked why the story could not be submitted without manually filling content, which became the main negative feedback point.
05:45-06:45 Akif presented the last story flow. We searched for "natural walk" and retrieved relevant stories, then showed commenting, liking, multi-location information on the story detail page, saving a story, and viewing saved information from the profile page. The search result quality was received positively because the returned stories fit the query. The interaction and profile-connected save flow helped show that discovery and user actions were integrated.
06:45-07:30 We connected the demo back to the memory theme and said that we wanted to add the presentation itself as a memory by taking a selfie with the class and publishing it as a story. The instructors liked the idea and approved the selfie. This created a strong closing moment because the demo itself became a story inside the product.
07:30-08:00 We shared the selfie story live. There was a small issue on the mobile side during story sharing, but the flow was completed. In the final discussion, the instructors stated that the project had improved significantly compared to the first presentation and that many earlier issues had been fixed.

Questions and Answers During the Demo

  • Transcript vs. content field: During the multi-location/audio story creation flow, the instructor asked why the story request could not be submitted without manually filling the content field. We explained the current implementation behavior, but this was received as negative feedback because the generated transcript should ideally be able to serve as the story content.
  • Search logic: After the story search demonstration, the instructors asked how the search feature worked and what logic was used behind it. We explained that a future version could use Elasticsearch, but the current implementation uses an AI-related tagging mechanism and semantic search based on story details. This explanation was considered appropriate for the current stage.

4.7.2 Reflections After Demo

Overall, the final demo was successful and showed a clear improvement over the earlier milestone presentation. The instructors' reactions suggested that the application had become more complete, more stable, and more aligned with the original project idea.

What Worked Well

  • Integrated product story: The live walkthrough showed that the system was not just a set of separate features, but a connected memory-sharing platform with story creation, discovery, search, timeline, interaction, profile, reporting, and moderation flows.
  • Timeline: The timeline attracted detailed attention because it added a stronger historical and chronological exploration dimension to the application.
  • Live transcription: The transcription demo was effective because it showed a concrete accessibility-oriented use case for elderly users or users who prefer speaking over writing.
  • Search experience: The search demonstration worked well because the returned stories were relevant to the entered query.
  • Final selfie story: Publishing the demo itself as a story was a strong closing moment because it turned the presentation into an example of the product's purpose.

Feedback and Issues Observed

  • Transcript-content dependency: The generated transcript should have been able to fill or replace the main content field, but the current flow still required manual content input before submission. Since this was noticed immediately by the instructor, it should be treated as an important UX and integration issue.
  • Mobile polish: The small mobile-side issue during live story sharing showed that the mobile experience needs additional stabilization and testing before it can be considered as polished as the web version.
  • Search architecture: The questions about search highlighted the importance of explaining the technical reasoning behind discovery features. Our current AI-assisted tagging and semantic search approach was considered acceptable for this stage, while Elasticsearch remains a natural future improvement if the product grows.

Team Takeaways

  • A final demo should not only show many features; it should connect them into a coherent product narrative.
  • Features were received more positively when they were tied to real user needs, such as memory loss, elderly users, content moderation, and location-based discovery.
  • Future demos should be prepared with extra attention to edge cases in live flows, especially form validation, mobile behavior, and transitions between generated content and user-submitted content.

5. Individual Contributions

The detailed individual contribution reports for all team members, including responsibilities, implemented work, and supporting repository evidence, are provided here.

Team Members

Milestones

Lab Reports

Weekly Meetings

Other Meetings

Templates
Scenarios
Use Case Diagrams
Class Diagram
Sequence Diagrams

Requirements

Implementation

Clone this wiki locally