My Role

My role was to overhaul the eHQ platform UI, integrating the new design system and enhance the UX of frequently used features based on feedback we received. I was also to co-ordinate with marketing and customer support to keep them informed and get their feedback on new and existing features we were building. I also supported the customer support team by writing help articles for new features.

The Challenge

With eHQ's legacy platform:

1. There was very little documentation. Over the years functionality had been modified but hadn't been documented.
2. High level userflows were missing
3. Having no design system, parts of the platform looked different.
4. For public-facing pages, the UI was to be modified only by styling and the structure was not to be touched. This was because the backend for these pages was older and was going to be taken up later.
5. The experience across the application hadn't changed in 6-7 years.

The Approach: Planning

There were three areas of the application we wanted to improve as a priority:
A. Frequently used features
B. Allow admins more control over platform
C. Update public facing pages

What we did know: Understanding the user

There had been done some amount of research over the years prior to starting on the project, that included personas, journey mapping and IA.
Two primary users - Admins or Community Managers who set up projects and Community users or participants who give feedback and vote on published projects.

Solution

The first step was to start with existing commonly used IA and user flows. For userflows We identified areas where they could be improved. For features that didn't have documentation of IA, we mapped it out. Feature that were prioritised:

1. Platform Settings: This was crutial in setting up the platform.
2. Project management and creation page: crutial for Community managers in publishing features.
3. Newsletter creation flow: Creating a linear process so that newsletters that were being sent to users were easier to create and send.
4. Homepage Editor: Giving admins more control over how their community homepages looked.
5. Building on the Ant Design system: Customising the Ant Design System to suit our needs.

Settings Page

Global settings for a project dictate how all consultancies receive feedback, how paticipants can share, notifications to participants and who is allowed to moderate discussions. The issue with the existing design was that information wasn't organised logically, a lot of microcopy was written by engineering and was confusing, and some fields were redundant or no longer had a purpose.

Project Management Page (PMP)

If a local government wants to create awareness of a project they start by creating a project page. The current PMP didn't take advantage of modern CMS applications. It was difficult to visualise what the page looked like unless previewed. To overcome this challange, the revised PMP was structured so it reflected, like modern WYSIWYG editors, what the published page would look like.

The listening tools and widgets that were participant facing were also relooked at. Some needed only a UI facelift, while others needed a rework on how they were set up. Tools and widgets now could be edited via a drawer that was an overlay on the project page, giving context to the Admin.

Newsletters

A newsletter goes out to participants on the progress of various consultancies as well as related consultancies. The legacy platform had this embedded deep in settings and was difficult to edit.

Home Page Editor

The Home Page Editor was a new feature to give more control to admins to design their home pages that contain all their consultancies. This used a drag and drop functionality with templates and themes.

Design System

In helping speed up development time, the Ant Design System was used as the base system upon which customisations were made. This was then used as a common library used across the platform.