Skip to content
← All projects

02Website · Custom Software · Branding

Gleanly

A gamified financial education platform with two schools, an authoring tool, and subscription billing.

Client
Gleanly, a financial education company
Engagement
Brand identity, product design, and a full build of the learning platform, admin tool and marketing site
Services
Branding, product design, custom software, subscription billing, WordPress marketing site
Stack
Next.js, TypeScript, Tailwind, Clerk (auth), Neon Postgres, Prisma, Stripe, WordPress with Bricks Builder (marketing site)
Live project
gleanly.com ↗
Gleanly logo on the cover of its brand guidelines

The problem

The founders had course content for personal finance and investing. They needed a product people would actually keep coming back to, and a way to write and update lessons without a developer.

What we built

01

Student app

  • Two schools: Gleanly Finance for financial literacy and Gleanly Invest for investing.
  • A galaxy-style map for moving through courses and modules, with game-like progression.
  • An investing simulator for practicing without real money.
  • Onboarding that places each student at the right starting point.
  • A layout that works on phone, tablet and desktop.
Gleanly student dashboard
Gleanly skill tree galaxy map
Gleanly course overview for investment bonds
Gleanly trading simulator
Gleanly lesson question
Gleanly dashboard on a phone
Gleanly lesson on a phone
Roi, the guide character who walks students through lessons
02

Admin authoring tool

  • Lets the Gleanly team build and edit courses, lessons and access settings themselves.
03

Subscription billing

  • Monthly and annual plans through Stripe.
  • Checkout, a self-serve account portal, and lesson-level access control for free and paid lessons.
04

Marketing site

  • A WordPress site with a course catalog, pricing information, SEO and clear calls to action.
Gleanly website home page
Gleanly website how it works section
Gleanly website moon landing section
Gleanly website course catalog
Gleanly website on a phone
Gleanly pricing page on a phone
Gleanly mobile menu
05

Brand identity

  • A logo built around a G mark with a sparkle, plus finance and invest submarks.
  • A color palette of Mist Mint, Vapor Violet and Zero Point Blue, with DM Sans and Avenir for type.
  • Brand guidelines covering logo variations, backgrounds, clear space and usage.
Gleanly primary logo
How the Gleanly G mark is constructed
Gleanly color palette
Gleanly primary typeface
Gleanly logo variations
Gleanly Finance and Gleanly Invest submarks
Gleanly app icon on a phone home screen
Gleanly logo on a hoodie
Gleanly logo on a glass sign
Gleanly logo on a building

Where it stands

Built in phases, with A440 Solutions continuing as the development partner.

Next project208 Tire & AutoWebsite
208 Tire shop building at dusk