Gorilla Graphs, is a platform for store managers. My team was asked to design a more refreshed look to further differentiate the platform and improve the managers’ experience through an administrative portal.
Store managers, as well as upper management, need a dynamic interface that can display customer feedback analytics to identify areas of improvement and examine the relationship between customer experience and sales. (Provided by the UX team)
I was involved in the research, synthesis, ideation, prototyping, animation, testing of the platform, and presenting our weekly progress to our stakeholders while keeping them engaged.
High Fidelity Prototypes
We had four weeks to design the look of the platform. We chose to adopt the double diamond method. This means that we first discover and define the problem we have to solve after we continuously develop, test, and iterate until we have a final product.
Become an expert
To create a great user interface and run productive user interviews we had to first understand the domain.
VISUAL COMPETITIVE ANALYSIS
We conducted an in-depth competitive analysis to identify the best practices in data visualization and if there are any opportunities to improve.
Portrait images with lots of illustrations.
Simple, fun and modern with enough white space
Charts & Graphs in vibrant colours.
Well organised with good use of space and cards.
Friendly with good use of cool colours.
Professional, minimal and organised with good use of grid.
Using the data we’d collected from our research, we began synthesizing it all into design principles that we had to follow in order to create the best look and experience for the users.
What can we improve?
We were given some previously created wireframes, that we evaluated to assess if there were any issues with them. We wanted to make sure that there was consistency in the rules of the layout and see if there are things that we can improve upon.
I crafted 3 different mood boards that helped me get the feel of how the interface should look.
To help users better visualize how the interface would look like and collect valuable feedback, I created a few style tile based on the mood boards.
What users think
We run a survey to see which of the style tiles looks the best for the users, what we can improve upon, and what visual direction we should take based on their feedback.
Based on the recommendations we got from our users, I started to iterate on the style tiles and create a final look that we will apply to the wireframes.
Wow, it moves
Micro-interactions are a really good way to make the platform more dynamic and engaging.
A few more changes
After putting everything together we were able to create a prototype for the users to test and have them provide us with feedback.
This is the main colour palette but all the secondary colours can be customised by the user.
The typography had to be simple, easy to read, and professional.
The iconography had to be bold and expressive.
What I learned
When it comes to a project, I felt it is much better to work in a team rather than as an individual. While working in a team, it is easier for us to brainstorm different ideas and give each other constructive feedbacks which is a rather hard thing to do while you are working individually.
Lastly, I learnt that we need to take input from someone isn’t that part of your team and having SME to interview and test is crucial because we, as a designer, might think we know what exactly is best for the user but that is not true. That’s why an outsider’s opinion is needed.