Skip to main content

Appendices

User Manual

Home Page

Upon landing users are prompted to sign up, with username , email address and a password. Security measures have been added to enhance security by forcing the user to enter password with special characters , uppercase letters etc.

LoginSignup
alt textalt text

Upon successful signup/login, users are displayed with the homepage view which features an interactive and dynamic UI. It has features like an AI chatbot, interactive map and a for you page.

alt text

Ask AI

To use the Ask AI feature, simply wait until the model is done loading (we use a web LLM) alt text

After it is done loading , simply type in a query of your choice and it will provide a response with relevant details

alt text

Interactive Map

To interact with the map, use two fingers to navigate across the map. Clicking on an issue or a event allows you to view brief details, you can then view the event / issue to get the rest of the details

alt text

Below is the details of the event which was clicked

alt text

For You Section

In this section users can users can explore articles, events, and reports, as well as interact through discussions and comment upvotes.

alt text

By clicking on a card, then on comments, users can leave comments and reply to other users, being able to voice their opinions on certain initiatives whilst also being able to interact with the community.

alt text

Users can also create forum posts by clicking on the create post button

Create Forum PostForum Post Details
alt textalt text

Reporting Page

On the reporting page, users get a detailed view of local issues, including discussions created around them. AI has also been incorporated to be able to summarise the content of reports

alt text

Users can voice their opinions on a certain issue by engaging in conversations

alt text

Events page

The events page showcases a timeline of featured and upcoming events, along with nearby points of interest like landmarks and parks.

Users can view the full details of any event

Create Forum Post
alt text
Forum Post Details
alt text

The dedicated points of interest section allows users to see nearby landmarks, museums , parks , etc. , providing further details when clicked

alt text

alt text

Extra Functionalities - Business Side Perspective

Businesses with sufficient access privileges have the ability to manage content displayed for users , such as issues, events , reports etc. . This is managed via the content management page, where businesses can modify and delete them.

alt text

To delete a card , simply press on the card and confirm deletion

Delete cardConfirm Delete
alt textalt text

Reports can also be managed in this way by businesses, who can delete reports, and change the status and tags of reports

alt text

Comments can also be moderated to remove any offensive or potentially harmful content. Businesses can also add announcement messages for a report, such as an update on it

alt text

Businesses can also create articles, events by clicking on the button on the bottom right alt text They can fill out the fields and save the article or event, which is then visible to users.

alt text

The edit interface also features AI Tooltips which provide a range of features such as suggesting alternative titles, generating the main content and description through a prompt, to optimise time for businesses. Below is an example of an example prompt and the description generated by AI. There is also a extract from pdf section which allows you to upload an unstructured pdf, which is then automatically placed into the correct fields, to create a article / event.

Description PromptExpanded Description
alt textalt text

Whilst creating a article or event, businesses can view a live preview of how the page would look like to users

alt text

After saving the article, it is displayed on the content management page, and also available on the home page for users.

User ViewBusiness (CMS) View
alt textalt text

Last but not least, there is also a miscellaneous section for businesses, which can be accessed via the settings icon. Here businesses can customise their name , logo, as well as the font of the site. They can also set the location based on where they are situated, this could be a different city or country for example

alt text

Deployment Manual

Backend

Run Development

  • Make sure your python version is 3.10 or 3.11
  • cd backend
  • python -m venv venv
  • Activate the Virtual Environment
    • (Linux/Mac) source venv/bin/activate
    • (Windows Powershell) .\venv\Scripts\Activate
    • (Windows Command Prompt) venv\Scripts\activate
  • pip install -r requirements.txt
    • These are our Python dependencies/libraries
    • Licences in ThirdPartyNotices.txt
  • python manage.py makemigrations
  • python manage.py migrate
  • python manage.py runserver
  • Backend should be up at the 127.0.0.1:8000

Example Data (Optional)

Perform the following steps to populate the database with example data:

  • Flush the current database (python manage.py flush) when the backend is not running.
  • Run the backend (python manage.py runserver)
  • From the backend folder:
    • cd exampledata/
    • python automatic_example_data.py

After running this script, as well as the frontend and backend, you'll be able to login with the following details:

  • Username: ExampleBusiness
  • Password: 1ExampleBusiness*

Tests

Unit Tests

  • python manage.py test

