Company /

Resonate

Year /

2020

Type /

Acoustic Calculation Platform

Case Study 

acoustic calculation platform

Credits /

 Elaine Maina (UX Designer) 

Jerry Tian (UX Designer) 

Lucy Kerney (UX Designer) 

Ping Cal. is a calculation software that allows acoustic Consultants to measure the dbs appropriate for commercial building. 
MY ROLE

As a designer for the Resonate team, my responsibilities involved quantitative and qualitative data research, conducting user tests and interviews, compiling new insights into personas, empathy & Journey maps, Information Architecture, and applying iterations to the wireframe, prototypes, and final design. 

Project Context - 
As an acoustic consultant, it is difficult to manage, share and collaborate on projects due to the lack of an all in one project management system

Design Process 

long-arrow-left.png

Desktop Research

User Interviews 

Personas

Journey Maps 

Solutions 

Wireframes 

Prototypes

Usability Testing

long-arrow-left.png

Problem Definition 

How Might We 

long-arrow-left.png

UI Design 

Final Design 

Next Steps

THE CHALLENGE

Whilst we were given a brief with deliverables, we found that we didn’t fully understand what Resonate was trying to achieve. We therefore used a compilation of surveys, desktop research and interviews to help us understand the current experience for the user/s.

 

Ping Cal is an existing software that is used in-house for Acoustic Consultants to measure the amount of dbs needed for a commercial building. 


The previous designs:

 

 

Screen Shot 2021-03-09 at 1.31.28 pm.png
Screen Shot 2021-03-09 at 1.33.29 pm.png

Two surveys were created in the hope to gain some data. Reality proved us to show minimal data, therefore we went back to our existing data passed from the stakeholder and came to an understanding there was enough data/ research to start a basic wireframe. 

Data collected overall 

Survey Results 

n = 13

Interviews 

n = 9

Usability Tests 

n = 15

Instead of our process starting at the beginning, we actually jumped into the development phase based on initial research and started to test and find insights to inform us of insights and user behaviour. 

 

LEARNING: The process is never the same, use your tools to assist the overarching methods. 

DISCOVER

Real People

Screen Shot 2021-03-09 at 2.07.39 pm.png

INSIGHTS FROM ORIGINAL PLATFORM

6 out of 9 had suggestions to improve the navigation - "At the moment there is no way to get back to the home page"

4 out of 9 made suggestions regarding the user interface - "The cards are too busy looking I would prefer a list view instead" or "I would prefer to have more filter options rather than the simple sort by"

7 out of 9 had problems based on the functionality - "I find it a bit annoying that you can't copy and paste data out of Ping" or "I wish I could be able to zoom in and out in my calculations"

7 out of 9 made suggestions regarding the current procedures - "It would be helpful to see status of the project, if it has been reviewed or not and who has reviewed it and version history"

Screen Shot 2021-03-11 at 11.20.21 pm.pn

Based on our user research, two personas were adapted. Each persona had a scenario that identified realistic traits, the user might have been working with.  For the prupose of this project, one persona; Jackson was identified as the primary user.  

Journey Map - Jackson.png

Jackson's Customer Journey Map, allowed us to specifically focus on one scenario, understanding the journey over a period of time, but most importantly discover the challenges and pain points to better a solution. 

DEVELOP

User Flows

Resonate x Academy Xi Presentation.png

An MVP Map was created to translate all the painpoints into solutions, this allowed us to focus on the most effective and efficient methods. Following on the User Flows above were a clear and consise way to navigate through the user experience. 

DEVELOP

UX | UI Elements

Screen Shot 2021-03-10 at 12.34.48 pm.pn

To assist the process, we looked at precedent UI elements, specifically dashboards, and navigation. The Design exploration helped us visually see how UI and UX combine for larger corporations eg. Google Drive, Monday, Asana, etc... . Furthermore, designs were selected and used for the next phase - wireframing. 

LEARNING: You can spend hours looking at beautiful UI. On reflection, I think better project management and time allocation would allow us to gather inspiration in an effective and timely manner. 

DEVELOP

Concepts

wireframe draft .png

