Tree Map of LWA Course Offerings
Crypto Education for The Masses
Light to the Wealth Academy(LWA) is a crypto education startup based in California. When I joined the team, I was tasked with auditing the Academy's in-person services and making a web-based platform for their clients. This scope was set by me and the owner of the business during the initial meeting:
Website to display LWA services
Virtual process for clients to signup and attend LWA classes
Marketing email campaign
Future plan for subscription service
At the discovery phase of my project, I conducted an interview with the business owner in order to get a better understanding of their business and help realize their vision.
What classes does LWA currently offer? Future Plans? (Diagram Below)
How are the classes currently presented?
What is the process for making a class?
How do clients currently sign-up for classes?
How do clients give feedback on classes?
What vocabulary does LWA use while interacting with the public?
Based on the interviews I found a set of three personas which helped define target markets. Out of these well researched personas, I chose to focus on the "Crypto Newbie" as LWA's primary clientele.
Overview of the Crypto Newbie:
Rose is Gen Z (<30 years old)
She recently started earning money and doesn't know what to do with it
She's internet savvy
She sees the benefits of new technology like blockchain and cryptocurrency
She doesn't have a lot of time to do her own research
She's frustrated with inefficiencies, such as slow technology
With LWA properly defined, I diagrammed the new service chain to convey to the stakeholders how their new digital product will fit into the business.
The process begins with the marketing department, using ads and word-of-mouth
The website will be the user's first impression
Users can either buy a class or signup for a meeting to help determine the student's schedule
LWA should regularly schedule times for student appointments in the Calendly
I discovered an implementation for referrals, which also gives repeat students a discount(Green Dot Flow)
The student can either be guided through the service, or be empowered to choose for themselves
This fits with LWA's goal to "Help People Gain Financial Independence", where comparable services (such as universities) require enrollment in a curriculum
Planning the Website
I mapped out the users’ journey in a site map to help organize the project and plan the different sections. As the project went on, I added colored dots to indicate the status of each part.
My primary goal was to create a clear path for students to either enroll in a class or submit an application
The student application allows LWA to vet their clientele before scheduling a sales meeting
The greyed out sections are planned for the future, including testimonials and referrals
The red sections were scrapped after deciding to use Calendly, which added a simpler user flow.
After years of making style guides, I've found the most essential elements to constructing a style guide, including:
Logos and Wordmarks
I aimed to show LWA in a professional and simple manner, and therefore used blue and yellow along with the typefaces SF Pro Display and Roboto.
These choices, while standard, help convey trust and security, which is vital to an educational service.
Directly to Design
Once I discovered the plan, I started designing the final screens in Figma. I knew the final product would be made in Webflow, which guided my endeavors and allowed me to skip the wireframe process.
Because the service is considered 'high-end', we intended for students to purchase courses on a Desktop
Since Rose, the persona, is most likely to visit the site on mobile, I made sure the site was fully responsive
I used the OpenPeeps illustrations, made by Pablo Stanley for cohesion and a sense of playfulness
While I wanted LWA to look professional, the actual courses are much more personable. I feel this is shown accurately using illustrations
I did have a few difficulties in this project, which I've detailed below:
The Figma to Webflow coding transition had a few minor hiccups because I didn't design with a grid first. In future project, grid mapping will be an essential part of my process.
While setting up the scheduling service, it was costing two data calls to have a schedule built into the site while using Calendly. This problem only required a minor adjustment to the "Our Offerings" page.
This project had an expedited timeline, which was an interesting challenge for me at my current level. After a month of the site running, I checked on LWA and found they had sold 5 courses.