Introduction

Out of all the UIUX/Product Design contracts I have worked on, this one was probably the most extensive, intense and challenging I have come across so far.

Typically, Product Design contracts tend to focus on a specific project for an extensive period of time. However, in this project I have designed, created and researched a total of 6 desktop digital products and two mobile applications over a very short period of time. On top of that, this contract also included a fair amount of web design as a separate side project. Specifically, a web portal which included, between many other things, a brand newly designed community forum.

As I was the only Product Designer for this project, this also included a considerable number of other tasks such as, liaising with key stakeholders, setting up timeframes for each spring, providing video presentations for the complete user journey of each product, liaising with developers on design review sessions, consulting, guiding and pushing for design, research and accessibility best practices (as the business had no previous experience within the UX arena), etc.

The Challenge

Despite of all the hurdles mentioned above regarding time constraints, workload, etc, there were also some “political” challenges to overcome during the creation and design of the new applications.

As 7 out of the 8 products needed a completely new redesign and user experience (as some of these digital products were 20 years old),there was an understandable amount of fear and scepticism around changing the status quo. In the end of the day, they have represented that organisation’s identity for more than two decades and the old designs and experience were somewhat familiar to the stakeholders.

Disclaimer: As this contract is still ongoing, I will not be showing any wireframes or speak about it in depth for confidentiality purposes as these products have not been launched/re-launched yet. Instead, I will simply have a holistic description of these projects and generic points of interest.

The UX Approach

Being the first time this organisation came across UX processes there was a fair amount of work not only in the project itself but also in promoting good UX best practices and in finding alternatives to some challenges:

1-  In the beginning stages, since the changes between the legacy products and the new vision were so dramatic, I have decided to introduce them to the concepts of lo-fidelity, sitemaps and user flows. This allowed the stakeholders not only to visually understand the new user journeys before moving any further but also to speed up the design process in case they didn’t like the proposals. This also gave the senior management more control over the design process which ultimately reassured them on the whole process.

2-  Also due to their unawareness around Product Design development processes, it was difficult to “sell” the benefits of proper user testing & research. As such, the competitive analysis stage had to be much more in-depth to ensure that users would be familiar to the structure and experience of these products.

3-  To overcome and find alternatives to the challenges on point 2, I have also created meetings where members of staff could test my prototypes (in moderated tests such as tree testing, card sorting, etc) as well as review the “almost finished” products in hi fidelity. Some unmoderated testing was also conducted to some of their customers(although not as extensively). Although this didn’t completely provide an evidence-based design approach, it was a good enough alternative to tailor the design to their users as well as newcomers.

4-  To reach a bigger feedback audience within the company, I have also created and edited regular video tutorials to explain the design thinking process as well as the journey behind the User Interfaces. This helped me gathering further feedback, identify and correct blind spots within the proposed design.

Other UX Concepts

I have also worked towards introducing other UX concepts that had never been thought about within this organisation:

-  Accessibility (WCAG 2.1 AA Standards) were also discussed and improved not only in the newly designed products but also corrected within their own website as some of their colour contrasts didn’t provide the required ratios to encapsulate all users.

-  The concept of minimising a journey as much as possible was also not present and so introduced to the company. This also incorporated a simplification of the UI, and a considerable reduction of text. The latter had been substituted by frequent tooltips only as and when the user needs to see them. I have also proposed a multiuse of input fields, side menu bars and other conventional solutions to structure the information. This considerably reduced the clutter in the user interface while simplifying its use.

-  Information aggregation in multiple dash boards in a single pane of glass was also introduced as well as different ways of displaying data visualisation. In some cases, creating new ways of analysing data, and some by sticking to known battle tested UI Patterns.

-  Use and awareness of the importance of content strategy.

-  Introduction and construction of a relevant design system.

-  Although I didn’t perform an Expert Review, the entire product development was achieved keeping in mind the 10 Usability Heuristics for User Interface Design by the Nielsen Normand Group.

Mobile App Design

As the senior management were still deciding on the final vision for the mobile app, a few versions were created to accommodate different business requirements for this project. For the output of this project, two products were created:

1-  A redesign of the existing app (carrying a dramatic change within UI and some UX improvements).

2-  A completely new application was designed where the UI and UX had substantial improvements. As the previous product had been designed by the developers, this time round I had the chance to introduce mobile best practices not only in the UX but in the UI as well. Included in this list, some of the principles were:
-  An increase on the input fields and a greater space between the elements
-  Following the easy and hard design areas for the thumb ergonomics
-  Using emulators for testing as mere indicators and making sure the real tests are done on actual mobile devices.
-  Etc…

The UI Approach

As mentioned above, due to the fact that some of their products were 20 years old, besides thinking of a completely new and current user experience, they were also in critical need of a dramatic cosmetic improvement. As such, part of the research phase was also focused on the latest2021 product design trends.

Some of these improvements included:

1-  Applying Glassmorphism whenever possible. The reason why I didn’t fully apply it is because this style only works when there is an existing background underneath the elements. And so, I have only used it on modals and overlapping cards.

2-  Another current trend was the use of “auroras”. Although this trend doesn’t have a specific name to it, it’s something like a collection of “blurred blops of subtle colour” and used as a background.

3-  The use of “paper design” with very far away shadows (with a regular grey or the same colour as the button).

4-  Double weighted fonts on two-word titles.

5-  Although this is also a UX improvement, the concept of a side menu bar (desktop) that extends and contracts further works as a centralised source to where the navigation options live proved to also be a great asset not only aesthetically but also in simplifying the user journeys.

6-  As some of their solutions were previously created by developers instead of Product Designers, they weren’t aware of simple UI design principles such as symmetry and harmony, colour consistency as a means of design as well as visual communication, visual hierarchy, etc. And so these were also introduced.

Conclusion

This was a project that tested not only every single aspect of my Product Designer expertise but also, my creativity in finding alternatives to severe budget constraints regarding user research and testing.

It was also challenging in the promotion of UIUX best practices as well as in conveying trust in my design thinking process and methodology (since they had never been introduced to these before).The end result was a completely satisfied senior management as well as customer base to the point that I honestly believe that they would invite me again on a future endeavour.

As these products haven't been launched/re-launched, there are no designs for these projects on my Behance yet. However you are more than welcome to visit it and see other product design pieces I have worked on in the past.