Embedded Files
Inter-American Defense College Website Redesign
Restoring Clarity and Credibility Across Four Languages
Restoring Clarity and Credibility Across Four Languages
I led the redesign of the Inter-American Defense College (IADC) website on WordPress to address systemic usability failures that were especially severe on mobile.
The legacy site (see screenshots) surfaced multiple compounding problems:
01 Critical admissions and academic content was buried behind deep, inconsistent navigation
02 Language switching was disconnected from content structure, causing mistranslations and broken parity
03 Mobile menus exposed institutional silos instead of user tasks
04 Students and applicants had no single place to access schedules, coursework, conferences, or registrar resources
The redesign prioritized clarity, parity, and task completion—particularly for international users accessing the site primarily on mobile devices.
Legacy IADC Website
Project Overview
Project Overview
Role
UX/UI Designer & Information Architect
(Website Redesign, Multilingual UX Strategy)
Platform Context
WordPress (CMS), Elementor (component-based UI builder), multilingual translation plugins, third-party academic systems integration
Engagement Type
End-to-end UX redesign and information architecture for a multilingual academic website, including admissions workflow redesign, mobile navigation overhaul, translation governance, and student portal definition and implementation (MyIADC)
Transforming Admissions and Multilingual Access
Transforming Admissions and Multilingual Access
Legacy mobile UX diagnosis
Legacy mobile UX diagnosis
The archived mobile views revealed several root problems:
Navigation overload: Long accordion menus forced users to scan institutional categories instead of answering simple questions like “How do I apply?” or “Where is my class schedule?”
Content burial: News, mission statements, and historical content dominated the mobile experience while high-value tasks (admissions steps, academic logistics) were pushed far below the fold.
Language ≠ structure: Switching languages did not guarantee equivalent navigation paths or content availability, increasing cognitive load for non-English users.
These issues framed every design decision that followed.
Admissions redesign: from static pages to workflow
Admissions redesign: from static pages to workflow
Building with Elementor under constraints
Building with Elementor under constraints
At the time, I was not deeply versed in custom development. I used Elementor intentionally as a component system, translating wireframes into reusable sections optimized for mobile, multilingual parity, and long-term maintainability.
Admissions content was restructured into a sequential, decision-based flow:
Eligibility and audience definition
Required documentation
Timelines and key dates
Application steps
Post-submission expectations and contacts
This replaced the legacy state where admissions information was fragmented across multiple pages with no clear entry or exit points—especially painful on mobile.
Multilingual execution: trials, errors, and resolution
Multilingual execution: trials, errors, and resolution
Early attempts using auto-translation tools, including Google Translate-driven approaches, failed immediately. Military, academic, and institutional terminology was mistranslated; tone shifted unpredictably; and mobile layouts frequently broke. These weren’t cosmetic issues—they undermined trust.
“Easy” multilingual plugins introduced additional problems:
Inconsistent mobile menus across languages
Broken internal links when switching languages
No reliable editorial or approval workflow
The final solution was a translation system, not just a plugin:
Human translation for all core admissions, academic, and student-facing content
A shared terminology glossary for academic programs, ranks, offices, and modules
A translation QA checklist validating page parity, links, assets, and mobile layouts
Defined ownership and sign-off before publishing
The plugin handled delivery; governance ensured accuracy.
MyIADC: fixing student fragmentation
MyIADC: fixing student fragmentation
Legacy screenshots show no clear student entry point—resources were scattered across Academics, Publications, News, and static pages.
I created MyIADC, a student portal embedded directly into the site navigation. It centralized:
Academic modules and schedules
Conference information
Registrar-managed records and document storage
Links to a third-party academic application used for coursework
This reduced reliance on email, institutional memory, and ad-hoc guidance.
Page updated
Report abuse