To start the creative process, I often find quick sketches to be an efficient way to make decisive decisions, whilst communicating ideas to the team. Based on research, interviews, and precedent studies it was starting to become clear what aspects were imperative to the user. 

DEVELOP

Wireframes 

wireframe.png

"Something about the icons is not doing it for me"

"Completely didn't see the search function at the top"

"I just think its the most obvious thing to do, the most obvious place where it would be. If the other information is there, I just thought I would look around there"

4 out of 5 of users were confused about the meaning of few navigation icons

3 out of 5 did not notice the search button

3 out of 5 found performing tasks to be very intuitive

4 out of 5 of users were confused about the meaning of few navigation icons

3 out of 5 did not notice the search button

3 out of 5 found performing tasks to be very intuitive

DEVELOP

Prototypes

Iteration Two, we came up with a medium-fidelity prototype, to complete another round of testing. This prototype addressed our user's insights, previously discovered. 

"That's definitely useful, being able to access it quickly"

"Far more obvious, where everything is sitting"

"Very intuitive"

"The flow makes sense, how you have got it"

5 out of 6 Resonate Consultants said they understand and like the new folder system

5 out 6 Resonate Consultants find the overall flow of various functionalities to be very intuitive

DEFINE

How Might We

How might we assist an Acoustic Consultant to manage, share and collaborate while using Ping Cal. ? 
DELIVER

UI Kit 

LOGO 

logo.png

TYPOGRAPHY 

COLOUR PALETTE 

DEFAULT

#F44771

#FF9A3E

#332A7C

#622CFC

#D0DFFF

DARK MODE

#16202B

#0E1722

#1D2939

#F4F7F8

#2D2D2D

NEUTRAL MODE 

#89BAE7

#349EFF

#6B6969

#F4F7F8

#2D2D2D

Users also have the choice to use dark mode. Our research indicates that consultants may be in the office late working, therefore dark mode will reduce eye strain. In addition, there is also a muted colour mode. If users feel the default colours are too bright, they may opt for a simplistic option, making the experience custom for the individual's needs. 

DELIVER

Final Design 

Dashboard

Users have a clear view of their latest projects, for efficiency in time. The functions of Sort by and Filter through date also allows the user to be in control of their view. Colour enhances wayfinding and navigation. 

New Project

Users have multiple ways of creating a New Project but is a systematic process that also allows users to add other co-workers on projects, as well as uploads items such as plans, revisions etc. 

New Calculation

Users can receive a process to create a new calculation within their new project, in a few easy clicks.  

Archive

Instead of thousands of files been available to the current database, the process included an archive system to allow a faster approach through the user's server but also can restore the archive if needed for reference at any point. 

Customised Profile 

A simplistic way to customise the user's preferences, inclusive of what they see. With addition access to ongoing calculations. 

009.png
DELIVER

Next Steps 

A strategy on how to proceed is always essential to take the prototype to the next level. 

 

1. Test Real People.

Test the long-term features with users within a real-life work environment, to understand their usage and limitations.

 

The business was also aiming to launch the product within the US Market, therefore recommendations of testing the prototype within the US market would be beneficial. 

2. Refinement 

Further, refine the app in regards to the calculation software which is beneficial to the acoustic consultants.

DELIVER

Conclusion 

Our redesigned dashboard for Ping Cal had comments such as "...a far more elegant option", "I'm keen to use it and really like it", "...more screens, but it is a nicer interface". The research-informed design produced positive results. 

Reflecting on this project, there are many items that could have been approached differently. I found the importance of stakeholder involvement is essential to the success of your project. Furthermore, I would recommend more workshops for future projects, specifically users, as their experiences and usability tests were extremely valuable to our research and methodology. 

 

Within a period of 2 weeks, our challenge was to discover the true pain points for the users and design a better solution. As users originally stated, "they are happy with everything, already".

 

So how do you solve a problem, when the user doesn't have any "problems.

 

Our prototype answers this. 

This project validated the value of diving deeper into usability interviews to understand what users need.  The Stakeholder was very impressed, as a Designer when the stakeholder states "I have no words, everything is validated through what users need and have said" - you know you have made a difference. 

 

I look forward to seeing the future of Ping Cal.