Help where help is needed
MICA hasn’t been able to keep up with their surging impact and importance and needs their digital presence to “play bigger” and a multi-lingual strategy that makes information widely available to targeted audience groups. Their dated hosting platform has made it difficult to maintain a consistent strategy, forcing them to come up with piecemeal content solutions so they’ll need a sustainable platform that helps them level up their content management, language support, and overall design standard.
PROJECT GOALS
Untangle the current language complexity impacting content and navigation, and define a path forward to a more modern localization approach.
Structure content so that it supports users within the logical flows that make sense for their needs.
Provide a consistent template model that lets the team deliver content in more systematic way and is managed with user-friendly, scalable admin tools.
Scoping the work
MICA needs an intuitive navigation model that supports different user roles and actions, combined with proper localization to make all content available to all language preferences. Simultaneously, managing the site needs to be easier, with dependable templates supporting staff as they add and evolve content over time. Our efforts needed to focus on an evaluation of their existing content platform, an architecture assessment combined with medium fidelity templates of all pages, a proposal for a new localization enabled hosting platform, and high fidelity examples of a few key pages. With these recommendations, MICA will plan their development timeline and pursue grant funding.
Discovery
- Kick-off and goal alignment
- Weebly site audit
- Audience persona and content analysis
Design
- Content modeling and navigation restructure
- Wireframes, standardized content template development and prototyping
- Brand guide updates
- Platform recommendation documentation
- Alignment checks, documentation and knowledge transfer
Development*
- WordPress framework setup & optimization
- Custom “Reusable Content Blocks” development
- LGL form integration
- Multi-language localization implementation
- Legacy content migration from Weebly
- Final WCAG 2.1 AA accessibility testing
Launch*
- Knowledge transfer and tool training
- “Quick Start” documentation
- Go-Live plan and production environment deployment
*Not part of Design Allies project
Structuring the content
As usual, we began with a full content audit to get an elevated view of MICA pages and navigation categories. This revealed that the site is currently operating as a flat hierarchy without a directory structure to inform SEO about the page weights across the site. This should be addressed quickly, as it negatively impacts their ranking performance.
Card sorting and flow modeling exercises revealed two dominant user types; those seeking legal services (clients) and community members (allies) who are looking to support the MICA mission. Today, these two use cases don’t have distinct pathways for action, and material relevant to both is interwoven in blurred categories. As a result, users experience content in a fragmented way and miss opportunities to flow through desirable outcomes from learning, to volunteering, to donating, or more being led through MICA’s rich content story.
It’s also important to note that a significant portion of MICA’s content is available in either English or Spanish which risks leaving a Spanish speaker unable to donate, or an English speaker missing vital information to protect themselves during an immigration raid.
Templating consistency
After identifying the semantic themes within the existing content, we built a small collection of flexible templates that will provide useful constraints to the MICA team. These clean, familiar layouts will let them focus on the story they are telling or the action they are encouraging.
Technical recommendations
MICA’s current platform and localization solution is a Weebly hosted template with page-level Google translate widgets which are combined with static navigation labels that show multiple languages simultaneously (eg. About MICA/Sobre MICA). Importantly, Weebly’s new owner, Square, is no longer offering platform updates and recommends that users manually transition their content to their alternate platform Square One. Our assessment is that Weebly lacks proper template management and localization support.
To find alternative options that meet MICA’s requirements, we reviewed three low complexity options: Square One, WordPress, and Webflow. Based on cost, ease-of-use, and breadth of localization options, we are recommending WordPress (WP) as it supports MICA’s required integration with LGL forms, offers WCAG compatible themes and validation plugins, has decent design functions, and is offered by many hosting services at very reasonable prices. It is also ubiquitous within the non-profit space, ensuring that future employees will have comfort with the system.
Specific to localization, WP offers a range of plugin options, from free (static or basic) to $200 per year (AI-generated with page level overrides). We researched the strengths and weaknesses of automatic translation services vs. static content managed by staff and believe automatic translation is worth trying for the initial effort, but informed MICA that costs or quality in translations may leave something to be desired. Fortunately, WP can support both approaches.
Brand guidelines
MICA’s colors and logo are seen as steadfast parts of their community appeal, with the bright color palette reflecting the diversity of the people they serve. With that in mind we focused design scope around tools and teaching to define brand standards within the organization, and working within the existing color palette to bring some color nuance. We also selected the open source Noto Serif font for its friendly, welcoming style paired with Inter to be a solid baseline for navigation and buttons.
The results
While we didn’t build the final site, we provided a blueprint and a technical roadmap to migrate to a modular WordPress environment, along with a set of high-fidelity wireframes, and a content strategy recommendations based on scannable, “chunked” information.
Key takeaways:
- Guidelines for moving away from dense “walls of text” to scannable, modular structures so that people in high-stress situations can find help quickly.
- Distinct digital journeys were created for those seeking legal information and those wishing to support them, ensuring localized resources are prioritized for those needing them most.
- A technical outline and strategy was provided for migrating to a stable WordPress environment, baking accessibility standards (WCAG 2.1 AA) and mobile-responsive designs into the organization’s foundation.