Requirement Specification
|
|
| Document |
Requirement Specification |
| Specification name |
Tukko Doc |
| Author: |
Ummar Ahmed & Kalle Vaimare & Matias Korpela |
| Version: |
1.0 |
| Date: |
20.2.2024 |
Some guidelines for writer of requirement specification
Introduction
Our assignment for the Future Factory project is commisioned by combitech Oy. We are working on their open source visualizer service Tukko-Traffic Visualizer. Tukko features a React-based user interface with mapping tools using Leaflet, along with multiple plugins such as Geoman and Cluster markers. The user interface includes custom icons, popups, and tooltips to convey information intuitively. For more interested users, there is also more in-depth information available. The development for Tukko follows best practices, including a strict ruleset maintained by TypeScript and ESLint. While described as a complete product, the passage mentions that the team had many ideas left unfulfilled due to time constraints.
Client
Combitech, as the client, has commissioned the creation of the traffic visualizer project and retains control and ownership over its requirements. This requirement specification is a crucial document that details Combitech's specific demands, characteristics, and capabilities expected in the traffic visualizer. It acts as a foundational reference for dialogue between Combitech and the development team, guaranteeing that the completed project corresponds with Combitech's expectations.
About the author and project team
Team Cven 2024, an integral part of Future Factory, comprises junior developers with a passion for coding and continuous learning. Their collective goal is to elevate their skills in full-stack and backend development. Alongside them, junior testers actively engage in ongoing learning to stay abreast of the latest technologies. This collaborative effort, blending diverse skills in coding, project management, test management, and testing, culminates in the successful delivery of projects. Moreover, the team includes key roles crucial to the project's success. The Backend Operational Manager oversees and optimizes backend processes, ensuring efficiency and reliability. The Security Specialist focuses on implementing robust security measures to safeguard against potential threats. The Generalist contributes versatility across various project aspects, demonstrating adaptability. Lastly, the Team Lead provides guidance and leadership, steering the team towards success by fostering collaboration and aligning project goals. Despite their collective achievements, the team acknowledges that some ideas remain unrealized due to time constraints.
Short description of service/solution
Our web-based traffic visualization tool offers a seamless, user-oriented experience for monitoring real-time traffic conditions and discovering the quickest paths between destinations. This application merges data from trustworthy sources to present a current snapshot of traffic congestion and road blockages, aiding users in making well-informed travel choices. The interface, featuring an easy-to-use map, showcases traffic intensity through color-coded indicators: red for heavy traffic and green for clear roads. Users have the flexibility to zoom into specific areas, gaining insights into traffic severity on preferred routes. This tool empowers individuals to effortlessly plan their routes, evade traffic snarls, and enjoy more efficient and relaxed journeys.
Business requirements / goals?
| ReqID |
Description |
| BUSINESS-REQ-0001 |
The Traffic Visualizer is designed for utmost simplicity, ensuring easy use for even those with no computer experience. This approach ensures that our service is accessible and straightforward for all users, facilitating stress-free travel planning for everyone. (update) |
| BUSINESS-REQ-0002 |
The Traffic Visualizer website is designed with inclusivity in mind, ensuring it's accessible and user-friendly for all, regardless of individual conditions or abilities. (update) |
Stakeholder map
Stakeholders and profiles
| Stakeholde/profile |
Info / Link to description |
Motivation? |
| Cven |
Cven website |
Has been assigned the responsibility of developing the Traffic Visualizer website by Combitech. |
| Combitech |
Combitech |
They are keen to discover what Team Cven can achieve. |
| End user 1 |
Person 25-50 Years old |
Desires a stress-free commute to work without the concern of encountering traffic jams. |
| End user 2 |
Person 21-65 Years old |
Prefers a daily drive to her workplace without the stress of navigating through traffic jams. |
Customer story's as background information
User 1, Alena, is a daily commuter who drives to work each day. She depends on our traffic visualizer to strategically plan her routes and avoid congestion. Using the application, Alena quickly assesses real-time traffic conditions before leaving home. By identifying areas with traffic jams, she can efficiently select the fastest route to her office. Thanks to Traffic Visualizer, Alena consistently arrives at work punctually and with reduced stress
User 2, Hari, is a tourist exploring a new city. He aims to discover various attractions without the inconvenience of traffic delays. Hari accesses our traffic visualization service on his tablet and chooses the area he intends to explore. The map presents up-to-date information on traffic flow, enabling Hari to opt for routes with lighter congestion. By utilizing the service, Hari optimizes his time exploring the city, visiting attractions, and immersing himself in the local culture while minimizing the frustration of being stuck in traffic.
Customer need
| ReqID |
Description |
| CUSTOMER-REQ-0001 |
As a user, I desire the ability to select dark mode for the application. |
| CUSTOMER-REQ-0002 |
As a user, I want UI selections to feature a collapsible menu that displays only titles, allowing for expansion. |
| CUSTOMER-REQ-0003 |
As a user, I wish to choose a high-contrast version of the map. |
| CUSTOMER-REQ-0004 |
As a user, I want the capability to search for a city using text search. |
| CUSTOMER-REQ-0005 |
As a user, I expect the application's performance to be optimized. |
| CUSTOMER-REQ-0006 |
As a user, I want the ability to zoom to a marker or a selected area by clicking it. |
| CUSTOMER-REQ-0007 |
As a user, I prefer tooltips to display a minimalistic info view, with the option to reveal more information upon clicking. |
| CUSTOMER-REQ-0008 |
As a user, I want to view traffic data in a heatmap format. |
| CUSTOMER-REQ-0009 |
As a user, I desire the ability to highlight roads for a clearer view. |
Customer Journey paths in Service/solution
Preliminary User Storys
| User Story ID |
Description |
Solution |
| US002 |
As a user, I want to be able to create an account and securely authenticate myself to the web app. |
React has modules for user authentication. |
| US003 |
As a data analyst, I want to export data to csv from the database. |
Optimal would be through the frontend but external solutions can be discussed. |
| US004 |
As a customer I want secure authentication mechanisms, such as password hashing and session management, to protect user accounts. |
Security is important on the backend. |
| US005 |
As a user, I want to save some favourite LAM stations to my account. |
Yes. |
| US006 |
As a user, I want data analytics pipelines that process and transform the raw traffic data into meaningful information. |
Graphs. |
| US017 |
As a developer, I want to regularly scan the codebase and dependencies for known security vulnerabilities and address them promptly. |
Check for known CSEs. |
| US018 |
As a developer, I want to enforce secure coding practices, such as input validation and output encoding, to prevent common security vulnerabilities like cross-site scripting (XSS) attacks. |
Read title. |
| US019 |
As a developer, I want to have an automated security testing pipeline that detects and reports security issues during the development process. |
Yes. |
| US020 |
As a developer, I want to have different environments (staging, testing, production) with automated deployments to ensure smooth and controlled releases. |
At least staging and production so the increment can be tested before deploying. |
| US021 |
As a developer, I want to set up a CI/CD pipeline that automatically builds, tests, and deploys the web app to different environments, such as staging and production. |
Yes. |
| US027 |
As a platform engineer, I want to set up a scalable and resilient infrastructure using containerization, such as Docker, to ensure easy deployment and management of the web app. |
Dockerize everything. |
| US029 |
As a platform engineer, I want to implement an automated build and deployment pipeline using tools like GitLab CI/CD to streamline the release process and ensure consistent deployments. |
Do. |
| US030 |
As a platform engineer, I want to configure and manage a cloud-based infrastructure, such as CSC Pouta server, to ensure high availability and scalability of the web app. |
Use CSC Pouta for this project. |
| US038 |
As a developer, I want to have automated tests for both frontend and backend code to ensure the reliability and correctness of the web app. |
Robot Framework and browser-library. |
| US039 |
As a developer, I want to set up continuous integration (CI) and continuous deployment (CD) pipelines to automate the testing and deployment processes. |
RF scripts running in the pipeline. |
| US040 |
As a tester I want to implement Robot Framework and browser libraries. |
Robot Framework. |
| US056 |
As a security specialist I want to harden all the containers. |
Docker Hardening. |
| US057 |
As a security specialist I want to have controls over who can access the server. |
SSH / MFA / don't allow root login / etc. |
| US060 |
As a product owner I want the testing to include exploratory testing. |
Check out maaretp stuff about exploratory testing. |
| US061 |
As a team member I want to have maintainable documentation. |
Make sure it's easy to keep up to date. |
Selected Use Cases of service/solution
During User interactions with the service, various service-related interaction events occur. The most crucial scenarios involving the use of the service/solution are depicted in the following diagram. A common method for defining these scenarios is through Use Case descriptions. Use Case diagrams have been created using draw.io scripts to visually represent and outline the key interactions and functionalities of the service. These diagrams serve as a valuable tool for understanding and documenting the different ways users engage with the service, providing a comprehensive overview of the system's behavior and functionality.
Preliminary MockUp-prototype layouts for solution/service
The image showcases preliminary Mockup-prototype layouts for the envisioned service/solution. These visual elements provide a tangible representation of the service's features and functions, particularly focusing on the user interface layout. In the realm of web design, these early design visions are commonly referred to as "Mockups." Mockups play a crucial role in validating the shared understanding between the development team and the customer, ensuring alignment in design expectations. Additionally, they serve as valuable tools for assessing the required functionalities within specific use cases. By exploring various layouts and visualizations, the Mockups unveil hidden needs, contributing to the refinement of the requirements specification for a more comprehensive design.
Demo version
System requirements
| RequirementsID |
Description |
| SYSTEM-HW-REQ-0001 |
Frontend server has to have at least 4 VCPUs |
| SYSTEM-HW-REQ-0002 |
Backend server has to have at least 4 VCPUs |
| SYSTEM-HW-REQ-0003 |
Frontend server memory capacity has to be at least 2GB |
| SYSTEM-HW-REQ-0004 |
Backend server memory capacity has to be at least 2GB Frontend |
Constraints and standards that affect on service design
| ReqId |
Description |
| CONSTRAINT-REQ-S00000 |
End user data shall be handled in a way that complies with EU GDPR Act |
| CONSTRAINT-REQ-S00001 |
The service should be accessible by Directive (EU) 2019/882 |
| CONSTRAINT-REQ-S00002 |
Service design should take into account the agreed-upon service levels and performance metrics that will be used to monitor the service's performance. |
| CONSTRAINT-REQ-S00003 |
The service must be designed with usability in mind to ensure that it is easy to use and understand. |
| CONSTRAINT-REQ-S00004 |
The design of the service must take into account the technical constraints and opportunities presented by available technology. |
| CONSTRAINT-REQ-S00005 |
The service design must consider the ability of the service to integrate with other systems and technologies as necessary |
Service primay features and functionalities
Priorization of essential features / functions
- P1 = Mandatory
- P3 = Required
- P5 = Nice to have
| Priority |
ID |
Feature Description |
| P1 - Must Have |
FEA516 |
Manual Testing |
| P1 - Must Have |
FEA102 |
Securely authenticate user accounts |
| P1 - Must Have |
FEA103 |
Save favourite LAM stations to user account |
| P1 - Must Have |
FEA403 |
Regularly scan for known security vulnerabilities |
| P1 - Must Have |
FEA505 |
Configure scalable and resilient infrastructure using containerization |
| P1 - Must Have |
FEA507 |
Manage cloud-based infrastructure |
| P1 - Must Have |
FEA515 |
Automate tests for frontend and backend code |
| P1 - Must Have |
FEA404 |
Enforce secure coding practices |
| P2 - Important |
FEA407 |
Control access to the server |
| P2 - Important |
FEA517 |
Maintainable Documentation |
| P2 - Important |
FEA201 |
Export data to CSV from the database |
| P2 - Important |
FEA506 |
Implement automated build and deployment pipeline |
| P2 - Important |
FEA405 |
Implement automated security testing pipeline |
| P3 - Nice to Have |
FEA202 |
Implement data analytics pipelines for traffic data |
| P3 - Nice to Have |
FEA502 |
Establish different development environments |
| P3 - Nice to Have |
FEA406 |
Harden all the containers |
Functional requirements of the service
| ReqID |
Description |
Affected feature? |
| FUNC-REQ-C0002 |
Securely authenticate user accounts |
FEA102 |
| FUNC-REQ-C0003 |
Create user account |
FEA103 |
| FUNC-REQ-C0013 |
Save user data in Database |
FEA103 |
| FUNC-REQ-C0015 |
Export data to csv from the database |
FEA201 |
| FUNC-REQ-C0019 |
Implement data analytics pipelines for traffic data |
FEA202 |
| FUNC-REQ-C0005 |
Implement security scanning within a pipeline |
FEA403 |
| FUNC-REQ-C0023 |
Enforce secure coding practices |
FEA404 |
| FUNC-REQ-C0018 |
Implement a pipeline that runs security tests |
FEA405 |
| FUNC-REQ-C0022 |
Harden all the containers |
FEA406 |
| FUNC-REQ-C0013 |
Adjust security settings for the server |
FEA407 |
| FUNC-REQ-C0020 |
Different environments for development and production |
FEA502 |
| FUNC-REQ-C0006 |
You have to be able to dockerize the software |
FEA505 |
| FUNC-REQ-C0017 |
Implement automated build and deployment pipeline |
FEA506 |
| FUNC-REQ-C0007 |
Use CSC Pouta for this project |
FEA507 |
| FUNC-REQ-C0009 |
Automate tests for frontend and backend code |
FEA515 |
| FUNC-REQ-C0001 |
Manual Testing |
FEA516 |
| FUNC-REQ-C0014 |
Maintainable Documentation |
FEA517 |
| FUNC-REQ-C0021 |
Account for staging and production environments in deployment pipeline |
FEA506 |
Software / service non-functional requirements
| ReqID |
Description |
| PERF-REQ-0000 |
Login is possible for 100 users at the same time (100 request/s) |
| PERF-REQ-0001 |
The traffic data on the map should update quickly, with minimal delay |
| PERF-REQ-0002 |
The application should load the initial map view promptly upon user interaction |
| PERF-REQ-0003 |
The application should handle a large number of cities and traffic data points without performance issues |
| PERF-REQ-0004 |
Zooming and panning across the map should be smooth and responsive. |
| PERF-REQ-0005 |
The application should perform well on various devices and screen sizes |
Security Requirements
| ReqID |
Description |
| SEC-REQ-0001 |
The password must use at least MD5-level encryption, as required by the XY112 standard |
| SEC-REQ-0002 |
Regularly update and patch the application's software components and libraries to address known security vulnerabilities |
Availability Requirements
| ReqID |
Description |
| USAB-REQ-0000 |
Font should be size at 16pt |
| USAB-REQ-0001 |
User interface should be visible in high contrast mode |
| USAB-REQ-0002 |
User should be able to use dark mode in the application |
| USAB-REQ-0003 |
User should be able to text search for a specific city |
| USAB-REQ-0004 |
Traffic Visualizer application should be as user-friendly as possible |
| USAB-REQ-0005 |
Display real-time traffic data from reliable and up-to-date sources |
| USAB-REQ-0006 |
Provide historical traffic data that allows user to predict where traffic jams might happen |
| USAB-REQ-0007 |
The application should have clear and intuitive navigation menus |
Accessability Requirements
| ReqID |
Requirement |
Description |
| ACC-REQ-0000 |
Keyboard Accessibility |
All functionality must be operable through a keyboard interface. |
| ACC-REQ-0002 |
Text Alternatives |
Provide text alternatives for any non-text content. |
| ACC-REQ-0003 |
Time-based Media |
Provide alternatives for time-based media, such as captions for videos. |
| ACC-REQ-0004 |
Adaptable |
Content must be presented in ways that can be perceived by all users, including those with disabilities. |
These
Quality Assurance
Preliminary Acceptance Tests
| AcceptanceTestId |
Feature |
Feature Description |
| ACCTEST001 |
FEA516 |
Verify functionality of manual testing. |
| ACCTEST002 |
FEA102 |
Verify secure authentication process for user accounts. |
| ACCTEST003 |
FEA103 |
Verify functionality to save favorite LAM stations to user account. |
| ACCTEST004 |
FEA403 |
Verify regular scanning for known security vulnerabilities. |
| ACCTEST005 |
FEA505 |
Verify configuration of scalable and resilient infrastructure using containerization. |
| ACCTEST006 |
FEA507 |
Verify management of cloud-based infrastructure. |
| ACCTEST008 |
FEA515 |
Verify automation of tests for frontend and backend code. |
| ACCTEST010 |
FEA407 |
Verify access control to the server. |
| ACCTEST011 |
FEA517 |
Verify maintainability of documentation. |
| ACCTEST012 |
FEA201 |
Verify functionality to export data to CSV from the database. |
| ACCTEST014 |
FEA506 |
Verify implementation of automated build and deployment pipeline. |
| ACCTEST015 |
FEA405 |
Verify implementation of automated security testing pipeline. |
| ACCTEST016 |
FEA202 |
Verify implementation of data analytics pipelines for traffic data. |
| ACCTEST017 |
FEA502 |
Verify establishment of different development environments. |
| ACCTEST018 |
FEA406 |
Verify hardening process of all the containers. |
| ACCTEST019 |
FEA404 |
Enforce secure coding practices. |
Software architecture, placement view, database description, and integrations
Application architecture diagram
CD/CD Deployment diagram
Technology choices
| Name |
Description |
Component |
| React |
Frontend JavaScript library/framework |
Frontend |
| Redis.io |
Database for live data and recent archival data |
Backend |
| MongoDB |
Database for archival data |
Backend |
| Digitraffic |
External data source for Finland's traffic data |
Backend |
| TypeScript |
Programming language |
Frontend/Backend |
| Docker |
Containerization platform for software components |
Backend |
| Node.js |
JavaScript runtime environment |
Backend |
| Express |
Web server that runs Node.js |
Backend |
Standards and sources