User Centered Design saves thousands of dollars and creates flexible website network

Challenge: take back control and improve user interface

As they approached their 2016 tri-annual website refreshing, the International Life Sciences Institute (ILSI) recognized that they were harboring more issues than just a simple design change.After assessing their website and analyzing the issues, ILSI prepared themselves for a website overhaul. Their main website, which was hosted in an on-premises version of SharePoint 2010, had limited flexibility and problems with editing content. These frustrations caused their 18 worldwide branch sites to disconnect and use their own platforms. And, because of the variety of languages and cultures represented in each location, the branches developed their own needs and desires for their website designs—creating major inconsistencies in ILSI’s website standards.

Journey: connecting the network and managing costs

In an attempt to maintain their control and build a better network of branch sites, ILSI reached out to a team of graphic designers to conduct user research and develop a better design for their website. They then turned to an IT strategy and consulting firm, MainSpring, Inc., to assess the cost of implementing the new design using the existing SharePoint site. The cost, however, was steep, so MainSpring suggested that ILSI move to a new host site—WordPress.

MainSpring knew ILSI needed an easy-to-use, cost-efficient solution to increase the flexibility of their website. To accommodate for each of the branch sites and their unique needs, MainSpring suggested using WordPress as ILSI’s host.

Once the new content management system (CMS) was agreed upon, MainSpring assessed ILSI using a process called UCD to gather more in-depth information about the organization—that way, there would be no cookie cutter designs. After spending time reviewing ILSI’s needs and goals, MainSpring developed deliverables to facilitate discussions about the overall plan for the project, beginning with user personas.

MainSpring helped ILSI differentiate between the various users in their target audience and separate them based on their reason for visiting the site and what they were looking for. This discovery process led ILSI to identify and create four different user personas that best described their target audiences.

Using personas, MainSpring charted their journeys through the site and created site maps to solidify the content structure of ILSI’s website. Together, they reassessed ILSI’s initial challenges to assure their needs were being met.

Once the site maps were perfected, MainSpring developed wireframes for ILSI’s website. Despite the lack of color and pictures, this step allowed MainSpring to present the overall organization of the website without investing a great deal of time and money into the walk-through stage. This allowed ILSI to save their budgeted hours for the actual design process and make several revisions to their predetermined design idea.

After numerous walk-throughs, ILSI approved the flow of the content structure, and MainSpring began developing the website’s design, mimicking ILSI’s pre-planned scheme as best as possible. They added photos and menus to the organization/structure of the homepage, which illustrated how to view various content and photos and provided the general aesthetic view of the website.

When they received approval for the design, MainSpring created the interface architecture—an internal document that sorts content into pages or posts and defines how individual elements work. MainSpring also used this document to store the website templates, along with various other fields of data for the site. Finally, MainSpring built ILSI’s custom website, which launched in July 2016.

Impact: thousands of dollars saved and a cohesive website design

After breaking down expenses and examining quotes, ILSI found that switching to WordPress would save them $51,000 upfront. That money was then reinvested into the discovery and planning process for their website overhaul. And, in just under one year, MainSpring delivered a solution that resulted in a visually-striking, interactive and flexible network of sites that has significantly improved UX.

Using custom-built metadata and a tagging system, MainSpring developed an organized content structure with a search feature to help users navigate the website. This feature improved UX for ILSI’s stakeholders and allowed ILSI to present their research with transparency—ultimately ensuring confidence in the integrity of the scientific process.

With an easy-to-use backlog system, ILSI was able to avoid hiring more staff to help manage the website; WordPress’s intuitive platform made editing content a simple process. Additionally, each of ILSI’s branch sites were able to retain some control over managing users and content, yet, ILSI, as an administrator, gained the ability to supervise the plug-ins and themes that the branches can use. While the branches retained a degree of autonomy from the national organization, their content still fed into ILSI’s website—creating a unified network of sites.

MainSpring helped ILSI transform their web presence from a labor-intensive, expensive, inefficient solution to one that better positions the organization to meet their mission in a simpler and smarter way.