Portfolio Project 2: Data Dynamics

Background

Context

This is a case study that I designed for a hypothetical digital marketing company called Data Dynamics. This design concept is for a desktop Software As A Service (SaaS) UI with Marketing Campaign features & A/B Testing functionalities. The UI designs for the case study were completed in about 2 months.

Defining the Problem

Users

The users of this Marketing SaaS are assumed to be the company staff who are doing digital marketing as part of their jobs, and would need to use a platform like Data Dynamics in order to promote & track their marketing sales performances. Individual marketing campaigns can be created, promoted and tracked from the platform. Potential customers are converted via a sales funnel, and the final conversions are tracked. Details of every potential, existing & past customers are also stored in the platform to help the company keep track of its clients and their information.

Interview Findings

No user research was conducted as this was a case study.

Pain Points & Opportunities

❌ Pain Points:

Many existing marketing-centric SaaS platforms have interfaces that are overly complex, with too many features and options presented all at once. This can overwhelm users, especially newer staff to digital marketing.

Many existing marketing-centric SaaS platforms have unintuitive workflows. This could cause difficulties for users when they are trying to set up marketing campaigns, analyse the results, and also manage multiple concurrent campaigns.

✅ Opportunities

Data Dynamics can help by simplifying the user interface, by prioritizing key features and offering guided onboarding processes can help users navigate the platform more easily. Data visualization can be designed more clearly to help users interpret data more easily.

Data Dynamics can help users by having UX workflows that align with users' mental models and tasks can streamline their experience, such as creating & tracking marketing campaign performances. Providing contextual help, tooltips, and in-app tutorials can also assist users in understanding how to accomplish tasks more efficiently.

Designing a Solution

Process

I started with creating initial sketches and formulated the overall information architecture, before designing the final hi-fidelity UI. The UI screens to be included were:

Campaign Overview - showing a list of all Marketing Campaigns created

Campaign Page - showing details of each Campaign & its subsequent Reports

Creation of Marketing Campaigns, with addition A/B Testing option if required

Mailing List & Contact List

Customer Overview & Customer Details Page

Overall, I aimed for a clean and modern UI design which enables the data in the tables and bar graphs to be easily readable, hence improving user-friendliness.

Visual Deliverables

Marketing Campaigns Overview

In the SaaS Sytem, the user first navigates to the Marketing tab on the left sidebar. The first sub-tab "Campaigns" is where it shows a list of all existing Marketing Campaigns, including past campaigns and upcoming Marketing Campaigns (created in advance with a planned release date & time).

Marketing Campaign Detail Page

Upon clicking the > icon in any of the Campaign rows, the details & report for that Marketing Campaign can be viewed.

Creating New Marketing Campaign

The user can click the "+ New Campaign" button at the top right in the Overview page to create a new Marketing Campaign.

The user needs to choose between Regular or A/B Test, which means that the Marketing Campaign would only have one template or use two templates. The purpose of the latter is for A/B Testing, where the user might want to do further investigations about what kind of marketing campaign design and method would be more effective in creating higher sales and hence conversion.

Creation of New Marketing Campaign - Selecting A/B Testing

Creation of New Marketing Campaign - Process (1️⃣ Setup > 2️⃣ Template Selection & Editing > 3️⃣ Recipient List > 4️⃣ Configure Campaign Spit Rules for A/B Testing > 5️⃣ Final Confirmation)

Mailing List

Prior to sending out a Marketing Campaign, the user can configure specific Mailing List groups. Sometimes, Marketing Campaigns are targeted to specific target audiences but not others, so it is best to differentiate this clearly in the settings section here beforehand. Each Mailing List shows which Marketing Campaigns were sent to that Mailing List in the past as part of the archival data. The user can then create or edit an existing Mailing List. Each Mailing list also shows all the current recipients, which can be removed or added upon, and the final total number of contacts in the List is shown below.

Contact List

The user can also navigate to the Contact List to view the entire list of contacts, and add or remove existing Contacts if required.

Customer Overview

Lastly, the user can view, add & edit existing Customer details. These Customers were converted from the entire list of contacted potential clients, hence they have a higher chance of sales conversion or there is already existing sales generated from these customers. The Customer's Detail Pages shows the contact history and sales outcome, if any, with the customer. Users can also write custom notes about the Customer as a reminder to themselves.

Customer Overview

Customer Details

Design System

The Design System below shows the typography and colour palette that I used for this case study. As I was aiming for a clean, sleek and modern asethetic, the colours chosen had a lower saturation, in order to contrast with the bright orange Brand colour.

Reflection

I enjoyed this case study self-challenge very much because I had to consider how to allow users to customise each marketing campaign, while also taking into account an appropriate UX flow for A/B Testing for data analysis purposes. However, since this was a case study, there wasn't a chance to interview real users to truly understand if this was the UX flow they would prefer the most in their digital marketing management process. Also, I would like to have more opportunities to try different UI styles for SaaS platforms, such as dark mode UI and so on.