Bilingual Archive
Category:
Web Design
Duration:
10 weeks


This bilingual archive project blends cultural sensitivity with modern usability, creating a digital space where Arabic and English coexist seamlessly.
Designed for the Lebanese Diaspora Center, it allows users to explore historical newspapers, documents, and family records with ease.
The layout balances institutional trust with a clean, contemporary visual identity, making archival research more accessible to both scholars and community members.
This bilingual archive project blends cultural sensitivity with modern usability, creating a digital space where Arabic and English coexist seamlessly.
Designed for the Lebanese Diaspora Center, it allows users to explore historical newspapers, documents, and family records with ease.
The layout balances institutional trust with a clean, contemporary visual identity, making archival research more accessible to both scholars and community members.
This bilingual archive project blends cultural sensitivity with modern usability, creating a digital space where Arabic and English coexist seamlessly.
Designed for the Lebanese Diaspora Center, it allows users to explore historical newspapers, documents, and family records with ease.
The layout balances institutional trust with a clean, contemporary visual identity, making archival research more accessible to both scholars and community members.
Project Overview
Project Overview
The Challenge: Lebanese diaspora newspapers in Arabic were difficult to access and search, especially for Arabic-speaking users.
The Product & Platform: A bilingual digital archive, designed for desktop.
The Users & Their Needs: Researchers, students, and diaspora members needed easier ways to explore materials in both Arabic and English, with culturally intuitive navigation and search.
My Role & Team: I was the sole UX/UI designer, working closely with backend developers and archivists to align design with content, metadata, and platform needs.
The Challenge: Lebanese diaspora newspapers in Arabic were difficult to access and search, especially for Arabic-speaking users.
The Product & Platform: A bilingual digital archive, designed for desktop.
The Users & Their Needs: Researchers, students, and diaspora members needed easier ways to explore materials in both Arabic and English, with culturally intuitive navigation and search.
My Role & Team: I was the sole UX/UI designer, working closely with backend developers and archivists to align design with content, metadata, and platform needs.
The Challenge: Lebanese diaspora newspapers in Arabic were difficult to access and search, especially for Arabic-speaking users.
The Product & Platform: A bilingual digital archive, designed for desktop.
The Users & Their Needs: Researchers, students, and diaspora members needed easier ways to explore materials in both Arabic and English, with culturally intuitive navigation and search.
My Role & Team: I was the sole UX/UI designer, working closely with backend developers and archivists to align design with content, metadata, and platform needs.

My Approach
As the sole designer, I led everything from research to final UI handoff.
Approach Highlights:
Interviewed Arabic-speaking users and researchers
Created quick personas to guide user goals and needs
Audited the old archive and ran a heuristic evaluation and studied strong examples
Sketched bilingual flows and wireframes
Prototyped both English and Arabic versions in Figma
Collected feedback and iterated across 3 rounds
Shared design specs and assets with the dev team
Tools: Figma, Adobe CC, Google Workspace
As the sole designer, I led everything from research to final UI handoff.
Approach Highlights:
Interviewed Arabic-speaking users and researchers
Created quick personas to guide user goals and needs
Audited the old archive and ran a heuristic evaluation and studied strong examples
Sketched bilingual flows and wireframes
Prototyped both English and Arabic versions in Figma
Collected feedback and iterated across 3 rounds
Shared design specs and assets with the dev team
Tools: Figma, Adobe CC, Google Workspace


Defining the Problem
Defining the Problem
Through early audits, interviews, and competitive analysis, it became clear that users were struggling on multiple levels. Over time, these issues eroded trust in the platform.
Core Problem:
How might we design a bilingual interface that feels intuitive, culturally familiar, and aligned with institutional branding—while working within technical and layout constraints?
Through early audits, interviews, and competitive analysis, it became clear that users were struggling on multiple levels. Over time, these issues eroded trust in the platform.
Core Problem:
How might we design a bilingual interface that feels intuitive, culturally familiar, and aligned with institutional branding—while working within technical and layout constraints?



Ideation and Lo-fi wireframes
Ideation and Lo-fi wireframes
I began by exploring multiple interaction patterns for switching languages, browsing content, and navigating archival materials. Early concepts included toggle-based language switching, all-in-one encapsulating layouts, and soft animated transitions to help users adjust between directions.
I sketched and iterated user flows and built wireframes in both English and Arabic. I tested directional alignment, spacing, and hierarchy to ensure both versions felt native and balanced. My background in visual storytelling helped me design layouts that were not only usable, but also carried emotional clarity through typography, contrast, and rhythm.
Designs were refined across several rounds of internal feedback.
I began by exploring multiple interaction patterns for switching languages, browsing content, and navigating archival materials. Early concepts included toggle-based language switching, all-in-one encapsulating layouts, and soft animated transitions to help users adjust between directions.
I sketched and iterated user flows and built wireframes in both English and Arabic. I tested directional alignment, spacing, and hierarchy to ensure both versions felt native and balanced. My background in visual storytelling helped me design layouts that were not only usable, but also carried emotional clarity through typography, contrast, and rhythm.
Designs were refined across several rounds of internal feedback.


Outcomes & Reflections
Outcomes & Reflections
The Final Design:
The new bilingual archive is easier to navigate for both Arabic and English users. It feels clearer, more welcoming, and better aligned with the archive’s goals. Key actions like browsing and searching are now more intuitive.
Impact:
Feedback from users and collaborators showed that the design felt more inclusive, especially for Arabic speakers. The visual clarity and updated structure also made it easier for the archive team to manage and grow the site.
Reflection:
This project taught me a lot about balancing user needs with technical realities. I worked closely with backend developers and archivists to align design goals with what was feasible. It also reminded me to leave room for gradual implementation—good design sometimes means pacing things so the whole team can move forward together.
The Final Design:
The new bilingual archive is easier to navigate for both Arabic and English users. It feels clearer, more welcoming, and better aligned with the archive’s goals. Key actions like browsing and searching are now more intuitive.
Impact:
Feedback from users and collaborators showed that the design felt more inclusive, especially for Arabic speakers. The visual clarity and updated structure also made it easier for the archive team to manage and grow the site.
Reflection:
This project taught me a lot about balancing user needs with technical realities. I worked closely with backend developers and archivists to align design goals with what was feasible. It also reminded me to leave room for gradual implementation—good design sometimes means pacing things so the whole team can move forward together.



Final protoype

