aelyn Website design custom development screenshot

Case Study

Aelyn Website Design & Development

Industry
Online Life-Skills Education
Location
Online
Launched
2022
Platform
WordPress, Elementor & WooCommerce

Services

Aelyn logo

The Client

Founded by Ariana Gaffoglio, Aelyn teaches the life skills traditional education often leaves out, from careers and money to real estate and starting over after a divorce. Through online courses, course bundles and free advice articles, Aelyn wants to remove the stigma of “not knowing” and help people become self-empowered through self-education.

The Challenge

Aelyn was built on a simple idea: teach everyone the life skills no one ever taught them, from building a career and managing money to getting started in real estate or rebuilding after a divorce. Before we came in, beaelyn.com was little more than a pre-launch page with a short mission statement and a "Something big is coming" email signup. The courses, the bundles and the editorial voice all still needed a home.

The new site had two jobs at once. It needed to read like a polished lifestyle magazine, with free advice articles that build trust, and it needed to work as a store where visitors can browse courses, see exactly what each one covers, buy a single course or a bundle, and log in to their account afterwards. Both had to feel like one brand, not a blog with a shop bolted on.

Aelyn homepage

Our Approach

We planned the site around the path from reader to student. The navigation leads with the topics people care about (Career + Finance, Lifestyle + Wellness and Aelyn Advice), while Courses and Aelyn Login sit right beside them, and every article, category and course page points to the course catalog and bundles.

We built it on WordPress and Elementor, with WooCommerce handling the cart, checkout and customer accounts, and courses managed as their own content type with categories, lesson plans and course details, so Aelyn's team can publish a new course or article without touching code. The visual style is quiet and editorial: black and white, generous white space, refined serif headlines and soft lifestyle photography that lets the content lead. Our team also wrote the copy for the site.

Aelyn website, inner page

What We Built

The site combines an online magazine with a course store. Choose a feature to see it on the live site.

  • Every course has its own page with a numbered lesson plan, a summary of what you'll learn, approximate reading time, category and the number of worksheets included. Add to Cart sits right below, so the decision and the purchase happen on the same page.

    Aelyn: Course pages with full lesson plans

The Results

courses, each with its own lesson plan page
6courses, each with its own lesson plan page
themed course bundles in the store
4themed course bundles in the store
advice articles in the editorial library
35advice articles in the editorial library

A brand that feels premium

The black-and-white palette, refined typography and lifestyle photography give Aelyn the look of a polished magazine rather than a typical course site. That matters for a brand asking people to trust it with personal topics like money and divorce.

From reader to student

Free articles, mega menus, course categories and bundles all link into each other, so someone who arrives for one article always has a clear next step toward a course. The cart icon and Shop Courses bar stay visible on every page.

Content the team can run themselves

Courses, categories, articles and bundles are structured content in WordPress, so adding a new course or publishing an article is a matter of filling in fields. The design stays consistent no matter who updates the site.

Comfortable on a phone

Lesson plans, course details and articles stack cleanly on small screens, and the mobile header keeps search, account and cart one tap away. Reading an article or buying a course works just as well on a phone as on a desktop.

Want a website that works this hard for you?

Tell us where you want your business to go. A senior member of our team will get back to you right away.

Designed for Every Screen

Aelyn website, full page
Aelyn website on mobile

The Brand

Color Palette

#0a0a0a
#ffffff
#e6e8ef

Typography

Aelyn brand typography

In our clients' own words

Schedule Project Discussion