The Hawaii Government Employees Association (HGEA) is the state’s largest public-sector labor union, dedicated to advocating for fair wages, benefits, and working conditions for government employees. Started in 1934 in response to 10% pay cuts to Honolulu Board of Water Supply managerial employees, HGEA has since grown to over 37,000 members across nine bargaining units. Through collective bargaining, legislative action, and quality representation, HGEA works to protect and enhance the rights of its members.

HGEA came to 14 Oranges with an ambitious goal: to completely reimagine their website and introduce a new mobile app that would deliver added value to their members. Their old website relied on a difficult-to-manage content system and had accumulated numerous outdated pages over the years. Maintaining it had become a growing challenge for the HGEA team.

Design and Development Strategy

14 Oranges worked with the key stakeholders at HGEA throughout the entire development process. The strategy of our design and development process is based on an engineering mindset and has been perfected over many years deploying solutions to our organizations large and small. 

Research and Requirements Phase

During this phase we interviewed members of the HGEA team to understand the issues they faced with their existing website, and to identify their vision and goals for the new website and mobile app. One of the key challenges was that the website was difficult to navigate and overly bloated with out of date content. We analyzed the website and designed a new menu navigation structure and site-map. Using this new structure HGEA conducted a thorough purge of old pages and media files that would no longer be needed on the new website. We also discussed the requirements for integration with HGEA’s own in house user management system, and the need to support single sign on in the mobile app.

The requirements for the mobile app were to provide an on the go companion to the website, with the added benefit of supporting push notifications as well as a strong focus on member only content such as their contract and individual membership card. The app requirements were an ideal fit for our Info Grove Mobile App platform.

Wireframes and Design Phase

The next step was to create wireframes for the website and the mobile app. The wireframes defined key usability features such as the page header, menu navigation, footers and overall page layouts. HGEA provided detailed guidance on their brand colours, as well as the desire to incorporate key Hawaiian elements into the design. Our graphic design team then created the design elements to use throughout the website and mobile app.

Implementation Phase

Once the wireframes and design comps were approved, 14 Oranges began the implementation phase of the project using an agile approach. The project was broken down into regular milestones where tasks were completed in priority order as defined during the research and requirements phase. The 14 Oranges team met weekly with HGEA to review progress, demonstrate updates on the new site, and synchronize tasks between the two teams. 

Implementation of the website was completed within a development environment where search engine crawlers (bots) had been disabled preventing the site from being indexed by popular search engines. Throughout the life of the project, access to the development environment was provided to HGEA staff allowing them to monitor the status of the new website at their leisure.

For this project, 14 Oranges used WordPress, which has been our go-to platform for most of the website projects we have completed over the last 15 years. WordPress is widely deployed and well supported. It also comes with a multitude of plugins (free and paid) to expand its capabilities or enable easy integrations with a variety of 3rd party systems. We worked with HGEA to identify suitable plugins for features such as calendar RSVPs, custom form fields and media file management.

In parallel with the website development, we worked on building the mobile app content using the modules of the Info Grove content management system. The HGEA team was provided with access to a beta version of the iOS and Android apps, so they could review the branding and content on their mobile devices.

Quality Assurance Phase

Once the majority of the website development was complete, 14 Oranges completed a formal round of quality assurance with its experienced team of testers to ensure the site was functioning properly on all supported browsers and operating systems.

Training & Acceptance Phase

14 Oranges provided HGEA with detailed hands-on training on the WordPress backend and the Info Grove CMS. HGEA used the development site and beta app to continue refining their content, test with their internal systems and gather user feedback from a limited soft launch user group. Throughout this time 14 Oranges provided support to answer questions and implement minor updates as requested.

Deployment Phase

HGEA provided a date of February 2nd to launch the app. Our teams worked together to deploy the new site to HGEA’s production environment and simultaneously launch the mobile app in the App and Play Stores. HGEA launched a contest to encourage users to install the app, and saw several hundred downloads within the first few days.

Ongoing Support Phase

14 Oranges will continue to provide ongoing support to HGEA for both the website and mobile app via our standard maintenance agreements.

Final Results

The new website www.hgea.org and companion mobile app have been very well received. HGEA staff value the streamlined content management experience, with the ability to easily maintain and update information across both platforms. Members are now able to find what they need more quickly on the website and appreciate the added convenience of accessing resources through the mobile app. With push notifications, HGEA can now connect directly with members to share important news, events, and campaigns—further strengthening engagement.

“We’re extremely pleased with the results of this project. The development team at 14 Oranges took a thoughtful, solutions-driven approach to the issues we identified with our previous website. Despite our complex organization structure of multiple membership types and units, each requiring tailored content, their experienced team handled it seamlessly. Our launch ushered in a new era of improved communication and more user-friendly resources for HGEA members.” 

Randy Perreira
HGEA Executive Director

The team at 14 Oranges was proud to partner closely with HGEA throughout this transformation. Together, we addressed longstanding pain points and delivered a modern, intuitive website along with a powerful mobile app that provides meaningful added value for their members.

Featured Image  by Braden Jarvis on Unsplash