Skip to main content

Industry

Legal Tech

Location

Chicago, Illinois, US

Engagement

4

Year

Focus

Website Design – to make legal content available to all in simple and clear language with visual aids and interactive features

Services

UX & UI Design

Design System

Drupal Migration

Quality Assurance

Third-Party Integration

We partnered with Illinois Legal Aid Online (ILAO), a legal non-profit organization dedicated to making the law understandable and accessible for Illinois residents. We worked together to create a platform that provides comprehensive and easy-to-use legal support.

We designed, built, and migrated the website to Drupal 8 and continued the partnership to migrate the site to Drupal 10. The website has a simplified information architecture and uses plain language to provide clear and concise information to anyone seeking legal guidance.

Challenge

ILAO faced numerous usability and navigational challenges with its Drupal 7 website. This presented a significant issue for individuals in distress seeking time-sensitive legal information.

The Legal Information section was disorganized, creating difficulties for both legal professionals and ordinary individuals in need of legal information. The search for necessary information was challenging, and the website lacked mobile-friendliness, creating challenges for users accessing information on their phones.

The approach

To address the challenges encountered by ILAO users, we collaborated with stakeholders and chose to prioritize content, adopting a design-first approach.

Our emphasis was on enhancing the overall user experience, optimizing workflows, and refining the content architecture and strategy. The objective was to elevate user satisfaction and ensure effortless access to ILAO's comprehensive range of services and resources.

Solution

Discovery

During the discovery phase, we conducted workshops and thorough user research with the goal of understanding and empathizing with the users. We delved deep into their pain points, motivations, and needs.

Through empathy mapping, we discovered that users often felt lost when dealing with legal matters. They struggled to find the necessary information and felt overwhelmed. This increased their distress and impeded ILAO's mission to provide clarity and guidance to individuals seeking legal assistance.

During stakeholder interviews, we identified that the existing site presented difficulties in comprehending the systems of the civil court. There was a lack of clarity in the content hierarchy, and the organization of the content within the legal information section created confusion between the general public and legal professionals. These challenges made it difficult for users to interact with the ILAO website, resulting in a higher drop-off rate.

Stakeholder interviews
Building a master plan

Information architecture

We started by identifying key content formats and their basic functionalities. Then, we structured and organized the content in a logical manner based on user preferences, informed by our research. We prioritized what users would ideally need first when they landed on the platform.

To improve navigation, we set up an information hierarchy and streamlined existing data. We designed a navigation system that is intuitive and efficient for users to find information.

We used clear and concise labels for navigation items, considered hierarchical structures, and implemented breadcrumbs for easy navigation. To ensure accessibility, we provided alternative text for images, ensured keyboard navigation, and used semantic HTML.

The key approach was to define the relationship between the website's content and functionality, resulting in the development of a comprehensive information architecture.

Information architecture

User-friendly interface

Our objective was to strike a balance between conveying essential information, providing services, and maintaining a professional yet friendly visual language for diverse audiences. This includes the general public, legal professionals, and donors.

To achieve this, we designed the homepage with interactive elements to engage users and created a dedicated section that is prominently visible and specifically addresses donors.

Keeping the people of Illinois at the center of the process, the overall layout was designed to be intuitive and user-friendly, ensuring that important information is easily findable and usable.

ILAO Case Study Mockups

UX writing

A great example of collaboration between words and design was the simplification of call-to-actions on ILAO's homepage. Our design team facilitated a compelling solution to encourage users to request and receive legal assistance, achieving the goal of actionable UX writing and fulfilling the primary purpose of the website.

Concise and impactful language was strategically placed alongside visually engaging elements. Clear and persuasive calls-to-action guided users seamlessly toward the assistance request process. The team successfully enhanced the website's effectiveness in encouraging users to seek legal assistance.

UX writing

Drupal migration

The migration of ILAO's website from Drupal 7 to Drupal 8 was a substantial endeavor. It encompassed transferring around 1 million custom entities, nearly 500,000 nodes, various taxonomy elements, a select number of user profiles, and numerous files. The goal was to ensure a smooth transfer of revisions and translations.

During the transition to Drupal 10, the front-end and design teams collaborated to implement a component-based design approach. This approach accelerated project delivery and significantly improved the overall flexibility and efficiency of the migration.

