Invasive Plants Identification App

Project phases

Published: March 12, 2024

Last Updated: 2 months ago.

View All Projects

Community gardeners face significant challenges when it comes to obtaining accurate and up-to-date information about the plants they purchase. Naming conventions are not standardized, and plants that are considered invasive in one region may not be so in another. This knowledge gap often leads to the unintentional planting of invasive species, which pose a threat to native species and ecosystems. As an example, seemingly harmless plants like English ivy can overwhelm British Columbian ecosystems, while being completely harmless in other regions.

Approach

To address this challenge, the UBC CIC developed a photo-identification mobile application, available on both iOS and Android devices, that integrates with the Pl@ntNet API. This solution provides gardeners with a user-friendly interface, offering a comprehensive database of invasive plants. Users can either manually search or take a picture for identification leveraging the Pl@ntNet’s plant identification service, which will provide a list of potential matches with probability percentages. This approach allows users to leverage their own expertise in identifying the plant.

The application will not only provide general characteristics of identified plants but also suggest alternative non-invasive species for consideration. Users can set their location to account for regional variations in invasiveness and create personalized plant lists as well.

Moreover, the admin web application allows authorized administrators to edit the database of invasive plants, alternative species, and regions through a secure dashboard, allowing the solution to be scaled up as needed.

Screenshots of UI

Admin Dashboard

The admin dashboard's invasive species page
Invasive species page
The admin dashboard's dialog popup when adding an invasive species
Adding an invasive species
The admin dashboard's dialog popup when editing an invasive species
Editing an invasive species
The admin dashboard's alternative species page
Alternative species page
The admin dashboard's regions page
Regions page

Mobile App

The mobile app's homepage
Home page
The mobile app's identification page
Identification page
The mobile app's results page after after identifying a safe, non-invasive plant species
Safe plant results page
The mobile app's results page after after identifying an invasive plant species
Invasive plant results page
The mobile app's plant lists page
Plant lists page
The mobile app's sign up page
Sign up page
The mobile app's login page
Login page

Technical Details

This section provides an overview of the components and services we used to develop the prototype.

The solution consists of 3 main components: 

  • The client mobile application
  • The admin web application 
  • The database backend that interfaces both the web and mobile applications

Modifications to the data made through the administrator dashboard are reflected immediately in the database. These changes will be reflected on the mobile app after every refresh.

Architecture Diagram

Step-By-Step

The following includes a simplified walkthrough of the solution and describes how all of the components interact.

Admin Web Application

The admin web application is a dashboard where administrators can manage and modify the database of invasive plants. It provides a secure and user-friendly interface to edit, update, and customize the information about invasive species (and their alternatives) available to users through the mobile app. It interacts with the API that connects to the database and is hosted as a container on Amazon Elastic Container Service (ECS) Fargate.

  1. The admin user sends a request to a Cloudfront Distribution with caching enabled. A Web Application Firewall (WAF) will ensure that general security protection is enforced.
  2. On cache miss, Cloudfront will send a request to an Application Load Balancer (ALB), which checks the health status of the container.
  3. A container image file is used to run on a container as an ECS task using Fargate, a serverless compute engine for containers. If a task fails, the ECS Service will redeploy a new task.
  4. The admin user then logs into the web app. Behind the scenes, the web app will forward the authentication to Amazon Cognito.
  5. The web app then makes requests to various endpoints on the API Gateway. Each request is passed with the JSON Web Token that will trigger a Lambda Authorizer to check if the user is in the admin user group.

Client Mobile Application

The client mobile application integrates the Pl@ntNet API to accurately identify plant species. Upon identification, the app determines if the plant is invasive or not given the user’s region. The user also has the ability to save plants into their own lists. The displayed plant information is sourced from Pl@ntNet, Wikipedia, and official provincial websites.

  1. A mobile app user can sign up/in to the app or proceed as a guest. When a user signs up, the mobile app that runs on Flutter makes a request to Cognito. Upon successful authentication via verification code, the verified user is created.
  2. The app then makes a request to the API Gateway on the /invasiveSpecies, /region, and /saveList endpoints. Only the /saveList endpoint requires that the user is signed in.
  3. A request to the /saveList endpoint triggers the Lambda Authorizer. Further explanation of the API Gateway can be found in the API Interaction section.
  4. When identifying a plant, various servers are queried: the Pl@ntNet API utilizes machine learning to identify scientific names, the Wikipedia API provides plant details, and the ML-derived scientific name is cross-referenced with our backend database for invasive species.

API Interaction

This section assumes that the request already authenticates accordingly from the two sections above.

  1. Upon successful authentication, the API Gateway will forward the request to one of the lambda integrations that queries the database managed by Amazon RDS, either retrieving, uploading, or updating the data.
  2. Admin-uploaded plant image files are stored in an S3 bucket. CloudFront has a cached copy of the requested file and delivers it to the user. If the requested file hasn’t been cached, CloudFront retrieves it from the S3 bucket.
  3. The MediaWiki API is also utilized to extract plant information from their respective Wikipedia pages based on scientific name. After the details, links, and images are retrieved, they are organized into a structured format and cached for future usage.

Link to the mobile app solution on GitHub: https://github.com/UBC-CIC/InvasivePlantsFlutter

Link to the admin page/database management solution on GitHub: https://github.com/UBC-CIC/InvasivePlants

Visuals

Infographics

An infographic for the solution's user workflow
An infographic for the solution's admin workflow

Demo Video

Acknowledgements

Photo by iStock

About the University of British Columbia Cloud Innovation Centre (UBC CIC)

The UBC CIC is a public-private collaboration between UBC and Amazon. A CIC identifies digital transformation challenges, the problems or opportunities that matter to the community, and provides subject matter expertise and CIC leadership.

Using Amazon’s innovation methodology, dedicated UBC and Amazon CIC staff work with students, staff and faculty, as well as community, government or not-for-profit organizations to define challenges, to engage with subject matter experts, to identify a solution, and to build a Proof of Concept (PoC). Through co-op and work-integrated learning, students also have an opportunity to learn new skills which they will later be able to apply in the workforce.