Project Name

galleri5 brands app

Role

UI · UX · Wireframing · Prototyping · Documentation · webflow

Team

galleri5

BRIEF

Galleri5 is an influencer marketing agency that is augmented with a complex and powerful tech product. The product is fairly mature and can be broadly be sliced into 3 parts

This project covers primarily the Analytics portion of the app.

CHALLENGE

At the time of starting this role, a lot of the development was done quickly with functionality in mind. Quick development meant that designs were almost always made on an adhoc basis. So we made a list of issues we felt were lacking in the development and design process. The list was as follows -

SOLUTION

The process

The process followed was straightforward and rapid. We still wanted to ship as fast as possible but without too much compromise on the product, however this meant the process of feedback was often skipped.

In the initial phases of the product, feedback would often get skipped.

Internal Team Feedback

The process followed was straightforward and rapid. We still wanted to ship as fast as possible but without too much compromise on the product, however this meant the process of feedback was often skipped.

Usually I would sit down with team members in person, walk them through the proposed UX Wireframes and then just note their points of feedback as comments on the Figma file.

Client Feedback

Our first subscription based client was a beauty and fashion company, one of the biggest in India. So they were engaged in loads of campaigns. We started to prioritize their feedback over our assumptions and it automatically improved the quality of life of the app. A good example of their feedback coming to fruition was bulk adding influencers to a campaign and bulk adding influencers to the database that weren't there before.

We would have frequent client feedback calls and their feature requests/ issues would be logged on a Slack channel.

I was also made the key account manager for our first client. This was a once in a lifetime position to be in. As a key account manager I was able to hear the clients concerns directly and maintain an open dialog. Then as a product designer I was able to gather unadulterated feedback and create user centered designs.

These features made one the basis of client requirements directly benefited the internal team too. So with a proper process in place the next step was to introduce a sustainable design system.

Design Standardization

While ideally coming up with a complete end to end design system would have seemed like a good idea, it would require a great deal of time, so we opted for just standardizing a few things at the start. We went about tackling the basics of a design system like Fonts, colors, input fields, buttons and labels. Then we moved onto layouts, charts, cards, graphs, flyouts, modals and icons .

Above is an example of the stat card component and variants that we came up with.

It was during this phase that my technical proficiency in Figma was able to grow leaps and bounds. I was able to use components and variants to its fullest extent. Designs became more consistent and quicker to implement. Once the design system was set up, I learnt how to handoff screens better and document them on a series of different project management applications that were adopted to streamline development.

Site Structure

A basic site structure was drafted concurrently with the design standardization. Below is the first draft, as the project progressed the site structure evolved.

Edge case coverage & Handoff

Something that really elevates UX is graceful handling of edge cases, error states and empty states. Having a default fallback state on every screen and/or a scenario specific empty/error state is definitely underrated. The CTO of the company pushed to think with that mindset and it helped the entire team grow along with the app.

Empty states and edge case consideration brought some much needed polish to the app.

In terms of handoff, we initially covered a fair bit of a non technical documentation of Figma itself. Eventually we moved to Click Up were tasks and details were clearly covered.

Learning to do UX documentation was a bit of a learning curve but eventually it became second nature.

Brand alignment & marketing integration

This entailed an overhaul of the marketing website. We decided to purchase a high end Webflow template and I was tasked with 
- Bringing the template in sync with the brand identity
- Converting the UI we had designed into aesthetically pleasing creatives that could tell a story about the features of the product.

You can check out the website at https://www.galleri5.com

User journey Map

Although a user journey map was never charted out, I decided to make one using the internal team's process of how they went about conducting a influencer marketing campaign in tandem with the galleri5 platform.

BEfore & After

The app was far from perfect but in a span of 4 months the difference was notable and the path ahead was clear.
Below are some Before and after screens of the UI.

Performance Tracking Dashboard

Browse Influencers

Influencer Profile PAge

Conclusion & WAY forward

Here a few milestones we hit after the design over haul -
- We landed our 1st paying platform client
- They created 60+ campaigns in the first 3 months
- Consequently landed 2 more platform clients
- Showed off the product to over 20+ companies
- Enter into trial period with 3 clients

A couple of other thing we aimed to tackle next in the context of performance tracking was -
- Roles and team settings
- Control over data visibility
- Better design and frontend sync

In the larger scheme of things the other features to follow were
- CRM outreach
- Open campaign management through a creator facing app
- Comparative Analytical Tools.