Heka Leka is a non profit organization which has a dream of creating an intelligent, cultured, and impactful Maluku society that embraces values rooted in Maluku culture and Pancasila. VRDA helped their team develop and redesign a lightweight website so the organization can expand their influence broader around the world.
How We Developed Heka Leka Website
Received UI design in Figma
Develop and redesign the website based on the UI
Feedback & revison after development
Migration and publicity
The interesting story about Heka Leka project was the website previously built in Laravel framework. Therefore, it was challenging to migrate from one framework to another as well as redesigning it.
Here are the steps we did to make it seemless :
- We received a UI design in Figma from Heka Leka team. This design would be our reference for developing website’s front page.
- We then proceed to the website development process. The development was done in the staging website first because we didn’t want to make changes directly in the production website.
- Once development completed, we submited the website to Heka Leka team for corrections and revisions if there is any.
- Revisions were done, and this process was repeated until the team was satisfied with the results.
- Finally after their team was satisfied with the results, we could proceed the migration from staging website to the production website.
Features We Developed on Heka Leka Website
Below are the features we developed on Heka Leka website to support the needs of the organization :
- Multilingual Support
The website is available in English, Dutch, and Indonesian to accommodate international visitors and potential clients. - Responsive Design
Automatically adjusts to different screen sizes for a smooth and consistent browsing experience. - News
The news page was customized based on the Figma design and applied consistently across all published posts. - On Page SEO
We optimize the website so it will be easier to rank in search engine using on page SEO. - Donation
Adding donation features through various popular platforms such as Paypal, QRIS, and direct bank transfers.
Highlighted Feature #1 : Donation
Donation is a feature where visitors can donate some amount of money for the future of Maluku children.
In all of the available languages, donation can be done in three currencies, they are USD, IDR, and EUR.
- USD donation can be done via website directly, where the website is already integrated with Paypal.
- IDR donation will be done via QRIS, where visitors will need to scan the provided QR code to make donations.
- EUR donation can be done by direct transfer to Heka Leka Global bank account which is based in Netherlands.
Highlighted Feature #2 : News
News is actually just a blog page. It might sound very common, but the thing was that the previous website contained more than 300 articles on it, and around 100 of them needed to be transfered to the new website.
Heka Leka team realized this, and asked us if there was a way to do it without uploading the article one by one.
We then developed a custom plugin to solve this problem. Here were the process on how to make the plugin and upload the articles by bulk :
- Heka Leka team provides list of articles which were needed to be transferred in csv format, including all of its languages, categories, titles, etc.
- We developed the plugin based on the csv format given on the local host or staging site.
- After making sure that the plugin was error free, we then installed it on the live website.
Notable Achievement : 3.3k+ Impressions & 180+ Clicks
In around 3 months after website launch, Heka Leka website got a notable achivements.
We optimized each page available for search engines and helped them to get more than 3.3k+ impressions and 180+ clicks on Google.
Previously, Heka Leka team could not even track the the traffic of the website.
As a developer, one of the things we could help to get those numbers were by optimizing on page SEO. These are things we did to optimize on page SEO :
- Making sure the heading was well structured
- Setting up meta title and its description
- Setting up url slug
- Connecting pages using internal links
- Writing alt text for each image
