System Requirements Document (SRD)

Project Name: omega-wix

1. Introduction

The purpose of this System Requirements Document (SRD) is to outline the requirements for the redevelopment of the "omega-wix" project, which involves recreating the outdated website for Finix Group (https://www.finixgroup.com.au/). The goal is to deliver a modern, responsive, and engaging website that effectively showcases Finix Group's professional services while providing an enhanced user experience.

This document has been tailored for Hafeez, based in Australia, and considers locale-specific defaults such as timezone (AEST), currency (AUD), and mobile accessibility, as Hafeez primarily works from a mobile device. The updated website will retain the existing logo and incorporate a modern design inspired by Thrive Web (https://thriveweb.com.au/) and Simply Bathroom Solutions (https://simplybathroomsolutions.com.au/).

2. System Overview

The omega-wix project aims to replace the existing Finix Group website with a new design that is visually appealing, mobile-friendly, and user-centric. The system will be built using modern web technologies to ensure scalability, responsiveness, and ease of maintenance.

Key objectives include:

• A clean, modern layout that reflects Finix Group's professionalism.
• Improved navigation and user experience across devices.
• Integration of interactive elements to engage visitors.
• A responsive design that adapts seamlessly to mobile, tablet, and desktop screens.
• Retention of the existing Finix Group logo for brand consistency.

The system will be designed to support Finix Group's business goals, including showcasing services, building trust with potential clients, and driving conversions.

3. Functional Requirements

• As a User, I should be able to view a modern, responsive website layout.
• As a User, I should be able to navigate the website easily on mobile, tablet, and desktop devices.
• As a User, I should be able to access detailed information about Finix Group's services.
• As a User, I should be able to view a carousel of client testimonials.
• As a User, I should be able to contact Finix Group via a simple and intuitive contact form.
• As a User, I should be able to view a team showcase with profiles of key members, including Director Hafeez, Sadiqa, Arsalan, and Huda.
• As an Admin, I should be able to update website content easily without technical expertise.
• As an Admin, I should be able to selectively re-run specific sections of the SRD to regenerate updated requirements.

4. User Personas

4.1 Admin

• Role: Finix Group staff responsible for managing website content.
• Goals: Update service descriptions, add testimonials, and manage team profiles.
• Technical Expertise: Basic familiarity with content management systems.

4.2 User

• Role: Potential clients or partners visiting the website.
• Goals: Learn about Finix Group's services, view testimonials, and contact the company.
• Technical Expertise: General internet users with varying levels of tech-savviness.

5. Visuals Colors and Theme

The visual identity of the omega-wix project will reflect professionalism, trust, and modernity. Below is the custom color palette for the project:

• Background: #F5F8FA (soft cloud white)
• Surface: #FFFFFF (pure white)
• Text: #2D3748 (charcoal gray)
• Accent: #3182CE (calm azure blue)
• Muted Tones: #CBD5E0 (light slate gray)

This palette ensures a clean and professional look while maintaining readability and visual appeal. The colors are designed to evoke trust and sophistication, aligning with Finix Group's brand identity.

6. Signature Design Concept

Interactive Blueprint Homepage with Animated Service Highlights

The homepage of the omega-wix project will feature an Interactive Blueprint Design that creates a visually stunning and memorable experience. Visitors will be greeted with a sleek, modern layout inspired by Thrive Web and Simply Bathroom Solutions, but with a unique twist to make the website stand out.

Key Features:

1. Blueprint Aesthetic:

   • The homepage will resemble an architectural blueprint, with a grid-like background and animated line drawings that form the layout as the user scrolls.
   • Each section (e.g., "Our Services," "Testimonials," "About Us") will appear as a "room" in the blueprint, with smooth transitions between sections.

2. Interactive Service Highlights:

   • Each service will be represented by a clickable icon or blueprint element.
   • Hovering over or tapping on an icon will animate the element, revealing detailed information about the service in a pop-up or expanding card.

3. Dynamic Hero Section:

   • The homepage will open with a full-screen hero section featuring an animated blueprint of Finix Group's logo, which will "draw itself" on the screen.
   • A bold call-to-action (e.g., "Explore Our Services") will be prominently displayed, encouraging users to engage further.

4. Micro-Interactions:

   • Subtle animations, such as glowing lines or pulsing icons, will guide users to key sections of the website.
   • Interactive elements will respond to user actions, creating a tactile and engaging experience.

5. Mobile Optimization:

   • On mobile devices, the blueprint design will adapt to a vertical layout, with swipeable sections and touch-friendly interactions.

This design will create a unique and professional first impression, setting Finix Group apart from competitors while encouraging users to explore the website further.

7. Non-Functional Requirements

• Performance: The website must load within 3 seconds on a standard 4G connection.
• Accessibility: The website must comply with WCAG 2.1 Level AA standards.
• Scalability: The system must support future content additions without requiring a complete redesign.
• Security: The website must use HTTPS for secure communication.
• Localization: The website must display content in English (AU) and use AUD as the default currency.
• Mobile Optimization: The website must provide a seamless experience on mobile devices, considering the primary user preference.

8. Tech Stack

Frontend

• React for Web

Backend

• Python
• FastAPI

Database

• MySQL (with Alembic for migrations)

AI Tools

• GPT 5.4 for user-friendly responses

Local Orchestration

• Docker
• docker-compose

Server-Side Orchestration

• Kubernetes

9. Assumptions and Constraints

• The website will primarily target Australian users, so all content will be tailored to this audience.
• The Admin user will have basic technical skills, so the content management system must be intuitive.
• The project will adhere to a mobile-first design approach, given the user's preference for mobile accessibility.
• The existing content from the Finix Group website will be reused unless otherwise specified.
• The existing logo will remain unchanged to maintain brand identity.
• The design will draw inspiration from Thrive Web's modern and sleek aesthetic and Simply Bathroom Solutions' clean and professional layout while incorporating unique elements to differentiate the Finix Group brand.

10. Glossary

• Responsive Design: A design approach that ensures the website adapts to different screen sizes and devices.
• WCAG: Web Content Accessibility Guidelines, a set of standards for making web content accessible to people with disabilities.
• HTTPS: Hypertext Transfer Protocol Secure, a protocol for secure communication over a computer network.
• Docker: A platform for developing, shipping, and running applications in containers.
• Kubernetes: An open-source system for automating deployment, scaling, and management of containerized applications.
• Interactive Blueprint Design: A web design technique that mimics architectural blueprints, using grid layouts and animated line drawings for a unique visual experience.