lemon-communication

byUdayashree S

To enable real-time communication and collaboration within the platform, the web application should incorporate a VoIP feature that allows users to make video calls with their friends directly from the app. During a call, users should be able to share their screen, specifically allowing screen sharing of a YouTube website for shared viewing or discussion. The system should also provide an option to record the video call session and save the recorded file locally on the user's device for later access. This feature enhances social interaction by combining video communication, shared media viewing, and session

No preview

Comments (0)

No comments yet. Be the first!

System Requirements

System Requirement Document
Page 1 of 7

System Requirements Document (SRD)

Project Name: Lemon-Communication

1. Introduction

Lemon-Communication is a web application designed to enable seamless real-time communication and collaboration among users. The platform integrates advanced VoIP features, including video calling, screen sharing, and session recording, to enhance social interaction and productivity. This document outlines the updated system requirements based on Udayashree S's vision for the project, focusing on user-friendly and impactful features tailored to the Indian market.

Page 2 of 7

2. System Overview

The Lemon-Communication platform aims to provide users with a robust communication tool that combines video calls, shared media viewing, and session recording. The system will focus on delivering a smooth and intuitive experience, ensuring high-quality video and audio communication, efficient screen-sharing capabilities, and reliable local recording functionality.

Key features include:

  • VoIP-based video calling for real-time interaction.
  • Screen sharing, specifically enabling YouTube website sharing for collective viewing.
  • Session recording, allowing users to save the full video feed, audio, and shared screen content locally for later access.

The system will prioritize ease of use, compatibility across devices, and adherence to locale-specific preferences, such as time zones (IST) and storage formats commonly used in India.

3. Functional Requirements

As User:

  • I should be able to initiate video calls with friends directly from the app.
  • I should be able to share my screen during a video call, specifically allowing YouTube website sharing for collective viewing.
  • I should be able to record the full video feed, audio, and shared screen content during a video call and save the recorded file locally on my device.

4. User Personas

Page 3 of 7

1. Regular User

  • Description: A typical user who engages in video calls, shares media, and records sessions for personal or professional use.
  • Needs: High-quality video and audio communication, intuitive screen-sharing functionality, and reliable recording options.

2. Guest User

  • Description: A temporary user invited to join a video call without full access to the platform's features.
  • Needs: Seamless participation in video calls and viewing shared screens without requiring account creation.

3. Admin

  • Description: A user responsible for managing platform settings, monitoring usage, and ensuring system compliance.
  • Needs: Tools to oversee system performance, user activity, and storage management.

5. Visuals Colors and Theme

Color Palette for Lemon-Communication:

  • primary: #1A73E8 (Vivid Indigo Blue)
  • primary_light: #4D9EF8 (Soft Sky Blue)
  • secondary: #F57C00 (Bright Amber Orange)
  • accent: #E91E63 (Vibrant Pink)
  • highlight: #FFC107 (Warm Golden Yellow)
  • bg: #F5F5F5 (Light Gray)
  • surface: rgba(255, 255, 255, 0.9) (Soft White Panel Background)
  • text: #212121 (Deep Charcoal Black)
  • text_muted: #757575 (Muted Gray)
  • border: rgba(33, 33, 33, 0.2) (Subtle Charcoal Border)
Page 4 of 7

6. Signature Design Concept

Concept Name: Interactive Media Hub

The homepage of Lemon-Communication will feature an Interactive Media Hub, designed to captivate users with dynamic and engaging visuals.

Key Features:

  • Centralized 3D Sphere: A rotating 3D sphere (built using @react-three/fiber and @react-three/drei) will serve as the centerpiece. Each node on the sphere represents a feature or section of the platform, such as video calling, screen sharing, or recording.
  • Interactive Nodes: Users can click on nodes to expand them into detailed feature cards. Hovering over nodes will trigger subtle animations, such as glowing effects or pulsating highlights.
  • YouTube Integration Showcase: A dedicated node will demonstrate the YouTube screen-sharing feature with a live preview of shared content.
  • Session Recording Animation: A visual timeline will animate the recording process, showing how video, audio, and shared screens are captured.
  • Color Transitions: The background will subtly shift between the primary and accent colors based on user interactions, creating a dynamic and immersive experience.

Interaction Patterns:

  • Scroll-triggered Depth: As users scroll, the sphere will rotate, revealing new nodes and features.
  • Micro-interactions: Buttons and links will respond with spring physics (framer-motion) for a tactile feel.
  • Responsive Design: The hub will adapt seamlessly to different screen sizes, ensuring accessibility across devices.

7. Interaction Model & Motion Direction

Page 5 of 7

Landing Page Interaction Model: Parallax

The landing page will employ a parallax interaction model, creating layered depth and dynamic movement as users scroll. Key elements include:

  • Layered Backgrounds: Atmospheric gradients and particle fields will move at varying speeds to create a sense of depth.
  • Scroll-triggered Animations: Features will reveal themselves as users scroll, with smooth transitions and fade-ins.
  • Interactive Elements: Hover effects, clickable nodes, and animated icons will enhance user engagement.

Internal Pages Interaction Model: Static

Internal pages, such as settings and profile management, will prioritize clarity and simplicity with minimal motion.

8. Non-Functional Requirements

  • Performance: The system must support high-quality video and audio communication with minimal latency.
  • Scalability: The platform should handle concurrent video calls and screen-sharing sessions without degradation.
  • Security: All communication and shared content must be encrypted to ensure user privacy.
  • Storage: Recorded sessions must be saved locally in a format compatible with common media players.
  • Compatibility: The platform must function seamlessly across major browsers and operating systems.

9. Tech Stack

Frontend:

  • React for Web
Page 6 of 7

Backend:

  • Python
  • FastAPI

Database:

  • MySQL or MariaDB (using Alembic for migrations)

AI Models:

  • GPT 5.4 for user-friendly responses

AI Tools:

  • Langchain

Local Orchestration:

  • Docker
  • docker-compose

Server-Side Orchestration:

  • Kubernetes
Page 7 of 7

10. Assumptions and Constraints

  • Users will have sufficient bandwidth to support high-quality video calls and screen sharing.
  • Local storage devices must have adequate space for saving recorded sessions.
  • The platform will prioritize YouTube screen sharing but may expand to other media platforms in future updates.

11. Glossary

  • VoIP: Voice over Internet Protocol, enabling real-time communication over the internet.
  • Screen Sharing: A feature that allows users to share their device screen with others during a video call.
  • Session Recording: The process of capturing and saving video, audio, and shared screen content during a call.
  • Parallax Interaction Model: A design approach that creates layered depth and motion effects as users scroll through a page.

End of Document

Landing design preview
Landing: View Info
Login: Sign In
AdminDashboard: View Overview
AdminDashboard: Monitor Usage
Users: View All Users
Users: Manage User
Sessions: View Active Calls
Sessions: Monitor Session
Storage: View Usage
Storage: Manage Recordings
Settings: Configure Platform
Settings: Update Compliance