Brandy

Project Overview

Building a brand for a brand educator

Overview

Web design
Online education
Enhance educator's brand image

Problem Statement

Although exceptional educators have the ability to create a following on social media platforms, they struggle to convert that audience into sales of their content.

Goal

To maximize profit from digital content e-commerce and establish complete control over the online presence, delivering value and expanding brand reach.

Solution

A Direct-to-Consumer (DTC) education platform that serves the purpose of digital sales, content aggregation, and brand promotion.

Impact

Improvement in both brand awareness and conversion rates to varying degrees, as well as:

150% up

in user engagement

35% up

in user retention

Pain Point

Customers lack confidence in the worth of the courses

Pain Point

Disparate formats of content are scattered across various platforms

Pain Point

Professionals seek streamlined research for course investments

Pain Point

Challenging for professionals to complete courses

Cause

Insufficient social proof due to comment limitation on social media

Cause

Inadequate cross-platform compatibility

Cause

Overabundance of courses with filler content and inconsistent quality

Cause

Limited dedicated learning time as the main hindrance

Solution

Showcasing successful student case studies

Solution

Centralizing generated content on one platform

Solution

Building a trusted brand committed to quality and minimal filler content

Solution

Incorporating innovative features to aid course completion

zoom_in_map

COALESCED SOLUTION

A standalone e-commerce platform that empowers professionals to discover resources, find solutions, and make purchases with assurance.

Learn more about how I arrived at this solution

chevron_right

How I Think

Balancing business needs and student needs

The main business need is to sell instructor-generated digital content, which is relatively well defined. However, user needs are not as clear. I started the project by researching with three approaches:

query_stats

Market research on online education

face

User persona of target audience

work

User research with both stakeholder and students

Market research

Online education market can be divided into four types based on their scales:

Small, instructor-owned sites have been gaining popularity in recent years due to the many advantages they have over bigger rivals:

High profit margin

Instructors capture all the profits since they are the platform owners

No race to the bottom

Instructors do not directly compete on price with marketplace-based instructors

Lean content

Instructors are not pressured into creating padded, "comprehensive" content to impress customers

One-of-a-kind experience

Instructors can produce unique experiences with custom features not possible from marketplaces

Direct customer relationship

Instructors own the customer relationship and are capable of direct communication

User Profile

Key to success as an instructor-owned site is to differentiate oneself from marketplaces by offering specialized content for a specific target audience. Junior designers with means for premium courses and low churn once trust is established with the instructor, are a favorable market. To cater to their needs, deeper understanding of their challenges is needed.

Opaque career path

Insights and career coaching from industry veterans desired

Low work efficiency

Aiming to be more efficient and have more time for self-improvement

Limited free time

Prefers succinct courses without padding over extensive content

Desktop is the primary platform for learning, with limited mobile usage under certain scenarios.

research with Stakeholder

After speaking with the stakeholder, the company's main objectives were clarified, and solutions were suggested to tackle each of them.

Goal

Turning social media influence to

Sales

monetization_on

Goal

Gaining new customers'

Trust

thumb_up

Goal

Centralizing

content across multiple platforms

call_merge

compress

Solution

Selling digital content on

E-commerce

shopping_cart

Solution

Displaying successful

Case studies

history_edu

Solution

Building a website as a content

Hub

hub

research with Students

Three young professionals were interviewed on their approach to learning and previous experience with e-learning. Main findings:

Lack of dedicated time

Self pace is essential, and the perception is that learning takes a significant amount of time.

Group learning preferred

Collaborative learning offers better interaction and motivation, and improves social & networking skills

Accountability is crucial

People are more prone to lag in their learning without accountability

These findings unearth two key insights:

❶ Unlock new learning opportunities

Professionals lament about a lack of time for learning, but they have numerous brief, idle moments throughout the day. Micro-learning, designed for fragmented short time, can convert these idle moments into new learning opportunities.

Another unconventional learning option is audio-only content, which users can access in an eyes-free environment like commuting or running errands, greatly increasing their available learning hours.

❷ Asynchronized social learning

Many individuals prefer group studying, but the conventional cohort model demands excessive dedication. A blended approach of self-paced social learning may resolve this dilemma. The platform can provide social environments where students can voluntarily exchange updates, receive feedback and accountability from peers and instructors, and improve soft skills and networking, all in a progress-agnostic fashion. These environments include group meetings, Q&A sessions, chat channels, study groups, and forum discussions.

How I Draw

Delivering high style with high conversion

Three areas were prioritized based on UX research:

history_edu

Displaying the success stories of past graduates

hub

Creating a centralized hub for all content generated across different platforms

self_improvement

Enhancing learning effectiveness with tailored feature

View prototype ➔

The Social Proof

While social media customer testimonials may be abundant and organic, they can be inconsistent, disorganized, and limited by character counts. Student success stories are more persuasive as they provide in-depth context and insights.

The Content Hub

Having a personal website allows for the aggregation of different types of content from various platforms, offering users a convenient one-stop destination and enhancing the instructor's personal brand. The key to success is the implementation of cross-platform search functionality, making it easy for users to find content on specific topics.

Custom Features for learning

Though the project goal is to create a website for an online educator, I thought it would be nice to incorporate some innovative design elements based on user research as an added value.

The main concept centers around optimization for micro-learning, designed for mobile devices. The accompanying mobile app will allow user to input their desired learning session time and receive recommendations for the most suitable course material. Short-form videos are optimized for mobile viewing with a vertical layout and time-synced comments from other students, improving the overall interactivity.

How I Improve

Pushing visual boundaries while maintaining usability

To stand out from competitors, the course subject demands an edgy visual language characterized by unconventional typeface combinations; bold, vibrant colors; an asymmetrical layout; and modern graphic elements like frosted glass effect and gradients.

Sketch/wireframes of several main pages

The process of converting wireframes to high-fidelity prototypes involved several rounds of visual style refinement. The end result is an edgy design that is both visually consistent and tailored to its intended audience of young professionals.

Sketch

Low-Fi

Mid-Fi

Hi-Fi

Besides stylistic refinement, iteration is also driven by usability improvement based on feedback from users and stakeholders. The checkout page is a clear example of these changes, including the elimination of the original header and footer to prevent misclicks, the optimization of text size and layout to fit all information on an one-pager, among other modifications.

Wireframe

Hi-Fi mockup

Postmortem

Mind the subtle difference in perspectives

Project Summary

For this web project, I successfully delivered a functional and stylish e-commerce site for online education while addressing stakeholder's concerns of social proof and content aggregation.

Success Matrix

By optimizing the content structure with visual aids and clear language, I saw an improvement in both brand awareness and conversion rates to varying degrees, as well as:

150% up

in user engagement

35% up

in user retention

Lesson learned

A key lesson is the importance of defining the correct perspective during user research. I missed the nuanced difference between customers and students, and that mistake led to insights that were useful for designing the learning interface but not the e-commerce site.

Future Direction

I remain eager to further this project and design a learning mobile app in the future.

View More Work

Telemetry Dashboard

Data visualization that informs and not overwhelms

Product Feature

Primary Flight Display

Empower operators with situational awareness and manual piloting capability

Product Feature

SAI Design System

Built a Design System from scratch and reduced cycle time by 40%

Design System

LocaLoco

Revitalize local business communities through hyperlocal social network

Mobile App