Coverage Report

  • coverage run manage.py test
  • coverage html --omit="*/test*" -i
  • Open backend/htmlcov/index.html to view coverage

Linting

  • pylint --load-plugins pylint_django **/*.py

Documentation

  • Available at pdocs/index.html
  • To rebuild (from the backend folder run): pdoc backend/ accounts/ articles/ events/ api/ comments/ companyinformation/ exampledata/ forums/ likes/ reportdiscussion/ reports/ search/ --output-dir pdocs
  • Any further created apps should also be included in the pdoc command (e.g: following on from search/)

Frontend

Run Development

  • Make sure you have nodejs.org installed.
  • Duplicate .env.example in frontend/ and rename it to .env
  • cd frontend
  • npm install
    • package.json is our libraries/dependencies for our React frontend
    • Licences in ThirdPartyNotices.txt
  • npm run dev

Tests

Unit Tests
  • npm run test
Coverage Report
  • npm run coverage
  • Check coverage folder for index.html to view coverage
Linting
  • npx eslint src --max-warnings=0

comp0016-systems-engineering-group-11-2024

Introduction

Welcome to the Community Impact Report Portal. This privacy policy outlines how we collect, use, and protect your personal information when you access or use our platform. By using our portal, you agree to the collection and use of your information in accordance with this policy.

Information Collection

We collect the following types of information to provide and improve our services:

  • Personal Data: When you register, report issues, participate in events, or engage in community forums, we collect personal information such as your name, email address, and any other details you provide.
  • Usage Data: We may collect data on how you use the portal, including the pages you visit, your interactions with content, and technical data such as IP addresses and browser types.

Data Usage

Your information is used for the following purposes:

  • To facilitate communication between users and businesses or organisations.
  • To process reports and facilitate resolutions of community issues.
  • To manage and notify users about events and updates.
  • To improve our platform by analysing usage data and feedback.

Data Sharing

We do not sell your personal information. However, we may share data in the following cases:

  • Service Providers: We may share your information with third-party services like cloud hosting providers or analytics platforms (e.g., NTT DATA, Azure) to help us provide the portal’s functionality.
  • Legal Compliance: We may share your data if required to comply with legal obligations, such as responding to a subpoena or other legal processes.

Data Security

We implement strong security measures to protect your data. Your personal information is encrypted and stored securely, ensuring that unauthorised parties cannot access it. However, no system is 100% secure, and we cannot guarantee the absolute security of your data.

User Rights

  • Access and Control: You can access, correct, or delete your personal data by contacting us through the portal.
  • Data Retention: We retain your information for as long as necessary to fulfil the purposes outlined in this policy, after which your data will be deleted or anonymised.

GDPR Compliance

We are committed to protecting your privacy and complying with the General Data Protection Regulation (GDPR), which ensures the protection and privacy of your personal data within the European Union. Under GDPR, you have the right to:

  • Request access to your personal data.
  • Correct any incorrect or incomplete personal data.
  • Request deletion of your personal data.
  • Object to the processing of your data in certain circumstances.
  • Request that we transfer your data to another service provider.

For more information on your rights under GDPR, please visit the GDPR official page.

Licenses for Software and Libraries

This platform uses open-source libraries and third-party software under various licences:

For more detailed licensing information, please refer to the third-party notices section of our website.

Creative Commons License

Our project is licensed under a Creative Commons Attribution 4.0 International License, which allows others to remix, tweak, and build upon our work, even for commercial purposes, as long as they credit the original creation.

This licence applies to all content created by the Community Impact Portal team, except for logos and trademarks owned by third parties such as our partners UCL and NTT DATA.

Logos and Trademarks:

  • UCL (University College London): All rights to the UCL logo are owned by UCL. For more information, please refer to UCL's logo usage policy.
  • NTT DATA: The NTT DATA logo is a trademark of NTT DATA Corporation. For further details, visit NTT DATA's website.

Contact Us

If you have any questions about this privacy policy or the way your data is handled, please contact us at:

Email: [nayeem.khan.23@ucl.ac.uk] [mohamad.habbal.23@ucl.ac.uk] [mouid.khan.23@ucl.ac.uk] [ibrahim.gabol.23@ucl.ac.uk]

Development Blog

Here is the link to our development blog : Development Blog

Monthly Videos

Update Video November

Update Video December

Update Video January

Update Video February

Update Video March