tough-3d

byMaharsh Patel

3D website create

LandingAnalysis
Landing

Comments (0)

No comments yet. Be the first!

System Requirements

System Requirement Document
Page 1 of 4

tough-3d System Requirements Document

Introduction

The "tough-3d" project is an innovative 3D website designed as a resume analyzer. This project aims to provide an interactive and visually engaging platform for users to upload and analyze resumes, offering a modern and captivating user experience.

System Overview

The tough-3d project is a web-based application that leverages 3D technology to create an engaging interface for resume analysis. The system will allow users to upload their resumes and receive feedback on key sections such as education and experience. The 3D visualization of analysis results will enhance user interaction and provide a unique experience.

Functional Requirements

  • As a User, I should be able to upload my resume for analysis.
  • As a User, I should be able to view a 3D visualization of my resume analysis results.
  • As a User, I should be able to receive feedback on key sections like education and experience.
  • The system should parse resume data and provide insights on areas such as skills, achievements, and overall structure.

User Personas

  • User: Individuals looking to analyze their resumes for feedback on key sections.
Page 2 of 4

Visuals Colors and Theme

  • primary: #1A237E (Deep Indigo)
  • primary_light: #534BAE (Light Indigo)
  • secondary: #FF7043 (Coral)
  • accent: #FFD600 (Vibrant Yellow)
  • highlight: #FFAB00 (Amber)
  • bg: #F5F5F5 (Light Gray)
  • surface: rgba(255, 255, 255, 0.9) (White)
  • text: #212121 (Dark Gray)
  • text_muted: #757575 (Muted Gray)
  • border: rgba(33, 33, 33, 0.1) (Subtle Gray)

Signature Design Concept

The homepage of the tough-3d project will feature an interactive 3D environment where users can navigate through a virtual office space. Each section of the resume analysis will be represented as a different room or area within this space. Users can click and drag to explore the environment, with transitions powered by @react-three/fiber and gsap for smooth animations. As users interact with different sections, the environment will dynamically change, providing an immersive experience that highlights the analysis results in a visually compelling way.

Page 3 of 4

Interaction Model & Motion Direction

The landing page will utilize a "parallax" interaction model, creating a layered depth effect as users scroll through the site. This will be achieved with decorative layers that move at different speeds, enhancing the storytelling aspect of the resume analysis. Internal pages will adopt a "static" model to ensure clarity and focus on the analysis results.

Non-Functional Requirements

  • The system should be responsive and accessible on various devices and screen sizes.
  • The application should load within 3 seconds on a standard internet connection.
  • The 3D interactions should be smooth and intuitive, with no noticeable lag.

Tech Stack

  • Frontend: React for Web
  • Backend: Python, FastAPI
  • Database: MySQL or MariaDB, using alembic for migrations
  • AI Models: GPT 5.4 for user-friendly responses
  • Local Orchestration: Docker, docker-compose
  • Server-side Orchestration: Kubernetes

Assumptions and Constraints

  • The project will be developed as a college project with a focus on basic functionality.
  • The system will primarily target users in India, considering local preferences and internet speeds.
  • The 3D features will be optimized for modern browsers that support WebGL.
Page 4 of 4

Glossary

  • 3D Visualization: The graphical representation of data in three dimensions.
  • Resume Analyzer: A tool that evaluates resumes for specific content and structure.
  • Parallax: A scrolling effect where background images move slower than foreground images, creating a sense of depth.
  • React: A JavaScript library for building user interfaces.
  • FastAPI: A modern, fast (high-performance) web framework for building APIs with Python.
  • Docker: A platform for developing, shipping, and running applications in containers.
  • Kubernetes: An open-source system for automating the deployment, scaling, and management of containerized applications.
Landing design preview
Landing: View 3D Demo
Landing: Upload Resume
Analysis: View 3D Results
Analysis: View Education Section
Analysis: View Experience Section
Analysis: Read Feedback
Analysis: Download Report