EmpowerLine Malawi by Tomi ScattiniEmpowerLine Malawi by Tomi Scattini

EmpowerLine Malawi

Tomi Scattini

Tomi Scattini

1 collaborator

The App

Summary

EmpowerLine Malawi is a cross-platform mobile application developed for the Gender and Justice Unit (GJU) in Malawi. The application provides accessible legal information designed to help women understand their rights and find relevant resources when facing difficult situations. Alongside the structured legal content, the application integrates an AI-powered chatbot that allows users to ask questions and navigate the available information conversationally.
I developed the mobile application for iOS and Android using React Native, as well as the WordPress-based content infrastructure used to manage and deliver legal information to the app. Following the initial release, I worked on a second iteration of the platform that expanded the original architecture with multilingual content, redesigned interfaces, voice interaction with the AI assistant, and interactive step-by-step legal guides. All the work was done through Chameleonic within an interdisciplinary team with a copywriter, a UX/UI designer and an Illustrator.

Challenge/Requirements

The main technical challenge was building an application that could present a large amount of structured legal information without embedding that content directly into the mobile application while maintaining a good performance for low internet bandwidths. Legal content needed to be managed independently by the GJU team, while the mobile application needed a predictable data model that could transform this information into native, interactive interfaces. This introduced several engineering requirements:
Build a single mobile codebase targeting both iOS and Android.
Design a CMS architecture capable of representing different types of legal content.
Expose WordPress content through a REST API consumed by the mobile application.
Support relationships and navigation between different pieces of legal information.
Build a robust cache system that permits fast access to the content while being able to update to data changes made by the GJU team.
Integrate an AI assistant with the application's legal knowledge base.
Introduce multilingual content without duplicating application logic.
Support richer content structures such as interactive legal guides.
Extend the chatbot beyond text-based interaction with voice input and output.
Keep the system maintainable by non-technical content editors. The second version introduced an additional architectural challenge: the existing application and content model had to evolve without turning each language or new content format into a separate implementation.

Solution

Cross-platform mobile application
I built the application with React Native, maintaining a shared codebase for the iOS and Android versions.
The UI was implemented as a set of reusable components capable of rendering different types of legal resources returned by the backend. NativeWind was used for styling and for implementing the redesigned visual system introduced in the second iteration.
Instead of treating pages as static screens, much of the application is driven by structured data retrieved from the API. This made it possible to expand and update the legal content without requiring a new application release for every content change.

WordPress as a headless CMS

WordPress is used as the content management system behind the application.
Rather than using WordPress as a traditional website, I extended it as a headless CMS and exposed the required content through the WordPress REST API.
Different legal resources are represented through custom post types, taxonomies, custom fields, and relationships. On the mobile side, this data is transformed into native React Native interfaces.
I also extended WordPress with custom PHP functionality where the standard CMS capabilities were not sufficient. This included extending REST API responses and introducing application-specific content structures.
This architecture created a separation between the two systems:
WordPress → REST API → React Native application
Content editors can therefore manage legal information through WordPress while the application remains responsible for presentation, navigation, and interaction.

Multilingual content architecture

For the second version, I extended the content system to support multiple languages.
Rather than hard-coding translated content in the application, language became part of the CMS data model. Content can be associated with a language through a custom WordPress taxonomy and queried through the API accordingly.
The REST API was extended to expose this information consistently across the different content types.
This allowed the React Native application to switch languages while continuing to use the same screens, components, and data-fetching architecture.

Structured legal guides

The second iteration also introduced Legal Guides: interactive, step-by-step explanations of legal processes.
This required moving beyond conventional rich-text content.
I created additional structured content models in WordPress for representing the individual sections and steps of a legal process. The mobile application interprets this structure and renders it as an interactive guide.
The result is a CMS-driven feature: editors define the legal process and its content in WordPress, while the application determines how that process is presented and navigated.

AI assistant and voice interaction

The application includes an AI-powered chatbot designed to help users navigate the available legal information through natural-language questions.
In the second iteration, I expanded the chatbot experience with voice interaction, allowing users to interact with the assistant without relying exclusively on text input.
From an application perspective, the chatbot was treated as another interface to the platform's legal information rather than as an isolated feature. Users can move between structured legal resources and conversational assistance depending on how they prefer to find information.

Custom content editing

One important part of the project was making increasingly complex application content manageable through WordPress.
As the application evolved, standard rich-text editing was no longer enough. Content needed to reference glossary terms, legal topics, documents, sections, and application-specific UI elements.
I extended the WordPress editing experience with custom fields and editor functionality so content editors could create these relationships without manually writing application-specific markup.
This kept implementation details inside the platform while providing editors with a manageable CMS interface.

Impact

The resulting architecture separates content management from application development.
Legal information can be created and updated through WordPress and delivered dynamically to both iOS and Android without embedding that content into the application itself.
More importantly from an engineering perspective, the architecture was able to evolve beyond the requirements of the initial release.
The same foundation was extended to support multilingual content, richer structured legal processes, a redesigned interface, and voice-enabled AI interaction without requiring separate applications or independent content systems.
For me, the project was particularly valuable because it went beyond implementing a mobile interface. It involved designing the boundary between a mobile application, a CMS, structured legal content, and AI-powered functionality while keeping the system usable by non-technical content managers.

Skills

Mobile
React Native
TypeScript
NativeWind
Cross-platform development
iOS
Android
Responsive mobile UI Backend & CMS
WordPress
PHP
WordPress REST API
Custom Post Types
Custom Taxonomies
Custom Fields
Headless CMS architecture
Custom WordPress development Application Architecture
REST API integration
CMS-driven applications
Multilingual architecture
Structured content modeling
Cross-platform architecture AI & Interaction
AI chatbot integration
Voice interfaces
Conversational UI Development
API design
Data modeling
Mobile application architecture
CMS architecture
Content editor tooling
Like this project

Posted Jan 9, 2025

Developed the EmpowerLine Malawi app for Gender and Justice.This mobile app, built with React Native, empowers victims of violence, particularly women in Malawi