Blog Project
PNL Mahdia is a Tunisian non-profit known for creative social impact — repurposing old hardware into art, donating refurbished laptops to rural schools, and running STEM workshops for kids using donated Arduino kits.
The problem: every project built during those workshops was being lost. No documentation, no shared library, nothing to build on.
They came to me as both their designer/developer — and as an active volunteer facilitator who had worked directly with the target users.
Readers — Students, teachers, and curious newcomers. Open access, no account needed. Many discovering technology for the first time.
Contributors — Mid-aged teachers with basic computer skills. Typing is a challenge. Writing structured multilingual guides is even harder.
Language priority: Arabic RTL first. French and English as secondary — not the other way around.
Define → Wireframe → Prototype → Develop → Test with real users → Iterate.
Wireframes were validated with the PNL team before any development began. RTL and LTR layouts were designed in parallel from day one, not retrofitted. Contributor accounts are invite-only; all project content is publicly accessible for free.
Problem 1 — Filling forms in 3 languages was too hard.
Mid-aged teachers with basic typing skills were abandoning the contribution form.
→ Added a one-click auto-translate button. Fill in Arabic, click translate, done.
Problem 2 — A blank form intimidated contributors.
Teachers skipped steps or submitted incomplete guides.
→ Introduced a default 3-step scaffold: Gather materials → Assembly → Install & test.
→ Result: 70% increase in contribution efficiency.
Problem 3 — Writing a clear guide was still a barrier.
Some teachers had great project ideas but couldn't structure or write them.
→ Integrated AI generation: enter a title, click once. AI writes the full guide, step-by-step, in all 3 languages. Teacher reviews and publishes.
→ Reduced time-on-task, removed most typing, and gave non-writers the confidence to contribute.
Problem 4 — Resources sidebar was distracting.
A sticky side panel pulled focus from the main content.
→ Moved resources to the bottom. Users reach them naturally after reading the project.
The Arabic RTL layout wasn't bolted on — it was the primary design. Every component was built to feel native in Arabic. The mobile layout includes a real-time language toggle that switches the entire interface direction, designed to be discoverable without any technical knowledge.