Toolbox

The toolbox feature simplifies the legal process by breaking it down into manageable steps. It offers a checklist within the website's design and structure, allowing users to track their progress and stay organized while navigating the legal system.

Content translation

To improve ILAO's website SEO, we used a Drupal-contributed module that added keywords and descriptions to enhance search engine ranking. We implemented support for importing and exporting XLIFF files to improve the efficiency of content translation, enabling seamless integration and collaboration between different translation tools and platforms.

Design system

The implementation of a scalable design system has proven to be a valuable asset for ILAO. It has contributed to the long-term sustainability and adaptability of the site by ensuring consistency in design elements. This has streamlined the design and development process, resulting in improved efficiency and cost-effectiveness.

ILAO's design system has allowed for the seamless integration of new features and has facilitated migration while preserving the overall design integrity of the website throughout our ongoing partnership.

Design system
ILAO Website Design Mockups

Outcome

The outcomes of our collaboration with ILAO were a result of a smooth integration between UX design and Drupal. This association resulted in easy-to-use navigation, improved search function, and a simplified process for users to comprehend their legal choices and pursue justice when necessary.

We effectively implemented practical UX enhancements, expanded translation capabilities, an improved mobile experience, and heightened security and loading speed. These improvements offer a seamless browsing experience for website users. Optimizing the website's performance will contribute to enhancing user satisfaction and engagement.

I have never worked with a more dedicated group of developers. When I explain what I want, they understand how to approach it, whether it is a site-building task, contributed modules, or something that is going to require custom code. And it goes beyond Drupal, their development practices are deeply professional.

Gwen Daniels

Director, Product Development

Bring us your challenge

We’ll help you get clear on what needs solving,
that’s where we begin

How an academic medical center launched its full site on schedule, with the content migration still running

How an academic medical center launched its full site on schedule, with the content migration still running

Rebuilding Diabetes Food Hub as one connected nutrition planning experience

One operating model for a global portfolio of industrial brands

AI-powered legal search helps 62% more users find legal help

How Banyan Living built a digital guest experience as premium as their properties

Built on trust and purpose, our 5 years of Digital partnership with the UN

Creating a safe digital space for women and girls facing gender based violence

Building a migraine therapy band website for the German market

National Kidney Foundation’s Drupal 7 to 10 migration | Redefining digital operations and experience

Interactive data visualization of climate hazards for the International Organization for Migration, UN

Enabled a Fortune 200 company to launch 2000+ websites via a decoupled DXP

An intuitive platform to find co-living spaces for digital nomads

MVP to a multi-platform real estate app using Decoupled Drupal

Restaurant aggregator web & mobile interface fueled by NodeJS

Overhauling the digital landscape of diabetes.org with Drupal 10 & multisite architecture

Drupal multisite powered HCP portal for a Fortune 500 pharma company

Bringing 70 brands under one umbrella platform for the world's largest FMCG company

Unifying multiple brand sites for a hospitality group with Drupal 9

Launched 11 beer brands via platforming for SABMiller

Connecting 1200+ educators and digitizing resources for Azim Premji Foundation

Drupal 9 & Acquia Site Studio platform for the world largest’s FMCG company

Marketing CMS for Blinkit’s Native Mobile App

Helping buyers shop from multiple boutiques in one place via headless commerce: STA

Expanding global presence for the European Bartender School using Drupal 8

How Kotak Securities rebuilt for speed, scale, and full platform ownership

Increasing employee engagement at HERE Technologies

Platform migration and design system for Stanford GSB

Personalization & effortless content management for Rajasthan Patrika

NSE Clearing — Secure and scalable digital finance solutions with Drupal 9

Redefining user-centric legal access for ILAO with UX design and Drupal

Building the future of healthcare engagement with Lean UX and Drupal

Enabling Ashoka's presence across 90+ geographies with a resilient content architecture

Building a Drupal-powered knowledge management platform for a global nonprofit

Transforming a global nonprofit venture fund platform with Drupal 9

One file only.
128 MB limit.
Allowed types: gif jpg jpeg png bmp eps tif pict psd txt rtf html odf pdf doc docx ppt pptx xls xlsx xml avi mov mp3 mp4 ogg wav bz2 dmg gz jar rar sit svg tar zip.